Merge pull request #38 from Paneon/master

Update master

Author: tronsha

.github/workflows/php.yml

@@ -26,6 +26,9 @@ jobs:
         restore-keys: |
           ${{ runner.os }}-php-
 
+    - name: Composer update
+      run: composer update
+
     - name: Install dependencies
       if: steps.composer-cache.outputs.cache-hit != 'true'
       run: composer install --prefer-dist --no-progress --no-suggest

src/Compiler.php

@@ -232,10 +232,7 @@ public function convert(): string
         }
 
         $this->rawBlocks[] = $this->createVariableBlock();
-
-        if (count($this->rawBlocks)) {
-            $html = implode("\n", $this->rawBlocks) . "\n" . $html;
-        }
+        $html = implode("\n", $this->rawBlocks) . "\n" . $html;
 
         $html = $this->replacePlaceholders($html);
         $html = $this->replaceScopedPlaceholders($html);
@@ -440,13 +437,20 @@ private function preparePropertiesForInclude(array $variables, bool $isRootNode
             } elseif ($name === '__DATA_SCOPED_STYLE_ATTRIBUTE__') {
                 unset($variables[$key]);
                 if ($hasScopedStyleAttribute) {
-                    continue;
+                    foreach ($variables as $variable) {
+                        if ($variable->getName() === 'dataScopedStyleAttribute') {
+                            $variable->setValue(
+                                $variable->getValue() . ' ~ " " ~ dataScopedStyleAttribute|default(\'\')'
+                            );
+                        }
+                    }
+                } else {
+                    $variables[] = new Property(
+                        'dataScopedStyleAttribute',
+                        'dataScopedStyleAttribute|default(\'\')',
+                        false
+                    );
                 }
-                $variables[] = new Property(
-                    'dataScopedStyleAttribute',
-                    'dataScopedStyleAttribute|default(\'\')',
-                    false
-                );
             } elseif ($name === 'vBind') {
                 $this->vBind = $value;
                 unset($variables[$key]);
@@ -458,17 +462,13 @@ private function preparePropertiesForInclude(array $variables, bool $isRootNode
             if ($attribute === 'style') {
                 $glue = ' ~ "; " ~ ';
             }
-            $value = $values[$attribute] ?? null ? implode($glue, $values[$attribute]) : '""';
             if ($isRootNode) {
-                $value = $value . $glue . $attribute . '|default(\'\')';
+                $values[$attribute][] = $attribute . '|default(\'\')';
             }
+            $value = $values[$attribute] ?? null ? implode($glue, $values[$attribute]) : '""';
             $variables[] = new Property($attribute, $value, false);
         }
 
-        if ($isRootNode) {
-            $variables[] = new Property('dataScopedStyleAttribute', 'dataScopedStyleAttribute|default(\'\')', false);
-        }
-
         return $variables;
     }
 

src/Models/Property.php

@@ -58,6 +58,12 @@ public function getValue(): string
         return $this->value;
     }
 
+    public function setValue(string $value): Property
+    {
+        $this->value = $value;
+        return $this;
+    }
+
     public function isBinding(): bool
     {
         return $this->isBinding;

tests/fixtures/style-block-scoped/include-child-component-with-component-on-root-and-style-block-scoped.twig

@@ -0,0 +1,2 @@
+<style> .foo[data-v-858c11a91dcdf48f12d9b6c5ca636873] { color: purple; }</style>
+{% include "/templates/ChildComponent.twig" with { 'slot_default': "", 'dataScopedStyleAttribute': "data-v-858c11a91dcdf48f12d9b6c5ca636873" ~ " " ~ dataScopedStyleAttribute|default(''), 'class': "foo" ~ " " ~ class|default(''), 'style': "color: black" ~ "; " ~ style|default('') } %}

tests/fixtures/style-block-scoped/include-child-component-with-component-on-root-and-style-block-scoped.vue

@@ -0,0 +1,18 @@
+<template>
+  <ChildComponent class="foo" style="color: black" />
+</template>
+
+<script>
+    export default {
+        name: 'ComponentWithComponentOnRoot',
+        component: {
+          ChildComponent,
+        }
+    };
+</script>
+
+<style scoped>
+  .foo {
+    color: purple;
+  }
+</style>

tests/fixtures/style-block-scoped/include-child-component-with-component-on-root.twig

@@ -0,0 +1 @@
+{% include "/templates/ChildComponent.twig" with { 'slot_default': "", 'dataScopedStyleAttribute': dataScopedStyleAttribute|default(''), 'class': "foo" ~ " " ~ class|default(''), 'style': "color: black" ~ "; " ~ style|default('') } %}

tests/fixtures/vue-slot/include-child-component-with-component-on-root.vue renamed to tests/fixtures/style-block-scoped/include-child-component-with-component-on-root.vue

@@ -0,0 +1,2 @@
+<style> .foo[data-v-858c11a91dcdf48f12d9b6c5ca636873] { color: purple; }</style>
+<div data-v-858c11a91dcdf48f12d9b6c5ca636873 {{ dataScopedStyleAttribute|default('') }} class="{{ class|default('') }}" style="{{ style|default('') }}">{% include "/templates/ChildComponent.twig" with { 'slot_default': "", 'dataScopedStyleAttribute': "data-v-858c11a91dcdf48f12d9b6c5ca636873", 'class': "foo", 'style': "color: black" } %}</div>

tests/fixtures/style-block-scoped/include-child-component-with-style-block-scoped.twig

@@ -0,0 +1,20 @@
+<template>
+  <div>
+    <ChildComponent class="foo" style="color: black" />
+  </div>
+</template>
+
+<script>
+    export default {
+        name: 'ComponentWithComponentOnRoot',
+        component: {
+          ChildComponent,
+        }
+    };
+</script>
+
+<style scoped>
+  .foo {
+    color: purple;
+  }
+</style>

tests/fixtures/style-block-scoped/include-child-component-with-style-block-scoped.vue

@@ -1,4 +1,4 @@
 {% set text = text|default('foo') %}
 {% set slot_default_fallback %}{{ text }}{% endset %}
 {% set slot_default_value %}{{ slot_default|default(slot_default_fallback) }}{% endset %}
-{% include "/templates/ChildComponent.twig" with { 'slot_default': slot_default_value, 'class': "", 'style': "" } %}
+{% include "/templates/ChildComponent.twig" with { 'slot_default': slot_default_value, 'class': class|default(''), 'style': style|default('') } %}