stimeo-ui 0.1.0.pre.alpha.1

data/dist/controllers/radio_group_controller.js

@@ -0,0 +1,128 @@
+import { Controller } from '@hotwired/stimulus';
+
+// src/controllers/radio_group_controller.ts
+
+// src/utils/roving_tabindex.ts
+var RovingTabindex = class {
+  /** Returns the current ordered item elements; called on every operation. */
+  #getItems;
+  /**
+   * @param getItems - Returns the current ordered item elements. Called on every
+   *   operation so the live target list is always used.
+   */
+  constructor(getItems) {
+    this.#getItems = getItems;
+  }
+  /** Index of the currently tabbable item (`tabindex="0"`), or `-1` if none. */
+  get activeIndex() {
+    return this.#getItems().findIndex((item) => item.tabIndex === 0);
+  }
+  /**
+   * Makes exactly the item at `index` tabbable (`tabindex="0"`) and removes every
+   * other item from the Tab sequence (`tabindex="-1"`). An out-of-range `index`
+   * (e.g. `-1`) leaves all items at `-1`, which a controller can use to express
+   * "nothing is currently tabbable".
+   *
+   * @param index - Position of the item to make tabbable.
+   * @param options - Pass `{ focus: true }` to also move DOM focus to that item.
+   */
+  setActive(index, { focus = false } = {}) {
+    const items = this.#getItems();
+    items.forEach((item, i) => {
+      item.tabIndex = i === index ? 0 : -1;
+    });
+    if (focus) items[index]?.focus();
+  }
+};
+function rovingMove(current, length, delta, wrap) {
+  if (length === 0) return -1;
+  const next = current + delta;
+  return (next + length) % length;
+}
+
+// src/controllers/radio_group_controller.ts
+var RadioGroupController = class extends Controller {
+  static targets = ["radio", "field"];
+  static actions = ["onKeydown", "select"];
+  static events = ["change"];
+  #roving = new RovingTabindex(() => this.radioTargets);
+  /** Establishes the roving entry point and reflects the initial selection. */
+  connect() {
+    const selected = this.#selectedIndex();
+    this.#roving.setActive(selected === -1 ? 0 : selected);
+    if (selected !== -1) this.#reflectField(this.radioTargets[selected], { silent: true });
+  }
+  /** Selects the clicked radio. Bound via `data-action` (click). */
+  select(event) {
+    const index = this.radioTargets.indexOf(event.currentTarget);
+    if (index !== -1) this.#selectIndex(index, { focus: false });
+  }
+  /** Arrow/Home/End/Space navigation with selection-follows-focus. */
+  onKeydown(event) {
+    const current = this.radioTargets.indexOf(event.currentTarget);
+    if (current === -1) return;
+    let next = null;
+    switch (event.key) {
+      case "ArrowDown":
+      case "ArrowRight":
+        next = rovingMove(current, this.radioTargets.length, 1);
+        break;
+      case "ArrowUp":
+      case "ArrowLeft":
+        next = rovingMove(current, this.radioTargets.length, -1);
+        break;
+      case "Home":
+        next = 0;
+        break;
+      case "End":
+        next = this.radioTargets.length - 1;
+        break;
+      case " ":
+        next = current;
+        break;
+      default:
+        return;
+    }
+    event.preventDefault();
+    this.#selectIndex(next, { focus: true });
+  }
+  /**
+   * Checks the radio at `index`, clears the rest, updates the roving Tab stop and
+   * the hidden field, and dispatches `change`.
+   */
+  #selectIndex(index, { focus }) {
+    const radio = this.radioTargets[index];
+    if (!radio) return;
+    this.radioTargets.forEach((item, i) => {
+      item.setAttribute("aria-checked", i === index ? "true" : "false");
+    });
+    this.#roving.setActive(index, { focus });
+    this.#reflectField(radio);
+    this.dispatch("change", { detail: { value: this.#radioValue(radio), radio } });
+  }
+  /** Index of the currently checked radio, or `-1` if none. */
+  #selectedIndex() {
+    return this.radioTargets.findIndex((radio) => radio.getAttribute("aria-checked") === "true");
+  }
+  /**
+   * Mirrors a radio's `data-value` onto the hidden field, when present. Fires a
+   * native bubbling `change` on a real value change (matching `listbox`, so
+   * `auto-submit` and other native-`change` consumers react) — unless `silent`
+   * (the initial connect reflection, which is not a user edit).
+   */
+  #reflectField(radio, { silent = false } = {}) {
+    if (!this.hasFieldTarget || !radio) return;
+    const value = this.#radioValue(radio);
+    if (this.fieldTarget.value === value) return;
+    this.fieldTarget.value = value;
+    if (!silent) this.fieldTarget.dispatchEvent(new Event("change", { bubbles: true }));
+  }
+  /** A radio's submitted value (`data-value`, defaulting to empty). */
+  #radioValue(radio) {
+    return radio.getAttribute("data-value") ?? "";
+  }
+};
+
+export { RadioGroupController };
+//# sourceMappingURL=radio_group_controller.js.map
+//# sourceMappingURL=radio_group_controller.js.map

