[Twig] Add a strategy for adding a Stimulus controller to a Twig component

[weaverryan]

…onent root element

Q	A
Bug fix?	yes-ish
New feature?	yes
Tickets	Fix #527
License	MIT

Hi!

This allows adding a custom Stimulus controller to the root element of a component. The syntax is:

<div {{ attributes.add(stimulus_controller('my-controller', { someValue: 'foo' })) }}>

This is a compromise of having a nice syntax vs not duplicating code. The attributes.add() method is designed to work specifically with the stimulus_* functions, so it's name is kinda funny. But it feels way better than something like attributes->stimulusController(stimulus_controller()). Just doing attributes.stimulusController('my-controller') isn't possible at the moment, because it would require us to create a StimulusControllersDto and that, unfortunately, requires a Twig Environment for escaping purposes.

Cheers!

[althaus]

Hey.... I've just stumbled upon this issue as the feature is already in the docs but not released yet.

Could you pack a new version with this change?

Cheers
Matthias

[weaverryan]

Oooh, we need to add the versionadded annotation above the docs for this to make it clear! We’ll have as new release sometime soon… but not immediately.

[weaverryan]

Added in sha: 8e5cab3

[Kocal]

Isn't a bit weird to have a method add that takes a StimulusDto?
Shouldn't this method be named withStimulus or something like that?

[weaverryan]

Probably :). But it looked a bit terrible when used:

{{ attributes.withStimulus(stimulus_controller(...)) }}

The 2x Stimulus. But, we could potentially "open" this add() method later to accept other types of arguments, if we think of something.

[Kocal]

Yeah, an array of key/values for example

[althaus]

Oooh, we need to add the versionadded annotation above the docs for this to make it clear! We’ll have as new release sometime soon… but not immediately.

Thanks for fixing the doc. I'm totally fine with using a non-release for trying things out. I just felt that integrating custom/legacy JS is quite common use case.