Feature Guide

A quick orientation block that answers the essential questions: what this feature does, how it works, why it matters, and the key concepts behind it.

What this does

Reusable, attribute-registered UI components — discovered automatically from the classmap.

Component Event Bridge

One click, one SSR component contract, one backend event bus.

This button still opens the disclosure layer locally, but it now also dispatches a signed backend event through the generic SSR bridge endpoint.

Local disclosure still works immediately. The component bridge runs in parallel and acknowledges the backend dispatch below.

DemoDisclosureExpanded Declared backend event

click Public trigger contract

/__semitexa_component_event Generic bridge endpoint

Backend acknowledgment

Waiting for the first dispatch…

#[AsComponent] event triggers component_event_attrs() EventDispatcherInterface

Verified against Semitexa Ultimate 2026.09.19.1020

Components

Attribute-registered SSR components with an explicit backend event contract, signed manifest, and one generic dispatch endpoint. Open the component class and you can now see both the rendered UI primitive and the backend event contract it is allowed to trigger.

How it works

Components are discovered at boot from the classmap through #[AsComponent]. A component can declare which backend events it is allowed to trigger. The framework provides one generic dispatch endpoint and a signed manifest so the frontend knows what events are permitted.

When the component renders, component_event_attrs() outputs the data attributes needed for the client runtime to dispatch events through the bridge without custom fetch wiring per component.

Key mechanisms

#[AsComponent] — registers the class as a discoverable UI component.
event / triggers — declare the backend event contract the component is allowed to trigger.
component_event_attrs() — outputs data attributes in Twig for the client dispatch bridge.
EventDispatcherInterface — handles incoming component events on the backend.

Why this matters

Components can become interactive without requiring a separate API endpoint per component. The event contract is visible on the component class, the manifest is signed, and one shared bridge handles dispatch. Behavior stays co-located with the component rather than scattered across ad hoc endpoints and frontend fetch calls.

1<?php23declare(strict_types=1);45namespace App\Application\Component;67use Semitexa\Ssr\Attribute\AsComponent;89#[AsComponent(10    name: 'disclosure-prompt',11    template: '@app/components/disclosure-prompt.html.twig',12    cacheable: false,13)]14final class DisclosurePromptComponent15{16    public function __construct(17        public readonly string $label,18        public readonly string $target,19    ) {}20}21

<?php

declare(strict_types=1);

namespace App\Application\Component;

use Semitexa\Ssr\Attribute\AsComponent;

#[AsComponent(
    name: 'disclosure-prompt',
    template: '@app/components/disclosure-prompt.html.twig',
    cacheable: false,
)]
final class DisclosurePromptComponent
{
    public function __construct(
        public readonly string $label,
        public readonly string $target,
    ) {}
}

1{% set normalizedLabel = label ends with '→' ? label|slice(0, -1)|trim : label %}2<button3  type="button"4  class="disclosure-prompt disclosure-prompt--{{ variant }}"5  aria-controls="{{ target }}"6  aria-expanded="false"7  data-disclosure-trigger="{{ target }}"8  {{ component_event_attrs('click', {9    targetId: target,10    source: variant,11  }) }}12>13  <span class="disclosure-prompt__label">{{ normalizedLabel }}</span>14  <span class="disclosure-prompt__arrow" aria-hidden="true">→</span>15</button>16

{% set normalizedLabel = label ends with '→' ? label|slice(0, -1)|trim : label %}
<button
  type="button"
  class="disclosure-prompt disclosure-prompt--{{ variant }}"
  aria-controls="{{ target }}"
  aria-expanded="false"
  data-disclosure-trigger="{{ target }}"
  {{ component_event_attrs('click', {
    targetId: target,
    source: variant,
  }) }}
>
  <span class="disclosure-prompt__label">{{ normalizedLabel }}</span>
  <span class="disclosure-prompt__arrow" aria-hidden="true">→</span>
</button>

1<?php23declare(strict_types=1);45namespace App\Application\Event;67use Semitexa\Core\Attribute\AsEvent;89#[AsEvent]10final class DemoDisclosureExpanded11{12    public function __construct(13        public readonly string $component,14        public readonly string $target,15    ) {}16}17

<?php

declare(strict_types=1);

namespace App\Application\Event;

use Semitexa\Core\Attribute\AsEvent;

#[AsEvent]
final class DemoDisclosureExpanded
{
    public function __construct(
        public readonly string $component,
        public readonly string $target,
    ) {}
}

1<?php23declare(strict_types=1);45namespace App\Application\Listener;67use App\Application\Event\DemoDisclosureExpanded;8use Semitexa\Core\Attribute\AsEventListener;9use Semitexa\Core\Event\EventExecution;1011#[AsEventListener(event: DemoDisclosureExpanded::class, execution: EventExecution::Sync)]12final class DemoDisclosureExpandedListener13{14    public function handle(DemoDisclosureExpanded $event): void15    {16        // Persist analytics or emit follow-up UI signals.17    }18}19

<?php

declare(strict_types=1);

namespace App\Application\Listener;

use App\Application\Event\DemoDisclosureExpanded;
use Semitexa\Core\Attribute\AsEventListener;
use Semitexa\Core\Event\EventExecution;

#[AsEventListener(event: DemoDisclosureExpanded::class, execution: EventExecution::Sync)]
final class DemoDisclosureExpandedListener
{
    public function handle(DemoDisclosureExpanded $event): void
    {
        // Persist analytics or emit follow-up UI signals.
    }
}