stimeo-ui 0.1.0.pre.beta.3 → 0.2.0

data/dist/controllers/otp_controller.js

@@ -1,5 +1,54 @@
 import { Controller } from '@hotwired/stimulus';
 
+// src/controllers/otp_controller.ts
+
+// src/utils/composition_tracker.ts
+var CompositionTracker = class {
+  #observedTargets = /* @__PURE__ */ new Set();
+  #activeTargets = /* @__PURE__ */ new Set();
+  #onStart;
+  #onEnd;
+  constructor(options = {}) {
+    this.#onStart = options.onStart;
+    this.#onEnd = options.onEnd;
+  }
+  /** Starts lifecycle tracking for `target`; repeated calls are idempotent. */
+  observe(target) {
+    if (this.#observedTargets.has(target)) return;
+    target.addEventListener("compositionstart", this.#handleStart);
+    target.addEventListener("compositionend", this.#handleEnd);
+    this.#observedTargets.add(target);
+  }
+  /** Stops tracking one target and clears any active composition it owned. */
+  unobserve(target) {
+    if (!this.#observedTargets.delete(target)) return;
+    target.removeEventListener("compositionstart", this.#handleStart);
+    target.removeEventListener("compositionend", this.#handleEnd);
+    this.#activeTargets.delete(target);
+  }
+  /** 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);
+    }
+    this.#observedTargets.clear();
+    this.#activeTargets.clear();
+  }
+  /** True when lifecycle tracking or the current event reports composition. */
+  isComposing(event) {
+    return this.#activeTargets.size > 0 || event?.isComposing === true;
+  }
+  #handleStart = (event) => {
+    if (event.currentTarget) this.#activeTargets.add(event.currentTarget);
+    this.#onStart?.(event);
+  };
+  #handleEnd = (event) => {
+    if (event.currentTarget) this.#activeTargets.delete(event.currentTarget);
+    this.#onEnd?.(event);
+  };
+};
+
 // src/controllers/otp_controller.ts
 var OtpController = class extends Controller {
   static targets = ["field", "value", "error"];
@@ -9,21 +58,24 @@ var OtpController = class extends Controller {
   };
   static actions = ["onInput", "onKeydown", "onPaste"];
   static events = ["change", "complete", "invalid"];
-  #isComposing = /* @__PURE__ */ new Map();
+  /** Owns IME lifecycle state across every digit field. */
+  #composition = new CompositionTracker({
+    onEnd: (event) => {
+      const input = event.currentTarget;
+      if (input) this.#handleInputValidation(input);
+    }
+  });
   connect() {
     for (const field of this.fieldTargets) {
       field.addEventListener("focus", this.#onFieldFocus);
-      field.addEventListener("compositionstart", this.#onCompositionStart);
-      field.addEventListener("compositionend", this.#onCompositionEnd);
+      this.#composition.observe(field);
     }
   }
   disconnect() {
     for (const field of this.fieldTargets) {
       field.removeEventListener("focus", this.#onFieldFocus);
-      field.removeEventListener("compositionstart", this.#onCompositionStart);
-      field.removeEventListener("compositionend", this.#onCompositionEnd);
     }
-    this.#isComposing.clear();
+    this.#composition.disconnect();
   }
   /**
    * Stimulus lifecycle callback when a new field target enters the DOM.
@@ -31,21 +83,18 @@ var OtpController = class extends Controller {
    */
   fieldTargetConnected(element) {
     element.addEventListener("focus", this.#onFieldFocus);
-    element.addEventListener("compositionstart", this.#onCompositionStart);
-    element.addEventListener("compositionend", this.#onCompositionEnd);
+    this.#composition.observe(element);
   }
   /** Removes focus listeners when fields are dropped. */
   fieldTargetDisconnected(element) {
     element.removeEventListener("focus", this.#onFieldFocus);
-    element.removeEventListener("compositionstart", this.#onCompositionStart);
-    element.removeEventListener("compositionend", this.#onCompositionEnd);
-    this.#isComposing.delete(element);
+    this.#composition.unobserve(element);
   }
   /** Handles keystroke inputs and advances focus to the next field. */
   onInput(event) {
     const input = event.currentTarget;
     if (!input) return;
-    if (this.#isComposing.get(input)) return;
+    if (this.#composition.isComposing(event)) return;
     this.#handleInputValidation(input);
   }
   /** Handles Backspace retreating, arrows, and home/end navigation. */
@@ -54,7 +103,7 @@ var OtpController = class extends Controller {
     if (!input) return;
     const index = this.fieldTargets.indexOf(input);
     if (index === -1) return;
-    if (this.#isComposing.get(input)) return;
+    if (this.#composition.isComposing(event)) return;
     switch (event.key) {
       case "Backspace":
         if (!input.value) {
@@ -136,15 +185,6 @@ var OtpController = class extends Controller {
       input.select();
     }
   };
-  #onCompositionStart = (event) => {
-    const input = event.currentTarget;
-    this.#isComposing.set(input, true);
-  };
-  #onCompositionEnd = (event) => {
-    const input = event.currentTarget;
-    this.#isComposing.set(input, false);
-    this.#handleInputValidation(input);
-  };
   #handleInputValidation(input) {
     const index = this.fieldTargets.indexOf(input);
     if (index === -1) return;

data/dist/controllers/pointer_drag_controller.js

@@ -187,6 +187,7 @@ var PointerDragController = class _PointerDragController extends Controller {
     const handle = this.#handleFor(event.target);
     if (!handle) return;
     if (event.key === "Escape") {
+      if (event.defaultPrevented || event.isComposing) return;
       if (this.#pointer?.started) {
         const { pointerType } = this.#pointer;
         this.#teardownSessions();
@@ -299,9 +300,8 @@ var PointerDragController = class _PointerDragController extends Controller {
   }
   /**
    * Silently tears down whatever session is live (disconnect / disabled /
-   * Escape). Composed from the two single-session teardowns so a cleanup step
-   * added to one path can never be missed on the other (the bug-shape behind
-   * the capture-release fix).
+   * Escape). Composed from the two single-session teardowns so pointer and
+   * keyboard cleanup cannot diverge as either path evolves.
    */
   #teardownSessions() {
     this.#endPointerSession();

data/dist/controllers/popover_controller.js

@@ -2,6 +2,96 @@ import { Controller } from '@hotwired/stimulus';
 
 // src/controllers/popover_controller.ts
 
+// src/utils/escape_layer.ts
+function claimsWhileFocusWithin(element) {
+  return () => {
+    const active = element.ownerDocument.activeElement;
+    return active === null || active === element.ownerDocument.body || element.contains(active);
+  };
+}
+var EscapeLayer = class _EscapeLayer {
+  static #registries = /* @__PURE__ */ new WeakMap();
+  #ownerDocument = null;
+  /** Dismissal callback while active; `null` when inactive. */
+  #onDismiss = null;
+  /** Live predicate deciding whether the layer claims a press; `null` = always. */
+  #claims = null;
+  /**
+   * Activates this layer at the top of its document's Escape stack, installing
+   * the document's shared resolver listener if this is its first layer.
+   * Re-activating an already-active layer moves it to the top.
+   */
+  activate(ownerDocument = document, options) {
+    this.deactivate();
+    let registry = _EscapeLayer.#registries.get(ownerDocument);
+    if (!registry) {
+      registry = _EscapeLayer.#createRegistry();
+      _EscapeLayer.#registries.set(ownerDocument, registry);
+      ownerDocument.addEventListener("keydown", registry.onKeydown);
+    }
+    registry.stack.push(this);
+    this.#ownerDocument = ownerDocument;
+    this.#onDismiss = options.onDismiss;
+    this.#claims = options.claims ?? null;
+  }
+  /**
+   * Removes this layer from its document's Escape stack, uninstalling the
+   * shared listener when the stack empties. Safe to call when inactive.
+   */
+  deactivate() {
+    const ownerDocument = this.#ownerDocument;
+    if (!ownerDocument) return;
+    const registry = _EscapeLayer.#registries.get(ownerDocument);
+    if (registry) {
+      const index = registry.stack.lastIndexOf(this);
+      if (index >= 0) registry.stack.splice(index, 1);
+      if (registry.stack.length === 0) {
+        ownerDocument.removeEventListener("keydown", registry.onKeydown);
+        _EscapeLayer.#registries.delete(ownerDocument);
+      }
+    }
+    this.#ownerDocument = null;
+    this.#onDismiss = null;
+    this.#claims = null;
+  }
+  /**
+   * Whether this active layer would own a press right now: it is the topmost
+   * layer whose {@link EscapeLayerOptions.claims} passes. Exposed for tests
+   * and diagnostics — production dismissal goes through the shared listener.
+   */
+  get ownsEscape() {
+    const ownerDocument = this.#ownerDocument;
+    if (!ownerDocument) return false;
+    const registry = _EscapeLayer.#registries.get(ownerDocument);
+    if (!registry) return false;
+    return _EscapeLayer.#resolveOwner(registry.stack) === this;
+  }
+  /** Builds a document's registry with its shared resolver listener. */
+  static #createRegistry() {
+    const registry = {
+      stack: [],
+      onKeydown: (event) => {
+        if (event.key !== "Escape" || event.defaultPrevented || event.isComposing) return;
+        const owner = _EscapeLayer.#resolveOwner(registry.stack);
+        if (!owner) return;
+        event.preventDefault();
+        owner.#onDismiss?.();
+      }
+    };
+    return registry;
+  }
+  /** The topmost stack layer whose claims predicate passes, or `null`. */
+  static #resolveOwner(stack) {
+    for (let index = stack.length - 1; index >= 0; index--) {
+      const layer = stack[index];
+      if (!layer) continue;
+      if (layer.#claims && !layer.#claims()) continue;
+      return layer;
+    }
+    return null;
+  }
+};
+
 // src/utils/scroll_dismiss.ts
 function observeScrollDismiss(element, onScroll) {
   const targets = [...scrollParents(element), window];
@@ -36,24 +126,26 @@ var PopoverController = class _PopoverController extends Controller {
   static actions = ["close", "open", "toggle"];
   /** Cleanup for the dismiss-on-scroll listeners while open, or `null`. */
   #stopScrollDismiss = null;
+  /** Escape-stack membership while open; the shared resolver dismisses via it. */
+  #escapeLayer = new EscapeLayer();
   /** Selector for natively focusable elements used to find the first one. */
   static #FOCUSABLE = 'a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
-  /** Starts closed and registers the document-level dismissal listeners. */
+  /** Starts closed and registers the standing dismissal listeners. */
   connect() {
     this.close();
     document.addEventListener("click", this.#onOutsideClick);
-    document.addEventListener("keydown", this.#onKeydown);
+    this.element.addEventListener("focusout", this.#onFocusOut);
   }
   /**
-   * Removes the document-level listeners registered in {@link connect}, plus the
-   * panel's `focusout` listener if the popover is torn down while open (e.g. a
-   * Turbo navigation). `removeEventListener` is a no-op when it was never added,
-   * so this is safe in the closed state too — no listener outlives the element.
+   * Removes every standing listener registered in {@link connect} plus any active
+   * dismiss-on-scroll observers. `removeEventListener` is a no-op when it was
+   * never added, so this is safe in the closed state too — no listener outlives
+   * the element after a Turbo navigation.
    */
   disconnect() {
+    this.#escapeLayer.deactivate();
     document.removeEventListener("click", this.#onOutsideClick);
-    document.removeEventListener("keydown", this.#onKeydown);
-    if (this.hasPanelTarget) this.panelTarget.removeEventListener("focusout", this.#onFocusOut);
+    this.element.removeEventListener("focusout", this.#onFocusOut);
     this.#stopScrollDismiss?.();
     this.#stopScrollDismiss = null;
   }
@@ -70,7 +162,10 @@ var PopoverController = class _PopoverController extends Controller {
     if (!this.hasPanelTarget || this.#isOpen) return;
     this.panelTarget.hidden = false;
     if (this.hasTriggerTarget) this.triggerTarget.setAttribute("aria-expanded", "true");
-    this.panelTarget.addEventListener("focusout", this.#onFocusOut);
+    this.#escapeLayer.activate(document, {
+      onDismiss: () => this.#closeAndRestore(),
+      claims: claimsWhileFocusWithin(this.element)
+    });
     if (this.closeOnScrollValue && !this.#stopScrollDismiss) {
       this.#stopScrollDismiss = observeScrollDismiss(this.element, () => this.close());
     }
@@ -78,11 +173,10 @@ var PopoverController = class _PopoverController extends Controller {
   }
   /** Closes the panel and reflects the collapsed state. Bound via `data-action`. */
   close() {
-    if (!this.hasPanelTarget) return;
-    this.panelTarget.removeEventListener("focusout", this.#onFocusOut);
+    this.#escapeLayer.deactivate();
     this.#stopScrollDismiss?.();
     this.#stopScrollDismiss = null;
-    this.panelTarget.hidden = true;
+    if (this.hasPanelTarget) this.panelTarget.hidden = true;
     if (this.hasTriggerTarget) this.triggerTarget.setAttribute("aria-expanded", "false");
   }
   /** Moves focus to the first focusable element in the panel, or the panel itself. */
@@ -95,31 +189,28 @@ var PopoverController = class _PopoverController extends Controller {
     if (!this.panelTarget.hasAttribute("tabindex")) this.panelTarget.tabIndex = -1;
     this.panelTarget.focus();
   }
-  /** Closes and restores focus to the trigger (shared by Escape / outside click). */
+  /** Closes and restores focus to the trigger for explicit keyboard dismissal. */
   #closeAndRestore() {
     this.close();
     if (this.hasTriggerTarget) this.triggerTarget.focus();
   }
-  /** Closes (restoring focus) when a click lands outside the controller element. */
+  /** Closes without moving focus when a click lands outside the controller element. */
   #onOutsideClick = (event) => {
-    if (this.#isOpen && !this.element.contains(event.target)) this.#closeAndRestore();
-  };
-  /** Closes (restoring focus) on `Escape` while open. */
-  #onKeydown = (event) => {
-    if (event.key === "Escape" && this.#isOpen) {
-      event.preventDefault();
-      this.#closeAndRestore();
-    }
+    const target = event.target;
+    if (this.#isOpen && target instanceof Node && !this.element.contains(target)) this.close();
   };
   /**
-   * Closes when focus leaves the panel for an element outside the controller
-   * (e.g. `Tab` past the last field). Focus is *not* restored — the natural
-   * destination is kept, which is the modeless contract. Moves within the
-   * controller (panel → trigger) keep it open.
+   * Closes when focus leaves the controller for a known external destination
+   * (e.g. forward Tab past the panel or reverse Tab past the trigger). Focus is
+   * not restored — the natural destination is kept, which is the modeless
+   * contract. A null/non-Node destination is indeterminate: browsers use it for
+   * clicks on non-focusable content and window deactivation, so the later outside
+   * click handler decides pointer dismissal instead.
    */
   #onFocusOut = (event) => {
+    if (!this.#isOpen) return;
     const next = event.relatedTarget;
-    if (next && this.element.contains(next)) return;
+    if (!(next instanceof Node) || this.element.contains(next)) return;
     this.close();
   };
   /** Whether the panel is currently visible. */

data/dist/controllers/toast_controller.js

@@ -56,6 +56,7 @@ var SafeTimeout = class extends TimerRegistry {
 };
 
 // src/controllers/toast_controller.ts
+var DELEGATED_EVENTS = ["click", "focusin", "focusout", "keydown", "mouseover", "mouseout"];
 var ToastController = class extends Controller {
   static targets = ["list", "template", "item"];
   static values = {
@@ -76,34 +77,57 @@ var ToastController = class extends Controller {
    * Tracked so {@link disconnect} can cancel any that have not fired, preventing a
    * detached element from being mutated after it leaves the DOM (Turbo).
    */
-  #rafHandles = /* @__PURE__ */ new Set();
+  #rafHandles = /* @__PURE__ */ new Map();
   /** Track active timeouts mapped by each toast element for safe cancellation. */
   #activeTimeouts = /* @__PURE__ */ new Map();
   /** Track active pause reasons (hover/focus) per toast for WCAG 2.2.1 pause/resume. */
   #pauseReasons = /* @__PURE__ */ new Map();
+  /** The stable list that owns delegated listeners for dynamically added items. */
+  #delegatedList = null;
   connect() {
+    this.#connectDelegatedEvents();
     this.enforceMaxLimit();
     for (const item of this.itemTargets) {
-      if (!this.#activeTimeouts.has(item)) {
+      if (!this.#activeTimeouts.has(item) && item.dataset.state !== "leaving") {
         this.#startTimer(item);
       }
     }
   }
   disconnect() {
+    this.#disconnectDelegatedEvents();
     this.#timers.clearAll();
-    for (const handle of this.#rafHandles) {
+    for (const handle of this.#rafHandles.values()) {
       window.cancelAnimationFrame(handle);
     }
     this.#rafHandles.clear();
     this.#activeTimeouts.clear();
     this.#pauseReasons.clear();
   }
+  /** Rebinds delegated interaction when Turbo replaces the list target in place. */
+  listTargetConnected(element) {
+    if (this.#delegatedList !== element) this.#connectDelegatedEvents(element);
+  }
+  /** Releases delegation only when the removed target is its current owner. */
+  listTargetDisconnected(element) {
+    if (this.#delegatedList === element) this.#disconnectDelegatedEvents();
+  }
   durationValueChanged() {
-    if (this.durationValue > 0) {
-      for (const item of this.itemTargets) {
-        if (!this.#activeTimeouts.has(item)) {
-          this.#startTimer(item);
-        }
+    for (const item of this.itemTargets) {
+      if (item.dataset.state === "leaving") continue;
+      const pauseReasons = this.#pauseReasons.get(item);
+      this.#clearTimer(item);
+      if (this.durationValue <= 0) {
+        item.removeAttribute("data-paused");
+      } else if (pauseReasons && pauseReasons.size > 0) {
+        this.#pauseReasons.set(item, pauseReasons);
+        this.#activeTimeouts.set(item, {
+          id: 0,
+          startedAt: 0,
+          remaining: this.durationValue
+        });
+        item.setAttribute("data-paused", "true");
+      } else {
+        this.#startTimer(item);
       }
     }
   }
@@ -117,17 +141,21 @@ var ToastController = class extends Controller {
    */
   itemTargetConnected(element) {
     this.enforceMaxLimit();
+    if (element.dataset.state === "leaving" || element.parentNode !== this.listTarget) return;
     this.#startTimer(element);
     element.setAttribute("data-state", "entering");
+    this.#cancelAnimation(element);
     const handle = window.requestAnimationFrame(() => {
-      this.#rafHandles.delete(handle);
+      this.#rafHandles.delete(element);
+      if (element.parentNode !== this.listTarget || element.dataset.state === "leaving") return;
       element.setAttribute("data-state", "visible");
     });
-    this.#rafHandles.add(handle);
+    this.#rafHandles.set(element, handle);
   }
   /** Clears any active timer when a toast is removed from the DOM. */
   itemTargetDisconnected(element) {
     this.#clearTimer(element);
+    this.#cancelAnimation(element);
   }
   /**
    * Shows a new toast. Accepts its content from either a Stimulus action param
@@ -150,10 +178,9 @@ var ToastController = class extends Controller {
     const item = clone.querySelector("[data-stimeo--toast-target='item']");
     if (!item) return;
     const bodySlot = item.querySelector("[data-toast-slot='body']");
-    if (bodySlot) {
-      bodySlot.textContent = body;
-    }
-    item.setAttribute("role", this.#readField(event, "type") === "alert" ? "alert" : "status");
+    if (!bodySlot) return;
+    bodySlot.textContent = body;
+    bodySlot.setAttribute("role", this.#readField(event, "type") === "alert" ? "alert" : "status");
     this.listTarget.appendChild(item);
     this.dispatch("show", { detail: { item } });
   }
@@ -175,18 +202,15 @@ var ToastController = class extends Controller {
   }
   /** Dismisses the toast that contained the trigger. */
   dismiss(event) {
-    const target = event.currentTarget || event.target;
-    if (!target) return;
-    const item = target.closest("[data-stimeo--toast-target='item']");
+    const item = this.#itemFromEvent(event);
     if (!item) return;
     this.#removeWithTransition(item, "user");
   }
   /** Dismisses the focused toast when Escape is pressed. */
   onKeydown(event) {
     if (event.key === "Escape") {
-      const target = event.currentTarget || event.target;
-      if (!target) return;
-      const item = target.closest("[data-stimeo--toast-target='item']");
+      if (event.defaultPrevented || event.isComposing) return;
+      const item = this.#itemFromEvent(event);
       if (!item) return;
       event.preventDefault();
       this.#removeWithTransition(item, "user");
@@ -212,6 +236,10 @@ var ToastController = class extends Controller {
     this.#timers.clear(timeout.id);
     const elapsed = Date.now() - timeout.startedAt;
     const remaining = Math.max(0, timeout.remaining - elapsed);
+    if (remaining <= 0) {
+      this.#removeWithTransition(item, "timeout");
+      return;
+    }
     this.#activeTimeouts.set(item, { id: 0, startedAt: 0, remaining });
     item.setAttribute("data-paused", "true");
   }
@@ -223,14 +251,17 @@ var ToastController = class extends Controller {
     reasons.delete(this.#pauseReason(event));
     if (reasons.size > 0) return;
     const timeout = this.#activeTimeouts.get(item);
-    if (!timeout || timeout.remaining <= 0) return;
+    if (!timeout) return;
+    if (timeout.id !== 0 || timeout.remaining <= 0) return;
     item.removeAttribute("data-paused");
     this.#startTimer(item, timeout.remaining);
   }
   /** Resolves the toast item element a pause/resume event targets. */
   #itemFromEvent(event) {
-    const target = event.currentTarget || event.target;
-    return target?.closest("[data-stimeo--toast-target='item']") ?? null;
+    const target = event.target instanceof Element ? event.target : event.currentTarget;
+    if (!(target instanceof Element) || !this.hasListTarget) return null;
+    const item = target.closest("[data-stimeo--toast-target='item']");
+    return item && this.listTarget.contains(item) ? item : null;
   }
   /** Classifies a pause/resume event as a hover or focus reason. */
   #pauseReason(event) {
@@ -246,7 +277,9 @@ var ToastController = class extends Controller {
     return reasons;
   }
   #startTimer(element, duration = this.durationValue) {
-    if (duration <= 0) return;
+    if (duration <= 0 || element.dataset.state === "leaving" || element.parentNode !== this.listTarget) {
+      return;
+    }
     this.#clearTimer(element);
     const id = this.#timers.set(() => {
       this.#removeWithTransition(element, "timeout");
@@ -262,12 +295,13 @@ var ToastController = class extends Controller {
     this.#pauseReasons.delete(element);
   }
   #removeWithTransition(element, reason) {
+    if (element.dataset.state === "leaving" || element.parentNode !== this.listTarget) return;
     this.#clearTimer(element);
+    this.#cancelAnimation(element);
     element.setAttribute("data-state", "leaving");
     const finalize = () => {
-      if (element.parentNode === this.listTarget) {
-        this.listTarget.removeChild(element);
-      }
+      if (element.parentNode !== this.listTarget) return;
+      this.listTarget.removeChild(element);
       this.dispatch("dismiss", { detail: { item: element, reason } });
     };
     const transitions = window.getComputedStyle(element).transitionDuration;
@@ -289,14 +323,59 @@ var ToastController = class extends Controller {
    */
   enforceMaxLimit() {
     const currentItems = this.itemTargets;
-    if (currentItems.length > this.maxValue) {
-      const excessCount = currentItems.length - this.maxValue;
+    const max = Math.max(0, this.maxValue);
+    if (currentItems.length > max) {
+      const excessCount = currentItems.length - max;
       for (let i = 0; i < excessCount; i++) {
         const oldest = currentItems[i];
         if (oldest) this.#removeWithTransition(oldest, "timeout");
       }
     }
   }
+  /** Wires stable-container delegation so newly appended items work immediately. */
+  #connectDelegatedEvents(list = this.hasListTarget ? this.listTarget : null) {
+    this.#disconnectDelegatedEvents();
+    if (!list) return;
+    this.#delegatedList = list;
+    for (const type of DELEGATED_EVENTS) {
+      this.#delegatedList.addEventListener(type, this.#onListEvent);
+    }
+  }
+  /** Releases every delegated listener from the exact list that owns it. */
+  #disconnectDelegatedEvents() {
+    if (!this.#delegatedList) return;
+    for (const type of DELEGATED_EVENTS) {
+      this.#delegatedList.removeEventListener(type, this.#onListEvent);
+    }
+    this.#delegatedList = null;
+  }
+  /** Routes every delegated item interaction from the stable list. */
+  #onListEvent = (event) => {
+    if (event.type === "click") {
+      const target = event.target instanceof Element ? event.target : null;
+      const trigger = target?.closest("[data-toast-dismiss]");
+      if (trigger && this.#delegatedList?.contains(trigger)) this.dismiss(event);
+    } else if (event.type === "keydown") {
+      this.onKeydown(event);
+    } else if (this.#crossesItemBoundary(event)) {
+      if (event.type === "focusin" || event.type === "mouseover") this.pause(event);
+      else this.resume(event);
+    }
+  };
+  /** Whether a bubbling focus/pointer event enters or leaves a toast boundary. */
+  #crossesItemBoundary(event) {
+    const item = this.#itemFromEvent(event);
+    if (!item) return false;
+    const related = "relatedTarget" in event ? event.relatedTarget : null;
+    return !(related instanceof Node && item.contains(related));
+  }
+  /** Cancels the pending entering-to-visible frame owned by one item. */
+  #cancelAnimation(element) {
+    const handle = this.#rafHandles.get(element);
+    if (handle === void 0) return;
+    window.cancelAnimationFrame(handle);
+    this.#rafHandles.delete(element);
+  }
 };
 function cssTimeToMs(value) {
   const first = value.split(",")[0]?.trim() ?? "";