stimeo-ui 0.1.0.pre.alpha.1

data/dist/controllers/tooltip_controller.js

@@ -0,0 +1,165 @@
+import { Controller } from '@hotwired/stimulus';
+
+// src/controllers/tooltip_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/tooltip_controller.ts
+var TooltipController = class extends Controller {
+  static targets = ["trigger", "content"];
+  static values = {
+    showDelay: { type: Number, default: 0 },
+    hideDelay: { type: Number, default: 0 }
+  };
+  static actions = ["hide", "onKeydown", "show"];
+  /** Pending show/hide timers, torn down together on disconnect. */
+  #timers = new SafeTimeout();
+  /** The id of the currently pending show or hide timer, if any. */
+  #pendingShow = null;
+  #pendingHide = null;
+  /** Starts hidden. */
+  connect() {
+    this.#conceal();
+  }
+  /** Clears timers and the document `Escape` listener so nothing outlives the element. */
+  disconnect() {
+    this.#timers.clearAll();
+    document.removeEventListener("keydown", this.#onDocumentKeydown);
+  }
+  /** Shows the tooltip, after `showDelay` ms (or immediately at 0). Cancels a pending hide. */
+  show() {
+    this.#cancelHide();
+    if (this.#isVisible || this.#pendingShow !== null) return;
+    if (this.showDelayValue <= 0) {
+      this.#reveal();
+      return;
+    }
+    this.#pendingShow = this.#timers.set(() => {
+      this.#pendingShow = null;
+      this.#reveal();
+    }, this.showDelayValue);
+  }
+  /** Hides the tooltip, after `hideDelay` ms (or immediately at 0). Cancels a pending show. */
+  hide() {
+    this.#cancelShow();
+    if (!this.#isVisible || this.#pendingHide !== null) return;
+    if (this.hideDelayValue <= 0) {
+      this.#conceal();
+      return;
+    }
+    this.#pendingHide = this.#timers.set(() => {
+      this.#pendingHide = null;
+      this.#conceal();
+    }, this.hideDelayValue);
+  }
+  /**
+   * Dismisses the tooltip on `Escape` from the trigger. The authoritative
+   * dismissal path is the document-level listener (added while shown) so a
+   * hover-triggered tooltip is dismissible regardless of focus; this handler
+   * keeps the documented `keydown->#onKeydown` binding meaningful too.
+   */
+  onKeydown(event) {
+    if (event.key === "Escape" && this.#isVisible) {
+      event.preventDefault();
+      this.#cancelShow();
+      this.#cancelHide();
+      this.#conceal();
+    }
+  }
+  /** Reveals the content and starts watching for a dismissing `Escape`. */
+  #reveal() {
+    if (!this.hasContentTarget) return;
+    this.contentTarget.hidden = false;
+    this.contentTarget.setAttribute("data-state", "open");
+    document.addEventListener("keydown", this.#onDocumentKeydown);
+  }
+  /** Hides the content and stops watching for `Escape`. */
+  #conceal() {
+    if (!this.hasContentTarget) return;
+    this.contentTarget.hidden = true;
+    this.contentTarget.setAttribute("data-state", "closed");
+    document.removeEventListener("keydown", this.#onDocumentKeydown);
+  }
+  /** Document-level `Escape` watcher (active only while shown). */
+  #onDocumentKeydown = (event) => {
+    if (event.key === "Escape") {
+      event.preventDefault();
+      this.#cancelShow();
+      this.#cancelHide();
+      this.#conceal();
+    }
+  };
+  /** Cancels any pending show timer. */
+  #cancelShow() {
+    if (this.#pendingShow !== null) {
+      this.#timers.clear(this.#pendingShow);
+      this.#pendingShow = null;
+    }
+  }
+  /** Cancels any pending hide timer. */
+  #cancelHide() {
+    if (this.#pendingHide !== null) {
+      this.#timers.clear(this.#pendingHide);
+      this.#pendingHide = null;
+    }
+  }
+  /** Whether the tooltip is currently shown. */
+  get #isVisible() {
+    return this.hasContentTarget && !this.contentTarget.hidden;
+  }
+};
+
+export { TooltipController };
+//# sourceMappingURL=tooltip_controller.js.map
+//# sourceMappingURL=tooltip_controller.js.map

data/dist/controllers/transition_controller.js

