[WIP] Model rendering overhaul

src/Autocomplete/assets/dist/controller.js

@@ -1,7 +1,7 @@
 import { Controller } from '@hotwired/stimulus';
 import TomSelect from 'tom-select';
 
-/*! *****************************************************************************
+/******************************************************************************
 Copyright (c) Microsoft Corporation.
 
 Permission to use, copy, modify, and/or distribute this software for any
@@ -42,6 +42,9 @@ class default_1 extends Controller {
         }
         this.tomSelect = __classPrivateFieldGet(this, _instances, "m", _createAutocomplete).call(this);
     }
+    disconnect() {
+        this.tomSelect.destroy();
+    }
     get selectElement() {
         if (!(this.element instanceof HTMLSelectElement)) {
             return null;

src/Autocomplete/src/Resources/doc/index.rst

@@ -447,7 +447,7 @@ outside of the Form component. For example:
 
     <select
         name="food"
-        {{ stimulus_controller('symfony/ux-autocomplete/autocomplete')
+        {{ stimulus_controller('symfony/ux-autocomplete/autocomplete') }}
     >
 
 That's it! If you want the options to be autocompleted via
@@ -460,7 +460,7 @@ a :ref:`custom autocompleter <custom-autocompleter>`:
         name="food"
         {{ stimulus_controller('symfony/ux-autocomplete/autocomplete', {
             url: path('ux_entity_autocomplete', { alias: 'food' })
-        })
+        }) }}
     >
 
 .. _custom-autocomplete-endpoint:
@@ -483,6 +483,7 @@ a :ref:`custom autocompleter <custom-autocompleter>`:
     Once you have this, generate the URL to your controller and
     pass it to the ``url`` value of the ``stimulus_controller()`` Twig
     function, or to the ``autocomplete_url`` option of your form field.
+    The search term entered by the user is passed as a query parameter called ``query``.
 
 Beyond ``url``, the Stimulus controller has various other values,
 including ``tomSelectOptions``. See the `controller.ts`_ file for

src/Chartjs/Twig/ChartExtension.php

@@ -12,6 +12,7 @@
 namespace Symfony\UX\Chartjs\Twig;
 
 use Symfony\UX\Chartjs\Model\Chart;
+use Symfony\WebpackEncoreBundle\Dto\StimulusControllersDto;
 use Symfony\WebpackEncoreBundle\Twig\StimulusTwigExtension;
 use Twig\Environment;
 use Twig\Extension\AbstractExtension;
@@ -49,7 +50,16 @@ public function renderChart(Environment $env, Chart $chart, array $attributes =
         }
         $controllers['@symfony/ux-chartjs/chart'] = ['view' => $chart->createView()];
 
-        $html = '<canvas '.$this->stimulus->renderStimulusController($env, $controllers).' ';
+        if (class_exists(StimulusControllersDto::class)) {
+            $dto = new StimulusControllersDto($env);
+            foreach ($controllers as $name => $controllerValues) {
+                $dto->addController($name, $controllerValues);
+            }
+
+            $html = '<canvas '.$dto.' ';
+        } else {
+            $html = '<canvas '.$this->stimulus->renderStimulusController($env, $controllers).' ';
+        }
 
         foreach ($chart->getAttributes() as $name => $value) {
             if ('data-controller' === $name) {

src/LiveComponent/CHANGELOG.md

@@ -1,5 +1,68 @@
 # CHANGELOG
 
+## 2.3.0
+
+-   [BC BREAK] The `data-action="live#update"` attribute must now be
+    removed from **nearly** all elements. This is because LiveComponents
+    now automatically listens to the `input` event on all elements
+    with a `data-model` attribute and updates the data. If you previously
+    used `data-action="change->live#update"` to list on the `change`
+    event, now you should use the `on(change)` modifier inside `data-model`.
+
+```twig
+<!-- BEFORE -->
+<input
+    data-model="max"
+    data-action="change->live#update"
+>
+
+<!-- AFTER -->
+<input
+    data-model="on(change)|max"
+>
+```
+
+-   [BC BREAK] The `live#updateDefer` action was removed entirely.
+    Now, to update a model without triggering a re-render, use the
+    `norender` modifier for `data-model`:
+
+```twig
+<!-- BEFORE -->
+<input
+    data-model="max"
+    data-action="live#updateDefer"
+>
+
+<!-- AFTER -->
+<input
+    data-model="norender|max"
+>
+```
+
+-   [BC BREAK] The `name` attribute is no longer automatically used to
+    update a model when a parent component has `data-action="change->live#update"`.
+    To make a form's fields behave like "model" fields (but using the
+    `name` attribute instead of `data-model`) you need to add a `data-model`
+    attribute to the `<form>` element around your fields (NOTE: the
+    new attribute is automatically added to your `form` element when
+    using `ComponentWithFormTrait`):
+
+```twig
+<!-- BEFORE -->
+<form data-action="change->live#update">
+    <input
+        name="max"
+    >
+</form>
+
+<!-- AFTER -->
+<form data-model="on(change)|*">
+    <input
+        name="max"
+    >
+</form>
+```
+
 ## 2.2.0
 
 -   The bundle now properly exposes a `live` controller, which can be