Component

L'attribut Component permet de lier une méthode à un composant Twig, permettant d'injecter des données et de la logique métier dans vos templates.

Utilisation de base

app/Controllers/MyController.php

use Elementum\Attributes\Component;

class MyController extends Controller
{
    #[Component('blog/article-card')]
    public function articleCard(): array
    {
        return [
            'title' => 'Mon titre',
            'content' => 'Mon contenu',
            'date' => date('d/m/Y')
        ];
    }
}

Paramètre obligatoire

name Requis

• Type : string
• Description : Chein du composant Twig correspondant
• Exemple : 'blog/article-card'
• Remarque : Doit correspondre au chemin du template Twig sans l'extension

Utilisation dans les templates

Appel du composant

templates/base.html.twig

{{ component('blog/article-card') }}

Template du composant

templates/components/blog/article-card.html.twig

<article class="article-card">
    <h2>{{ title }}</h2>
    <div class="content">{{ content|raw }}</div>
    <footer>Publié le {{ date }}</footer>
</article>

Extensibilité via #[Hook]

Chaque composant est automatiquement extensible par l'attribut #[Hook]. Quand component('blog/article-card') est appelé dans Twig, le service twig.hook déclenche le filtre elm.blog.article-card.

Un thème enfant ou un plugin peut alors surcharger le template et/ou enrichir les variables sans modifier le contrôleur d'origine :

child-theme/app/Controller/HooksController.php

use Elementum\Attributes\Hook;

class HooksController extends Controller
{
    #[Hook('blog.article-card', '@child/components/blog/article-card.html.twig')]
    public function articleCardOverride(array $args): array
    {
        return [
            ...$args,
            'badge' => 'Nouveau',
        ];
    }
}

Bonnes pratiques

• Nommage : Utilisez des noms de méthodes descriptifs qui reflètent le rôle du composant
• Retour : La méthode doit toujours retourner un tableau associatif
• Séparation : Gardez la logique dans le contrôleur et l'affichage dans le template
• Documentation : Commentez les paramètres attendus et le rôle du composant
• Extension : Pour surcharger un composant dans un thème enfant, préférez #[Hook] plutôt que de dupliquer le composant