data/dist/controllers/rating_controller.js

@@ -0,0 +1,179 @@
+import { Controller } from '@hotwired/stimulus';
+
+// src/controllers/rating_controller.ts
+
+// src/utils/roving_tabindex.ts
+var RovingTabindex = class {
+  /** Returns the current ordered item elements; called on every operation. */
+  #getItems;
+  /**
+   * @param getItems - Returns the current ordered item elements. Called on every
+   *   operation so the live target list is always used.
+   */
+  constructor(getItems) {
+    this.#getItems = getItems;
+  }
+  /** Index of the currently tabbable item (`tabindex="0"`), or `-1` if none. */
+  get activeIndex() {
+    return this.#getItems().findIndex((item) => item.tabIndex === 0);
+  }
+  /**
+   * Makes exactly the item at `index` tabbable (`tabindex="0"`) and removes every
+   * other item from the Tab sequence (`tabindex="-1"`). An out-of-range `index`
+   * (e.g. `-1`) leaves all items at `-1`, which a controller can use to express
+   * "nothing is currently tabbable".
+   *
+   * @param index - Position of the item to make tabbable.
+   * @param options - Pass `{ focus: true }` to also move DOM focus to that item.
+   */
+  setActive(index, { focus = false } = {}) {
+    const items = this.#getItems();
+    items.forEach((item, i) => {
+      item.tabIndex = i === index ? 0 : -1;
+    });
+    if (focus) items[index]?.focus();
+  }
+};
+
+// src/controllers/rating_controller.ts
+var RatingController = class extends Controller {
+  static targets = ["symbol", "field"];
+  static values = {
+    value: { type: Number, default: 0 },
+    max: { type: Number, default: 5 },
+    clearable: { type: Boolean, default: true },
+    readonly: { type: Boolean, default: false }
+  };
+  static actions = ["endPreview", "onKeydown", "preview", "select"];
+  static events = ["change"];
+  #roving = new RovingTabindex(() => this.symbolTargets);
+  /** Reflects the initial value, or switches to the non-interactive readonly view. */
+  connect() {
+    if (this.readonlyValue) {
+      this.#applyReadonly();
+      return;
+    }
+    this.#apply(this.#clamp(this.valueValue), { focus: false });
+  }
+  /** Selects (or clears) the clicked symbol. Bound via `data-action` (click). */
+  select(event) {
+    if (this.readonlyValue) return;
+    const value = this.#clamp(this.#symbolValue(event.currentTarget));
+    if (this.clearableValue && value === this.valueValue) {
+      this.#render(0, { focus: true });
+    } else {
+      this.#render(value, { focus: false });
+    }
+  }
+  /** Previews a fill range on hover/focus. Bound via `data-action` (mouseenter/focus). */
+  preview(event) {
+    if (this.readonlyValue) return;
+    this.#setFillRange(this.#clamp(this.#symbolValue(event.currentTarget)));
+  }
+  /** Restores the fill range to the selected value. Bound via `data-action` (mouseleave/blur). */
+  endPreview() {
+    if (this.readonlyValue) return;
+    this.#setFillRange(this.valueValue);
+  }
+  /** Arrow/Home/End/Space keyboard control, clamped (no wrap). */
+  onKeydown(event) {
+    if (this.readonlyValue) return;
+    let next = null;
+    switch (event.key) {
+      case "ArrowRight":
+      case "ArrowUp":
+        next = this.valueValue + 1;
+        break;
+      case "ArrowLeft":
+      case "ArrowDown":
+        next = this.valueValue - 1;
+        break;
+      case "Home":
+        next = this.#minValue;
+        break;
+      case "End":
+        next = this.maxValue;
+        break;
+      case " ":
+      case "Enter":
+        next = this.#symbolValue(event.currentTarget);
+        break;
+      default:
+        return;
+    }
+    event.preventDefault();
+    this.#render(this.#clamp(next), { focus: true });
+  }
+  /**
+   * Applies `value` (already clamped) everywhere, then dispatches `change`.
+   * Use for user-driven changes; on connect call `#apply` directly so
+   * initialization mirrors state without emitting an event.
+   */
+  #render(value, { focus }) {
+    this.#apply(value, { focus });
+    this.dispatch("change", { detail: { value } });
+  }
+  /**
+   * Stores `value`, syncs `aria-checked` and the roving Tab stop, the hidden
+   * field, and the fill range — without dispatching `change`. Idempotent and
+   * safe on connect (and across Turbo morphing).
+   */
+  #apply(value, { focus }) {
+    this.valueValue = value;
+    this.symbolTargets.forEach((symbol) => {
+      symbol.setAttribute(
+        "aria-checked",
+        value > 0 && this.#symbolValue(symbol) === value ? "true" : "false"
+      );
+    });
+    this.#roving.setActive(value > 0 ? value - 1 : 0, { focus });
+    if (this.hasFieldTarget) this.fieldTarget.value = String(value);
+    this.#setFillRange(value);
+  }
+  /** Marks symbols up to `range` with `data-rating-hover` (the consumer's fill hook). */
+  #setFillRange(range) {
+    for (const symbol of this.symbolTargets) {
+      if (this.#symbolValue(symbol) <= range && range > 0) {
+        symbol.setAttribute("data-rating-hover", "");
+      } else {
+        symbol.removeAttribute("data-rating-hover");
+      }
+    }
+  }
+  /** Turns the group into a non-interactive `role="img"` snapshot of the value. */
+  #applyReadonly() {
+    const value = this.#clamp(this.valueValue);
+    this.valueValue = value;
+    this.element.setAttribute("role", "img");
+    for (const symbol of this.symbolTargets) {
+      symbol.removeAttribute("role");
+      symbol.setAttribute("aria-hidden", "true");
+      symbol.tabIndex = -1;
+    }
+    if (this.hasFieldTarget) this.fieldTarget.value = String(value);
+    this.#setFillRange(value);
+  }
+  /**
+   * Clamps `value` to `[min, max]` (min is 0 when clearable, else 1). The upper
+   * bound is also capped at the number of symbols so the roving Tab stop
+   * (`value - 1`) always maps to a real symbol — even if the consumer's `max`
+   * value and rendered symbol count disagree, the tabbable item is never lost.
+   */
+  #clamp(value) {
+    const max = Math.min(this.maxValue, this.symbolTargets.length);
+    return Math.min(max, Math.max(this.#minValue, value));
+  }
+  /** Lowest selectable value: 0 when clearable, otherwise 1. */
+  get #minValue() {
+    return this.clearableValue ? 0 : 1;
+  }
+  /** A symbol's ordinal value (`data-rating-value`, defaulting to its position). */
+  #symbolValue(symbol) {
+    const raw = Number(symbol.getAttribute("data-rating-value"));
+    return Number.isFinite(raw) && raw > 0 ? raw : this.symbolTargets.indexOf(symbol) + 1;
+  }
+};
+
+export { RatingController };
+//# sourceMappingURL=rating_controller.js.map
+//# sourceMappingURL=rating_controller.js.map

