Render Statics Components and Props tags

Author: WebMamba

src/TwigComponent/src/ComponentFactory.php

@@ -31,13 +31,12 @@ final class ComponentFactory
      * @param array<class-string, string> $classMap
      */
     public function __construct(
+        private Environment $environment,
         private ServiceLocator $components,
         private PropertyAccessorInterface $propertyAccessor,
         private EventDispatcherInterface $eventDispatcher,
         private array $config,
-        private array $classMap,
-        private Environment $environment,
-        private string $twigExtension
+        private array $classMap
     ) {
     }
 
@@ -46,14 +45,14 @@ public function metadataFor(string $name): ComponentMetadata
         $name = $this->classMap[$name] ?? $name;
 
         if (!$config = $this->config[$name] ?? null) {
-            if ($this->isStaticComponent($name)) {
+            if (($template = $this->findStaticComponentTemplate($name)) !== null) {
                 return new ComponentMetadata([
                     'key' => $name,
-                    'template' => $this->getTemplateFromName($name),
+                    'template' => $template,
                 ]);
             }
 
-            throw new \InvalidArgumentException(sprintf('Unknown component "%s". The registered components are: %s. And no template %s. founded', $name, implode(', ', array_keys($this->config)), $this->getTemplateFromName($name)));
+            throw new \InvalidArgumentException(sprintf('Unknown component "%s". The registered components are: %s. And no template anonymous component founded', $name, implode(', ', array_keys($this->config))));
         }
 
         return new ComponentMetadata($config);
@@ -134,6 +133,12 @@ private function mount(object $component, array &$data): void
             return;
         }
 
+        if ($component instanceof StaticComponent) {
+            $component->mount($data);
+
+            return;
+        }
+
         $parameters = [];
 
         foreach ($method->getParameters() as $refParameter) {
@@ -163,7 +168,7 @@ private function getComponent(string $name): object
                 return new StaticComponent();
             }
 
-            throw new \InvalidArgumentException(sprintf('Unknown component "%s". The registered components are: %s. And no template %s. founded', $name, implode(', ', array_keys($this->components->getProvidedServices())), $this->getTemplateFromName($name)));
+            throw new \InvalidArgumentException(sprintf('Unknown component "%s". The registered components are: %s. And no anonymous component founded', $name, implode(', ', array_keys($this->components->getProvidedServices()))));
         }
 
         return $this->components->get($name);
@@ -205,12 +210,31 @@ private function postMount(object $component, array $data): array
 
     private function isStaticComponent(string $name): bool
     {
-        return $this->environment->getLoader()->exists($this->getTemplateFromName($name));
+        return null !== $this->findStaticComponentTemplate($name);
     }
 
