stimeo-ui 0.6.0 → 0.7.0

package/dist/controllers/nested_form_controller.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/controllers/nested_form_controller.ts"],"names":[],"mappings":"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","file":"nested_form_controller.js","sourcesContent":["import { Controller } from \"@hotwired/stimulus\";\n\n/**\n * Headless **nested / dynamic fields** for Rails `fields_for` +\n * `accepts_nested_attributes_for` (no dedicated APG pattern — form editing). The\n * Headless successor to the cocoon / nested_form gems: clone a `<template>` row,\n * renumber its index, and remove rows by flagging `_destroy` (persisted) or\n * dropping them from the DOM (unsaved).\n *\n * Markup contract (identifier: `stimeo--nested-form`):\n *   <div data-controller=\"stimeo--nested-form\" data-stimeo--nested-form-min-value=\"1\">\n *     <div data-stimeo--nested-form-target=\"list\">\n *       <!-- existing rows; a persisted row carries a _destroy flag + remove button -->\n *     </div>\n *     <template data-stimeo--nested-form-target=\"template\">\n *       <fieldset>\n *         <input name=\"order[items_attributes][__INDEX__][name]\">\n *         <button type=\"button\" data-stimeo--nested-form-target=\"remove\">Remove</button>\n *       </fieldset>\n *     </template>\n *     <button type=\"button\" data-stimeo--nested-form-target=\"add\"\n *             data-action=\"click->stimeo--nested-form#add\">Add</button>\n *   </div>\n *\n * @remarks\n * Behavior only — server-side `accepts_nested_attributes_for`, per-field\n * validation, and reordering are out of scope. Row state lives **only** in the DOM\n * (inserted nodes + each `_destroy` hidden input); there is no module-scope index\n * counter, so the controller stays idempotent across Turbo swaps. Remove buttons\n * are handled by **delegation** on the container, so dynamically-added rows work\n * without per-row `data-action`. Adding a row moves focus to its first control and\n * removing returns focus to a neighbor (WCAG 2.2 2.4.3); count changes are announced\n * through the shared `stimeo--announcer` (WCAG 2.2 4.1.3) when `announce` +\n * `countMessage` are set. The delegated listener is removed on `disconnect()`.\n */\nexport class NestedFormController extends Controller<HTMLElement> {\n  static override targets = [\"list\", \"template\", \"add\", \"remove\", \"destroyFlag\"];\n  static override values = {\n    min: { type: Number, default: 0 },\n    max: { type: Number, default: 0 },\n    indexPlaceholder: { type: String, default: \"__INDEX__\" },\n    announce: { type: Boolean, default: true },\n    countMessage: { type: String, default: \"\" },\n  };\n  static actions = [\"add\"] as const;\n  static events = [\"add\", \"remove\"] as const;\n\n  declare readonly listTarget: HTMLElement;\n  declare readonly templateTarget: HTMLTemplateElement;\n  declare readonly addTarget: HTMLButtonElement;\n  declare readonly hasListTarget: boolean;\n  declare readonly hasTemplateTarget: boolean;\n  declare readonly hasAddTarget: boolean;\n\n  declare minValue: number;\n  declare maxValue: number;\n  declare indexPlaceholderValue: string;\n  declare announceValue: boolean;\n  declare countMessageValue: string;\n\n  /** Monotonic source for unique row indices; never a row-state counter. */\n  #lastIndex = 0;\n\n  /** Delegated click handler for the per-row remove buttons (dynamic-safe). */\n  readonly #onClick = (event: Event): void => {\n    const target = event.target as HTMLElement | null;\n    const button = target?.closest('[data-stimeo--nested-form-target=\"remove\"]');\n    if (!button || !this.element.contains(button)) return;\n    const row = this.#rowContaining(button);\n    if (row) this.#removeRow(row);\n  };\n\n  override connect(): void {\n    this.element.addEventListener(\"click\", this.#onClick);\n    this.#refresh();\n  }\n\n  override disconnect(): void {\n    this.element.removeEventListener(\"click\", this.#onClick);\n  }\n\n  /**\n   * Clones the template row, replaces the index placeholder with a unique value,\n   * appends it, focuses its first control, and announces the new count. No-ops at\n   * `max`.\n   */\n  add(): void {\n    if (!this.hasTemplateTarget || !this.hasListTarget || this.#atMax) return;\n\n    const index = this.#nextIndex();\n    const markup = this.templateTarget.innerHTML.replaceAll(\n      this.indexPlaceholderValue,\n      String(index),\n    );\n    this.listTarget.insertAdjacentHTML(\"beforeend\", markup);\n    const row = this.listTarget.lastElementChild as HTMLElement | null;\n    if (!row) return;\n\n    this.#refresh();\n    this.#firstControl(row)?.focus();\n    this.dispatch(\"add\", { detail: { index, element: row } });\n    this.#announce();\n  }\n\n  /**\n   * Removes a row: a persisted row (one carrying a `destroyFlag`) has its flag set\n   * to `1` and is hidden so Rails destroys it on submit; an unsaved row is dropped\n   * from the DOM. Returns focus to a neighboring row. No-ops at `min`.\n   */\n  #removeRow(row: HTMLElement): void {\n    if (this.#effectiveRows.length <= this.minValue) return;\n\n    const neighbors = this.#effectiveRows;\n    const position = neighbors.indexOf(row);\n    const neighbor = neighbors[position + 1] ?? neighbors[position - 1] ?? null;\n\n    const flag = row.querySelector<HTMLInputElement>(\n      '[data-stimeo--nested-form-target=\"destroyFlag\"]',\n    );\n    const persisted = flag !== null;\n    if (persisted) {\n      flag.value = \"1\";\n      row.hidden = true;\n    } else {\n      row.remove();\n    }\n\n    this.#refresh();\n    const focusTarget = neighbor\n      ? this.#firstControl(neighbor)\n      : this.hasAddTarget\n        ? this.addTarget\n        : null;\n    focusTarget?.focus();\n    this.dispatch(\"remove\", { detail: { element: row, persisted } });\n    this.#announce();\n  }\n\n  /** Recomputes the live count and the min/max state hooks from the DOM. */\n  #refresh(): void {\n    const count = this.#effectiveRows.length;\n    this.element.setAttribute(\"data-nested-count\", String(count));\n    this.#reflect(\"data-nested-at-max\", this.maxValue > 0 && count >= this.maxValue);\n    this.#reflect(\"data-nested-at-min\", count <= this.minValue);\n    if (this.hasAddTarget) this.addTarget.disabled = this.#atMax;\n  }\n\n  /** Bridges the count change to the shared announcer when configured. */\n  #announce(): void {\n    if (!this.announceValue || !this.countMessageValue) return;\n    const message = this.countMessageValue.replaceAll(\n      \"{count}\",\n      String(this.#effectiveRows.length),\n    );\n    window.dispatchEvent(new CustomEvent(\"stimeo--announcer:announce\", { detail: { message } }));\n  }\n\n  /** Sets `attribute` to `\"true\"` when `on`, else removes it. */\n  #reflect(attribute: string, on: boolean): void {\n    if (on) this.element.setAttribute(attribute, \"true\");\n    else this.element.removeAttribute(attribute);\n  }\n\n  /** A strictly-increasing unique index (collision-free even on rapid adds). */\n  #nextIndex(): number {\n    const index = Math.max(Date.now(), this.#lastIndex + 1);\n    this.#lastIndex = index;\n    return index;\n  }\n\n  get #atMax(): boolean {\n    return this.maxValue > 0 && this.#effectiveRows.length >= this.maxValue;\n  }\n\n  /** Direct child rows of the list that are not flagged for destruction. */\n  get #effectiveRows(): HTMLElement[] {\n    return (Array.from(this.listTarget.children) as HTMLElement[]).filter((row) => !row.hidden);\n  }\n\n  /** The nearest ancestor of `el` that is a direct child of the list, else null. */\n  #rowContaining(el: Element): HTMLElement | null {\n    let node: Element | null = el;\n    while (node && node.parentElement !== this.listTarget) {\n      node = node.parentElement;\n    }\n    return node as HTMLElement | null;\n  }\n\n  /** First visible focusable control inside `row` (skips hidden inputs). */\n  #firstControl(row: HTMLElement): HTMLElement | null {\n    return row.querySelector<HTMLElement>(\n      'input:not([type=\"hidden\"]), select, textarea, button, [tabindex]',\n    );\n  }\n}\n"]}
+{"version":3,"sources":["../../src/controllers/nested_form_controller.ts"],"names":[],"mappings":"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","file":"nested_form_controller.js","sourcesContent":["import { Controller } from \"@hotwired/stimulus\";\n\n/**\n * Headless **nested / dynamic fields** for Rails `fields_for` +\n * `accepts_nested_attributes_for` (no dedicated APG pattern — form editing). The\n * Headless successor to the cocoon / nested_form gems: clone a `<template>` row,\n * renumber its index, and remove rows by flagging `_destroy` (persisted) or\n * dropping them from the DOM (unsaved).\n *\n * Markup contract (identifier: `stimeo--nested-form`):\n *   <div data-controller=\"stimeo--nested-form\" data-stimeo--nested-form-min-value=\"1\">\n *     <div data-stimeo--nested-form-target=\"list\">\n *       <!-- existing rows; a persisted row carries a _destroy flag + remove button -->\n *     </div>\n *     <template data-stimeo--nested-form-target=\"template\">\n *       <fieldset>\n *         <input name=\"order[items_attributes][__INDEX__][name]\">\n *         <button type=\"button\" data-stimeo--nested-form-target=\"remove\">Remove</button>\n *       </fieldset>\n *     </template>\n *     <button type=\"button\" data-stimeo--nested-form-target=\"add\"\n *             data-action=\"click->stimeo--nested-form#add\">Add</button>\n *   </div>\n *\n * `add` dispatches `{ index, element }`; `remove` dispatches `{ element, persisted }`.\n *\n * @remarks\n * Behavior only — server-side `accepts_nested_attributes_for`, per-field\n * validation, and reordering are out of scope. Row state lives **only** in the DOM\n * (inserted nodes + each `_destroy` hidden input); there is no module-scope index\n * counter, so the controller stays idempotent across Turbo swaps. Remove buttons\n * are handled by **delegation** on the container, so dynamically-added rows work\n * without per-row `data-action`. Adding a row moves focus to its first control and\n * removing returns focus to a neighbor (WCAG 2.2 2.4.3); count changes are announced\n * through the shared `stimeo--announcer` (WCAG 2.2 4.1.3) when `announce` +\n * `countMessage` are set. The delegated listener is removed on `disconnect()`.\n */\nexport class NestedFormController extends Controller<HTMLElement> {\n  static override targets = [\"list\", \"template\", \"add\", \"remove\", \"destroyFlag\"];\n  static override values = {\n    min: { type: Number, default: 0 },\n    max: { type: Number, default: 0 },\n    indexPlaceholder: { type: String, default: \"__INDEX__\" },\n    announce: { type: Boolean, default: true },\n    countMessage: { type: String, default: \"\" },\n  };\n  static actions = [\"add\"] as const;\n  static events = [\"add\", \"remove\"] as const;\n\n  declare readonly listTarget: HTMLElement;\n  declare readonly templateTarget: HTMLTemplateElement;\n  declare readonly addTarget: HTMLButtonElement;\n  declare readonly hasListTarget: boolean;\n  declare readonly hasTemplateTarget: boolean;\n  declare readonly hasAddTarget: boolean;\n\n  declare minValue: number;\n  declare maxValue: number;\n  declare indexPlaceholderValue: string;\n  declare announceValue: boolean;\n  declare countMessageValue: string;\n\n  /** Monotonic source for unique row indices; never a row-state counter. */\n  #lastIndex = 0;\n\n  /** Delegated click handler for the per-row remove buttons (dynamic-safe). */\n  readonly #onClick = (event: Event): void => {\n    const target = event.target as HTMLElement | null;\n    const button = target?.closest('[data-stimeo--nested-form-target=\"remove\"]');\n    if (!button || !this.element.contains(button)) return;\n    const row = this.#rowContaining(button);\n    if (row) this.#removeRow(row);\n  };\n\n  override connect(): void {\n    this.element.addEventListener(\"click\", this.#onClick);\n    this.#refresh();\n  }\n\n  override disconnect(): void {\n    this.element.removeEventListener(\"click\", this.#onClick);\n  }\n\n  /**\n   * Clones the template row, replaces the index placeholder with a unique value,\n   * appends it, focuses its first control, and announces the new count. No-ops at\n   * `max`.\n   */\n  add(): void {\n    if (!this.hasTemplateTarget || !this.hasListTarget || this.#atMax) return;\n\n    const index = this.#nextIndex();\n    const markup = this.templateTarget.innerHTML.replaceAll(\n      this.indexPlaceholderValue,\n      String(index),\n    );\n    this.listTarget.insertAdjacentHTML(\"beforeend\", markup);\n    const row = this.listTarget.lastElementChild as HTMLElement | null;\n    if (!row) return;\n\n    this.#refresh();\n    this.#firstControl(row)?.focus();\n    this.dispatch(\"add\", { detail: { index, element: row } });\n    this.#announce();\n  }\n\n  /**\n   * Removes a row: a persisted row (one carrying a `destroyFlag`) has its flag set\n   * to `1` and is hidden so Rails destroys it on submit; an unsaved row is dropped\n   * from the DOM. Returns focus to a neighboring row. No-ops at `min`.\n   */\n  #removeRow(row: HTMLElement): void {\n    if (this.#effectiveRows.length <= this.minValue) return;\n\n    const neighbors = this.#effectiveRows;\n    const position = neighbors.indexOf(row);\n    const neighbor = neighbors[position + 1] ?? neighbors[position - 1] ?? null;\n\n    const flag = row.querySelector<HTMLInputElement>(\n      '[data-stimeo--nested-form-target=\"destroyFlag\"]',\n    );\n    const persisted = flag !== null;\n    if (persisted) {\n      flag.value = \"1\";\n      row.hidden = true;\n    } else {\n      row.remove();\n    }\n\n    this.#refresh();\n    const focusTarget = neighbor\n      ? this.#firstControl(neighbor)\n      : this.hasAddTarget\n        ? this.addTarget\n        : null;\n    focusTarget?.focus();\n    this.dispatch(\"remove\", { detail: { element: row, persisted } });\n    this.#announce();\n  }\n\n  /** Recomputes the live count and the min/max state hooks from the DOM. */\n  #refresh(): void {\n    const count = this.#effectiveRows.length;\n    this.element.setAttribute(\"data-nested-count\", String(count));\n    this.#reflect(\"data-nested-at-max\", this.maxValue > 0 && count >= this.maxValue);\n    this.#reflect(\"data-nested-at-min\", count <= this.minValue);\n    if (this.hasAddTarget) this.addTarget.disabled = this.#atMax;\n  }\n\n  /** Bridges the count change to the shared announcer when configured. */\n  #announce(): void {\n    if (!this.announceValue || !this.countMessageValue) return;\n    const message = this.countMessageValue.replaceAll(\n      \"{count}\",\n      String(this.#effectiveRows.length),\n    );\n    window.dispatchEvent(new CustomEvent(\"stimeo--announcer:announce\", { detail: { message } }));\n  }\n\n  /** Sets `attribute` to `\"true\"` when `on`, else removes it. */\n  #reflect(attribute: string, on: boolean): void {\n    if (on) this.element.setAttribute(attribute, \"true\");\n    else this.element.removeAttribute(attribute);\n  }\n\n  /** A strictly-increasing unique index (collision-free even on rapid adds). */\n  #nextIndex(): number {\n    const index = Math.max(Date.now(), this.#lastIndex + 1);\n    this.#lastIndex = index;\n    return index;\n  }\n\n  get #atMax(): boolean {\n    return this.maxValue > 0 && this.#effectiveRows.length >= this.maxValue;\n  }\n\n  /** Direct child rows of the list that are not flagged for destruction. */\n  get #effectiveRows(): HTMLElement[] {\n    return (Array.from(this.listTarget.children) as HTMLElement[]).filter((row) => !row.hidden);\n  }\n\n  /** The nearest ancestor of `el` that is a direct child of the list, else null. */\n  #rowContaining(el: Element): HTMLElement | null {\n    let node: Element | null = el;\n    while (node && node.parentElement !== this.listTarget) {\n      node = node.parentElement;\n    }\n    return node as HTMLElement | null;\n  }\n\n  /** First visible focusable control inside `row` (skips hidden inputs). */\n  #firstControl(row: HTMLElement): HTMLElement | null {\n    return row.querySelector<HTMLElement>(\n      'input:not([type=\"hidden\"]), select, textarea, button, [tabindex]',\n    );\n  }\n}\n"]}

