stimeo-ui 0.16.0 → 0.18.0

data/dist/controllers/textarea_autosize_controller.js

@@ -1,19 +1,47 @@
 import { Controller } from '@hotwired/stimulus';
 
-// src/controllers/textarea_autosize_controller.ts
+var ListenerSet = class {
+  #abort = new AbortController();
+  add(target, type, handler, options) {
+    target.addEventListener(type, handler, { ...options, signal: this.#abort.signal });
+  }
+  dispose() {
+    this.#abort.abort();
+    this.#abort = new AbortController();
+  }
+};
+
+var FontLoadWatcher = class {
+  #listeners = new ListenerSet();
+  #onSettled;
+  #fonts = null;
+  constructor(run) {
+    this.#onSettled = () => run();
+  }
+  observe(element) {
+    const fonts = element.ownerDocument.fonts ?? null;
+    if (fonts === this.#fonts) return;
+    this.disconnect();
+    if (!fonts) return;
+    this.#fonts = fonts;
+    this.#listeners.add(fonts, "loadingdone", this.#onSettled);
+    this.#listeners.add(fonts, "loadingerror", this.#onSettled);
+  }
+  disconnect() {
+    this.#listeners.dispose();
+    this.#fonts = null;
+  }
+};
 
-// src/utils/layout_observer.ts
 var LayoutObserver = class {
   #callback;
   #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();
   };
@@ -21,11 +49,6 @@ var LayoutObserver = class {
     this.#callback = callback;
     this.#resizeObserverFactory = options.resizeObserverFactory ?? (typeof ResizeObserver === "undefined" ? null : (cb) => new ResizeObserver(cb));
   }
-  /**
-   * Starts observing an element's size. Repeated calls observe additional
-   * elements through the same shared observer. No-ops when no
-   * `ResizeObserver` implementation is available.
-   */
   observe(element) {
     if (!this.#resizeObserverFactory) return;
     if (!this.#resizeObserver) {
@@ -35,47 +58,28 @@ var LayoutObserver = class {
     }
     this.#resizeObserver.observe(element);
   }
-  /** Stops observing a single element while leaving any others in place. */
   unobserve(element) {
     this.#resizeObserver?.unobserve(element);
   }
-  /** Starts observing viewport resizes. Idempotent: the listener is added once. */
   observeViewport() {
     if (this.#observingViewport) return;
     this.#observingViewport = true;
     window.addEventListener("resize", this.#handleViewportResize);
   }
-  /** Stops observing viewport resizes without affecting element observation. */
   unobserveViewport() {
     if (!this.#observingViewport) return;
     this.#observingViewport = false;
     window.removeEventListener("resize", this.#handleViewportResize);
   }
-  /**
-   * 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;
@@ -84,29 +88,70 @@ var LayoutObserver = class {
   }
 };
 
-// src/controllers/textarea_autosize_controller.ts
+var NUMBER_BOUNDS = {
+  nonNegative: { finite: true, min: 0 }};
+function matchesNumberBounds(value, bounds) {
+  if (!Number.isFinite(value)) {
+    const direction = value === Infinity ? "positive" : value === -Infinity ? "negative" : null;
+    if (direction === null) return false;
+    if (bounds.allowInfinity !== "both" && bounds.allowInfinity !== direction) return false;
+  }
+  if (bounds.min !== void 0 && value < bounds.min) return false;
+  if (bounds.max !== void 0 && value > bounds.max) return false;
+  if (bounds.exclusiveMin !== void 0 && value <= bounds.exclusiveMin) return false;
+  if (bounds.integer && !Number.isInteger(value)) return false;
+  if (bounds.allowedValues !== void 0 && !bounds.allowedValues.includes(value)) return false;
+  return true;
+}
+
+function readNumber(raw, fallback, bounds) {
+  return matchesNumberBounds(raw, bounds) ? raw : fallback;
+}
+
+var NumberValueReader = class {
+  #lastRejected = /* @__PURE__ */ new Map();
+  read(owner, name, raw, fallback, bounds) {
+    const resolved = readNumber(raw, fallback, bounds);
+    if (matchesNumberBounds(raw, bounds)) {
+      this.#lastRejected.delete(name);
+      return resolved;
+    }
+    const attribute = `data-${owner.identifier}-${name.replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`)}-value`;
+    const literal = owner.element.getAttribute(attribute);
+    if (literal === null) {
+      this.#lastRejected.delete(name);
+      return resolved;
+    }
+    if (this.#lastRejected.get(name) !== literal) {
+      this.#lastRejected.set(name, literal);
+      console.warn(
+        `Stimeo UI: "${owner.identifier}" has an invalid number Value "${name}" declaration ${JSON.stringify(literal)}; using ${fallback}.`
+      );
+    }
+    return resolved;
+  }
+};
+
 function px(value) {
   const n = Number.parseFloat(value);
   return Number.isNaN(n) ? 0 : n;
 }
-var TextareaAutosizeController = class extends Controller {
+var TextareaAutosizeController = class _TextareaAutosizeController extends Controller {
+  #numbers = new NumberValueReader();
   static values = {
     minRows: { type: Number, default: 1 },
     maxRows: { type: Number, default: 0 }
   };
+  static valueConstraints = {
+    minRows: { finite: true, min: 1 },
+    maxRows: NUMBER_BOUNDS.nonNegative
+  };
   static actions = ["resize"];
   static events = ["resize"];
   #lastHeight = -1;
   #lastWidth = -1;
   #started = false;
   #pending = false;
-  #fonts = null;
-  /**
-   * Content triggers arriving while the box is collapsed (`display: none`
-   * ancestors) are deferred: `scrollHeight` is 0 there, so measuring would
-   * clamp the kept height to the `minRows` floor and dispatch a bogus
-   * `resize`. The next report from a rendered box flushes the deferral.
-   */
   #remeasure = () => {
     if (this.element.clientWidth === 0) {
       this.#pending = true;
@@ -114,16 +159,7 @@ var TextareaAutosizeController = class extends Controller {
     }
     this.resize();
   };
-  /**
-   * Re-measures when the content width changed (re-wrapping, including a
-   * horizontal padding change under `border-box`), the applied inline height
-   * was stripped (a Turbo morph syncing attributes from server HTML that has no
-   * `style`), or a content trigger was deferred while the box was collapsed.
-   * This instance's own height writes match none of these signals, so they
-   * cannot re-enter; an authored inline height (e.g. a user dragging the native
-   * resize handle) is left alone until the next content trigger. Reports from a
-   * still-collapsed box are skipped (nothing is measurable there).
-   */
+  #fonts = new FontLoadWatcher(this.#remeasure);
   #layout = new LayoutObserver(() => {
     if (this.element.clientWidth === 0) return;
     const width = this.#contentWidth();
@@ -132,32 +168,29 @@ var TextareaAutosizeController = class extends Controller {
     this.#lastWidth = width;
     this.resize();
   });
+  #listeners = new ListenerSet();
   connect() {
     this.#lastHeight = Math.round(px(this.element.style.height));
     this.#lastWidth = this.#contentWidth();
-    this.element.addEventListener("input", this.#remeasure);
-    this.element.addEventListener("change", this.#remeasure);
+    this.#listeners.add(this.element, "input", this.#remeasure);
+    this.#listeners.add(this.element, "change", this.#remeasure);
     this.#layout.observe(this.element);
-    this.#bindFonts();
+    this.#fonts.observe(this.element);
     this.#started = true;
     this.resize();
   }
   disconnect() {
     this.#started = false;
-    this.element.removeEventListener("input", this.#remeasure);
-    this.element.removeEventListener("change", this.#remeasure);
+    this.#listeners.dispose();
     this.#layout.disconnect();
-    this.#unbindFonts();
+    this.#fonts.disconnect();
   }
-  /** Re-clamps when application code or a Turbo morph changes `minRows`. */
   minRowsValueChanged() {
     if (this.#started) this.#remeasure();
   }
-  /** Re-clamps when application code or a Turbo morph changes `maxRows`. */
   maxRowsValueChanged() {
     if (this.#started) this.#remeasure();
   }
-  /** Re-measures the content and applies the clamped height. */
   resize() {
     this.#pending = false;
     const el = this.element;
@@ -169,10 +202,10 @@ var TextareaAutosizeController = class extends Controller {
     el.style.height = "auto";
     const contentHeight = Math.max(0, el.scrollHeight - paddingV);
     const rows = Math.max(1, Math.round(contentHeight / lineHeight));
-    let targetContent = Math.max(contentHeight, this.minRowsValue * lineHeight);
+    let targetContent = Math.max(contentHeight, this.#safeMinRows * lineHeight);
     let atMax = false;
-    if (this.maxRowsValue > 0) {
-      const maxContent = this.maxRowsValue * lineHeight;
+    if (this.#safeMaxRows > 0) {
+      const maxContent = this.#safeMaxRows * lineHeight;
       if (targetContent > maxContent) {
         targetContent = maxContent;
         atMax = true;
@@ -193,34 +226,35 @@ var TextareaAutosizeController = class extends Controller {
       this.dispatch("resize", { detail: { height, rows } });
     }
   }
-  /** Content-box width — the wrapping input, unaffected by this instance's height writes. */
   #contentWidth() {
     const style = window.getComputedStyle(this.element);
     return Math.max(0, this.element.clientWidth - px(style.paddingLeft) - px(style.paddingRight));
   }
-  /** Resolved line height, falling back to ~1.2× font-size when `normal`. */
   #lineHeight(style) {
     const lh = px(style.lineHeight);
     if (lh > 0) return lh;
     const fontSize = px(style.fontSize);
     return fontSize > 0 ? fontSize * 1.2 : 16;
   }
-  /** Subscribes to font completion when the current engine exposes `document.fonts`. */
-  #bindFonts() {
-    const fonts = this.element.ownerDocument.fonts;
-    if (!fonts) return;
-    this.#fonts = fonts;
-    fonts.addEventListener("loadingdone", this.#remeasure);
-    fonts.addEventListener("loadingerror", this.#remeasure);
+  get #safeMinRows() {
+    return this.#numbers.read(
+      this,
+      "minRows",
+      this.minRowsValue,
+      _TextareaAutosizeController.values.minRows.default,
+      _TextareaAutosizeController.valueConstraints.minRows
+    );
   }
-  /** Removes the font completion subscriptions. */
-  #unbindFonts() {
-    this.#fonts?.removeEventListener("loadingdone", this.#remeasure);
-    this.#fonts?.removeEventListener("loadingerror", this.#remeasure);
-    this.#fonts = null;
+  get #safeMaxRows() {
+    return this.#numbers.read(
+      this,
+      "maxRows",
+      this.maxRowsValue,
+      _TextareaAutosizeController.values.maxRows.default,
+      _TextareaAutosizeController.valueConstraints.maxRows
+    );
   }
 };
 
 export { TextareaAutosizeController };
-//# sourceMappingURL=textarea_autosize_controller.js.map
 //# sourceMappingURL=textarea_autosize_controller.js.map