stimeo-ui 0.7.0 → 0.9.0

package/dist/controllers/bulk_select_controller.js

@@ -1,72 +1,189 @@
 import { Controller } from '@hotwired/stimulus';
 
+// src/controllers/bulk_select_controller.ts
+
+// src/utils/announce.ts
+function announce(message, options = {}) {
+  const text = message.trim();
+  if (text.length === 0) return;
+  window.dispatchEvent(
+    new CustomEvent("stimeo--announcer:announce", {
+      detail: { message: text, assertive: options.assertive === true }
+    })
+  );
+}
+function fillTemplate(template, values) {
+  return template.replace(/\{([a-zA-Z][a-zA-Z0-9]*)\}/g, (match, name) => {
+    const replacement = values[name];
+    return replacement === void 0 ? match : String(replacement);
+  });
+}
+
+// src/utils/microtask_coalescer.ts
+var MicrotaskCoalescer = class {
+  #run;
+  #queued = false;
+  #active = false;
+  #generation = 0;
+  /** @param run - the single reconciliation pass, invoked at most once per batch. */
+  constructor(run) {
+    this.#run = run;
+  }
+  /** Opens the window in which {@link schedule} is honoured; call from `connect()`. */
+  activate() {
+    this.#active = true;
+  }
+  /** Closes the window and drops any pending pass; call from `disconnect()`. */
+  cancel() {
+    this.#active = false;
+    this.#queued = false;
+    this.#generation += 1;
+  }
+  /** Requests one pass after the batch settles. Idempotent; inert outside the window. */
+  schedule() {
+    if (!this.#active || this.#queued) return;
+    this.#queued = true;
+    const generation = this.#generation;
+    queueMicrotask(() => {
+      if (generation !== this.#generation || !this.#queued || !this.#active) return;
+      this.#queued = false;
+      this.#run();
+    });
+  }
+};
+
 // src/controllers/bulk_select_controller.ts
 var BulkSelectController = class extends Controller {
   static targets = ["all", "item", "bar", "count", "selectAllPages"];
   static values = {
     totalCount: { type: Number, default: 0 },
-    announce: { type: Boolean, default: true }
+    announceText: { type: String, default: "" }
   };
   static actions = ["clear", "selectAllPages"];
-  static events = ["change"];
-  /** All-pages mode is a transient UI state; mirrored to `data-all-pages` so it
-   *  survives a Turbo swap and `connect()` can rehydrate it. */
+  static events = ["change", "reconcile"];
+  /** All-pages mode is a transient UI state, mirrored to `data-all-pages` so a
+   *  `connect()` over markup that already carries the attribute rehydrates the
+   *  mode — a morph, a Turbo Stream, or a server that renders it back. A restore
+   *  visit serves the server's markup instead, so the mode does not survive one. */
   #allPagesMode = false;
-  /** Last emitted figures, so a recompute dispatches `change` only on real change. */
+  /** Last emitted figures, so a recompute reports only on a real change. */
   #lastCount = -1;
   #lastAllPages = false;
+  /** Collapses every signal from one DOM or Value update into one repair. */
+  #reconcile = new MicrotaskCoalescer(() => this.#reconcileNow());
   /** Delegated `change` handler covering the select-all box and every row. */
   #onChange = (event) => {
     const target = event.target;
     if (!target) return;
     if (this.hasAllTarget && target === this.allTarget) {
       this.#applyAll();
-    } else if (target.matches('[data-stimeo--bulk-select-target="item"]')) {
+    } else if (this.itemTargets.some((item) => item === target)) {
       this.#exitAllPages();
-      this.#recompute(true);
+      this.#reportChange(this.#recompute());
     }
   };
   connect() {
     this.#allPagesMode = this.element.dataset.allPages === "true";
+    this.#reconcile.activate();
     this.element.addEventListener("change", this.#onChange);
-    this.#recompute(false);
+    this.#recompute();
   }
   disconnect() {
     this.element.removeEventListener("change", this.#onChange);
+    this.#reconcile.cancel();
+  }
+  /** Repairs the figures for a row that arrived at runtime. */
+  itemTargetConnected() {
+    this.#reconcile.schedule();
+  }
+  /** Repairs the figures after a row leaves, so a removed selection stops counting. */
+  itemTargetDisconnected() {
+    this.#reconcile.schedule();
+  }
+  /** Reflects the current selection onto a select-all box added at runtime. */
+  allTargetConnected() {
+    this.#reconcile.schedule();
+  }
+  /** Repairs the figures after the select-all box leaves. */
+  allTargetDisconnected() {
+    this.#reconcile.schedule();
+  }
+  /** Repaints the count for a total that changed at runtime, rejecting non-finite ones. */
+  totalCountValueChanged() {
+    if (!Number.isFinite(this.totalCountValue)) {
+      this.totalCountValue = 0;
+      return;
+    }
+    this.#reconcile.schedule();
+  }
+  /** Repaints so wording changed at runtime is used by the next announcement. */
+  announceTextValueChanged() {
+    this.#reconcile.schedule();
   }
   /** Clears every selection (rows + select-all) and exits all-pages mode. */
   clear() {
-    for (const item of this.#items) item.checked = false;
+    for (const item of this.itemTargets) item.checked = false;
     if (this.hasAllTarget) {
       this.allTarget.checked = false;
       this.allTarget.indeterminate = false;
     }
     this.#exitAllPages();
-    this.#recompute(true);
+    this.#reportChange(this.#recompute());
   }
-  /** Enters "select all across pages" mode (count shows `totalCount`). */
+  /**
+   * Enters "select all across pages" mode: the count shows `totalCount`, and every
+   * row on this page is checked.
+   *
+   * The mode's claim is that the whole set is selected, so leaving a visible row
+   * unchecked would put the page and the count in open disagreement.
+   */
   selectAllPages() {
     this.#allPagesMode = true;
-    this.#recompute(true);
+    this.#checkEveryRow();
+    this.#reportChange(this.#recompute());
+  }
+  /** Marks every row on this page selected. */
+  #checkEveryRow() {
+    for (const item of this.itemTargets) item.checked = true;
   }
   /** Mirrors the select-all box to every row, then recomputes. */
   #applyAll() {
     if (!this.hasAllTarget) return;
     const { checked } = this.allTarget;
-    for (const item of this.#items) item.checked = checked;
+    for (const item of this.itemTargets) item.checked = checked;
     this.#exitAllPages();
-    this.#recompute(true);
+    this.#reportChange(this.#recompute());
   }
   #exitAllPages() {
     this.#allPagesMode = false;
   }
+  /** Repairs the derived state after the page moved rows or a render input. */
+  #reconcileNow() {
+    if (this.#allPagesMode) this.#checkEveryRow();
+    const detail = this.#recompute();
+    if (!detail) return;
+    this.dispatch("reconcile", { detail });
+    this.#announce(detail);
+  }
+  /** Reports a selection the user moved. */
+  #reportChange(detail) {
+    if (!detail) return;
+    this.dispatch("change", { detail });
+    this.#announce(detail);
+  }
+  /** Hands the count to the shared announcer, worded by the consumer. */
+  #announce(detail) {
+    announce(fillTemplate(this.announceTextValue, { count: detail.count }));
+  }
   /**
    * Recomputes the count, the select-all checked/indeterminate state, and the bar
-   * visibility from the current DOM. Dispatches `change` (when `notify`) only if
-   * the emitted count or all-pages flag actually changed.
+   * visibility from the current DOM. Returns the figures when the emitted count or
+   * all-pages flag actually moved, and `null` when they did not.
+   *
+   * @stimeoRenderRoot
    */
-  #recompute(notify) {
-    const items = this.#items;
+  #recompute() {
+    const items = this.itemTargets;
     const total = items.length;
     const checked = items.filter((item) => item.checked).length;
     const allPages = this.#allPagesMode;
@@ -77,8 +194,10 @@ var BulkSelectController = class extends Controller {
     const count = allPages ? this.totalCountValue : checked;
     const show = allPages || checked > 0;
     if (this.hasBarTarget) {
+      if (!show && this.hasAllTarget && this.barTarget.contains(document.activeElement)) {
+        this.allTarget.focus();
+      }
       this.barTarget.hidden = !show;
-      this.barTarget.setAttribute("aria-live", this.announceValue ? "polite" : "off");
     }
     if (this.hasCountTarget) this.countTarget.textContent = String(count);
     this.element.setAttribute("data-selected-count", String(checked));
@@ -87,15 +206,7 @@ var BulkSelectController = class extends Controller {
     const changed = count !== this.#lastCount || allPages !== this.#lastAllPages;
     this.#lastCount = count;
     this.#lastAllPages = allPages;
-    if (notify && changed) {
-      this.dispatch("change", { detail: { count, allPages } });
-    }
-  }
-  /** Live list of row checkboxes, queried from the DOM so dynamic rows count. */
-  get #items() {
-    return Array.from(
-      this.element.querySelectorAll('[data-stimeo--bulk-select-target="item"]')
-    );
+    return changed ? { count, allPages } : null;
   }
 };
 

