symfony-ux-twig-component

To create reusable Twig components with PHP backing in Symfony, you annotate a PHP class with the AsTwigComponent attribute, define public properties to act as component props, and render the UI block using the twig:Component tag in your templates.

Twig component slots allow you to compose server-rendered UI blocks by injecting content into defined areas within your component template. You can use named slots for targeted content placement and anonymous components for template-only UI pieces.

Yes, you can use lifecycle hooks to validate props in Symfony Twig components. The PreMount hook allows you to intercept and validate incoming props before rendering, while the PostMount hook executes post-setup logic after the component is instantiated.

The best way to pass data to server-rendered Twig components is by defining public properties in your PHP class, which automatically become component props. You can set default values and use computed accessors to dynamically derive data when rendering with the twig: tag.

You do not need to manually configure template naming conventions for Twig components. Symfony UX automatically resolves the matching Twig template based on the component class name, though you can specify custom names and templates if needed.

You should use anonymous Twig components instead of PHP-backed ones when you need straightforward, template-only UI blocks that do not require PHP logic. This approach is designer-friendly and eliminates the need for a backing PHP class when rendering server-side UI.