package/dist/controllers/network_status_controller.d.ts

@@ -22,6 +22,8 @@ import { Controller } from '@hotwired/stimulus';
  * (assertive, because losing connectivity is urgent) and `announceOnlineText`
  * (polite), which go to the page's announcer.
  *
+ * `change` dispatches `{ online: boolean }`.
+ *
  * @remarks
  * Behavior only. `navigator.onLine` is the browser's *guess* — it does not
  * guarantee server reachability, which stays the consumer's job. A banner that is

package/dist/controllers/network_status_controller.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/announce.ts","../../src/utils/safe_timeout.ts","../../src/controllers/network_status_controller.ts"],"names":[],"mappings":"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","file":"network_status_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 * Self-cleaning timer registries shared by Stimeo controllers.\n *\n * Stimulus controllers frequently schedule `setTimeout` / `setInterval` work\n * (auto-dismiss, debouncing, polling). When the element leaves the DOM — a\n * Turbo Drive navigation, a Turbo Stream replacement, or any `disconnect()` —\n * orphaned timers keep firing against a detached controller, leaking memory and\n * mutating stale state. {@link SafeTimeout} and {@link SafeInterval} track every\n * timer they create so a single {@link TimerRegistry.clearAll | clearAll()} call\n * in `disconnect()` tears them all down.\n *\n * These are intentionally low-level primitives: they own *registration and\n * cleanup only*. Higher-level policy (pause/resume, remaining-time accounting)\n * stays in the individual controllers so per-widget semantics are not flattened\n * into a lowest-common-denominator helper.\n */\n\n/**\n * Shared registry bookkeeping for the timeout/interval variants.\n *\n * Subclasses provide the scheduling primitive ({@link schedule}) and its matching\n * canceller ({@link cancel}); this base owns the set of live ids plus the\n * per-id and bulk teardown shared by both.\n */\nabstract class TimerRegistry {\n  /** Live timer ids that have not yet been cleared (or, for timeouts, fired). */\n  protected readonly ids = new Set<number>();\n\n  /** Schedules the underlying platform timer and returns its id. */\n  protected abstract schedule(callback: () => void, delay: number): number;\n\n  /** Cancels the underlying platform timer for `id`. */\n  protected abstract cancel(id: number): void;\n\n  /**\n   * Cancels a single tracked timer.\n   *\n   * No-ops if the id is unknown (already cleared, fired, or never owned by this\n   * registry), so callers can clear defensively without guarding.\n   */\n  clear(id: number): void {\n    if (this.ids.delete(id)) {\n      this.cancel(id);\n    }\n  }\n\n  /**\n   * Cancels every tracked timer. Call this from a controller's `disconnect()`\n   * to guarantee no timer outlives the element.\n   */\n  clearAll(): void {\n    for (const id of this.ids) {\n      this.cancel(id);\n    }\n    this.ids.clear();\n  }\n\n  /** Number of timers currently tracked (pending). */\n  get size(): number {\n    return this.ids.size;\n  }\n}\n\n/**\n * `setTimeout` wrapper that auto-forgets each timer once it fires and supports\n * bulk teardown on disconnect.\n *\n * @example\n * ```ts\n * #timers = new SafeTimeout();\n *\n * connect() {\n *   this.#timers.set(() => this.dismiss(), 5000);\n * }\n *\n * disconnect() {\n *   this.#timers.clearAll();\n * }\n * ```\n */\nexport class SafeTimeout extends TimerRegistry {\n  /**\n   * Schedules `callback` after `delay` ms and returns the timer id.\n   *\n   * The id is removed from the registry automatically when the timeout fires,\n   * so {@link TimerRegistry.size | size} reflects only still-pending timers.\n   */\n  set(callback: () => void, delay: number): number {\n    const id = this.schedule(() => {\n      this.ids.delete(id);\n      callback();\n    }, delay);\n    this.ids.add(id);\n    return id;\n  }\n\n  protected schedule(callback: () => void, delay: number): number {\n    return window.setTimeout(callback, delay);\n  }\n\n  protected cancel(id: number): void {\n    window.clearTimeout(id);\n  }\n}\n\n/**\n * `setInterval` wrapper that tracks every interval for bulk teardown on\n * disconnect. Unlike {@link SafeTimeout}, intervals are retained until they are\n * explicitly cleared because they fire repeatedly.\n *\n * @example\n * ```ts\n * #intervals = new SafeInterval();\n *\n * connect() {\n *   this.#intervals.set(() => this.tick(), 1000);\n * }\n *\n * disconnect() {\n *   this.#intervals.clearAll();\n * }\n * ```\n */\nexport class SafeInterval extends TimerRegistry {\n  /** Schedules a repeating `callback` every `delay` ms and returns the timer id. */\n  set(callback: () => void, delay: number): number {\n    const id = this.schedule(callback, delay);\n    this.ids.add(id);\n    return id;\n  }\n\n  protected schedule(callback: () => void, delay: number): number {\n    return window.setInterval(callback, delay);\n  }\n\n  protected cancel(id: number): void {\n    window.clearInterval(id);\n  }\n}\n","import { Controller } from \"@hotwired/stimulus\";\nimport { announce, fillTemplate } from \"../utils/announce\";\nimport { SafeTimeout } from \"../utils/safe_timeout\";\n\n/**\n * Headless online/offline banner behavior built on the live-region practice (no\n * dedicated APG pattern).\n *\n * Markup contract (identifier: `stimeo--network-status`):\n *   <div data-controller=\"stimeo--network-status\"\n *        data-stimeo--network-status-announce-text-value=\"You are offline.\"\n *        data-stimeo--network-status-announce-online-text-value=\"Back online.\">\n *     <div hidden data-stimeo--network-status-target=\"offline\">\n *       You are offline.\n *     </div>\n *     <div hidden data-stimeo--network-status-target=\"online\">\n *       Back online.\n *     </div>\n *   </div>\n *\n * Reads `navigator.onLine` on connect and subscribes to the `window`\n * `online`/`offline` events, toggling the matching banner. The banners are the\n * visual half; assistive tech hears the transition through `announceText`\n * (assertive, because losing connectivity is urgent) and `announceOnlineText`\n * (polite), which go to the page's announcer.\n *\n * @remarks\n * Behavior only. `navigator.onLine` is the browser's *guess* — it does not\n * guarantee server reachability, which stays the consumer's job. A banner that is\n * merely un-hidden at the moment of the change is not reliably read, which is why\n * the wording goes to the page's announcer — a region that stands in the document\n * independently of this component. The transition is guarded so an unchanged\n * state never re-announces. The event listeners and the auto-hide timer are\n * removed/cleared on `disconnect()` (Turbo included).\n */\nexport class NetworkStatusController extends Controller<HTMLElement> {\n  static override targets = [\"offline\", \"online\"];\n  static override values = {\n    announceText: { type: String, default: \"\" },\n    announceOnlineText: { type: String, default: \"\" },\n    onlineAutoHide: { type: Number, default: 0 },\n  };\n  static events = [\"change\"] as const;\n\n  declare readonly offlineTarget: HTMLElement;\n  declare readonly onlineTarget: HTMLElement;\n  declare readonly hasOfflineTarget: boolean;\n  declare readonly hasOnlineTarget: boolean;\n\n  declare onlineAutoHideValue: number;\n  declare announceTextValue: string;\n  declare announceOnlineTextValue: string;\n\n  readonly #timers = new SafeTimeout();\n\n  /** Last known connectivity; guards against duplicate-state re-announcements. */\n  #online = true;\n\n  readonly #handleOnline = (): void => this.#update(true);\n  readonly #handleOffline = (): void => this.#update(false);\n\n  override connect(): void {\n    // Normalize initial visibility so a missing `hidden` in the markup cannot\n    // strand a stale banner (e.g. an offline notice showing while online).\n    if (this.hasOfflineTarget) this.offlineTarget.hidden = true;\n    if (this.hasOnlineTarget) this.onlineTarget.hidden = true;\n\n    this.#online = navigator.onLine;\n    // On connect, surface only the offline state; do not flash a \"back online\"\n    // banner just because the page loaded while connected.\n    this.element.setAttribute(\"data-state\", this.#online ? \"online\" : \"offline\");\n    if (!this.#online) this.#showOffline();\n\n    window.addEventListener(\"online\", this.#handleOnline);\n    window.addEventListener(\"offline\", this.#handleOffline);\n  }\n\n  override disconnect(): void {\n    window.removeEventListener(\"online\", this.#handleOnline);\n    window.removeEventListener(\"offline\", this.#handleOffline);\n    this.#timers.clearAll();\n  }\n\n  /**\n   * Applies a connectivity transition, guarded against duplicate states.\n   *\n   * The event goes out last, so a listener reading `data-state` or a banner's\n   * visibility sees the state the transition landed on rather than the previous one.\n   */\n  #update(online: boolean): void {\n    if (online === this.#online) return;\n    this.#online = online;\n    this.element.setAttribute(\"data-state\", online ? \"online\" : \"offline\");\n    if (online) {\n      this.#showOnline();\n    } else {\n      this.#showOffline();\n    }\n    // The banner is the visual half; reading it out is the announcer's job, because\n    // a region that is only revealed at the moment of the change is not reliably read.\n    announce(fillTemplate(online ? this.announceOnlineTextValue : this.announceTextValue, {}), {\n      assertive: !online,\n    });\n    this.dispatch(\"change\", { detail: { online } });\n  }\n\n  /** Shows the offline banner and hides the recovery banner. */\n  #showOffline(): void {\n    this.#timers.clearAll();\n    if (this.hasOnlineTarget) this.onlineTarget.hidden = true;\n    if (this.hasOfflineTarget) this.offlineTarget.hidden = false;\n  }\n\n  /** Shows the recovery banner, optionally auto-hiding it after `onlineAutoHide`. */\n  #showOnline(): void {\n    if (this.hasOfflineTarget) this.offlineTarget.hidden = true;\n    if (!this.hasOnlineTarget) return;\n    this.onlineTarget.hidden = false;\n    if (this.onlineAutoHideValue > 0) {\n      this.#timers.set(() => {\n        this.onlineTarget.hidden = true;\n      }, this.onlineAutoHideValue);\n    }\n  }\n}\n"]}
+{"version":3,"sources":["../../src/utils/announce.ts","../../src/utils/safe_timeout.ts","../../src/controllers/network_status_controller.ts"],"names":[],"mappings":"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","file":"network_status_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 * Self-cleaning timer registries shared by Stimeo controllers.\n *\n * Stimulus controllers frequently schedule `setTimeout` / `setInterval` work\n * (auto-dismiss, debouncing, polling). When the element leaves the DOM — a\n * Turbo Drive navigation, a Turbo Stream replacement, or any `disconnect()` —\n * orphaned timers keep firing against a detached controller, leaking memory and\n * mutating stale state. {@link SafeTimeout} and {@link SafeInterval} track every\n * timer they create so a single {@link TimerRegistry.clearAll | clearAll()} call\n * in `disconnect()` tears them all down.\n *\n * These are intentionally low-level primitives: they own *registration and\n * cleanup only*. Higher-level policy (pause/resume, remaining-time accounting)\n * stays in the individual controllers so per-widget semantics are not flattened\n * into a lowest-common-denominator helper.\n */\n\n/**\n * Shared registry bookkeeping for the timeout/interval variants.\n *\n * Subclasses provide the scheduling primitive ({@link schedule}) and its matching\n * canceller ({@link cancel}); this base owns the set of live ids plus the\n * per-id and bulk teardown shared by both.\n */\nabstract class TimerRegistry {\n  /** Live timer ids that have not yet been cleared (or, for timeouts, fired). */\n  protected readonly ids = new Set<number>();\n\n  /** Schedules the underlying platform timer and returns its id. */\n  protected abstract schedule(callback: () => void, delay: number): number;\n\n  /** Cancels the underlying platform timer for `id`. */\n  protected abstract cancel(id: number): void;\n\n  /**\n   * Cancels a single tracked timer.\n   *\n   * No-ops if the id is unknown (already cleared, fired, or never owned by this\n   * registry), so callers can clear defensively without guarding.\n   */\n  clear(id: number): void {\n    if (this.ids.delete(id)) {\n      this.cancel(id);\n    }\n  }\n\n  /**\n   * Cancels every tracked timer. Call this from a controller's `disconnect()`\n   * to guarantee no timer outlives the element.\n   */\n  clearAll(): void {\n    for (const id of this.ids) {\n      this.cancel(id);\n    }\n    this.ids.clear();\n  }\n\n  /** Number of timers currently tracked (pending). */\n  get size(): number {\n    return this.ids.size;\n  }\n}\n\n/**\n * `setTimeout` wrapper that auto-forgets each timer once it fires and supports\n * bulk teardown on disconnect.\n *\n * @example\n * ```ts\n * #timers = new SafeTimeout();\n *\n * connect() {\n *   this.#timers.set(() => this.dismiss(), 5000);\n * }\n *\n * disconnect() {\n *   this.#timers.clearAll();\n * }\n * ```\n */\nexport class SafeTimeout extends TimerRegistry {\n  /**\n   * Schedules `callback` after `delay` ms and returns the timer id.\n   *\n   * The id is removed from the registry automatically when the timeout fires,\n   * so {@link TimerRegistry.size | size} reflects only still-pending timers.\n   */\n  set(callback: () => void, delay: number): number {\n    const id = this.schedule(() => {\n      this.ids.delete(id);\n      callback();\n    }, delay);\n    this.ids.add(id);\n    return id;\n  }\n\n  protected schedule(callback: () => void, delay: number): number {\n    return window.setTimeout(callback, delay);\n  }\n\n  protected cancel(id: number): void {\n    window.clearTimeout(id);\n  }\n}\n\n/**\n * `setInterval` wrapper that tracks every interval for bulk teardown on\n * disconnect. Unlike {@link SafeTimeout}, intervals are retained until they are\n * explicitly cleared because they fire repeatedly.\n *\n * @example\n * ```ts\n * #intervals = new SafeInterval();\n *\n * connect() {\n *   this.#intervals.set(() => this.tick(), 1000);\n * }\n *\n * disconnect() {\n *   this.#intervals.clearAll();\n * }\n * ```\n */\nexport class SafeInterval extends TimerRegistry {\n  /** Schedules a repeating `callback` every `delay` ms and returns the timer id. */\n  set(callback: () => void, delay: number): number {\n    const id = this.schedule(callback, delay);\n    this.ids.add(id);\n    return id;\n  }\n\n  protected schedule(callback: () => void, delay: number): number {\n    return window.setInterval(callback, delay);\n  }\n\n  protected cancel(id: number): void {\n    window.clearInterval(id);\n  }\n}\n","import { Controller } from \"@hotwired/stimulus\";\nimport { announce, fillTemplate } from \"../utils/announce\";\nimport { SafeTimeout } from \"../utils/safe_timeout\";\n\n/**\n * Headless online/offline banner behavior built on the live-region practice (no\n * dedicated APG pattern).\n *\n * Markup contract (identifier: `stimeo--network-status`):\n *   <div data-controller=\"stimeo--network-status\"\n *        data-stimeo--network-status-announce-text-value=\"You are offline.\"\n *        data-stimeo--network-status-announce-online-text-value=\"Back online.\">\n *     <div hidden data-stimeo--network-status-target=\"offline\">\n *       You are offline.\n *     </div>\n *     <div hidden data-stimeo--network-status-target=\"online\">\n *       Back online.\n *     </div>\n *   </div>\n *\n * Reads `navigator.onLine` on connect and subscribes to the `window`\n * `online`/`offline` events, toggling the matching banner. The banners are the\n * visual half; assistive tech hears the transition through `announceText`\n * (assertive, because losing connectivity is urgent) and `announceOnlineText`\n * (polite), which go to the page's announcer.\n *\n * `change` dispatches `{ online: boolean }`.\n *\n * @remarks\n * Behavior only. `navigator.onLine` is the browser's *guess* — it does not\n * guarantee server reachability, which stays the consumer's job. A banner that is\n * merely un-hidden at the moment of the change is not reliably read, which is why\n * the wording goes to the page's announcer — a region that stands in the document\n * independently of this component. The transition is guarded so an unchanged\n * state never re-announces. The event listeners and the auto-hide timer are\n * removed/cleared on `disconnect()` (Turbo included).\n */\nexport class NetworkStatusController extends Controller<HTMLElement> {\n  static override targets = [\"offline\", \"online\"];\n  static override values = {\n    announceText: { type: String, default: \"\" },\n    announceOnlineText: { type: String, default: \"\" },\n    onlineAutoHide: { type: Number, default: 0 },\n  };\n  static events = [\"change\"] as const;\n\n  declare readonly offlineTarget: HTMLElement;\n  declare readonly onlineTarget: HTMLElement;\n  declare readonly hasOfflineTarget: boolean;\n  declare readonly hasOnlineTarget: boolean;\n\n  declare onlineAutoHideValue: number;\n  declare announceTextValue: string;\n  declare announceOnlineTextValue: string;\n\n  readonly #timers = new SafeTimeout();\n\n  /** Last known connectivity; guards against duplicate-state re-announcements. */\n  #online = true;\n\n  readonly #handleOnline = (): void => this.#update(true);\n  readonly #handleOffline = (): void => this.#update(false);\n\n  override connect(): void {\n    // Normalize initial visibility so a missing `hidden` in the markup cannot\n    // strand a stale banner (e.g. an offline notice showing while online).\n    if (this.hasOfflineTarget) this.offlineTarget.hidden = true;\n    if (this.hasOnlineTarget) this.onlineTarget.hidden = true;\n\n    this.#online = navigator.onLine;\n    // On connect, surface only the offline state; do not flash a \"back online\"\n    // banner just because the page loaded while connected.\n    this.element.setAttribute(\"data-state\", this.#online ? \"online\" : \"offline\");\n    if (!this.#online) this.#showOffline();\n\n    window.addEventListener(\"online\", this.#handleOnline);\n    window.addEventListener(\"offline\", this.#handleOffline);\n  }\n\n  override disconnect(): void {\n    window.removeEventListener(\"online\", this.#handleOnline);\n    window.removeEventListener(\"offline\", this.#handleOffline);\n    this.#timers.clearAll();\n  }\n\n  /**\n   * Applies a connectivity transition, guarded against duplicate states.\n   *\n   * The event goes out last, so a listener reading `data-state` or a banner's\n   * visibility sees the state the transition landed on rather than the previous one.\n   */\n  #update(online: boolean): void {\n    if (online === this.#online) return;\n    this.#online = online;\n    this.element.setAttribute(\"data-state\", online ? \"online\" : \"offline\");\n    if (online) {\n      this.#showOnline();\n    } else {\n      this.#showOffline();\n    }\n    // The banner is the visual half; reading it out is the announcer's job, because\n    // a region that is only revealed at the moment of the change is not reliably read.\n    announce(fillTemplate(online ? this.announceOnlineTextValue : this.announceTextValue, {}), {\n      assertive: !online,\n    });\n    this.dispatch(\"change\", { detail: { online } });\n  }\n\n  /** Shows the offline banner and hides the recovery banner. */\n  #showOffline(): void {\n    this.#timers.clearAll();\n    if (this.hasOnlineTarget) this.onlineTarget.hidden = true;\n    if (this.hasOfflineTarget) this.offlineTarget.hidden = false;\n  }\n\n  /** Shows the recovery banner, optionally auto-hiding it after `onlineAutoHide`. */\n  #showOnline(): void {\n    if (this.hasOfflineTarget) this.offlineTarget.hidden = true;\n    if (!this.hasOnlineTarget) return;\n    this.onlineTarget.hidden = false;\n    if (this.onlineAutoHideValue > 0) {\n      this.#timers.set(() => {\n        this.onlineTarget.hidden = true;\n      }, this.onlineAutoHideValue);\n    }\n  }\n}\n"]}