package/dist/controllers/bulk_select_controller.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/controllers/bulk_select_controller.ts"],"names":[],"mappings":"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","file":"bulk_select_controller.js","sourcesContent":["import { Controller } from \"@hotwired/stimulus\";\n\n/**\n * Headless **bulk select / batch action bar** (no dedicated APG pattern — a\n * composition of a checkbox group and a toolbar). Mirrors the Gmail/admin UX where\n * checking one or more rows reveals a sticky action bar with the selected count,\n * select-all, and clear. Data Grid owns per-row `aria-selected`; this is the\n * contextual action-bar layer on top.\n *\n * Markup contract (identifier: `stimeo--bulk-select`):\n *   <div data-controller=\"stimeo--bulk-select\"\n *        data-stimeo--bulk-select-total-count-value=\"128\">\n *     <input type=\"checkbox\" data-stimeo--bulk-select-target=\"all\">\n *     <!-- rows (may be added dynamically; handled via event delegation) -->\n *     <input type=\"checkbox\" data-stimeo--bulk-select-target=\"item\">\n *     <input type=\"checkbox\" data-stimeo--bulk-select-target=\"item\">\n *     <div data-stimeo--bulk-select-target=\"bar\" hidden role=\"toolbar\" aria-live=\"polite\">\n *       <span data-stimeo--bulk-select-target=\"count\"></span> selected\n *       <button data-stimeo--bulk-select-target=\"selectAllPages\"\n *               data-action=\"click->stimeo--bulk-select#selectAllPages\">Select all</button>\n *       <button data-action=\"click->stimeo--bulk-select#clear\">Clear</button>\n *     </div>\n *   </div>\n *\n * `change` dispatches `{ count, allPages }`.\n *\n * @remarks\n * Behavior only — it never runs the batch action (that is the consumer's\n * form/Turbo) nor fetches/pages rows. Selection lives **only** in each checkbox's\n * `checked` (no module-scope set), so `connect()` recomputes idempotently from the\n * DOM after a Turbo swap. Row `change` is handled by **delegation** on the\n * container, so dynamically-added rows work without per-row `data-action`.\n * Showing the bar never steals focus\n * (WCAG 2.2 2.4.3); the count rides the bar's own `aria-live` region (WCAG 2.2\n * 4.1.3) — the bar is revealed *before* the count text is written so the change is\n * observed and announced. The delegated listener is removed on `disconnect()`.\n */\nexport class BulkSelectController extends Controller<HTMLElement> {\n  static override targets = [\"all\", \"item\", \"bar\", \"count\", \"selectAllPages\"];\n  static override values = {\n    totalCount: { type: Number, default: 0 },\n    announce: { type: Boolean, default: true },\n  };\n  static actions = [\"clear\", \"selectAllPages\"] as const;\n  static events = [\"change\"] as const;\n\n  declare readonly allTarget: HTMLInputElement;\n  declare readonly barTarget: HTMLElement;\n  declare readonly countTarget: HTMLElement;\n  declare readonly hasAllTarget: boolean;\n  declare readonly hasBarTarget: boolean;\n  declare readonly hasCountTarget: boolean;\n\n  declare totalCountValue: number;\n  declare announceValue: boolean;\n\n  /** All-pages mode is a transient UI state; mirrored to `data-all-pages` so it\n   *  survives a Turbo swap and `connect()` can rehydrate it. */\n  #allPagesMode = false;\n  /** Last emitted figures, so a recompute dispatches `change` only on real change. */\n  #lastCount = -1;\n  #lastAllPages = false;\n\n  /** Delegated `change` handler covering the select-all box and every row. */\n  readonly #onChange = (event: Event): void => {\n    const target = event.target as HTMLElement | null;\n    if (!target) return;\n    if (this.hasAllTarget && target === this.allTarget) {\n      this.#applyAll();\n    } else if (target.matches('[data-stimeo--bulk-select-target=\"item\"]')) {\n      this.#exitAllPages();\n      this.#recompute(true);\n    }\n  };\n\n  override connect(): void {\n    this.#allPagesMode = this.element.dataset.allPages === \"true\";\n    this.element.addEventListener(\"change\", this.#onChange);\n    this.#recompute(false);\n  }\n\n  override disconnect(): void {\n    this.element.removeEventListener(\"change\", this.#onChange);\n  }\n\n  /** Clears every selection (rows + select-all) and exits all-pages mode. */\n  clear(): void {\n    for (const item of this.#items) item.checked = false;\n    if (this.hasAllTarget) {\n      this.allTarget.checked = false;\n      this.allTarget.indeterminate = false;\n    }\n    this.#exitAllPages();\n    this.#recompute(true);\n  }\n\n  /** Enters \"select all across pages\" mode (count shows `totalCount`). */\n  selectAllPages(): void {\n    this.#allPagesMode = true;\n    this.#recompute(true);\n  }\n\n  /** Mirrors the select-all box to every row, then recomputes. */\n  #applyAll(): void {\n    if (!this.hasAllTarget) return;\n    const { checked } = this.allTarget;\n    for (const item of this.#items) item.checked = checked;\n    this.#exitAllPages();\n    this.#recompute(true);\n  }\n\n  #exitAllPages(): void {\n    this.#allPagesMode = false;\n  }\n\n  /**\n   * Recomputes the count, the select-all checked/indeterminate state, and the bar\n   * visibility from the current DOM. Dispatches `change` (when `notify`) only if\n   * the emitted count or all-pages flag actually changed.\n   */\n  #recompute(notify: boolean): void {\n    const items = this.#items;\n    const total = items.length;\n    const checked = items.filter((item) => item.checked).length;\n    const allPages = this.#allPagesMode;\n\n    if (this.hasAllTarget) {\n      this.allTarget.checked = total > 0 && checked === total;\n      this.allTarget.indeterminate = checked > 0 && checked < total;\n    }\n\n    const count = allPages ? this.totalCountValue : checked;\n    const show = allPages || checked > 0;\n\n    // Reveal the bar BEFORE writing the count so its aria-live region observes the\n    // text change (a region revealed after its content changed may not announce).\n    if (this.hasBarTarget) {\n      this.barTarget.hidden = !show;\n      this.barTarget.setAttribute(\"aria-live\", this.announceValue ? \"polite\" : \"off\");\n    }\n    if (this.hasCountTarget) this.countTarget.textContent = String(count);\n\n    this.element.setAttribute(\"data-selected-count\", String(checked));\n    if (allPages) this.element.setAttribute(\"data-all-pages\", \"true\");\n    else this.element.removeAttribute(\"data-all-pages\");\n\n    const changed = count !== this.#lastCount || allPages !== this.#lastAllPages;\n    this.#lastCount = count;\n    this.#lastAllPages = allPages;\n    if (notify && changed) {\n      this.dispatch(\"change\", { detail: { count, allPages } });\n    }\n  }\n\n  /** Live list of row checkboxes, queried from the DOM so dynamic rows count. */\n  get #items(): HTMLInputElement[] {\n    return Array.from(\n      this.element.querySelectorAll<HTMLInputElement>('[data-stimeo--bulk-select-target=\"item\"]'),\n    );\n  }\n}\n"]}
+{"version":3,"sources":["../../src/utils/announce.ts","../../src/utils/microtask_coalescer.ts","../../src/controllers/bulk_select_controller.ts"],"names":[],"mappings":"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","file":"bulk_select_controller.js","sourcesContent":["/**\n * Sends one message to the page's shared `stimeo--announcer`.\n *\n * A component that has to reach assistive tech does not carry a live region of its\n * own: a region only announces what changes *after* assistive tech already knows\n * about it, which a region that appears (or is un-hidden) with its message cannot\n * satisfy. The one region that can is the announcer sitting in the page from the\n * start, so state changes are handed to it as an event and it does the reading.\n *\n * The event goes to `window` because the announcer is usually a sibling high in the\n * document rather than an ancestor of the component dispatching it.\n *\n * Wording comes from the consumer — the library ships no English strings — so an\n * empty message is silently dropped and nothing is announced.\n *\n * @example\n * ```ts\n * announce(this.announceTextValue, { assertive: false });\n * ```\n */\nexport function announce(message: string, options: { assertive?: boolean } = {}): void {\n  const text = message.trim();\n  if (text.length === 0) return;\n  window.dispatchEvent(\n    new CustomEvent(\"stimeo--announcer:announce\", {\n      detail: { message: text, assertive: options.assertive === true },\n    }),\n  );\n}\n\n/**\n * Fills `{name}` placeholders in an announcement template from `values`.\n *\n * The same substitution the value-text templates use, so a consumer writes\n * `\"{percent}% complete\"` in one attribute and gets the same rules everywhere. A\n * placeholder with no matching entry is left as authored rather than blanked, which\n * keeps a typo visible instead of silently swallowing the word.\n */\nexport function fillTemplate(template: string, values: Record<string, string | number>): string {\n  return template.replace(/\\{([a-zA-Z][a-zA-Z0-9]*)\\}/g, (match, name: string) => {\n    const replacement = values[name];\n    return replacement === undefined ? match : String(replacement);\n  });\n}\n","/**\n * Collapses many Stimulus lifecycle callbacks from one DOM mutation into a\n * single pass.\n *\n * Stimulus fires `<name>TargetConnected` / `Disconnected` once per element and\n * `<name>ValueChanged` once per changed attribute. Replacing a list of N options\n * or morphing several render Values therefore delivers N callbacks — but the\n * useful unit of work is \"reconcile against the resulting declarative input\",\n * once, after the batch has settled. Every controller with reconcilable targets\n * or render Values needs the same shape: a `queued` flag plus `queueMicrotask`.\n *\n * **A microtask is the right horizon, and the reason is specific.** Stimulus\n * drives these callbacks from a `MutationObserver`, whose own callback already\n * runs as a microtask with the whole batch in hand; scheduling one more lands\n * after the last sibling callback of that batch and still before paint or any\n * event handler. A timer would be later than it needs to be, and reconciling\n * synchronously would run once per element against a half-applied DOM.\n *\n * **The two guards are not the same guard.** Scheduling is refused before the\n * controller connects, and running is refused after it disconnects:\n *\n * - **Before `connect()`** — Stimulus delivers initial target and Value callbacks\n *   ahead of `connect()`. Reconciling there would compute output against a\n *   controller whose own state has not been initialised, and `connect()` is\n *   about to do a full pass anyway.\n * - **After `disconnect()`** — Stimulus fires a callback for **every** target\n *   during teardown, and a microtask queued just before it would otherwise run\n *   against a detached tree. {@link MicrotaskCoalescer.cancel} exists for the\n *   teardown path to drop the pending pass outright.\n *\n * Both guards are part of one contract here rather than something each consumer\n * has to remember separately.\n *\n * Scope is the scheduling only. *What* to reconcile — keep the surviving active\n * option, fall back to the next / previous / first visible one, rebuild derived\n * chips or hidden fields — stays in the controller, because no two consumers\n * answer it the same way.\n *\n * This file's own doc block is dropped from `dist`, but every member comment is\n * inlined into each consumer entry (`tsup` builds with `splitting: false`), so\n * rationale belongs here and only the contract belongs on the members.\n *\n * @example\n * ```ts\n * readonly #reconcile = new MicrotaskCoalescer(() => this.#reconcileOptions());\n *\n * connect()    { this.#reconcile.activate(); }\n * disconnect() { this.#reconcile.cancel(); }\n *\n * optionTargetConnected()    { this.#reconcile.schedule(); }\n * optionTargetDisconnected() { this.#reconcile.schedule(); }\n * ```\n */\nexport class MicrotaskCoalescer {\n  readonly #run: () => void;\n  #queued = false;\n  #active = false;\n  #generation = 0;\n\n  /** @param run - the single reconciliation pass, invoked at most once per batch. */\n  constructor(run: () => void) {\n    this.#run = run;\n  }\n\n  /** Opens the window in which {@link schedule} is honoured; call from `connect()`. */\n  activate(): void {\n    this.#active = true;\n  }\n\n  /** Closes the window and drops any pending pass; call from `disconnect()`. */\n  cancel(): void {\n    this.#active = false;\n    this.#queued = false;\n    this.#generation += 1;\n  }\n\n  /** Requests one pass after the batch settles. Idempotent; inert outside the window. */\n  schedule(): void {\n    if (!this.#active || this.#queued) return;\n    this.#queued = true;\n    const generation = this.#generation;\n    queueMicrotask(() => {\n      // A cancelled callback must not consume a pass queued after reconnect.\n      if (generation !== this.#generation || !this.#queued || !this.#active) return;\n      this.#queued = false;\n      this.#run();\n    });\n  }\n}\n","import { Controller } from \"@hotwired/stimulus\";\nimport { announce, fillTemplate } from \"../utils/announce\";\nimport { MicrotaskCoalescer } from \"../utils/microtask_coalescer\";\n\n/** The selection figures every report carries. */\ntype SelectionDetail = { count: number; allPages: boolean };\n\n/**\n * Headless **bulk select / batch action bar** (no dedicated APG pattern — a\n * composition of a checkbox group and a toolbar). Mirrors the Gmail/admin UX where\n * checking one or more rows reveals a sticky action bar with the selected count,\n * select-all, and clear. Data Grid owns per-row `aria-selected`; this is the\n * contextual action-bar layer on top.\n *\n * Markup contract (identifier: `stimeo--bulk-select`):\n *   <div data-controller=\"stimeo--bulk-select\"\n *        data-stimeo--bulk-select-total-count-value=\"128\"\n *        data-stimeo--bulk-select-announce-text-value=\"{count} selected\">\n *     <input type=\"checkbox\" data-stimeo--bulk-select-target=\"all\">\n *     <!-- rows (may be added dynamically; handled via event delegation) -->\n *     <input type=\"checkbox\" data-stimeo--bulk-select-target=\"item\">\n *     <input type=\"checkbox\" data-stimeo--bulk-select-target=\"item\">\n *     <div data-stimeo--bulk-select-target=\"bar\" hidden role=\"toolbar\"\n *          data-controller=\"stimeo--toolbar\" aria-label=\"Bulk actions\">\n *       <span data-stimeo--bulk-select-target=\"count\"></span> selected\n *       <button data-stimeo--bulk-select-target=\"selectAllPages\"\n *               data-stimeo--toolbar-target=\"control\"\n *               data-action=\"click->stimeo--bulk-select#selectAllPages\">Select all</button>\n *       <button data-stimeo--toolbar-target=\"control\"\n *               data-action=\"click->stimeo--bulk-select#clear\">Clear</button>\n *     </div>\n *   </div>\n *\n * The bar carries `role=\"toolbar\"`, so it is composed with `stimeo--toolbar` to get\n * the arrow-key movement and single tab stop that role calls for.\n *\n * `change` and `reconcile` both dispatch `{ count, allPages }`.\n *\n * Selection is two-stage. The select-all box covers the rows on this page; the\n * optional `selectAllPages` control extends the selection to `totalCount` rows\n * across every page, checking each row here as it does so. Touching any single row\n * leaves that mode, because the selection is no longer the whole set.\n *\n * @remarks\n * Behavior only — it never runs the batch action (that is the consumer's\n * form/Turbo) nor fetches/pages rows. Selection lives **only** in each checkbox's\n * `checked` (no module-scope set), so `connect()` recomputes idempotently from the\n * DOM after a Turbo swap. Row `change` is handled by **delegation** on the\n * container, so dynamically-added rows work without per-row `data-action`, while\n * rows arriving or leaving on their own are picked up by the target callbacks and\n * coalesced into one repair per batch.\n *\n * `change` is dispatched when the user moves the selection; `reconcile` when the\n * controller repairs the figures itself — a row added or removed by the page, or a\n * render input changing at runtime. Both carry the same detail.\n *\n * The count reaches assistive tech through the page's shared `stimeo--announcer`,\n * worded by the consumer via `announceText` (`{count}` expands to the figure being\n * shown; an empty template stays silent, keeping announcements opt-in and\n * i18n-neutral).\n *\n * Showing the bar never steals focus (WCAG 2.2 2.4.3). Hiding it hands focus to\n * the select-all box first when the bar holds it, so the keyboard user keeps a Tab\n * position instead of falling back to the document.\n *\n * A non-finite `totalCount` falls back to the Value's default and is written back\n * to the attribute, so the count never renders as `NaN`.\n *\n * The delegated listener and the pending repair are both released on `disconnect()`.\n */\nexport class BulkSelectController extends Controller<HTMLElement> {\n  static override targets = [\"all\", \"item\", \"bar\", \"count\", \"selectAllPages\"];\n  static override values = {\n    totalCount: { type: Number, default: 0 },\n    announceText: { type: String, default: \"\" },\n  };\n  static actions = [\"clear\", \"selectAllPages\"] as const;\n  static events = [\"change\", \"reconcile\"] as const;\n\n  declare readonly allTarget: HTMLInputElement;\n  declare readonly barTarget: HTMLElement;\n  declare readonly countTarget: HTMLElement;\n  declare readonly itemTargets: HTMLInputElement[];\n  declare readonly hasAllTarget: boolean;\n  declare readonly hasBarTarget: boolean;\n  declare readonly hasCountTarget: boolean;\n\n  declare totalCountValue: number;\n  declare announceTextValue: string;\n\n  /** All-pages mode is a transient UI state, mirrored to `data-all-pages` so a\n   *  `connect()` over markup that already carries the attribute rehydrates the\n   *  mode — a morph, a Turbo Stream, or a server that renders it back. A restore\n   *  visit serves the server's markup instead, so the mode does not survive one. */\n  #allPagesMode = false;\n  /** Last emitted figures, so a recompute reports only on a real change. */\n  #lastCount = -1;\n  #lastAllPages = false;\n\n  /** Collapses every signal from one DOM or Value update into one repair. */\n  readonly #reconcile = new MicrotaskCoalescer(() => this.#reconcileNow());\n\n  /** Delegated `change` handler covering the select-all box and every row. */\n  readonly #onChange = (event: Event): void => {\n    const target = event.target as HTMLElement | null;\n    if (!target) return;\n    if (this.hasAllTarget && target === this.allTarget) {\n      this.#applyAll();\n    } else if (this.itemTargets.some((item) => item === target)) {\n      this.#exitAllPages();\n      this.#reportChange(this.#recompute());\n    }\n  };\n\n  override connect(): void {\n    this.#allPagesMode = this.element.dataset.allPages === \"true\";\n    this.#reconcile.activate();\n    this.element.addEventListener(\"change\", this.#onChange);\n    this.#recompute();\n  }\n\n  override disconnect(): void {\n    this.element.removeEventListener(\"change\", this.#onChange);\n    this.#reconcile.cancel();\n  }\n\n  /** Repairs the figures for a row that arrived at runtime. */\n  itemTargetConnected(): void {\n    this.#reconcile.schedule();\n  }\n\n  /** Repairs the figures after a row leaves, so a removed selection stops counting. */\n  itemTargetDisconnected(): void {\n    this.#reconcile.schedule();\n  }\n\n  /** Reflects the current selection onto a select-all box added at runtime. */\n  allTargetConnected(): void {\n    this.#reconcile.schedule();\n  }\n\n  /** Repairs the figures after the select-all box leaves. */\n  allTargetDisconnected(): void {\n    this.#reconcile.schedule();\n  }\n\n  /** Repaints the count for a total that changed at runtime, rejecting non-finite ones. */\n  totalCountValueChanged(): void {\n    if (!Number.isFinite(this.totalCountValue)) {\n      this.totalCountValue = 0;\n      return;\n    }\n    this.#reconcile.schedule();\n  }\n\n  /** Repaints so wording changed at runtime is used by the next announcement. */\n  announceTextValueChanged(): void {\n    this.#reconcile.schedule();\n  }\n\n  /** Clears every selection (rows + select-all) and exits all-pages mode. */\n  clear(): void {\n    for (const item of this.itemTargets) item.checked = false;\n    if (this.hasAllTarget) {\n      this.allTarget.checked = false;\n      this.allTarget.indeterminate = false;\n    }\n    this.#exitAllPages();\n    this.#reportChange(this.#recompute());\n  }\n\n  /**\n   * Enters \"select all across pages\" mode: the count shows `totalCount`, and every\n   * row on this page is checked.\n   *\n   * The mode's claim is that the whole set is selected, so leaving a visible row\n   * unchecked would put the page and the count in open disagreement.\n   */\n  selectAllPages(): void {\n    this.#allPagesMode = true;\n    this.#checkEveryRow();\n    this.#reportChange(this.#recompute());\n  }\n\n  /** Marks every row on this page selected. */\n  #checkEveryRow(): void {\n    for (const item of this.itemTargets) item.checked = true;\n  }\n\n  /** Mirrors the select-all box to every row, then recomputes. */\n  #applyAll(): void {\n    if (!this.hasAllTarget) return;\n    const { checked } = this.allTarget;\n    for (const item of this.itemTargets) item.checked = checked;\n    this.#exitAllPages();\n    this.#reportChange(this.#recompute());\n  }\n\n  #exitAllPages(): void {\n    this.#allPagesMode = false;\n  }\n\n  /** Repairs the derived state after the page moved rows or a render input. */\n  #reconcileNow(): void {\n    // A row that arrives while the whole set is selected is one of the rows the\n    // mode already claims, so it lands checked instead of contradicting the count.\n    if (this.#allPagesMode) this.#checkEveryRow();\n    const detail = this.#recompute();\n    if (!detail) return;\n    this.dispatch(\"reconcile\", { detail });\n    this.#announce(detail);\n  }\n\n  /** Reports a selection the user moved. */\n  #reportChange(detail: SelectionDetail | null): void {\n    if (!detail) return;\n    this.dispatch(\"change\", { detail });\n    this.#announce(detail);\n  }\n\n  /** Hands the count to the shared announcer, worded by the consumer. */\n  #announce(detail: SelectionDetail): void {\n    announce(fillTemplate(this.announceTextValue, { count: detail.count }));\n  }\n\n  /**\n   * Recomputes the count, the select-all checked/indeterminate state, and the bar\n   * visibility from the current DOM. Returns the figures when the emitted count or\n   * all-pages flag actually moved, and `null` when they did not.\n   *\n   * @stimeoRenderRoot\n   */\n  #recompute(): SelectionDetail | null {\n    const items = this.itemTargets;\n    const total = items.length;\n    const checked = items.filter((item) => item.checked).length;\n    const allPages = this.#allPagesMode;\n\n    if (this.hasAllTarget) {\n      this.allTarget.checked = total > 0 && checked === total;\n      this.allTarget.indeterminate = checked > 0 && checked < total;\n    }\n\n    const count = allPages ? this.totalCountValue : checked;\n    const show = allPages || checked > 0;\n\n    if (this.hasBarTarget) {\n      // Hand the Tab position over before the bar leaves, or focus falls to the\n      // document and the keyboard user loses their place.\n      if (!show && this.hasAllTarget && this.barTarget.contains(document.activeElement)) {\n        this.allTarget.focus();\n      }\n      this.barTarget.hidden = !show;\n    }\n    if (this.hasCountTarget) this.countTarget.textContent = String(count);\n\n    this.element.setAttribute(\"data-selected-count\", String(checked));\n    if (allPages) this.element.setAttribute(\"data-all-pages\", \"true\");\n    else this.element.removeAttribute(\"data-all-pages\");\n\n    const changed = count !== this.#lastCount || allPages !== this.#lastAllPages;\n    this.#lastCount = count;\n    this.#lastAllPages = allPages;\n    return changed ? { count, allPages } : null;\n  }\n}\n"]}