@@ -0,0 +1,203 @@
+import { Controller } from '@hotwired/stimulus';
+
+// src/controllers/transition_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/transition_controller.ts
+var tokensOf = (value) => value.split(/\s+/).filter(Boolean);
+var firstTimeMs = (value) => {
+  const first = value.split(",")[0]?.trim() ?? "";
+  const amount = Number.parseFloat(first);
+  if (Number.isNaN(amount)) return 0;
+  return first.endsWith("ms") ? amount : amount * 1e3;
+};
+var TransitionController = class extends Controller {
+  static values = {
+    enter: { type: String, default: "" },
+    enterFrom: { type: String, default: "" },
+    enterTo: { type: String, default: "" },
+    leave: { type: String, default: "" },
+    leaveFrom: { type: String, default: "" },
+    leaveTo: { type: String, default: "" },
+    timeout: { type: Number, default: 0 }
+  };
+  static actions = ["enter", "leave", "toggle"];
+  static events = ["entered", "left"];
+  #timers = new SafeTimeout();
+  #rafId = null;
+  #endListener = null;
+  connect() {
+    this.#strip();
+    this.element.setAttribute("data-transition-state", this.element.hidden ? "left" : "entered");
+  }
+  disconnect() {
+    this.#cancel();
+  }
+  /** Shows the element with the enter transition. */
+  enter() {
+    this.#run("enter");
+  }
+  /** Hides the element with the leave transition. */
+  leave() {
+    this.#run("leave");
+  }
+  /** Reverses the current direction (enter when hidden/leaving, else leave). */
+  toggle() {
+    const state = this.element.getAttribute("data-transition-state");
+    if (state === "entered" || state === "entering") this.leave();
+    else this.enter();
+  }
+  #run(kind) {
+    this.#cancel();
+    const isEnter = kind === "enter";
+    if (isEnter) this.element.hidden = false;
+    this.element.setAttribute("data-transition-state", isEnter ? "entering" : "leaving");
+    if (this.#prefersReducedMotion()) {
+      this.#finish(kind);
+      return;
+    }
+    const base = isEnter ? this.enterValue : this.leaveValue;
+    const from = isEnter ? this.enterFromValue : this.leaveFromValue;
+    const to = isEnter ? this.enterToValue : this.leaveToValue;
+    this.#add(base, from);
+    this.#rafId = this.#raf(() => {
+      this.#rafId = null;
+      this.#remove(from);
+      this.#add(to);
+      this.#awaitEnd(() => this.#finish(kind));
+    });
+  }
+  /** Settles the element into the completed state, clearing the stage classes. */
+  #finish(kind) {
+    this.#cleanupEnd();
+    this.#strip();
+    if (kind === "enter") {
+      this.element.setAttribute("data-transition-state", "entered");
+      this.dispatch("entered", { detail: {} });
+    } else {
+      this.element.hidden = true;
+      this.element.setAttribute("data-transition-state", "left");
+      this.dispatch("left", { detail: {} });
+    }
+  }
+  /** Resolves on the element's own `transitionend`, with a safety timeout fallback. */
+  #awaitEnd(done) {
+    this.#endListener = (event) => {
+      if (event.target === this.element) done();
+    };
+    this.element.addEventListener("transitionend", this.#endListener);
+    const ms = this.timeoutValue > 0 ? this.timeoutValue : this.#duration();
+    this.#timers.set(done, ms);
+  }
+  #cleanupEnd() {
+    if (this.#endListener) {
+      this.element.removeEventListener("transitionend", this.#endListener);
+      this.#endListener = null;
+    }
+    this.#timers.clearAll();
+  }
+  /** Cancels any in-flight transition (interruption / teardown). */
+  #cancel() {
+    if (this.#rafId !== null) {
+      this.#cancelRaf(this.#rafId);
+      this.#rafId = null;
+    }
+    this.#cleanupEnd();
+    this.#strip();
+  }
+  #add(...lists) {
+    const tokens = lists.flatMap(tokensOf);
+    if (tokens.length > 0) this.element.classList.add(...tokens);
+  }
+  #remove(...lists) {
+    const tokens = lists.flatMap(tokensOf);
+    if (tokens.length > 0) this.element.classList.remove(...tokens);
+  }
+  /** Removes every stage class so no half-applied state lingers. */
+  #strip() {
+    this.#remove(
+      this.enterValue,
+      this.enterFromValue,
+      this.enterToValue,
+      this.leaveValue,
+      this.leaveFromValue,
+      this.leaveToValue
+    );
+  }
+  /** Auto-computed safety duration (transition time + delay, with a small buffer). */
+  #duration() {
+    if (typeof window.getComputedStyle !== "function") return 0;
+    const style = window.getComputedStyle(this.element);
+    const total = firstTimeMs(style.transitionDuration) + firstTimeMs(style.transitionDelay);
+    return total > 0 ? total + 50 : 0;
+  }
+  #raf(callback) {
+    if (typeof window.requestAnimationFrame === "function") {
+      return window.requestAnimationFrame(() => callback());
+    }
+    return window.setTimeout(callback, 0);
+  }
+  #cancelRaf(id) {
+    if (typeof window.cancelAnimationFrame === "function") window.cancelAnimationFrame(id);
+    else window.clearTimeout(id);
+  }
+  #prefersReducedMotion() {
+    return typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+  }
+};
+
+export { TransitionController };
+//# sourceMappingURL=transition_controller.js.map
+//# sourceMappingURL=transition_controller.js.map