data/dist/controllers/relative_time_controller.js

@@ -0,0 +1,129 @@
+import { Controller } from '@hotwired/stimulus';
+
+// src/controllers/relative_time_controller.ts
+
+// src/utils/safe_timeout.ts
+var TimerRegistry = class {
+  /** Live timer ids that have not yet been cleared (or, for timeouts, fired). */
+  ids = /* @__PURE__ */ new Set();
+  /**
+   * Cancels a single tracked timer.
+   *
+   * No-ops if the id is unknown (already cleared, fired, or never owned by this
+   * registry), so callers can clear defensively without guarding.
+   */
+  clear(id) {
+    if (this.ids.delete(id)) {
+      this.cancel(id);
+    }
+  }
+  /**
+   * Cancels every tracked timer. Call this from a controller's `disconnect()`
+   * to guarantee no timer outlives the element.
+   */
+  clearAll() {
+    for (const id of this.ids) {
+      this.cancel(id);
+    }
+    this.ids.clear();
+  }
+  /** Number of timers currently tracked (pending). */
+  get size() {
+    return this.ids.size;
+  }
+};
+var SafeTimeout = class extends TimerRegistry {
+  /**
+   * Schedules `callback` after `delay` ms and returns the timer id.
+   *
+   * The id is removed from the registry automatically when the timeout fires,
+   * so {@link TimerRegistry.size | size} reflects only still-pending timers.
+   */
+  set(callback, delay) {
+    const id = this.schedule(() => {
+      this.ids.delete(id);
+      callback();
+    }, delay);
+    this.ids.add(id);
+    return id;
+  }
+  schedule(callback, delay) {
+    return window.setTimeout(callback, delay);
+  }
+  cancel(id) {
+    window.clearTimeout(id);
+  }
+};
+
+// src/controllers/relative_time_controller.ts
+var YEAR_SCALE = { limit: Number.POSITIVE_INFINITY, unit: "year", ms: 315576e5 };
+var UNITS = [
+  { limit: 60, unit: "second", ms: 1e3 },
+  { limit: 3600, unit: "minute", ms: 6e4 },
+  { limit: 86400, unit: "hour", ms: 36e5 },
+  { limit: 604800, unit: "day", ms: 864e5 },
+  { limit: 2629800, unit: "week", ms: 6048e5 },
+  { limit: 31557600, unit: "month", ms: 26298e5 },
+  YEAR_SCALE
+];
+var RelativeTimeController = class extends Controller {
+  static values = {
+    locale: { type: String, default: "" },
+    threshold: { type: Number, default: 0 },
+    tickInterval: { type: Number, default: 6e4 }
+  };
+  #timers = new SafeTimeout();
+  /** Epoch ms parsed from `datetime`; `NaN` when absent or invalid. */
+  #targetMs = Number.NaN;
+  /** The authored absolute text, restored when the threshold fallback kicks in. */
+  #absoluteText = "";
+  connect() {
+    if (this.element.getAttribute("data-state") !== "relative") {
+      this.#absoluteText = (this.element.textContent ?? "").trim();
+    }
+    this.#targetMs = Date.parse(this.element.getAttribute("datetime") ?? "");
+    if (Number.isNaN(this.#targetMs)) return;
+    this.#schedule();
+  }
+  disconnect() {
+    this.#timers.clearAll();
+  }
+  /** Renders the current representation and reschedules unless it is now absolute. */
+  #schedule() {
+    const nextDelay = this.#applyAndComputeDelay();
+    if (nextDelay !== null) {
+      this.#timers.set(() => this.#schedule(), nextDelay);
+    }
+  }
+  /**
+   * Updates the visible text and returns the next poll delay (ms), or `null`
+   * once the absolute fallback is shown (which never changes, so stop polling).
+   */
+  #applyAndComputeDelay() {
+    const deltaMs = this.#targetMs - Date.now();
+    const absSeconds = Math.abs(deltaMs) / 1e3;
+    if (this.thresholdValue > 0 && absSeconds >= this.thresholdValue && this.#absoluteText) {
+      this.element.textContent = this.#absoluteText;
+      this.element.setAttribute("data-state", "absolute");
+      return null;
+    }
+    const scale = UNITS.find((u) => absSeconds < u.limit) ?? YEAR_SCALE;
+    const value = Math.round(deltaMs / scale.ms);
+    this.element.textContent = this.#formatter.format(value, scale.unit);
+    this.element.setAttribute("data-state", "relative");
+    const unitFloor = scale.unit === "second" || scale.unit === "minute" ? 6e4 : scale.ms;
+    return Math.max(this.tickIntervalValue, Math.min(unitFloor, 864e5));
+  }
+  /** A `RelativeTimeFormat` for the resolved locale (`numeric: "auto"`). */
+  get #formatter() {
+    return new Intl.RelativeTimeFormat(this.#locale, { numeric: "auto" });
+  }
+  /** Locale precedence: the value, then the element's `lang`, then the document's. */
+  get #locale() {
+    return this.localeValue || this.element.lang || document.documentElement.lang || void 0;
+  }
+};
+
+export { RelativeTimeController };
+//# sourceMappingURL=relative_time_controller.js.map
+//# sourceMappingURL=relative_time_controller.js.map