package/dist/controllers/carousel_controller.d.ts

@@ -8,43 +8,56 @@ import { Controller } from '@hotwired/stimulus';
  *            aria-label="Featured"
  *            data-stimeo--carousel-autoplay-value="false"
  *            data-stimeo--carousel-interval-value="5000"
- *            data-stimeo--carousel-loop-value="true"
- *            data-action="mouseenter->stimeo--carousel#pause
- *                         mouseleave->stimeo--carousel#resume
- *                         focusin->stimeo--carousel#pause
- *                         focusout->stimeo--carousel#resume">
- *     <button data-stimeo--carousel-target="playToggle"
- *             data-action="stimeo--carousel#togglePlay">…</button>
+ *            data-stimeo--carousel-loop-value="true">
+ *     <button data-stimeo--carousel-target="playToggle">…</button>
  *     <div data-stimeo--carousel-target="viewport">
  *       <div role="tabpanel" data-stimeo--carousel-target="slide">…</div>
- *       <div role="tabpanel" data-stimeo--carousel-target="slide" hidden>…</div>
+ *       <div role="tabpanel" data-stimeo--carousel-target="slide" hidden inert>…</div>
  *     </div>
- *     <button data-stimeo--carousel-target="prev" data-action="stimeo--carousel#prev">‹</button>
- *     <button data-stimeo--carousel-target="next" data-action="stimeo--carousel#next">›</button>
+ *     <button data-stimeo--carousel-target="prev">‹</button>
+ *     <button data-stimeo--carousel-target="next">›</button>
  *     <div role="tablist">
