Add classes support to {{ stimulus_controller }}

[sukei]

The stimulus_controller function is a great addition but is not feature complete. Targets and actions are already discussed here, so I won't talk about it. However classes are not covered.

As stated by the Stimulus documentation:

CSS class attributes must be specified on the same element as the data-controller attribute.

I think that stimulus_controller should add classes support too. But, I don't know how the function signature should change to support this without breaking things. Until the official implementation arrived, I came to the following:

stimulus_controller('layout/panel', { active: true }, { hide: d-none' }, 'focusable') which rendered data-controller="layout--panel focusable" data-layout--panel-active-value="true" data-layout--panel-hide-class="d-none".

[Kocal]

The problem is how it should behave when using the array syntax to render multiple controllers values like this?

{{ stimulus_controller({
  'controller1': { 'value1' => '...', 'value2': '...' },
  'controller2': { 'value1' => '...', 'value2': '...' },
}) }}

Maybe a 2nd parameter like this:

{{ stimulus_controller({
  'controller1': { 'value1' => '...', 'value2': '...' },
  'controller2': { 'value1' => '...', 'value2': '...' },
}, {
  'controller1': {'loading': 'my-class-for-loading'}
}) }}

WDYT?

If it's not readable enough and/or hard to maintain, maybe we can add a new argument and exploit Twig named arguments feature ?

{{ stimulus_controller({
  'controller1': { 'value1' => '...', 'value2': '...' },
  'controller2': { 'value1' => '...', 'value2': '...' },
}, classes={
  'controller1': {'loading': 'my-class-for-loading'}
}) }}

[sukei]

The current API may be hard to keep. That's the main issue here. My own version uses a triplet of values to achieve this purpose (controller, values, classes, controller, values, classes, ...). However, the current API can be tweaked to get the same signature. Currently we have

$dataOrControllerName, array $controllerValues = []

Could change to:

string|array $controller /* array of (string, mixed) to keep BC */, array $controllerValues = [], array $controllerClasses = [], ...$repeat

[weaverryan]

I understand the issue (and sorry for not including classes originally - it's just not a feature I use), but I don't quite understand the solution (just because the nature of this function is complex). @sukei would you be willing to open a PR with your vision? It's ok if it's incomplete / quick-and-dirty / untested: it's just more helpful to see proposals in code.

Note: I also think the "named" arguments approach that @Kocal mentioned is a worthwhile direction.

Thanks!