stimeo-ui 0.13.0 → 0.15.0

data/dist/controllers/masonry_controller.js

@@ -8,10 +8,15 @@ var LayoutObserver = class {
   #resizeObserverFactory;
   #resizeObserver = null;
   #observingViewport = false;
+  #loadContainer = null;
   /** Stable bound handler so add/removeEventListener target the same reference. */
   #handleViewportResize = () => {
     this.#callback();
   };
+  /** Stable bound handler for the capture-phase `load`; see {@link observeDescendantLoads}. */
+  #handleDescendantLoad = () => {
+    this.#callback();
+  };
   constructor(callback, options = {}) {
     this.#callback = callback;
     this.#resizeObserverFactory = options.resizeObserverFactory ?? (typeof ResizeObserver === "undefined" ? null : (cb) => new ResizeObserver(cb));
@@ -47,14 +52,35 @@ var LayoutObserver = class {
     window.removeEventListener("resize", this.#handleViewportResize);
   }
   /**
-   * Releases every observation: disconnects the {@link ResizeObserver} and
-   * removes the viewport listener. Safe to call multiple times. Call this from a
-   * controller's `disconnect()`.
+   * Starts reporting a `load` from anywhere inside `container` — an image or a
+   * frame settling changes the box it sits in, and it measures as zero high until
+   * then. `load` does not bubble, so the subscription is a capture-phase listener
+   * on the container itself and nothing the caller spells.
+   *
+   * **One container at a time.** A further call moves the observation, so a widget
+   * whose content element is swapped at runtime releases the element it let go by
+   * naming the new one — there is no second place for the release to drift from.
+   */
+  observeDescendantLoads(container) {
+    this.unobserveDescendantLoads();
+    this.#loadContainer = container;
+    container.addEventListener("load", this.#handleDescendantLoad, true);
+  }
+  /** Stops reporting descendant loads without affecting element or viewport observation. */
+  unobserveDescendantLoads() {
+    this.#loadContainer?.removeEventListener("load", this.#handleDescendantLoad, true);
+    this.#loadContainer = null;
+  }
+  /**
+   * Releases every observation: disconnects the {@link ResizeObserver} and removes
+   * the viewport and descendant-load listeners. Safe to call multiple times. Call
+   * this from a controller's `disconnect()`.
    */
   disconnect() {
     this.#resizeObserver?.disconnect();
     this.#resizeObserver = null;
     this.unobserveViewport();
+    this.unobserveDescendantLoads();
   }
 };
 
@@ -127,13 +153,6 @@ var MasonryController = class extends Controller {
   #mutationObserver = null;
   /** Last published column count, so `layout` fires only on real changes. */
   #lastColumns = 0;
-  /**
-   * Re-pack when a descendant resource finishes loading. Images/iframes report a
-   * height of 0 until loaded, which would skew the shortest-column packing if the
-   * first pass ran before they settled; `load` does not bubble, so this is bound in
-   * the capture phase to catch every descendant.
-   */
-  #onLoad = () => this.#reconcile.schedule();
   /** Resolves the declared column width once, falling back when it is unreadable. */
   minColumnWidthValueChanged() {
     this.#minColumnWidth = usableNumber(this.minColumnWidthValue, DEFAULT_MIN_COLUMN_WIDTH);
@@ -153,7 +172,7 @@ var MasonryController = class extends Controller {
    *
    * The removal is queued rather than immediate because teardown reports every
    * target as disconnected: doing it here would strip the whole grid just before
-   * a Turbo snapshot is taken. {@link MicrotaskCoalescer.cancel} drops the queue
+   * a Turbo snapshot is taken. The coalescer's `cancel` drops the queue
    * with the pass, so only a genuine target change reaches it.
    */
   itemTargetDisconnected(item) {
@@ -168,18 +187,17 @@ var MasonryController = class extends Controller {
       this.#mutationObserver = new MutationObserver(() => this.#reconcile.schedule());
       this.#mutationObserver.observe(this.element, { childList: true, subtree: true });
     }
-    this.element.addEventListener("load", this.#onLoad, true);
+    this.#layout.observeDescendantLoads(this.element);
     this.#relayout();
     this.#reconcile.activate();
   }
-  /** Releases both observers and the load listener so nothing fires after detach. */
+  /** Releases every observation so nothing fires after detach. */
   disconnect() {
     this.#reconcile.cancel();
     this.#released.clear();
     this.#layout.disconnect();
     this.#mutationObserver?.disconnect();
     this.#mutationObserver = null;
-    this.element.removeEventListener("load", this.#onLoad, true);
     this.#lastColumns = 0;
   }
   /**

data/dist/controllers/menu_controller.js

@@ -98,6 +98,15 @@ var EscapeLayer = class _EscapeLayer {
   }
 };
 
+// src/utils/event_owner.ts
+function ownerIndex(candidates, node) {
+  if (!(node instanceof Node)) return -1;
+  return candidates.findIndex((candidate) => candidate.contains(node));
+}
+function ownerOf(candidates, node) {
+  return candidates[ownerIndex(candidates, node)] ?? null;
+}
+
 // src/utils/safe_timeout.ts
 var TimerRegistry = class {
   /** Live timer ids that have not yet been cleared (or, for timeouts, fired). */
@@ -338,8 +347,7 @@ var MenuController = class extends Controller {
   };
   /** The item target that is, or contains, `node`; `null` when it is neither. */
   #itemFrom(node) {
-    if (!(node instanceof Node)) return null;
-    return this.itemTargets.find((item) => item === node || item.contains(node)) ?? null;
+    return ownerOf(this.itemTargets, node);
   }
   /**
    * First look at every click inside the controller, and the only point at which

data/dist/controllers/menubar_controller.js

@@ -103,6 +103,15 @@ var EscapeLayer = class _EscapeLayer {
   }
 };
 
+// src/utils/event_owner.ts
+function ownerIndex(candidates, node) {
+  if (!(node instanceof Node)) return -1;
+  return candidates.findIndex((candidate) => candidate.contains(node));
+}
+function ownerOf(candidates, node) {
+  return candidates[ownerIndex(candidates, node)] ?? null;
+}
+
 // src/utils/roving_tabindex.ts
 var RovingTabindex = class {
   /** Returns the current ordered item elements; called on every operation. */
@@ -577,8 +586,7 @@ var MenubarController = class extends Controller {
    * menu without moving focus.
    */
   #dismissOpenMenu() {
-    const active = document.activeElement;
-    const menu = this.menuTargets.find((candidate) => candidate.contains(active));
+    const menu = ownerOf(this.menuTargets, document.activeElement);
     if (menu) {
       const top = this.#topFor(menu);
       this.#closeMenu(top);

data/dist/controllers/navigation_menu_controller.js

@@ -103,6 +103,12 @@ var EscapeLayer = class _EscapeLayer {
   }
 };
 
+// src/utils/event_owner.ts
+function ownerIndex(candidates, node) {
+  if (!(node instanceof Node)) return -1;
+  return candidates.findIndex((candidate) => candidate.contains(node));
+}
+
 // src/utils/safe_timeout.ts
 var TimerRegistry = class {
   /** Live timer ids that have not yet been cleared (or, for timeouts, fired). */
@@ -395,7 +401,7 @@ var NavigationMenuController = class extends Controller {
    */
   #onPointerLeave = (event) => {
     const next = event instanceof MouseEvent ? event.relatedTarget : null;
-    if (next instanceof Node && this.#hoverElements.some((el) => el.contains(next))) return;
+    if (ownerIndex(this.#hoverElements, next) !== -1) return;
     this.#hoveredTrigger = null;
     this.#hoverTimers.clearAll();
     this.#hoverTimers.set(() => this.#closeFromHover(), this.hoverDelayValue);
@@ -465,7 +471,7 @@ var NavigationMenuController = class extends Controller {
    */
   get #hoverElements() {
     const areas = this.hoverAreaTargets;
-    const covered = (element) => areas.some((area) => area.contains(element));
+    const covered = (element) => ownerIndex(areas, element) !== -1;
     return [
       ...areas,
       ...this.triggerTargets.filter((trigger) => !covered(trigger)),

data/dist/controllers/optimistic_controller.js

@@ -57,6 +57,30 @@ 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/controllers/optimistic_controller.ts
 var HIDDEN_MARKER = "data-optimistic-toggled";
 var BUSY_MARKER = "data-optimistic-busy";
@@ -73,6 +97,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 +105,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;
     });

data/dist/controllers/otp_controller.js

@@ -152,6 +152,25 @@ var CompositionTracker = class {
   };
 };
 
+// src/utils/declared_value.ts
+function parseDeclared(raw, parse, fallback) {
+  try {
+    return parse(raw);
+  } catch {
+    return fallback;
+  }
+}
+function compileRegExp(source, anchor = "none") {
+  return parseDeclared(
+    source,
+    (text) => {
+      const bare = new RegExp(text);
+      return anchor === "exact" ? new RegExp(`^(?:${text})$`) : bare;
+    },
+    null
+  );
+}
+
 // src/utils/half_width.ts
 var FULL_WIDTH_SHIFT = 65248;
 function halfWidthChar(char) {
@@ -201,13 +220,7 @@ var MicrotaskCoalescer = class {
 
 // src/controllers/otp_controller.ts
 var DEFAULT_PATTERN = "[0-9]";
-function compilePattern(source) {
-  try {
-    return new RegExp(`^${source}$`);
-  } catch {
-    return null;
-  }
-}
+var DEFAULT_MATCHER = new RegExp(`^(?:${DEFAULT_PATTERN})$`);
 function hasModifier(event) {
   return event.altKey || event.ctrlKey || event.metaKey || event.shiftKey;
 }
@@ -222,7 +235,7 @@ var OtpController = class extends Controller {
   static actions = ["onInput", "onKeydown", "onPaste", "onPointerDown", "clear"];
   static events = ["change", "complete", "invalid", "reconcile"];
   /** Validated matcher; the hot path never compiles a raw declaration. */
-  #pattern = new RegExp(`^${DEFAULT_PATTERN}$`);
+  #pattern = DEFAULT_MATCHER;
   /** Source of {@link #pattern}, reported in `invalid` so consumers can word it. */
   #patternSource = DEFAULT_PATTERN;
   /** Public state carried by the last dispatch; keeps a no-op sync silent. */
@@ -295,9 +308,9 @@ var OtpController = class extends Controller {
    * the new pattern no longer accepts, so the combined value stays interpretable.
    */
   patternValueChanged() {
-    const compiled = compilePattern(this.patternValue);
+    const compiled = compileRegExp(this.patternValue, "exact");
     this.#patternSource = compiled ? this.patternValue : DEFAULT_PATTERN;
-    this.#pattern = compiled ?? new RegExp(`^${DEFAULT_PATTERN}$`);
+    this.#pattern = compiled ?? DEFAULT_MATCHER;
     if (!this.#connected) return;
     let dropped = false;
     for (const field of this.fieldTargets) {

data/dist/controllers/overflow_indicator_controller.js

@@ -63,10 +63,15 @@ var LayoutObserver = class {
   #resizeObserverFactory;
   #resizeObserver = null;
   #observingViewport = false;
+  #loadContainer = null;
   /** Stable bound handler so add/removeEventListener target the same reference. */
   #handleViewportResize = () => {
     this.#callback();
   };
+  /** Stable bound handler for the capture-phase `load`; see {@link observeDescendantLoads}. */
+  #handleDescendantLoad = () => {
+    this.#callback();
+  };
   constructor(callback, options = {}) {
     this.#callback = callback;
     this.#resizeObserverFactory = options.resizeObserverFactory ?? (typeof ResizeObserver === "undefined" ? null : (cb) => new ResizeObserver(cb));
@@ -102,14 +107,35 @@ var LayoutObserver = class {
     window.removeEventListener("resize", this.#handleViewportResize);
   }
   /**
-   * Releases every observation: disconnects the {@link ResizeObserver} and
-   * removes the viewport listener. Safe to call multiple times. Call this from a
-   * controller's `disconnect()`.
+   * Starts reporting a `load` from anywhere inside `container` — an image or a
+   * frame settling changes the box it sits in, and it measures as zero high until
+   * then. `load` does not bubble, so the subscription is a capture-phase listener
+   * on the container itself and nothing the caller spells.
+   *
+   * **One container at a time.** A further call moves the observation, so a widget
+   * whose content element is swapped at runtime releases the element it let go by
+   * naming the new one — there is no second place for the release to drift from.
+   */
+  observeDescendantLoads(container) {
+    this.unobserveDescendantLoads();
+    this.#loadContainer = container;
+    container.addEventListener("load", this.#handleDescendantLoad, true);
+  }
+  /** Stops reporting descendant loads without affecting element or viewport observation. */
+  unobserveDescendantLoads() {
+    this.#loadContainer?.removeEventListener("load", this.#handleDescendantLoad, true);
+    this.#loadContainer = null;
+  }
+  /**
+   * Releases every observation: disconnects the {@link ResizeObserver} and removes
+   * the viewport and descendant-load listeners. Safe to call multiple times. Call
+   * this from a controller's `disconnect()`.
    */
   disconnect() {
     this.#resizeObserver?.disconnect();
     this.#resizeObserver = null;
     this.unobserveViewport();
+    this.unobserveDescendantLoads();
   }
 };
 
@@ -324,7 +350,7 @@ var OverflowIndicatorController = class extends Controller {
     this.#observedViewport = next;
     this.#layout.observe(next);
     this.#layout.observeViewport();
-    next.addEventListener("load", this.#onContentLoad, true);
+    this.#layout.observeDescendantLoads(next);
     this.#syncContentObservation();
     if (typeof MutationObserver !== "undefined") {
       this.#mutationObserver = new MutationObserver(() => {
@@ -362,16 +388,13 @@ var OverflowIndicatorController = class extends Controller {
   #stopObservingViewport() {
     this.#mutationObserver?.disconnect();
     this.#mutationObserver = null;
-    this.#observedViewport?.removeEventListener("load", this.#onContentLoad, true);
+    this.#layout.unobserveDescendantLoads();
     if (this.#observedViewport) this.#layout.unobserve(this.#observedViewport);
     for (const content of this.#observedContent) this.#layout.unobserve(content);
     this.#observedContent.clear();
     this.#observedViewport = null;
     this.#layout.unobserveViewport();
   }
-  #onContentLoad = () => {
-    if (this.#connected) this.update();
-  };
   get #threshold() {
     const value = this.thresholdValue;
     return Number.isFinite(value) ? Math.max(0, value) : 1;

data/dist/controllers/overflow_menu_controller.js

@@ -31,6 +31,15 @@ var BeforeCacheReset = class _BeforeCacheReset {
   }
 };
 
+// src/utils/event_owner.ts
+function ownerIndex(candidates, node) {
+  if (!(node instanceof Node)) return -1;
+  return candidates.findIndex((candidate) => candidate.contains(node));
+}
+function ownerOf(candidates, node) {
+  return candidates[ownerIndex(candidates, node)] ?? null;
+}
+
 // src/utils/focus_candidate.ts
 function inheritsFieldsetDisabled(control) {
   let fieldset = control.closest("fieldset[disabled]");
@@ -55,10 +64,15 @@ var LayoutObserver = class {
   #resizeObserverFactory;
   #resizeObserver = null;
   #observingViewport = false;
+  #loadContainer = null;
   /** Stable bound handler so add/removeEventListener target the same reference. */
   #handleViewportResize = () => {
     this.#callback();
   };
+  /** Stable bound handler for the capture-phase `load`; see {@link observeDescendantLoads}. */
+  #handleDescendantLoad = () => {
+    this.#callback();
+  };
   constructor(callback, options = {}) {
     this.#callback = callback;
     this.#resizeObserverFactory = options.resizeObserverFactory ?? (typeof ResizeObserver === "undefined" ? null : (cb) => new ResizeObserver(cb));
@@ -94,14 +108,35 @@ var LayoutObserver = class {
     window.removeEventListener("resize", this.#handleViewportResize);
   }
   /**
-   * Releases every observation: disconnects the {@link ResizeObserver} and
-   * removes the viewport listener. Safe to call multiple times. Call this from a
-   * controller's `disconnect()`.
+   * Starts reporting a `load` from anywhere inside `container` — an image or a
+   * frame settling changes the box it sits in, and it measures as zero high until
+   * then. `load` does not bubble, so the subscription is a capture-phase listener
+   * on the container itself and nothing the caller spells.
+   *
+   * **One container at a time.** A further call moves the observation, so a widget
+   * whose content element is swapped at runtime releases the element it let go by
+   * naming the new one — there is no second place for the release to drift from.
+   */
+  observeDescendantLoads(container) {
+    this.unobserveDescendantLoads();
+    this.#loadContainer = container;
+    container.addEventListener("load", this.#handleDescendantLoad, true);
+  }
+  /** Stops reporting descendant loads without affecting element or viewport observation. */
+  unobserveDescendantLoads() {
+    this.#loadContainer?.removeEventListener("load", this.#handleDescendantLoad, true);
+    this.#loadContainer = null;
+  }
+  /**
+   * Releases every observation: disconnects the {@link ResizeObserver} and removes
+   * the viewport and descendant-load listeners. Safe to call multiple times. Call
+   * this from a controller's `disconnect()`.
    */
   disconnect() {
     this.#resizeObserver?.disconnect();
     this.#resizeObserver = null;
     this.unobserveViewport();
+    this.unobserveDescendantLoads();
   }
 };
 
@@ -502,7 +537,7 @@ var OverflowMenuController = class extends Controller {
   }
   /** The managed item that is, or contains, `el` — focus rescue works on either. */
   #ownerOf(el) {
-    return this.#items.find((item) => item === el || item.contains(el)) ?? null;
+    return ownerOf(this.#items, el);
   }
   /** Whether the item takes up room in the bar; an authored `hidden` one does not. */
   #rendered(item) {

data/dist/controllers/pointer_drag_controller.js

@@ -63,6 +63,15 @@ var DetachGate = class _DetachGate {
   }
 };
 
+// src/utils/event_owner.ts
+function ownerIndex(candidates, node) {
+  if (!(node instanceof Node)) return -1;
+  return candidates.findIndex((candidate) => candidate.contains(node));
+}
+function ownerOf(candidates, node) {
+  return candidates[ownerIndex(candidates, node)] ?? null;
+}
+
 // src/controllers/pointer_drag_controller.ts
 var NATIVE_KEY_OWNERS = "input, textarea, select, button, a[href], summary, [contenteditable]";
 var PointerDragController = class _PointerDragController extends Controller {
@@ -406,9 +415,7 @@ var PointerDragController = class _PointerDragController extends Controller {
   }
   /** Resolves the handle owning an event target (the handle or a descendant). */
   #handleFor(target) {
-    const node = target;
-    if (!node) return null;
-    return this.#handles().find((handle) => handle === node || handle.contains(node)) ?? null;
+    return ownerOf(this.#handles(), target);
   }
   #pointerTypeOf(event) {
     const type = event.pointerType;

data/dist/controllers/portal_controller.js

@@ -2,6 +2,26 @@ import { Controller } from '@hotwired/stimulus';
 
 // src/controllers/portal_controller.ts
 
+// src/utils/declared_value.ts
+function parseDeclared(raw, parse, fallback) {
+  try {
+    return parse(raw);
+  } catch {
+    return fallback;
+  }
+}
+function validSelector(element, raw, fallback) {
+  if (raw.length === 0) return fallback;
+  return parseDeclared(
+    raw,
+    (selector) => {
+      element.matches(selector);
+      return selector;
+    },
+    fallback
+  );
+}
+
 // src/utils/detach_gate.ts
 var DetachGate = class _DetachGate {
   /** Set while a probe is queued, waiting for a reconnect to cancel it. */
@@ -81,16 +101,7 @@ var PortalController = class extends Controller {
    * instead, which reads as a mistake and can be traced back to the declaration.
    */
   toValueChanged() {
-    const selector = this.toValue;
-    if (selector.length > 0) {
-      try {
-        this.element.matches(selector);
-        this.#toSelector = selector;
-        return;
-      } catch {
-      }
-    }
-    this.#toSelector = "body";
+    this.#toSelector = validSelector(this.element, this.toValue, "body");
   }
   connect() {
     this.#gate.cancel();

data/dist/controllers/radio_group_controller.js

@@ -20,6 +20,15 @@ function isReservedArrowChord(event, allow = []) {
   return event.altKey && !allow.includes("alt") || event.ctrlKey && !allow.includes("ctrl") || event.metaKey && !allow.includes("meta") || event.shiftKey && !allow.includes("shift");
 }
 
+// src/utils/event_owner.ts
+function ownerIndex(candidates, node) {
+  if (!(node instanceof Node)) return -1;
+  return candidates.findIndex((candidate) => candidate.contains(node));
+}
+function ownerOf(candidates, node) {
+  return candidates[ownerIndex(candidates, node)] ?? null;
+}
+
 // src/utils/focus_candidate.ts
 function inheritsFieldsetDisabled(control) {
   let fieldset = control.closest("fieldset[disabled]");
@@ -479,9 +488,8 @@ var RadioGroupController = class extends Controller {
   }
   /** Finds this group's radio containing an event target, excluding nested groups. */
   #radioForEventTarget(target) {
-    if (!this.#ownsEventTarget(target)) return void 0;
-    const node = target;
-    return this.radioTargets.find((radio) => radio === node || radio.contains(node));
+    if (!this.#ownsEventTarget(target)) return null;
+    return ownerOf(this.radioTargets, target);
   }
   /** Whether the closest Radio Group scope around a target is this instance. */
   #ownsEventTarget(target) {

data/dist/controllers/read_more_controller.js

@@ -63,10 +63,15 @@ var LayoutObserver = class {
   #resizeObserverFactory;
   #resizeObserver = null;
   #observingViewport = false;
+  #loadContainer = null;
   /** Stable bound handler so add/removeEventListener target the same reference. */
   #handleViewportResize = () => {
     this.#callback();
   };
+  /** Stable bound handler for the capture-phase `load`; see {@link observeDescendantLoads}. */
+  #handleDescendantLoad = () => {
+    this.#callback();
+  };
   constructor(callback, options = {}) {
     this.#callback = callback;
     this.#resizeObserverFactory = options.resizeObserverFactory ?? (typeof ResizeObserver === "undefined" ? null : (cb) => new ResizeObserver(cb));
@@ -102,14 +107,35 @@ var LayoutObserver = class {
     window.removeEventListener("resize", this.#handleViewportResize);
   }
   /**
-   * Releases every observation: disconnects the {@link ResizeObserver} and
-   * removes the viewport listener. Safe to call multiple times. Call this from a
-   * controller's `disconnect()`.
+   * Starts reporting a `load` from anywhere inside `container` — an image or a
+   * frame settling changes the box it sits in, and it measures as zero high until
+   * then. `load` does not bubble, so the subscription is a capture-phase listener
+   * on the container itself and nothing the caller spells.
+   *
+   * **One container at a time.** A further call moves the observation, so a widget
+   * whose content element is swapped at runtime releases the element it let go by
+   * naming the new one — there is no second place for the release to drift from.
+   */
+  observeDescendantLoads(container) {
+    this.unobserveDescendantLoads();
+    this.#loadContainer = container;
+    container.addEventListener("load", this.#handleDescendantLoad, true);
+  }
+  /** Stops reporting descendant loads without affecting element or viewport observation. */
+  unobserveDescendantLoads() {
+    this.#loadContainer?.removeEventListener("load", this.#handleDescendantLoad, true);
+    this.#loadContainer = null;
+  }
+  /**
+   * Releases every observation: disconnects the {@link ResizeObserver} and removes
+   * the viewport and descendant-load listeners. Safe to call multiple times. Call
+   * this from a controller's `disconnect()`.
    */
   disconnect() {
     this.#resizeObserver?.disconnect();
     this.#resizeObserver = null;
     this.unobserveViewport();
+    this.unobserveDescendantLoads();
   }
 };
 
@@ -192,7 +218,7 @@ var ReadMoreController = class extends Controller {
     this.#observedContent = next;
     this.#layout.observe(next);
     this.#layout.observeViewport();
-    next.addEventListener("load", this.#update, true);
+    this.#layout.observeDescendantLoads(next);
     if (typeof MutationObserver !== "undefined") {
       this.#contentMutationObserver = new MutationObserver(this.#update);
       this.#contentMutationObserver.observe(next, {
@@ -206,7 +232,7 @@ var ReadMoreController = class extends Controller {
     this.#deferredHide.releaseAll();
     if (this.#observedContent) {
       this.#layout.unobserve(this.#observedContent);
-      this.#observedContent.removeEventListener("load", this.#update, true);
+      this.#layout.unobserveDescendantLoads();
     }
     this.#observedContent = null;
     this.#contentMutationObserver?.disconnect();