- *       <button role="tab" data-stimeo--carousel-target="picker"
- *               data-action="stimeo--carousel#goto
- *                            keydown->stimeo--carousel#onPickerKeydown"></button>
+ *       <button role="tab" data-stimeo--carousel-target="picker"></button>
  *     </div>
  *   </section>
  *
- * Implements the WAI-ARIA APG **Carousel** (tabbed) pattern. The current slide is
- * exposed through `data-state` (`active`/`inactive`) and the `hidden` attribute on
- * inactive slides (removing them from focus order); the matching picker carries
- * `aria-selected` and the single roving `tabindex`. The play/pause toggle's
- * `aria-pressed` mirrors the autoplay state.
+ * Implements the WAI-ARIA APG **Carousel** pattern. With pickers it is the tabbed
+ * variant: each picker is a `tab` carrying `aria-selected` and the single roving
+ * `tabindex`, and each slide is its `tabpanel`. Without pickers the slides are
+ * `group`s and `prev`/`next` drive them. The current slide is exposed through
+ * `data-state` (`active`/`inactive`); the rest carry `hidden` **and** `inert`, so
+ * they stay out of the focus order and the accessibility tree even when consumer
+ * CSS overrides `display` to lay the slides out as a track.
  *
  * @remarks
  * Behavior only — transitions, layout, and visuals are the consumer's CSS.