package/dist/controllers/number_input_controller.d.ts

@@ -25,6 +25,8 @@ import { Controller } from '@hotwired/stimulus';
  * stepping) so the behavior is identical for a native `<input type="number">` and
  * a custom `role="spinbutton"` host.
  *
+ * `reconcile` dispatches `{ value: number }`.
+ *
  * @remarks
  * Behavior only — the consumer styles the field and buttons. The input is the
  * sole Tab stop; the buttons are `tabindex="-1"` and keep focus on the input

package/dist/controllers/number_input_controller.js

@@ -27,17 +27,21 @@ var AttributeLease = class {
         written: value
       });
     }
-    if (value === null) element.removeAttribute(this.#attribute);
-    else element.setAttribute(this.#attribute, value);
+    this.#reflect(element, value);
   }
   /** Returns one lease without overwriting a value subsequently authored by a consumer. */
   return(element) {
     const record = this.#records.get(element);
     if (!record) return;
     this.#records.delete(element);
-    if (element.getAttribute(this.#attribute) !== record.written) return;
-    if (record.original === null) element.removeAttribute(this.#attribute);
-    else element.setAttribute(this.#attribute, record.original);
+    const stillOwned = element.getAttribute(this.#attribute) === record.written;
+    if (stillOwned) this.#reflect(element, record.original);
+  }
+  /** Reflects only a real value transition, avoiding self-triggered mutation work. */
+  #reflect(element, value) {
+    if (element.getAttribute(this.#attribute) === value) return;
+    if (value === null) element.removeAttribute(this.#attribute);
+    else element.setAttribute(this.#attribute, value);
   }
   /** Returns every outstanding lease using the same ownership check as {@link return}. */
   returnAll() {
@@ -45,6 +49,35 @@ var AttributeLease = class {
   }
 };
 
+// src/utils/before_cache_reset.ts
+var BeforeCacheReset = class _BeforeCacheReset {
+  /** Every subscribed instance, iterated by the one shared document listener. */
+  static #subscribers = /* @__PURE__ */ new Set();
+  /** The shared listener; installed while at least one instance is subscribed. */
+  static #onBeforeCache = () => {
+    for (const subscriber of _BeforeCacheReset.#subscribers) subscriber.#rewind();
+  };
+  #rewind;
+  /** @param rewind - the pass that returns this controller's state to its initial form. */
+  constructor(rewind) {
+    this.#rewind = rewind;
+  }
+  /** Subscribes to `turbo:before-cache`; call from `connect()`. Idempotent. */
+  activate() {
+    const first = _BeforeCacheReset.#subscribers.size === 0;
+    _BeforeCacheReset.#subscribers.add(this);
+    if (first) {
+      document.addEventListener("turbo:before-cache", _BeforeCacheReset.#onBeforeCache);
+    }
+  }
+  /** Unsubscribes; call from `disconnect()`. Safe when never subscribed. */
+  deactivate() {
+    _BeforeCacheReset.#subscribers.delete(this);
+    if (_BeforeCacheReset.#subscribers.size > 0) return;
+    document.removeEventListener("turbo:before-cache", _BeforeCacheReset.#onBeforeCache);
+  }
+};
+
 // src/utils/composition_tracker.ts
 var CompositionTracker = class {
   #observedTargets = /* @__PURE__ */ new Set();
@@ -328,6 +361,7 @@ var NumberInputController = class _NumberInputController extends Controller {
   /** Tracks IME lifecycle on the current input, including confirming keys without a signal. */
   #composition = new CompositionTracker();
   /** Restores authored custom-spinbutton ARIA when a target leaves or the controller stops. */
+  #beforeCache = new BeforeCacheReset(() => this.#rewindForCache());
   #ariaValueNow = new AttributeLease("aria-valuenow");
   #ariaValueMin = new AttributeLease("aria-valuemin");
   #ariaValueMax = new AttributeLease("aria-valuemax");
@@ -351,6 +385,7 @@ var NumberInputController = class _NumberInputController extends Controller {
   /** Normalizes any initial value and wires the focus/hold pointer guards. */
   connect() {
     this.#repaint.activate();
+    this.#beforeCache.activate();
     this.#globalGuards = new AbortController();
     const { signal } = this.#globalGuards;
     for (const button of this.incrementTargets) this.#wireButton(button, 1);
@@ -364,6 +399,7 @@ var NumberInputController = class _NumberInputController extends Controller {
   disconnect() {
     this.#repaint.cancel();
     this.#composition.disconnect();
+    this.#beforeCache.deactivate();
     this.#globalGuards?.abort();
     this.#globalGuards = null;
     const buttons = /* @__PURE__ */ new Set([
@@ -697,6 +733,12 @@ var NumberInputController = class _NumberInputController extends Controller {
   get #steppedRange() {
     return { min: this.minValue, max: this.maxValue, step: this.stepValue };
   }
+  /** Returns borrowed range ARIA before Turbo snapshots the page. */
+  #rewindForCache() {
+    this.#ariaValueNow.returnAll();
+    this.#ariaValueMin.returnAll();
+    this.#ariaValueMax.returnAll();
+  }
 };
 
 export { NumberInputController };