-    private function getTemplateFromName(string $name): string
+    public function findStaticComponentTemplate(string $name): ?string
     {
-        return str_replace('.', '/', $name).$this->twigExtension;
+        $loader = $this->environment->getLoader();
+        $componentPath = rtrim(str_replace(':', '/', $name));
+
+        if ($loader->exists($componentPath)) {
+            return $componentPath;
+        }
+
+        if ($loader->exists($componentPath.'.html.twig')) {
+            return $componentPath.'.html.twig';
+        }
+
+        if ($loader->exists('components/'.$componentPath)) {
+            return 'components/'.$componentPath;
+        }
+
+        if ($loader->exists('/components/'.$componentPath.'.html.twig')) {
+            return '/components/'.$componentPath.'.html.twig';
+        }
+
+        return null;
     }
 
     /**

src/TwigComponent/src/ComponentRenderer.php

@@ -105,6 +105,7 @@ private function preRender(MountedComponent $mounted, array $context = []): PreR
 
             // expose public properties and properties marked with ExposeInTemplate attribute
             iterator_to_array($this->exposedVariables($component, $metadata->isPublicPropsExposed())),
+            $component instanceof StaticComponent ? $component->getProps() : []
         );
         $event = new PreRenderEvent($mounted, $metadata, $variables);
 

src/TwigComponent/src/DependencyInjection/Compiler/TwigComponentPass.php

@@ -58,8 +58,8 @@ public function process(ContainerBuilder $container): void
         }
 
         $factoryDefinition = $container->findDefinition('ux.twig_component.component_factory');
-        $factoryDefinition->setArgument(0, ServiceLocatorTagPass::register($container, $componentReferences));
-        $factoryDefinition->setArgument(3, $componentConfig);
-        $factoryDefinition->setArgument(4, $componentClassMap);
+        $factoryDefinition->setArgument(1, ServiceLocatorTagPass::register($container, $componentReferences));
+        $factoryDefinition->setArgument(4, $componentConfig);
+        $factoryDefinition->setArgument(5, $componentClassMap);
     }
 }

src/TwigComponent/src/DependencyInjection/TwigComponentExtension.php

@@ -40,9 +40,6 @@ public function load(array $configs, ContainerBuilder $container): void
             throw new LogicException('The TwigBundle is not registered in your application. Try running "composer require symfony/twig-bundle".');
         }
 
-        $configuration = new Configuration();
-        $config = $this->processConfiguration($configuration, $configs);
-
         $container->registerAttributeForAutoconfiguration(
             AsTwigComponent::class,
             static function (ChildDefinition $definition, AsTwigComponent $attribute) {
@@ -52,12 +49,11 @@ static function (ChildDefinition $definition, AsTwigComponent $attribute) {
 
         $container->register('ux.twig_component.component_factory', ComponentFactory::class)
             ->setArguments([
+                new Reference('twig'),
                 class_exists(AbstractArgument::class) ? new AbstractArgument(sprintf('Added in %s.', TwigComponentPass::class)) : null,
                 new Reference('property_accessor'),
                 new Reference('event_dispatcher'),
                 class_exists(AbstractArgument::class) ? new AbstractArgument(sprintf('Added in %s.', TwigComponentPass::class)) : [],
-                new Reference('twig'),
-                $config['template_extension'],
             ])
         ;
 

src/TwigComponent/src/StaticComponent.php

@@ -4,4 +4,20 @@
 
 class StaticComponent
 {
+    private array $props = [];
+
+    public function setProps(array $props)
+    {
+        $this->props = $props;
+    }
+
+    public function getProps(): array
+    {
+        return $this->props;
+    }
+
+    public function mount(array $props = [])
+    {
+        $this->setProps($props);
+    }
 }

src/TwigComponent/src/Twig/ComponentExtension.php

@@ -49,6 +49,7 @@ public function getTokenParsers(): array
     {
         return [
             new ComponentTokenParser(fn () => $this->container->get(ComponentFactory::class)),
+            new PropsTokenParser(),
         ];
     }
 

src/TwigComponent/src/Twig/PropsNode.php

@@ -0,0 +1,40 @@
+<?php
+
+namespace Symfony\UX\TwigComponent\Twig;
+
+use Twig\Compiler;
+use Twig\Node\Node;
+
+class PropsNode extends Node
+{
+    public function __construct(array $propsNames, array $values, $lineno = 0, string $tag = null)
+    {
+        parent::__construct($values, ['names' => $propsNames], $lineno, $tag);
+    }
+
+    public function compile(Compiler $compiler)
+    {
+        foreach ($this->getAttribute('names') as $name) {
+            $compiler
+                ->addDebugInfo($this)
+                ->write('if (!isset($context[\''.$name.'\'])) {')
+            ;
+
+            if (!$this->hasNode($name)) {
+                $compiler
+                    ->write('throw new \Exception("'.$name.' should be defined for component '.$this->getTemplateName().'");')
+                    ->write('}')
+                ;
+
+                continue;
+            }
+
+            $compiler
+                ->write('$context[\''.$name.'\'] = ')
+                ->subcompile($this->getNode($name))
+                ->raw(";\n")
+                ->write('}')
+            ;
+        }
+    }
+}

src/TwigComponent/src/Twig/PropsTokenParser.php

@@ -0,0 +1,40 @@
+<?php
+
+namespace Symfony\UX\TwigComponent\Twig;
+
+use Twig\Token;
+use Twig\TokenParser\AbstractTokenParser;
+
+class PropsTokenParser extends AbstractTokenParser
+{
+    public function parse(Token $token)
+    {
+        $parser = $this->parser;
+        $stream = $parser->getStream();
+
+        $names = [];
+        $values = [];
+        while (!$stream->nextIf(Token::BLOCK_END_TYPE)) {
+            $name = $stream->expect(\Twig\Token::NAME_TYPE)->getValue();
+
+            if ($stream->nextIf(Token::OPERATOR_TYPE, '=')) {
+                $values[$name] = $parser->getExpressionParser()->parseExpression();
+            }
+
+            $names[] = $name;
+
+            if (!$stream->nextIf(Token::PUNCTUATION_TYPE)) {
+                break;
+            }
+        }
+
+        $stream->expect(\Twig\Token::BLOCK_END_TYPE);
+
+        return new PropsNode($names, $values, $token->getLine(), $token->getValue());
+    }
+
+    public function getTag()
+    {
+        return 'props';
+    }
+}

src/TwigComponent/tests/Fixtures/templates/anonymous_component.html.twig

@@ -0,0 +1 @@
+<twig:Button label='Click me'/>

src/TwigComponent/tests/Fixtures/templates/anonymous_component_overwrite_props.html.twig

@@ -0,0 +1 @@
+<twig:Button label='Click me' :primary='false'/>

src/TwigComponent/tests/Fixtures/templates/components/Button.html.twig

@@ -0,0 +1,5 @@
+{% props label, primary = true %}
+
+<button class="{{ primary ? 'primary' : 'secondary' }}">
+    {{ label }}
+</button>

src/TwigComponent/tests/Fixtures/templates/static/button.html.twig

@@ -151,18 +151,27 @@ public function testCanRenderEmbeddedComponent(): void
         $this->assertStringContainsString('custom td (1)', $output);
     }
 
-    public function testCanRenderStaticComponent(): void
+    public function testComponentWithNamespace(): void
     {
-        $output = self::getContainer()->get(Environment::class)->render('render_static_component.html.twig');
+        $output = $this->renderComponent('foo:bar:baz');
 
-        $this->assertStringContainsString('I am static', $output);
+        $this->assertStringContainsString('Content...', $output);
     }
 
-    public function testComponentWithNamespace(): void
+    public function testRenderAnonymousComponent(): void
     {
-        $output = $this->renderComponent('foo:bar:baz');
+        $output = self::getContainer()->get(Environment::class)->render('anonymous_component.html.twig');
 
-        $this->assertStringContainsString('Content...', $output);
+        $this->assertStringContainsString('Click me', $output);
+        $this->assertStringContainsString('class="primary"', $output);
+    }
+
+    public function testRenderAnonymousComponentOverwriteProps(): void
+    {
+        $output = self::getContainer()->get(Environment::class)->render('anonymous_component_overwrite_props.html.twig');
+
+        $this->assertStringContainsString('Click me', $output);
+        $this->assertStringContainsString('class="secondary"', $output);
     }
 
     private function renderComponent(string $name, array $data = []): string