- * Autoplay honors WCAG 2.2.2: it suspends while the pointer is over the carousel
- * and **hard-stops** when keyboard focus enters (it does not silently resume on
- * focus out — the user must press play), so motion never surprises a keyboard
- * user. The interval is cleared on `disconnect()` (Turbo navigation included).
- * Picker arrow keys move focus only (manual activation); slide changes never steal
- * focus from the control the user operated. A slide change the user drove is
- * reported as `stimeo--carousel:change` with `{ index, total }`; the same detail
- * arrives as `stimeo--carousel:reconcile` when removing a slide or picker clamps
- * the active index instead.
+ *
+ * **The controller owns its own wiring.** Clicks, picker keys, hover, and focus
+ * are delegated from the controller element, so no `data-action` is required and
+ * a target added at runtime works the moment it appears. Explicit `data-action`
+ * bindings to the declared actions still work and coexist with the delegated
+ * path: the binding runs first and marks the event, and the delegated listener
+ * stands down, so one interaction is never handled twice.
+ *
+ * **`autoplay` is the single source of truth for the rotation intent.** The
+ * toggle writes back to it, so the state survives a Turbo Drive cache restore
+ * without a second, competing signal; `aria-pressed` is a pure output the
+ * controller owns. Rotation is suspended — not cancelled — while the pointer
+ * rests on the carousel, while focus is inside it, and while the tab is hidden;
+ * each suspension lifts on its own (WCAG 2.2.2 is met by the toggle, which is
+ * the one control that stops rotation for good). A carousel with nothing left to
+ * advance to (one slide, or the last slide of a non-looping set) normalizes
+ * `autoplay` to `false` and marks the toggle `aria-disabled`. `prefers-reduced-motion`
+ * does the same at connect, leaving an explicit press free to start rotation.
+ *
+ * The interval is cleared on `disconnect()` (Turbo navigation included), and the
+ * leased ARIA is returned before Turbo caches the page. Picker arrow keys, `Home`,
+ * and `End` move focus only (manual activation); slide changes never steal focus
+ * from the control the user operated. A slide change the user drove — including an
+ * autoplay tick they started — is reported as `stimeo--carousel:change` with
+ * `{ index, total }`; the same detail arrives as `stimeo--carousel:reconcile` when
+ * the controller re-derives the position itself, whether a target came or went or
+ * a retained element's state attributes were rewritten in place.
  */
 declare class CarouselController extends Controller<HTMLElement> {
     #private;
@@ -67,18 +80,27 @@ declare class CarouselController extends Controller<HTMLElement> {
     static events: readonly ["change", "pause", "play", "reconcile"];
     readonly slideTargets: HTMLElement[];
     readonly pickerTargets: HTMLElement[];
-    readonly playToggleTarget: HTMLElement;
-    readonly hasPlayToggleTarget: boolean;
+    readonly viewportTarget: HTMLElement;
+    readonly hasViewportTarget: boolean;
+    readonly prevTargets: HTMLElement[];
+    readonly nextTargets: HTMLElement[];
+    readonly playToggleTargets: HTMLElement[];
     autoplayValue: boolean;
     intervalValue: number;
     loopValue: boolean;
     /**
-     * Renders the initial slide and starts autoplay when requested.
+     * Renders the initial slide, wires the delegated listeners, and starts autoplay
+     * when requested.
      *
-     * `findIndex` makes the authored pre-selection first-wins when several pickers
-     * are marked; `#render` then writes an explicit value onto every picker.
+     * Every suspension is re-derived from the environment rather than carried, so an
+     * in-page move — which Stimulus delivers to the *same* controller instance as
+     * `disconnect()` then `connect()` — cannot strand the carousel in a suspension
+     * whose lifting event will never arrive. The attribute observer starts after the
+     * first render so the controller's own opening writes are not fed back to it.
      */
     connect(): void;
+    /** Releases every listener and observer, returns the leased ARIA, drops the suspensions. */
+    disconnect(): void;
     /**
      * Re-establishes the single selected picker when one is added after connect.
      *
@@ -95,29 +117,41 @@ declare class CarouselController extends Controller<HTMLElement> {
     slideTargetConnected(): void;
     /** Re-clamps the active index after a slide is removed. */
     slideTargetDisconnected(): void;
-    /** Clears the autoplay interval so it never fires after teardown. */
-    disconnect(): void;
-    /** Advances to the next slide. Bound via `data-action`. */
-    next(): void;
-    /** Returns to the previous slide. Bound via `data-action`. */
-    prev(): void;
+    /** Follows a rotation intent the page changed at runtime. */
+    autoplayValueChanged(): void;
+    /** Re-arms the live interval at the new delay without reporting a state change. */
+    intervalValueChanged(): void;
+    /** Re-publishes the step controls and re-evaluates the non-looping end. */
+    loopValueChanged(): void;
+    /** Advances to the next slide. Delegated; `data-action` wiring is optional. */
+    next(event?: Event): void;
+    /** Returns to the previous slide. Delegated; `data-action` wiring is optional. */
+    prev(event?: Event): void;
     /** Jumps to the slide whose picker was activated (click / Enter / Space). */
     goto(event: Event): void;
-    /** Toggles autoplay on the user's explicit request and syncs the timer. */
-    togglePlay(): void;
     /**
-     * Suspends autoplay. Hover (`mouseenter`) is a temporary suspension that resumes
-     * on leave; keyboard focus (`focusin`) is a hard stop that turns autoplay off so
-     * it cannot resume without an explicit play (WCAG 2.2.2).
+     * Flips the rotation intent on the user's explicit request.
+     *
+     * The intent is written back to the `autoplay` Value, which is where every other
+     * path reads it from. A carousel with nothing to advance to has no intent to
+     * flip: the toggle is marked `aria-disabled` and does nothing.
+     */
+    togglePlay(event?: Event): void;
+    /**
+     * Suspends rotation. A `focus`-family event records that focus is inside the
+     * carousel; anything else — hover, or a bare programmatic call — records the
+     * pointer suspension. Both lift through the matching {@link resume}, and
+     * neither touches the rotation intent.
      */
     pause(event?: Event): void;
     /**
-     * Lifts a hover suspension (`mouseleave`) and resumes autoplay if it is still
-     * on. A `focusout` does nothing here: the focus pause was a hard stop, so the
-     * user must press play to restart.
+     * Lifts the matching suspension. A `focusout` whose `relatedTarget` is still
+     * inside the carousel is focus moving between its own controls, which leaves the
+     * focus suspension in place — releasing it there would stop and restart the
+     * interval on every Tab press.
      */
     resume(event?: Event): void;
-    /** Picker roving: arrows move focus only; Home/End activate first/last slide. */
+    /** Picker roving for authored bindings; the delegated path is `#onKeydown`. */
     onPickerKeydown(event: KeyboardEvent): void;
 }