data/dist/controllers/reset_before_cache_controller.js

@@ -0,0 +1,62 @@
+import { Controller } from '@hotwired/stimulus';
+
+// src/controllers/reset_before_cache_controller.ts
+var ResetBeforeCacheController = class extends Controller {
+  static values = {
+    scope: { type: String, default: "" },
+    dispatchReset: { type: Boolean, default: true }
+  };
+  static actions = ["reset"];
+  static events = ["reset", "request"];
+  /** Runs the reset just before Turbo caches the snapshot. */
+  #onBeforeCache = () => this.reset();
+  connect() {
+    document.addEventListener("turbo:before-cache", this.#onBeforeCache);
+  }
+  disconnect() {
+    document.removeEventListener("turbo:before-cache", this.#onBeforeCache);
+  }
+  /**
+   * Resets transient UI within scope to its initial state. Asks controllers to
+   * close (via `request`) first, then applies the declarative `data-reset-*` cleanup,
+   * and finally emits `reset`. Safe to call any number of times (idempotent).
+   */
+  reset() {
+    const root = this.#scopeRoot();
+    if (this.dispatchResetValue) this.dispatch("request");
+    for (const element of root.querySelectorAll("[data-reset-attr]")) {
+      for (const name of (element.getAttribute("data-reset-attr") ?? "").split(/\s+/)) {
+        if (name) element.removeAttribute(name);
+      }
+    }
+    for (const element of root.querySelectorAll("[data-reset-class]")) {
+      for (const token of (element.getAttribute("data-reset-class") ?? "").split(/\s+/)) {
+        if (token) element.classList.remove(token);
+      }
+    }
+    for (const element of root.querySelectorAll("[data-reset-form]")) {
+      if (element instanceof HTMLFormElement) element.reset();
+    }
+    for (const element of root.querySelectorAll("[data-reset-value]")) {
+      if (element instanceof HTMLInputElement || element instanceof HTMLTextAreaElement || element instanceof HTMLSelectElement) {
+        element.value = "";
+      }
+    }
+    for (const element of root.querySelectorAll("[data-reset-hidden]")) {
+      element.hidden = true;
+    }
+    for (const element of root.querySelectorAll("[data-reset-remove]")) {
+      element.remove();
+    }
+    this.dispatch("reset");
+  }
+  /** The scan root: a `scope` descendant when set, else the controller element. */
+  #scopeRoot() {
+    if (!this.scopeValue) return this.element;
+    return this.element.querySelector(this.scopeValue) ?? this.element;
+  }
+};
+
+export { ResetBeforeCacheController };
+//# sourceMappingURL=reset_before_cache_controller.js.map
+//# sourceMappingURL=reset_before_cache_controller.js.map

data/dist/controllers/resizable_controller.js

@@ -0,0 +1,163 @@
+import { Controller } from '@hotwired/stimulus';
+
+// src/controllers/resizable_controller.ts
+var ResizableController = class extends Controller {
+  static targets = ["primary", "secondary", "separator"];
+  static values = {
+    min: { type: Number, default: 0 },
+    max: { type: Number, default: 100 },
+    step: { type: Number, default: 1 },
+    value: { type: Number, default: 50 }
+  };
+  static actions = ["onKeydown", "onPointerDown", "toggle"];
+  static events = ["change"];
+  /** Track previously held value before collapse toggles. */
+  #valueBeforeCollapse = 50;
+  /** Aborts in-progress pointer-drag listeners when the drag ends or on teardown. */
+  #dragAbort = null;
+  connect() {
+    this.#clampAndSync();
+  }
+  /** Cancels any active pointer drag so listeners never leak past disconnect. */
+  disconnect() {
+    this.#dragAbort?.abort();
+    this.#dragAbort = null;
+  }
+  /**
+   * Stimulus lifecycle callback when the valueValue changes.
+   * Keeps CSS fractions and ARIA status completely aligned.
+   */
+  valueValueChanged() {
+    this.#clampAndSync();
+  }
+  /** Starts active pointer drag tracking and locks capture. */
+  onPointerDown(event) {
+    if (!this.hasSeparatorTarget || event.button !== 0) return;
+    event.preventDefault();
+    const separator = this.separatorTarget;
+    separator.setPointerCapture(event.pointerId);
+    separator.focus();
+    this.element.setAttribute("data-dragging", "true");
+    this.#dragAbort?.abort();
+    const abort = new AbortController();
+    this.#dragAbort = abort;
+    separator.addEventListener("pointermove", this.#onPointerMove, { signal: abort.signal });
+    separator.addEventListener("pointerup", this.#onPointerUp, { signal: abort.signal });
+    separator.addEventListener("pointercancel", this.#onPointerUp, { signal: abort.signal });
+  }
+  /** Keydown adjustments for ArrowUp/Down/Left/Right and Home/End. */
+  onKeydown(event) {
+    if (!this.hasSeparatorTarget) return;
+    const orientation = this.separatorTarget.getAttribute("aria-orientation") || "vertical";
+    const isVertical = orientation === "vertical";
+    let handled = true;
+    let nextValue = this.valueValue;
+    switch (event.key) {
+      case "ArrowLeft":
+        if (isVertical) {
+          nextValue -= this.stepValue;
+        } else {
+          handled = false;
+        }
+        break;
+      case "ArrowRight":
+        if (isVertical) {
+          nextValue += this.stepValue;
+        } else {
+          handled = false;
+        }
+        break;
+      case "ArrowUp":
+        if (!isVertical) {
+          nextValue -= this.stepValue;
+        } else {
+          handled = false;
+        }
+        break;
+      case "ArrowDown":
+        if (!isVertical) {
+          nextValue += this.stepValue;
+        } else {
+          handled = false;
+        }
+        break;
+      case "Home":
+        nextValue = this.minValue;
+        break;
+      case "End":
+        nextValue = this.maxValue;
+        break;
+      case "Enter":
+        event.preventDefault();
+        this.toggle();
+        return;
+      default:
+        handled = false;
+        break;
+    }
+    if (handled) {
+      event.preventDefault();
+      this.valueValue = Math.max(this.minValue, Math.min(nextValue, this.maxValue));
+      this.#clampAndSync();
+      this.#dispatchChange();
+    }
+  }
+  /** Double-click or Enter to collapse/restore pane to min/max levels. */
+  toggle() {
+    const threshold = this.minValue + (this.maxValue - this.minValue) / 2;
+    if (this.valueValue > this.minValue) {
+      this.#valueBeforeCollapse = this.valueValue;
+      this.valueValue = this.minValue;
+    } else {
+      this.valueValue = this.#valueBeforeCollapse >= threshold ? this.#valueBeforeCollapse : this.maxValue;
+    }
+    this.#clampAndSync();
+    this.#dispatchChange();
+  }
+  #onPointerMove = (event) => {
+    if (!this.hasSeparatorTarget) return;
+    const rect = this.element.getBoundingClientRect();
+    const orientation = this.separatorTarget.getAttribute("aria-orientation") || "vertical";
+    const isVertical = orientation === "vertical";
+    let fraction = 0.5;
+    if (isVertical) {
+      fraction = (event.clientX - rect.left) / rect.width;
+    } else {
+      fraction = (event.clientY - rect.top) / rect.height;
+    }
+    fraction = Math.max(0, Math.min(fraction, 1));
+    const percent = Math.round(fraction * 100);
+    this.valueValue = Math.max(this.minValue, Math.min(percent, this.maxValue));
+    this.#clampAndSync();
+  };
+  #onPointerUp = (event) => {
+    if (!this.hasSeparatorTarget) return;
+    const separator = this.separatorTarget;
+    separator.releasePointerCapture(event.pointerId);
+    this.element.removeAttribute("data-dragging");
+    this.#dragAbort?.abort();
+    this.#dragAbort = null;
+    this.#dispatchChange();
+  };
+  #clampAndSync() {
+    const clamped = Math.max(this.minValue, Math.min(this.valueValue, this.maxValue));
+    if (this.valueValue !== clamped) {
+      this.valueValue = clamped;
+    }
+    const fraction = clamped / 100;
+    this.element.style.setProperty("--stimeo--resizable-fraction", String(fraction));
+    if (this.hasSeparatorTarget) {
+      this.separatorTarget.setAttribute("aria-valuenow", String(clamped));
+      this.separatorTarget.setAttribute("aria-valuemin", String(this.minValue));
+      this.separatorTarget.setAttribute("aria-valuemax", String(this.maxValue));
+    }
+  }
+  #dispatchChange() {
+    const fraction = this.valueValue / 100;
+    this.dispatch("change", { detail: { value: this.valueValue, fraction } });
+  }
+};
+
+export { ResizableController };
+//# sourceMappingURL=resizable_controller.js.map
+//# sourceMappingURL=resizable_controller.js.map