[LiveComponent] Add 'live_action' twig function

[pierredup]

Q	A
Bug fix?	no
New feature?	yes
Issues	N/A
License	MIT

Adds a new live_action twig function.

This helps with creating the proper attributes to call a live action. I can never remember the syntax and need to look up the docs every time to add a live action. This will make the process much easier.

Example Usage:

- <button data-action="live#action" data-live-action-param="save">Save</button>
+ <button {{ live_action('save') }}>Save</button>

Additional Parameters:

<button
-  data-action="live#action"
-  data-live-action-param="addItem"
-  data-live-id-param="{{ item.id }}"
-  data-live-item-name-param="CustomItem"
+  {{ live_action('addItem', {'id': item.id, 'itemName': 'CustomItem'}) }}
>Add Item</button>

Adding Modifiers:

<button
-  data-action="live#action:prevent"
-  data-live-action-param="debounce(300)|save"
+  {{ live_action('save', {}, {'debounce': 300, 'prevent': true}) }}
 >Save</button>

TODO:

• Add CHANGELOG entry
• Update docs

[smnandre]

Hi @pierredup !

I like the idea very much (in term of DX), but internally i think we should leverage the StimulusAttribute already present in the Stimulus-Bundle ... https://symfony.com/bundles/StimulusBundle/current/index.html#stimulus-action

... what do you thinkl ?

[smnandre]

Depending on your answer on the previous question, this comment could be useless ;)

We'd need to specify the trigger, as even if an action is often trigger by the "default event" on the DOM element it's registerered on, but this can be more specific / diverse

Examples here: https://stimulus.hotwired.dev/reference/actions#keyboardevent-filter

[pierredup]

internally i think we should leverage the StimulusAttribute already present in the Stimulus-Bundle

I did initially start to go down this route, but then noticed the StimulusBundle is not a direct dependency of the LiveComponent, so didn't want to use classes that's not guaranteed to be available. Will then just add the StimulusBundle as a dependency to LiveComponent

We'd need to specify the trigger, as even if an action is often trigger by the "default event" on the DOM element it's registerered on, but this can be more specific / diverse

Cool, yeah that makes sense, will add it to the function

[kbond]

I love this - you're totally right, the syntax is hard to remember!

[smnandre]

Thank you @pierredup !

Just two last tiny details and good!

[kbond]

Thanks for your work on this new feature!