stimeo-ui 0.14.0 → 0.16.0

data/dist/controllers/navigation_menu_controller.js

@@ -162,6 +162,16 @@ var SafeTimeout = class extends TimerRegistry {
   }
 };
 
+// src/utils/state_reason.ts
+var FOCUS_EVENTS = /* @__PURE__ */ new Set(["blur", "focus", "focusin", "focusout"]);
+var POINTER_EVENTS = /* @__PURE__ */ new Set(["mouseenter", "mouseleave", "pointerenter", "pointerleave"]);
+function stateReasonFor(event) {
+  if (!event) return "api";
+  if (FOCUS_EVENTS.has(event.type)) return "focus";
+  if (POINTER_EVENTS.has(event.type)) return "pointer";
+  return "user";
+}
+
 // src/controllers/navigation_menu_controller.ts
 var NavigationMenuController = class extends Controller {
   static targets = ["trigger", "panel", "hoverArea"];
@@ -170,6 +180,7 @@ var NavigationMenuController = class extends Controller {
     hoverDelay: { type: Number, default: 150 }
   };
   static actions = ["onTriggerKeydown", "toggle"];
+  static events = ["close", "open"];
   /** Open/close delay timers for hover mode; cleared together on disconnect. */
   #hoverTimers = new SafeTimeout();
   /**
@@ -190,19 +201,23 @@ var NavigationMenuController = class extends Controller {
    * rebuild would re-wire hover listeners onto an already-disconnected nav.
    */
   #connected = false;
+  /** Whether state moves are reported: set once `connect()` settled the baseline. */
+  #reporting = false;
   /** Escape-stack membership while any panel is open; the shared resolver dismisses via it. */
   #escapeLayer = new EscapeLayer();
   /** Establishes the closed baseline and the dismissal listeners. */
   connect() {
     this.#connected = true;
-    this.#closeAll();
+    this.#closeAll("api");
     document.addEventListener("click", this.#onOutsideClick, true);
     this.element.addEventListener("focusout", this.#onFocusOut);
     if (this.openOnHoverValue) this.#addHoverListeners();
+    this.#reporting = true;
   }
   /** Removes every listener, pending hover timer, and stack membership taken while connected. */
   disconnect() {
     this.#connected = false;
+    this.#reporting = false;
     this.#escapeLayer.deactivate();
     document.removeEventListener("click", this.#onOutsideClick, true);
     this.element.removeEventListener("focusout", this.#onFocusOut);
@@ -259,13 +274,14 @@ var NavigationMenuController = class extends Controller {
    */
   toggle(event) {
     const trigger = event.currentTarget;
+    const reason = stateReasonFor(event);
     this.#hoverTimers.clearAll();
     if (!this.#isExpanded(trigger)) {
-      this.#openPanel(trigger);
+      this.#openPanel(trigger, reason);
       return;
     }
     if (this.openOnHoverValue && this.#hoveredTrigger === trigger) return;
-    this.#closePanel(trigger);
+    this.#closePanel(trigger, reason);
   }
   /**
    * `ArrowLeft`/`ArrowRight` move focus between triggers (keeping Tab order).
@@ -297,24 +313,27 @@ var NavigationMenuController = class extends Controller {
    * already-open panel only re-asserts the Escape layer: the close/open
    * round-trip would rewrite `aria-expanded` and `hidden` for no state change.
    */
-  #openPanel(trigger) {
+  #openPanel(trigger, reason) {
     if (trigger.getAttribute("aria-disabled") === "true") return;
     if (this.#isExpanded(trigger)) {
       this.#syncEscapeLayer();
       return;
     }
-    this.#closeAll();
+    this.#closeAll(reason);
     const panel = this.#panelFor(trigger);
     if (!panel) return;
     panel.hidden = false;
     trigger.setAttribute("aria-expanded", "true");
+    this.#report("open", trigger, panel, reason);
     this.#syncEscapeLayer();
   }
-  /** Closes `trigger`'s panel and reflects the collapsed state. */
-  #closePanel(trigger) {
+  /** Closes `trigger`'s panel, reflects the collapsed state, and reports a move. */
+  #closePanel(trigger, reason) {
+    const was = this.#isExpanded(trigger);
     const panel = this.#panelFor(trigger);
     if (panel) panel.hidden = true;
     trigger.setAttribute("aria-expanded", "false");
+    if (was && panel) this.#report("close", trigger, panel, reason);
     this.#syncEscapeLayer();
   }
   /**
@@ -322,8 +341,16 @@ var NavigationMenuController = class extends Controller {
    * triggers, so a trigger whose panel was hidden by other means cannot keep
    * advertising an open panel.
    */
-  #closeAll() {
-    for (const trigger of this.triggerTargets) this.#closePanel(trigger);
+  #closeAll(reason) {
+    for (const trigger of this.triggerTargets) this.#closePanel(trigger, reason);
+  }
+  /** Names the panel that moved, so a subscriber does not have to re-derive it. */
+  #report(name, trigger, panel, reason) {
+    if (!this.#reporting) return;
+    const index = this.triggerTargets.indexOf(trigger);
+    const detail = { reason, index, panel };
+    if (name === "open") this.dispatch("open", { detail, cancelable: false });
+    else this.dispatch("close", { detail, cancelable: false });
   }
   /**
    * Whether a trigger can receive arrow-key focus: not `hidden`, not a natively
@@ -365,12 +392,12 @@ var NavigationMenuController = class extends Controller {
     const open = this.#openTrigger;
     if (!open) return;
     this.#hoverTimers.clearAll();
-    this.#closePanel(open);
+    this.#closePanel(open, "escape");
     open.focus();
   }
   /** Closes panels when a click lands outside the nav element. */
   #onOutsideClick = (event) => {
-    if (this.#isAnyOpen && !this.element.contains(event.target)) this.#closeAll();
+    if (this.#isAnyOpen && !this.element.contains(event.target)) this.#closeAll("outside");
   };
   /**
    * Closes (without restoring focus) when focus leaves the nav for a known
@@ -383,9 +410,13 @@ var NavigationMenuController = class extends Controller {
   #onFocusOut = (event) => {
     const next = event.relatedTarget;
     if (!(next instanceof Node) || this.element.contains(next)) return;
-    this.#closeAll();
+    this.#closeAll("focus");
   };
-  /** Opens a trigger's panel after the hover delay (hover mode). */
+  /**
+   * Opens a trigger's panel after the hover delay (hover mode).
+   *
+   * @stimeoRuntimeOnly `hoverDelay` is the delay of the one hover timer this entry arms.
+   */
   #onPointerEnter = (event) => {
     const trigger = this.#triggerForHover(event.currentTarget);
     if (!trigger) return;
@@ -398,6 +429,8 @@ var NavigationMenuController = class extends Controller {
    * pointer moved directly into another part of the hover region (an adjacent
    * trigger, panel, or hoverArea): crossing a shared edge must not schedule a
    * spurious close, e.g. a hoverArea whose panel sits outside it as a sibling.
+   *
+   * @stimeoRuntimeOnly `hoverDelay` is the delay of the one hover timer this exit arms.
    */
   #onPointerLeave = (event) => {
     const next = event instanceof MouseEvent ? event.relatedTarget : null;
@@ -416,7 +449,7 @@ var NavigationMenuController = class extends Controller {
     if (trigger.getAttribute("aria-disabled") === "true") return;
     const open = this.#openTrigger;
     if (open && open !== trigger && this.#holdsFocus(this.#panelFor(open))) open.focus();
-    this.#openPanel(trigger);
+    this.#openPanel(trigger, "pointer");
   }
   /**
    * Hover-driven close: skipped while focus sits inside the panel it would hide,
@@ -427,7 +460,7 @@ var NavigationMenuController = class extends Controller {
   #closeFromHover() {
     const open = this.#openTrigger;
     if (open && this.#holdsFocus(this.#panelFor(open))) return;
-    this.#closeAll();
+    this.#closeAll("pointer");
   }
   /** Whether `panel` exists and currently contains the focused element. */
   #holdsFocus(panel) {

data/dist/controllers/nested_form_controller.js

@@ -228,12 +228,28 @@ var TabindexLoan = class {
   }
 };
 
+// src/utils/target_selector.ts
+function targetSelector(identifier, name) {
+  return `[data-${identifier}-target~="${name}"]`;
+}
+
 // src/controllers/nested_form_controller.ts
-var ROOT_SELECTOR = '[data-controller~="stimeo--nested-form"]';
-var REMOVE_SELECTOR = '[data-stimeo--nested-form-target="remove"]';
-var DESTROY_FLAG_SELECTOR = '[data-stimeo--nested-form-target="destroyFlag"]';
+var REMOVE_PART = "remove";
+var DESTROY_FLAG_PART = "destroyFlag";
 var DESTROYED_VALUES = /* @__PURE__ */ new Set(["1", "true"]);
 var NestedFormController = class extends Controller {
+  /** Selects any root of this controller; the nearest one owns an element. */
+  get #rootSelector() {
+    return `[data-controller~="${this.identifier}"]`;
+  }
+  /** Selects per-row remove buttons, in the namespace this controller is registered under. */
+  get #removeSelector() {
+    return targetSelector(this.identifier, REMOVE_PART);
+  }
+  /** Selects the hidden `_destroy` input a persisted row carries. */
+  get #destroyFlagSelector() {
+    return targetSelector(this.identifier, DESTROY_FLAG_PART);
+  }
   static targets = ["list", "template", "add", "remove", "destroyFlag"];
   static values = {
     min: { type: Number, default: 0 },
@@ -265,7 +281,7 @@ var NestedFormController = class extends Controller {
    */
   #onClick = (event) => {
     const target = event.target;
-    const button = target?.closest(REMOVE_SELECTOR);
+    const button = target?.closest(this.#removeSelector);
     if (!button || this.#ownerOf(button) !== this.element) return;
     const row = this.#rowContaining(button);
     if (row) this.#removeRow(row);
@@ -362,6 +378,9 @@ var NestedFormController = class extends Controller {
       return;
     }
     const row = added[0];
+    for (const node of Array.from(list.childNodes).slice(beforeNodes)) {
+      if (node !== row) node.remove();
+    }
     this.#refresh();
     firstTabStop(row)?.focus();
     this.dispatch("add", { detail: { index, element: row } });
@@ -371,6 +390,8 @@ var NestedFormController = class extends Controller {
    * Removes a row: a persisted row (one carrying its own `destroyFlag`) has the
    * flag set to `1` and is hidden so Rails destroys it on submit; an unsaved row
    * is dropped from the DOM. Returns focus to a surviving row. No-ops at `min`.
+   *
+   * @stimeoRuntimeOnly `min` decides whether this one removal is allowed.
    */
   #removeRow(row) {
     const rows = this.#effectiveRows;
@@ -426,7 +447,11 @@ var NestedFormController = class extends Controller {
     this.#tabindex.lend(this.element);
     this.element.focus();
   }
-  /** Recomputes the count and min/max hooks from the DOM and records them as published. */
+  /**
+   * Recomputes the count and min/max hooks from the DOM and records them as published.
+   *
+   * @stimeoRenderRoot
+   */
   #refresh() {
     if (!this.hasListTarget) return;
     const count = this.#effectiveRows.length;
@@ -455,7 +480,11 @@ var NestedFormController = class extends Controller {
     const moved = previous.count !== current.count || previous.atMin !== current.atMin || previous.atMax !== current.atMax;
     if (moved) this.dispatch("reconcile", { detail: { ...current } });
   }
-  /** Bridges the count change to the shared announcer when configured. */
+  /**
+   * Bridges the count change to the shared announcer when configured.
+   *
+   * @stimeoRuntimeOnly `announce` and `countMessage` word the one announcement of this change.
+   */
   #announce() {
     if (!this.announceValue || this.countMessageValue === "") return;
     announce(fillTemplate(this.countMessageValue, { count: this.#effectiveRows.length }));
@@ -514,14 +543,14 @@ var NestedFormController = class extends Controller {
   }
   /** The row's own destroy flag, skipping flags owned by a nested inner form. */
   #destroyFlagOf(row) {
-    for (const flag of row.querySelectorAll(DESTROY_FLAG_SELECTOR)) {
+    for (const flag of row.querySelectorAll(this.#destroyFlagSelector)) {
       if (this.#ownerOf(flag) === this.element) return flag;
     }
     return null;
   }
   /** The nearest nested-form root that owns `el`. */
   #ownerOf(el) {
-    return el.closest(ROOT_SELECTOR);
+    return el.closest(this.#rootSelector);
   }
   /** The nearest ancestor of `el` that is a direct child of the list, else null. */
   #rowContaining(el) {

data/dist/controllers/network_status_controller.js

@@ -105,6 +105,9 @@ var NetworkStatusController = class extends Controller {
    *
    * The event goes out last, so a listener reading `data-state` or a banner's
    * visibility sees the state the transition landed on rather than the previous one.
+   *
+   * @stimeoRuntimeOnly The texts word the one announcement of this transition; the state it shows
+   *   comes from the browser.
    */
   #update(online) {
     if (online === this.#online) return;
@@ -126,7 +129,12 @@ var NetworkStatusController = class extends Controller {
     if (this.hasOnlineTarget) this.onlineTarget.hidden = true;
     if (this.hasOfflineTarget) this.offlineTarget.hidden = false;
   }
-  /** Shows the recovery banner, optionally auto-hiding it after `onlineAutoHide`. */
+  /**
+   * Shows the recovery banner, optionally auto-hiding it after `onlineAutoHide`.
+   *
+   * @stimeoRuntimeOnly `onlineAutoHide` is the delay of the one timer that hides the banner this
+   *   transition shows.
+   */
   #showOnline() {
     if (this.hasOfflineTarget) this.offlineTarget.hidden = true;
     if (!this.hasOnlineTarget) return;

data/dist/controllers/number_input_controller.js

@@ -79,11 +79,19 @@ var BeforeCacheReset = class _BeforeCacheReset {
 };
 
 // src/utils/composition_tracker.ts
+var COMPOSITION_INPUT_TYPES = /* @__PURE__ */ new Set([
+  "insertCompositionText",
+  "insertFromComposition",
+  "deleteCompositionText",
+  "deleteByComposition"
+]);
 var CompositionTracker = class {
   #observedTargets = /* @__PURE__ */ new Set();
   #activeTargets = /* @__PURE__ */ new Set();
   #onStart;
   #onEnd;
+  /** The field whose confirming `input` is still owed, while the window is open. */
+  #confirmedTarget = null;
   constructor(options = {}) {
     this.#onStart = options.onStart;
     this.#onEnd = options.onEnd;
@@ -93,6 +101,7 @@ var CompositionTracker = class {
     if (this.#observedTargets.has(target)) return;
     target.addEventListener("compositionstart", this.#handleStart);
     target.addEventListener("compositionend", this.#handleEnd);
+    target.addEventListener("keydown", this.#handleKeydown);
     this.#observedTargets.add(target);
   }
   /** Stops tracking one target and clears any active composition it owned. */
@@ -100,31 +109,74 @@ var CompositionTracker = class {
     if (!this.#observedTargets.delete(target)) return;
     target.removeEventListener("compositionstart", this.#handleStart);
     target.removeEventListener("compositionend", this.#handleEnd);
+    target.removeEventListener("keydown", this.#handleKeydown);
     this.#activeTargets.delete(target);
+    if (this.#confirmedTarget === target) this.#confirmedTarget = null;
   }
   /** Releases every listener and clears state so reconnect starts cleanly. */
   disconnect() {
     for (const target of this.#observedTargets) {
       target.removeEventListener("compositionstart", this.#handleStart);
       target.removeEventListener("compositionend", this.#handleEnd);
+      target.removeEventListener("keydown", this.#handleKeydown);
     }
     this.#observedTargets.clear();
     this.#activeTargets.clear();
+    this.#confirmedTarget = null;
   }
   /** True when lifecycle tracking or the current event reports composition. */
   isComposing(event) {
     return this.#activeTargets.size > 0 || event?.isComposing === true;
   }
+  /**
+   * Whether `event` is the `input` echoing the composition just confirmed.
+   *
+   * Asking closes the window either way, so one confirmation is folded at most
+   * once and a consumer asks once per `input`.
+   */
+  consumesConfirmedInput(event) {
+    const confirmed = this.#confirmedTarget;
+    this.#confirmedTarget = null;
+    if (confirmed === null || confirmed !== event.target) return false;
+    const inputType = event.inputType;
+    return !inputType || COMPOSITION_INPUT_TYPES.has(inputType);
+  }
   #handleStart = (event) => {
+    this.#confirmedTarget = null;
     if (event.currentTarget) this.#activeTargets.add(event.currentTarget);
     this.#onStart?.(event);
   };
   #handleEnd = (event) => {
     if (event.currentTarget) this.#activeTargets.delete(event.currentTarget);
+    this.#confirmedTarget = event.target;
     this.#onEnd?.(event);
   };
+  /** A key on an observed field opens an edit of its own, so no echo is owed. */
+  #handleKeydown = () => {
+    this.#confirmedTarget = null;
+  };
 };
 
+// src/utils/field_mirror.ts
+function commitEdit(control) {
+  control.dispatchEvent(new Event("input", { bubbles: true }));
+  control.dispatchEvent(new Event("change", { bubbles: true }));
+}
+
+// src/utils/half_width.ts
+var FULL_WIDTH_SHIFT = 65248;
+function halfWidthChar(char) {
+  if (char >= "\uFF01" && char <= "\uFF5E") {
+    return String.fromCharCode(char.charCodeAt(0) - FULL_WIDTH_SHIFT);
+  }
+  return char === "\u3000" ? " " : char;
+}
+function toHalfWidth(text) {
+  let out = "";
+  for (const char of text) out += halfWidthChar(char);
+  return out;
+}
+
 // src/utils/microtask_coalescer.ts
 var MicrotaskCoalescer = class {
   #run;
@@ -358,15 +410,34 @@ var NumberInputController = class _NumberInputController extends Controller {
   #globalGuards = null;
   /** Per-target guards allow an old button to be released without touching its replacement. */
   #buttonGuards = /* @__PURE__ */ new Map();
-  /** Tracks IME lifecycle on the current input, including confirming keys without a signal. */
-  #composition = new CompositionTracker();
+  /**
+   * Tracks IME lifecycle on the current input, including confirming keys without a
+   * signal, and runs a reconciliation the composition held back once it ends.
+   */
+  #composition = new CompositionTracker({
+    onEnd: () => {
+      if (this.#reconcileHeld) this.#repaint.schedule();
+    }
+  });
+  /** A reconciliation that arrived while the input was composing. */
+  #reconcileHeld = false;
   /** 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");
-  /** Last reconciled or user-committed numeric value. */
+  /**
+   * The number shown last — reconciled or committed by the user — which the next
+   * move is measured from; `null` while the field is blank, and before this
+   * instance has shown one. A disconnect keeps it for the same instance
+   * connecting again.
+   */
   #lastValue = null;
+  /**
+   * Whether `connect()` has run and `disconnect()` has not since. The pass
+   * `connect()` runs takes the baseline without reporting it.
+   */
+  #connected = false;
   /** Timers for the hold delay and the suppress-reset safety net. */
   #holdTimeouts = new SafeTimeout();
   /** The running auto-repeat interval (one at a time). */
@@ -394,9 +465,16 @@ var NumberInputController = class _NumberInputController extends Controller {
     window.addEventListener("pointercancel", this.#onPointerEnd, { signal });
     window.addEventListener("blur", this.#onWindowBlur, { signal });
     this.#reconcile();
+    this.#connected = true;
   }
-  /** Releases listeners, derived attributes, timers, and transient value state. */
+  /**
+   * Releases listeners, derived attributes, timers, and the hold state. The number
+   * shown last stays: the pass the next `connect()` runs takes a new one without a
+   * report from an input that is present, and with none it stays the number an
+   * input arriving later is compared with.
+   */
   disconnect() {
+    this.#connected = false;
     this.#repaint.cancel();
     this.#composition.disconnect();
     this.#beforeCache.deactivate();
@@ -418,7 +496,6 @@ var NumberInputController = class _NumberInputController extends Controller {
     this.#ariaValueNow.returnAll();
     this.#ariaValueMin.returnAll();
     this.#ariaValueMax.returnAll();
-    this.#lastValue = null;
   }
   /** Reconciles the value against a minimum changed by application code or a Turbo morph. */
   minValueChanged() {
@@ -437,12 +514,15 @@ var NumberInputController = class _NumberInputController extends Controller {
     this.#composition.observe(input);
     this.#repaint.schedule();
   }
-  /** Releases ARIA and composition state owned by an input that left the controller. */
+  /**
+   * Releases ARIA and composition state owned by an input that left the controller.
+   * The number it showed stays the baseline, so an input swapped in holding another
+   * number is reported as `reconcile`.
+   */
   inputTargetDisconnected(input) {
     this.#composition.unobserve(input);
     this.#releaseInputAria(input);
     this.#stopHold(false);
-    this.#lastValue = null;
     this.#repaint.schedule();
   }
   /** Wires focus preservation and hold behavior on a runtime increment target. */
@@ -520,7 +600,7 @@ var NumberInputController = class _NumberInputController extends Controller {
         return;
     }
     event.preventDefault();
-    this.#commit(next);
+    this.#commit(next, true);
   }
   /**
    * Wires a step button: `pointerdown` keeps focus on the input and arms the
@@ -624,42 +704,58 @@ var NumberInputController = class _NumberInputController extends Controller {
    *
    * @returns Whether the value changed (drives the auto-repeat's bound stop).
    */
-  #commit(raw) {
+  #commit(raw, report = false) {
     const value = this.#normalize(raw);
     const changed = this.#lastValue === null || value !== this.#lastValue;
+    const shown = this.inputTarget.value;
     this.#write(value);
     this.#lastValue = value;
+    if (report && shown !== this.inputTarget.value) commitEdit(this.inputTarget);
     if (changed) this.dispatch("change", { detail: { value } });
     return changed;
   }
   /** Commits an adjacent endpoint/grid value and reports whether it moved. */
   #commitStep(count) {
     if (!this.hasInputTarget) return false;
-    return this.#commit(stepSteppedValue(this.#currentValue(), count, this.#steppedRange));
+    return this.#commit(stepSteppedValue(this.#currentValue(), count, this.#steppedRange), true);
   }
   /**
-   * Reflects the current value after a range or step morph, reporting a moved
-   * value as `reconcile`.
+   * Reflects the current value after a range, step or input change, reporting a
+   * number that moved from the one shown last as `reconcile`. While the input is
+   * composing, its text is the IME's: the pass waits for the composition to end
+   * instead of reading and rewriting it. With no input there is nothing to show,
+   * and the number shown last stays the baseline for the input that comes next.
    *
    * @stimeoRenderRoot
    */
   #reconcile() {
-    if (!this.hasInputTarget) {
-      this.#lastValue = null;
+    if (!this.hasInputTarget) return;
+    if (this.#composition.isComposing()) {
+      this.#reconcileHeld = true;
       return;
     }
+    this.#reconcileHeld = false;
+    const previous = this.#lastValue;
     if (this.inputTarget.value.trim() !== "") {
-      const previous = this.#lastValue;
       const value = this.#normalize(this.#currentValue());
       this.#write(value);
       this.#lastValue = value;
-      if (previous !== null && value !== previous) {
-        this.dispatch("reconcile", { detail: { value } });
-      }
     } else {
       this.#lastValue = null;
       this.#reflectEmpty();
     }
+    this.#reportMove(previous);
+  }
+  /**
+   * Reports the number shown as `reconcile` when a change the page made moved it
+   * from `previous`. The page moved it, so it is reported apart from `change`,
+   * which stays reserved for user edits. A blank field reports nothing, the way a
+   * user blanking it does: both events carry a number.
+   */
+  #reportMove(previous) {
+    const value = this.#lastValue;
+    if (!this.#connected || value === null || value === previous) return;
+    this.dispatch("reconcile", { detail: { value } });
   }
   /** Reflects `value` on the input (and ARIA for non-native hosts) and the buttons. */
   #write(value) {
@@ -719,10 +815,17 @@ var NumberInputController = class _NumberInputController extends Controller {
     button.disabled = false;
     button.removeAttribute(OWNED_DISABLED);
   }
-  /** The current numeric value, falling back to a finite min (else 0) when blank. */
+  /**
+   * The current numeric value, falling back to a finite min (else 0) when blank.
+   * Every read of the field's number comes through here, and the text is read
+   * through the shared half-width mapping: a text-type spinbutton holds whatever an
+   * IME confirmed, full-width digits and signs included (`３４`, `－５`), while a
+   * native number field's value is already half-width or empty.
+   */
   #currentValue() {
-    const parsed = Number(this.inputTarget.value);
-    if (Number.isFinite(parsed) && this.inputTarget.value.trim() !== "") return parsed;
+    const text = toHalfWidth(this.inputTarget.value);
+    const parsed = Number(text);
+    if (Number.isFinite(parsed) && text.trim() !== "") return parsed;
     return Number.isFinite(this.minValue) ? this.minValue : 0;
   }
   /** Clamps to `[min, max]` and snaps to the step grid anchored at a finite min (else 0). */

data/dist/controllers/optimistic_controller.js

@@ -57,7 +57,44 @@ var DetachGate = class _DetachGate {
   }
 };
 
+// src/utils/listener_set.ts
+var ListenerSet = class {
+  /** The generation every `add` joins until the next `dispose()`. */
+  #abort = new AbortController();
+  /**
+   * Attaches `handler` to the open generation, exactly as the caller spelled it.
+   *
+   * The set supplies the signal, so `options` carries everything else the DOM
+   * accepts — `capture` included, which has to match at release time and no
+   * longer has a second place to drift from.
+   */
+  add(target, type, handler, options) {
+    target.addEventListener(type, handler, { ...options, signal: this.#abort.signal });
+  }
+  /**
+   * Releases every listener of the open generation, synchronously, and opens the
+   * next one. Idempotent, and safe before anything has been added.
+   */
+  dispose() {
+    this.#abort.abort();
+    this.#abort = new AbortController();
+  }
+};
+
+// src/utils/transient_hooks.ts
+var TransientHooks = class {
+  #attributes;
+  constructor(options) {
+    this.#attributes = options.attributes;
+  }
+  /** Drops the declared hooks from `element`; what it carries besides stays. */
+  reset(element) {
+    for (const attribute of this.#attributes) element.removeAttribute(attribute);
+  }
+};
+
 // src/controllers/optimistic_controller.ts
+var TRANSIENT = new TransientHooks({ attributes: ["data-optimistic"] });
 var HIDDEN_MARKER = "data-optimistic-toggled";
 var BUSY_MARKER = "data-optimistic-busy";
 var AUTHORED_ABSENT = "absent";
@@ -73,6 +110,7 @@ var OptimisticController = class extends Controller {
   /** The submission that owns the applied optimistic state, if any. */
   #pending = null;
   #gate = new DetachGate();
+  #listeners = new ListenerSet();
   /** True between `connect()` and `disconnect()`, so a repeat connect rewinds nothing. */
   #connected = false;
   connect() {
@@ -80,13 +118,12 @@ var OptimisticController = class extends Controller {
     this.#gate.cancel();
     this.#connected = true;
     if (restored && this.element.hasAttribute("data-optimistic")) this.#revert();
-    this.element.addEventListener("turbo:submit-start", this.#onSubmitStart);
-    this.element.addEventListener("turbo:submit-end", this.#onSubmitEnd);
+    this.#listeners.add(this.element, "turbo:submit-start", this.#onSubmitStart);
+    this.#listeners.add(this.element, "turbo:submit-end", this.#onSubmitEnd);
   }
   disconnect() {
     this.#connected = false;
-    this.element.removeEventListener("turbo:submit-start", this.#onSubmitStart);
-    this.element.removeEventListener("turbo:submit-end", this.#onSubmitEnd);
+    this.#listeners.dispose();
     this.#gate.disconnected(this, () => {
       this.#pending = null;
     });
@@ -165,7 +202,7 @@ var OptimisticController = class extends Controller {
    * received.
    */
   #revert() {
-    this.element.removeAttribute("data-optimistic");
+    TRANSIENT.reset(this.element);
     this.#restore(this.element, "aria-busy", BUSY_MARKER, "true");
     const hidden = new Set(this.hideTargets);
     for (const target of /* @__PURE__ */ new Set([...this.showTargets, ...this.hideTargets])) {