symfony/archived-stimulus-bundle
1
0
Fork 0
mirror of https://github.com/symfony/stimulus-bundle.git synced 2026-03-24 01:12:07 +01:00
Code Issues Packages Projects Releases Wiki Activity

minor #2707 [StimulusBundle] Docs, replace chart examples by hello to avoid confusion with the ChartJS component (welcoMattic)

Browse Source 
This PR was merged into the 2.x branch.

Discussion
----------

[StimulusBundle] Docs, replace `chart` examples by `hello` to avoid confusion with the ChartJS component

| Q             | A
| ------------- | ---
| Bug fix?      | no
| New feature?  | no <!-- please update src/**/CHANGELOG.md files -->
| Docs?         | yes <!-- required for new features -->
| Issues        | Fix #... <!-- prefix each issue number with "Fix #", no need to create an issue if none exist, explain below instead -->
| License       | MIT

As ChartJS component exists, the examples using `chart` as controller identifier are confusing. ChartJS component does not expect `name` and `data` as values, but `view`.

Examples has been updated with a dead simple `hello world` style, which can not be confusing.

Commits
-------

77ee62edd8b Replace `chart` examples by `hello` to avoid confusion with the ChartJS component
This commit is contained in:
Hugo Alliaume
2025-05-23 11:27:30 +02:00
parent d5abe891c0 70175cbecb
commit 750c770f66
1 changed files with 21 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
doc/index.rst
View File

@@ -174,15 +174,15 @@ For example:
.. code-block:: html+twig
<div {{ stimulus_controller('chart', { 'name': 'Likes', 'data': [1, 2, 3, 4] }) }}>
<div {{ stimulus_controller('hello', { 'name': 'World', 'data': [1, 2, 3, 4] }) }}>
Hello
</div>
<!-- would render -->
<div
data-controller="chart"
data-chart-name-value="Likes"
data-chart-data-value="&#x5B;1,2,3,4&#x5D;"
data-controller="hello"
data-hello-name-value="World"
data-hello-data-value="&#x5B;1,2,3,4&#x5D;"
>
Hello
</div>
@@ -191,22 +191,22 @@ If you want to set CSS classes:
.. code-block:: html+twig
<div {{ stimulus_controller('chart', { 'name': 'Likes', 'data': [1, 2, 3, 4] }, { 'loading': 'spinner' }) }}>
<div {{ stimulus_controller('hello', { 'name': 'World', 'data': [1, 2, 3, 4] }, { 'loading': 'spinner' }) }}>
Hello
</div>
<!-- would render -->
<div
data-controller="chart"
data-chart-name-value="Likes"
data-chart-data-value="&#x5B;1,2,3,4&#x5D;"
data-chart-loading-class="spinner"
data-controller="hello"
data-hello-name-value="World"
data-hello-data-value="&#x5B;1,2,3,4&#x5D;"
data-hello-loading-class="spinner"
>
Hello
</div>
<!-- or without values -->
<div {{ stimulus_controller('chart', controllerClasses = { 'loading': 'spinner' }) }}>
<div {{ stimulus_controller('hello', controllerClasses: { 'loading': 'spinner' }) }}>
Hello
</div>
@@ -214,8 +214,8 @@ And with outlets:
.. code-block:: html+twig
<div {{ stimulus_controller('chart',
{ 'name': 'Likes', 'data': [1, 2, 3, 4] },
<div {{ stimulus_controller('hello',
{ 'name': 'World', 'data': [1, 2, 3, 4] },
{ 'loading': 'spinner' },
{ 'other': '.target' } ) }}>
Hello
@@ -223,17 +223,17 @@ And with outlets:
<!-- would render -->
<div
data-controller="chart"
data-chart-name-value="Likes"
data-chart-data-value="&#x5B;1,2,3,4&#x5D;"
data-chart-loading-class="spinner"
data-chart-other-outlet=".target"
data-controller="hello"
data-hello-name-value="World"
data-hello-data-value="&#x5B;1,2,3,4&#x5D;"
data-hello-loading-class="spinner"
data-hello-other-outlet=".target"
>
Hello
</div>
<!-- or without values/classes -->
<div {{ stimulus_controller('chart', controllerOutlets = { 'other': '.target' }) }}>
<div {{ stimulus_controller('hello', controllerOutlets: { 'other': '.target' }) }}>
Hello
</div>
@@ -246,12 +246,12 @@ there's also a ``stimulus_controller`` filter:
.. code-block:: html+twig
<div {{ stimulus_controller('chart', { 'name': 'Likes' })|stimulus_controller('other-controller') }}>
<div {{ stimulus_controller('hello', { 'name': 'World' })|stimulus_controller('other-controller') }}>
Hello
</div>
<!-- would render -->
<div data-controller="chart other-controller" data-chart-name-value="Likes">
<div data-controller="hello other-controller" data-hello-name-value="World">
Hello
</div>
@@ -259,7 +259,7 @@ You can also retrieve the generated attributes as an array, which can be helpful
.. code-block:: twig
{{ form_start(form, { attr: stimulus_controller('chart', { 'name': 'Likes' }).toArray() }) }}
{{ form_start(form, { attr: stimulus_controller('hello', { 'name': 'World' }).toArray() }) }}
stimulus_action
~~~~~~~~~~~~~~~