stimeo-ui 0.16.0 → 0.17.0

data/dist/controllers/switch_controller.js

@@ -1,15 +1,11 @@
 import { Controller } from '@hotwired/stimulus';
 
-// src/controllers/switch_controller.ts
-
-// src/utils/default_attribute.ts
 function setDefaultAttribute(element, name, value) {
   if (element.hasAttribute(name)) return false;
   element.setAttribute(name, value);
   return true;
 }
 
-// src/utils/field_mirror.ts
 function writeField(field, value) {
   if (field.value === value) return false;
   field.value = value;
@@ -19,7 +15,6 @@ function commitField(target) {
   target.dispatchEvent(new Event("change", { bubbles: true }));
 }
 
-// src/utils/focus_candidate.ts
 function inheritsFieldsetDisabled(control) {
   let fieldset = control.closest("fieldset[disabled]");
   while (fieldset) {
@@ -30,7 +25,6 @@ function inheritsFieldsetDisabled(control) {
   return false;
 }
 
-// src/utils/interactive_host.ts
 var INTERACTIVE_HOST_SELECTOR = "button, input, select, textarea, label, a[href], area[href], summary, details, audio[controls], video[controls], iframe, object, embed";
 function isInteractiveHost(element) {
   if (element.matches(INTERACTIVE_HOST_SELECTOR)) return true;
@@ -47,27 +41,22 @@ function isInteractiveHost(element) {
   return false;
 }
 
-// src/utils/microtask_coalescer.ts
 var MicrotaskCoalescer = class {
   #run;
   #queued = false;
   #active = false;
   #generation = 0;
-  /** @param run - the single reconciliation pass, invoked at most once per batch. */
   constructor(run) {
     this.#run = run;
   }
-  /** Opens the window in which {@link schedule} is honoured; call from `connect()`. */
   activate() {
     this.#active = true;
   }
-  /** Closes the window and drops any pending pass; call from `disconnect()`. */
   cancel() {
     this.#active = false;
     this.#queued = false;
     this.#generation += 1;
   }
-  /** Requests one pass after the batch settles. Idempotent; inert outside the window. */
   schedule() {
     if (!this.#active || this.#queued) return;
     this.#queued = true;
@@ -80,7 +69,17 @@ var MicrotaskCoalescer = class {
   }
 };
 
-// src/controllers/switch_controller.ts
+var MoveCounter = class {
+  #sequence = 0;
+  record() {
+    this.#sequence += 1;
+    return this.#sequence;
+  }
+  isLatest(token) {
+    return token === this.#sequence;
+  }
+};
+
 var OBSERVED_ATTRIBUTES = [
   "role",
   "aria-checked",
@@ -92,32 +91,25 @@ var OBSERVED_ATTRIBUTES = [
 ];
 var OBSERVED_ANCESTOR_ATTRIBUTES = ["contenteditable"];
 var SwitchController = class extends Controller {
+  #moves = new MoveCounter();
   static targets = ["field"];
   static actions = ["onKeydown", "toggle"];
   static events = ["change", "reconcile"];
-  /** Defaults this instance introduced and may therefore remove safely. */
-  #ownedDefaults = /* @__PURE__ */ new Set();
-  /** Controller writes that must not be mistaken for authored morph changes. */
+  #ownedDefaults = /* @__PURE__ */ new Map();
   #internalAttributeValues = /* @__PURE__ */ new Map();
-  /** One pass per batch of retained-element changes and field arrivals. */
   #pass = new MicrotaskCoalescer(() => this.#reconcile());
-  /** The checked state last published: read on connect, then committed or reported. */
   #committedChecked = false;
   #attributeObserver = new MutationObserver((records) => {
     this.#releaseAuthoredDefaults(records);
     this.#pass.schedule();
   });
-  /** Blocks disabled pointer/native-key activation before consumer click handlers. */
   #onClickCapture = (event) => {
     if (!this.#isSupportedHost || !this.#isActivationDisabled) return;
     event.preventDefault();
     event.stopImmediatePropagation();
   };
-  /**
-   * Ensures the switch exposes a role and is keyboard-reachable, and takes the
-   * state it finds as the one a later move is measured from, reporting nothing.
-   */
   connect() {
+    this.#releaseDefaultsRewrittenWhileAway();
     this.#reconcileDefaults();
     this.#mirrorField(false);
     this.#committedChecked = this.#checked;
@@ -125,28 +117,22 @@ var SwitchController = class extends Controller {
     this.#pass.activate();
     this.#observeAttributes();
   }
-  /** Fills a form field inserted or replaced at runtime with the current state. */
   fieldTargetConnected() {
     this.#pass.schedule();
   }
-  /** Releases the click guard, the attribute observer, and a pass still queued. */
+  fieldTargetDisconnected() {
+    this.#pass.schedule();
+  }
   disconnect() {
     this.#pass.cancel();
     this.element.removeEventListener("click", this.#onClickCapture, true);
     this.#attributeObserver.disconnect();
     this.#internalAttributeValues.clear();
   }
-  /** Toggles the checked state. Bound via `data-action` (click). */
   toggle() {
     if (!this.#isSupportedHost || this.#isActivationDisabled) return;
     this.#commit(!this.#checked);
   }
-  /**
-   * Activates the switch on Space/Enter for non-native hosts and suppresses key
-   * repeat. Bound via `data-action` (keydown). A native `<button type="button">`
-   * owns the initial key-to-click synthesis; repeated keydowns are canceled before
-   * the browser can synthesize additional clicks.
-   */
   onKeydown(event) {
     if (event.defaultPrevented) return;
     if (!this.#isSupportedHost) return;
@@ -164,13 +150,6 @@ var SwitchController = class extends Controller {
     if (event.repeat) return;
     this.toggle();
   }
-  /**
-   * Re-derives the defaults and the field after the page changed the host, then
-   * reports a checked state that moved. Records still queued are read first, so
-   * an author's write is not lost when observation is suspended for this pass's
-   * own writes; observation resumes before the report, so an edit a listener
-   * makes is seen by the next pass.
-   */
   #reconcile() {
     this.#releaseAuthoredDefaults(this.#attributeObserver.takeRecords());
     this.#attributeObserver.disconnect();
@@ -179,14 +158,12 @@ var SwitchController = class extends Controller {
     this.#observeAttributes();
     this.#reportMove();
   }
-  /** Reports a checked state that moved since the one this switch last published. */
   #reportMove() {
     const checked = this.#checked;
     if (checked === this.#committedChecked) return;
     this.#committedChecked = checked;
     this.dispatch("reconcile", { detail: { checked } });
   }
-  /** Re-adds only missing defaults, preserving every authored attribute value. */
   #reconcileDefaults() {
     if (!this.#isSupportedHost) {
       this.#removeOwnedDefaults();
@@ -198,20 +175,20 @@ var SwitchController = class extends Controller {
       this.#setOwnedDefault("tabindex", "0");
     }
   }
-  /** Mirrors the checked state into the optional form field. */
   #mirrorField(notify) {
     if (!this.hasFieldTarget) return;
     const moved = writeField(this.fieldTarget, this.#checked ? "true" : "false");
     if (moved && notify) commitField(this.fieldTarget);
   }
-  /** Records a newly introduced default without claiming authored markup. */
   #setOwnedDefault(name, value) {
-    if (setDefaultAttribute(this.element, name, value)) this.#ownedDefaults.add(name);
+    if (setDefaultAttribute(this.element, name, value)) this.#ownedDefaults.set(name, value);
+  }
+  #releaseDefaultsRewrittenWhileAway() {
+    for (const [name, written] of this.#ownedDefaults) {
+      const value = this.element.getAttribute(name);
+      if (value !== null && value !== written) this.#ownedDefaults.delete(name);
+    }
   }
-  /**
-   * Gives ownership back when a retained-element morph authors a value. Missing
-   * owned attributes stay owned so reconciliation can restore them.
-   */
   #releaseAuthoredDefaults(records) {
     for (const record of records) {
       if (record.target === this.element) {
@@ -226,13 +203,10 @@ var SwitchController = class extends Controller {
     }
     this.#internalAttributeValues.clear();
   }
-  /** Removes only defaults introduced by this instance when a host becomes invalid. */
   #removeOwnedDefaults() {
-    for (const name of this.#ownedDefaults) this.element.removeAttribute(name);
+    for (const name of this.#ownedDefaults.keys()) this.element.removeAttribute(name);
     this.#ownedDefaults.clear();
-    this.#internalAttributeValues.clear();
   }
-  /** Watches retained host attributes that Turbo can morph without reconnecting. */
   #observeAttributes() {
     this.#attributeObserver.observe(this.element, {
       attributes: true,
@@ -247,12 +221,10 @@ var SwitchController = class extends Controller {
       ancestor = ancestor.parentElement;
     }
   }
-  /** Whether the host has one activation model that this controller can own. */
   get #isSupportedHost() {
     if (this.element instanceof HTMLButtonElement) return this.element.type === "button";
     return !isInteractiveHost(this.element);
   }
-  /** Whether ARIA or native HTML semantics make the supported switch inoperable. */
   get #isActivationDisabled() {
     let current = this.element;
     while (current) {
@@ -262,25 +234,26 @@ var SwitchController = class extends Controller {
     if (!(this.element instanceof HTMLButtonElement)) return false;
     return this.element.disabled || inheritsFieldsetDisabled(this.element);
   }
-  /** Whether the switch is currently on. */
   get #checked() {
     return this.element.getAttribute("aria-checked") === "true";
   }
-  /**
-   * Applies one toggle the user made. The state is taken as published before
-   * either report goes out, so a listener that toggles again or writes the
-   * attribute is measured from it.
-   */
   #commit(value) {
     const reflected = value ? "true" : "false";
     this.#internalAttributeValues.set("aria-checked", reflected);
+    if (this.#ownedDefaults.has("aria-checked")) this.#ownedDefaults.set("aria-checked", reflected);
     this.element.setAttribute("aria-checked", reflected);
+    const changed = value !== this.#committedChecked;
     this.#committedChecked = value;
+    if (!changed) {
+      this.#mirrorField(false);
+      return;
+    }
+    const token = this.#moves.record();
     this.#mirrorField(true);
+    if (!this.#moves.isLatest(token)) return;
     this.dispatch("change", { detail: { checked: value } });
   }
 };
 
 export { SwitchController };
-//# sourceMappingURL=switch_controller.js.map
 //# sourceMappingURL=switch_controller.js.map

data/dist/controllers/tabs_controller.js

@@ -1,33 +1,45 @@
 import { Controller } from '@hotwired/stimulus';
 
-// src/controllers/tabs_controller.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";
+}
+
+function actionSource(source) {
+  if (source instanceof HTMLElement) {
+    return { event: null, host: source, origin: source, reason: "api" };
+  }
+  const event = source ?? null;
+  return {
+    event,
+    host: event?.currentTarget instanceof Element ? event.currentTarget : null,
+    origin: event?.target instanceof Element ? event.target : null,
+    reason: stateReasonFor(event)
+  };
+}
 
-// src/utils/logical_scroll.ts
 function isRtl(element) {
   return window.getComputedStyle(element).direction === "rtl";
 }
 
-// src/utils/arrow_step.ts
 function isReservedArrowChord(event, allow = []) {
   if (!event.key.startsWith("Arrow")) return false;
   return event.altKey && !allow.includes("alt") || event.ctrlKey && !allow.includes("ctrl") || event.metaKey && !allow.includes("meta") || event.shiftKey && !allow.includes("shift");
 }
 
-// src/controllers/tabs_controller.ts
+function targetSelector(identifier, name) {
+  return `[data-${identifier}-target~="${name}"]`;
+}
+
 var TabsController = class extends Controller {
   static targets = ["tab", "panel", "list"];
   static actions = ["onKeydown", "select"];
   static events = ["change"];
-  /** Whether selection moves are reported: set once `connect()` settled the baseline. */
   #reporting = false;
-  /**
-   * Selects the initially active tab: the pre-selected one, else the first.
-   *
-   * `findIndex` makes this first-wins when the author marked several — the first
-   * in DOM order is the only deterministic reading of "which one did they mean" —
-   * and `#selectIndex` then writes an explicit value onto every tab, so a
-   * forgotten `aria-selected` cannot leave a tab looking unselectable.
-   */
   connect() {
     const preselected = this.tabTargets.findIndex(
       (tab) => tab.getAttribute("aria-selected") === "true"
@@ -35,19 +47,18 @@ var TabsController = class extends Controller {
     this.#selectIndex(preselected === -1 ? 0 : preselected, { focus: false });
     this.#reporting = true;
   }
-  /**
-   * Stops reporting until the next `connect()` has settled its baseline, so that
-   * normalization stays silent.
-   */
   disconnect() {
     this.#reporting = false;
   }
-  /** Selects the clicked tab. Bound via `data-action` (click). */
-  select(event) {
-    const index = this.tabTargets.indexOf(event.currentTarget);
-    if (index !== -1) this.#selectIndex(index, { focus: false });
+  select(source) {
+    const { host, origin, reason } = actionSource(source);
+    const tab = host?.closest(targetSelector(this.identifier, "tab"));
+    if (!tab || !this.tabTargets.includes(tab)) return;
+    if (origin && origin.closest(`[data-controller~="${this.identifier}"]`) !== this.element)
+      return;
+    const index = this.tabTargets.indexOf(tab);
+    this.#selectIndex(index, { focus: false }, reason);
   }
-  /** Implements arrow/Home/End navigation with automatic activation. */
   onKeydown(event) {
     if (event.defaultPrevented) return;
     if (isReservedArrowChord(event)) return;
@@ -75,11 +86,7 @@ var TabsController = class extends Controller {
     event.preventDefault();
     this.#selectIndex(nextIndex, { focus: true });
   }
-  /**
-   * Activates the tab/panel pair at `index`: updates `aria-selected`, the roving
-   * `tabindex`, and panel visibility. Optionally moves focus to the new tab.
-   */
-  #selectIndex(index, { focus }) {
+  #selectIndex(index, { focus }, reason = "user") {
     const tabs = this.tabTargets;
     const previous = tabs.findIndex((tab) => tab.getAttribute("aria-selected") === "true");
     tabs.forEach((tab, i) => {
@@ -92,7 +99,7 @@ var TabsController = class extends Controller {
     });
     if (previous !== index && this.#reporting) {
       this.dispatch("change", {
-        detail: { index, total: tabs.length, previous },
+        detail: { index, total: tabs.length, previous, reason },
         cancelable: false
       });
     }
@@ -101,5 +108,4 @@ var TabsController = class extends Controller {
 };
 
 export { TabsController };
-//# sourceMappingURL=tabs_controller.js.map
 //# sourceMappingURL=tabs_controller.js.map