6. renders self close components with many props

23 hours ago · 5cdc2e85c0
parent 38d4458e96
commit 5cdc2e85c0
4 changed files with 33 additions and 7 deletions
--- a/flight/template/View.php
+++ b/flight/template/View.php
@ -158,7 +158,7 @@ class View
        }

        preg_match(
-            '/<f-(?<component>[a-z-]+)\s*(?<props>[a-z]+="[a-z-A-Z]+")*\s*\/>/',
+            '/<f-(?<component>[a-z-]+)\s*(?<props>([a-z]+="[a-zA-Z]+"\s*)*)?\s*\/>/',
            $view,
            $matches,
        );
@ -168,15 +168,25 @@ class View
            $component = $matches['component'];
            $props = $matches['props'] ?? '';

-            preg_match(
-                '/^(?<name>[a-z]+)="(?<value>[a-zA-Z]+)"$/',
+            preg_match_all(
+                '/(?<name>[a-z]+)="(?<value>[a-zA-Z]+)"/',
                $props,
                $matches,
            );

-            $props = $matches
-                ? [$matches['name'] => $matches['value']]
-                : [];
+            $matches = array_filter($matches);
+
+            if ($matches) {
+                $props = [];
+
+                foreach (array_keys($matches[0]) as $index) {
+                    $name = $matches['name'][$index];
+                    $value = $matches['value'][$index];
+                    $props[$name] = $value;
+                }
+            } else {
+                $props = [];
+            }

            $component = $this->fetch("components/$component", $props);
            $view = str_replace($tag, $component, $view);
--- a/tests/ViewTest.php
+++ b/tests/ViewTest.php
@ -345,7 +345,17 @@ class ViewTest extends TestCase
                html,
                ['name' => 'Victoria'],
            ],
-
+            [
+                'page-with-component-with-two-props',
+                <<<'html'
+                <html>
+                    <body>
+                        <h1>Hello, Astronaut Victoria</h1>
+                    </body>
+                </html>
+                html,
+                ['name' => 'Victoria', 'occupation' => 'Astronaut'],
+            ],
        ];
    }

--- a/tests/views/components/greeting-with-two-props.php
+++ b/tests/views/components/greeting-with-two-props.php
@ -0,0 +1 @@
+<h1>Hello, <?= $occupation ?> <?= $name ?></h1>
--- a/tests/views/pages/page-with-component-with-two-props.php
+++ b/tests/views/pages/page-with-component-with-two-props.php
@ -0,0 +1,5 @@
+<html>
+    <body>
+        <f-greeting-with-two-props name="<?= $name ?>" occupation="<?= $occupation ?>" />
+    </body>
+</html>
				`@ -0,0 +1 @@`
				`<h1>Hello, <?= $occupation ?> <?= $name ?></h1>`