Fix deep

Author: tronsha

src/Utils/StyleBuilder.php

@@ -107,14 +107,22 @@ public function compile(?DOMElement $styleElement, ?string $path = null): ?strin
                     if (++$count < $selectorsCount) {
                         $selector .= ',';
                     }
-                    $regex = strpos($selector, '::v-deep') !== false
-                        ? '/((?:^|\s)\s*[^@\s][a-z0-9-_]+?)((?::{1,2}[a-z-]+)?\s*)(?:::v-deep)/i'
-                        : '/((?:^|\s)\s*[^@\s][a-z0-9-_]+?)((?::{1,2}[a-z-]+)?\s*(?:[,{]|$))/i';
-                    $style = str_replace(
-                        $selector,
-                        preg_replace($regex, '$1[' . $this->scopedAttribute . ']$2', $selector),
-                        $style
-                    );
+                    if (preg_match('/^[\s}]*::v-deep/', $selector)) {
+                        $style = str_replace(
+                            $selector,
+                            str_replace('::v-deep', '[' . $this->scopedAttribute . ']', $selector),
+                            $style
+                        );
+                    } else {
+                        $regex = strpos($selector, '::v-deep') !== false
+                            ? '/((?:^|\s)\s*[^@\s][a-z0-9-_]+?)((?::{1,2}[a-z-]+)?\s*)(?:::v-deep)/i'
+                            : '/((?:^|\s)\s*[^@\s][a-z0-9-_]+?)((?::{1,2}[a-z-]+)?\s*(?:[,{]|$))/i';
+                        $style = str_replace(
+                            $selector,
+                            preg_replace($regex, '$1[' . $this->scopedAttribute . ']$2', $selector),
+                            $style
+                        );
+                    }
                 }
             }
         }

tests/fixtures/style-block-scoped/style-block-scoped-deep-with-scss-2.twig

@@ -0,0 +1,6 @@
+<style>.foo[data-v-a75773abe77e60d5eec0d774b5e2deab] { color: black;}[data-v-a75773abe77e60d5eec0d774b5e2deab] .foo__bar { color: purple;}</style>
+<div class="foo {{ class|default('') }}" data-v-a75773abe77e60d5eec0d774b5e2deab {{ dataScopedStyleAttribute|default('') }} style="{{ style|default('') }}">
+    <span class="foo__bar" data-v-a75773abe77e60d5eec0d774b5e2deab>
+        test
+    </span>
+</div>

tests/fixtures/style-block-scoped/style-block-scoped-deep-with-scss-2.vue

@@ -0,0 +1,22 @@
+<template>
+<div class="foo">
+  <span class="foo__bar">
+    test
+  </span>
+</div>
+</template>
+
+<style lang="scss" scoped>
+  .foo {
+    color: black;
+
+    /deep/ &__bar {
+      color: purple;
+    }
+  }
+</style>
+
+<script>
+    export default {
+    }
+</script>