Merge pull request #35 from Paneon/master

Update master

Author: tronsha

src/Compiler.php

@@ -111,11 +111,21 @@ class Compiler
      */
     protected $includeAttributes = ['class', 'style'];
 
+    /**
+     * @var string|null
+     */
+    protected $vBind = null;
+
     /**
      * @var string[]
      */
     protected $attributesWithIf = ['checked', 'selected', 'disabled'];
 
+    /**
+     * @var array
+     */
+    protected $slotFallbackCounter = [];
+
     /**
      * Compiler constructor.
      */
@@ -340,7 +350,8 @@ public function convertNode(DOMNode $node, int $level = 0): DOMNode
             $include = $this->document->createTextNode(
                 $this->builder->createIncludePartial(
                     $usedComponent->getPath(),
-                    $this->preparePropertiesForInclude($usedComponent->getProperties())
+                    $this->preparePropertiesForInclude($usedComponent->getProperties()),
+                    $this->vBind
                 )
             );
 
@@ -435,6 +446,9 @@ private function preparePropertiesForInclude(array $variables): array
                     'dataScopedStyleAttribute|default(\'\')',
                     false
                 );
+            } elseif ($name === 'vBind') {
+                $this->vBind = $value;
+                unset($variables[$key]);
             }
         }
 
@@ -1297,10 +1311,18 @@ protected function handleSlots(DOMElement $node): void
 
         $slotName = Slot::SLOT_PREFIX;
         $slotName .= $node->getAttribute('name') ? $node->getAttribute('name') : Slot::SLOT_DEFAULT_NAME;
+        $slotFallbackKey = $slotName . '_fallback';
 
         if ($slotFallback) {
-            $this->addVariable($slotName . '_fallback', $slotFallback);
-            $variable = $this->builder->createVariableOutput($slotName, $slotName . '_fallback');
+            if (isset($this->slotFallbackCounter[$slotFallbackKey])) {
+                ++$this->slotFallbackCounter[$slotFallbackKey];
+                $slotFallbackName = $slotFallbackKey . '_' . $this->slotFallbackCounter[$slotFallbackKey];
+            } else {
+                $this->slotFallbackCounter[$slotFallbackKey] = 1;
+                $slotFallbackName = $slotFallbackKey;
+            }
+            $this->addVariable($slotFallbackName, $slotFallback);
+            $variable = $this->builder->createVariableOutput($slotName, $slotFallbackName);
         } else {
             $variable = $this->builder->createVariableOutput($slotName);
         }
@@ -1321,7 +1343,7 @@ protected function handleNamedSlotsInclude(DOMNode $node, Component $usedCompone
         foreach ($node->childNodes as $childNode) {
             if ($childNode instanceof DOMElement && $childNode->tagName === 'template') {
                 foreach ($childNode->attributes as $attribute) {
-                    if ($attribute instanceof DOMAttr && preg_match('/v-slot(?::([a-z]+)?)/i', $attribute->nodeName, $matches)) {
+                    if ($attribute instanceof DOMAttr && preg_match('/v-slot(?::([a-z0-9_-]+)?)/i', $attribute->nodeName, $matches)) {
                         $slotName = $matches[1] ?? Slot::SLOT_DEFAULT_NAME;
                         $this->addSlot($slotName, $childNode, $usedComponent);
                         $removeNodes[] = $childNode;

src/Utils/TwigBuilder.php

@@ -153,11 +153,17 @@ public function createBlock(string $content): string
     /**
      * @param Property[] $variables
      */
-    public function createIncludePartial(string $partialPath, array $variables = []): string
+    public function createIncludePartial(string $partialPath, array $variables = [], ?string $vBind = null): string
     {
         $serializedProperties = $this->serializeComponentProperties($variables);
 
-        return $this->createBlock('include "' . $partialPath . '" with ' . $serializedProperties);
+        $content = 'include "' . $partialPath . '" with ' . $serializedProperties;
+
+        if ($vBind) {
+            $content .= '|merge(' . trim($vBind, '"') . ')';
+        }
+
+        return $this->createBlock($content);
     }
 
     /**

tests/fixtures/vue-component/component-with-v-bind.twig

@@ -0,0 +1,3 @@
+<div class="{{ class|default('') }}" style="{{ style|default('') }}">
+  {% include "/templates/ChildComponent.twig" with { 'bar': "baz", 'slot_default': "", 'class': "", 'style': "" }|merge(foo) %}
+</div>

tests/fixtures/vue-component/component-with-v-bind.vue

@@ -0,0 +1,11 @@
+<template>
+  <div>
+    <ChildComponent v-bind="foo" bar="baz" />
+  </div>
+</template>
+
+<script>
+    export default {
+        name: 'ComponentWithVBind',
+    };
+</script>

tests/fixtures/vue-slot/component-has-two-default-slots-with-fallback-value.twig

@@ -0,0 +1,11 @@
+{% set slot_default_fallback %}{{ text }}{% endset %}
+{% set slot_default_fallback_2 %}{{ text }}{% endset %}
+{% if true %}
+<a href="#" class="{{ class|default('') }}" style="{{ style|default('') }}">
+    {{ slot_default|default(slot_default_fallback) }}
+</a>
+{% else %}
+<button class="{{ class|default('') }}" style="{{ style|default('') }}">
+    {{ slot_default|default(slot_default_fallback_2) }}
+</button>
+{% endif %}

tests/fixtures/vue-slot/component-has-two-default-slots-with-fallback-value.vue

@@ -0,0 +1,13 @@
+<template>
+  <a v-if="true" href="#">
+    <slot>{{ text }}</slot>
+  </a>
+  <button v-else>
+    <slot>{{ text }}</slot>
+  </button>
+</template>
+<script>
+    export default {
+        name: 'ComponentWithTowDefaultSlots',
+    };
+</script>