@als-tp/als-react-ts-ui 0.5.0 → 0.5.1

package/dist/als-react-ts-ui377.js

@@ -1,16 +1,155 @@
-let n = 0;
-function r(c, o = {}) {
-  const {
-    preventScroll: s = !1,
-    cancelPrevious: t = !0,
-    sync: a = !1
-  } = o;
-  t && cancelAnimationFrame(n);
-  const e = () => c?.focus({
-    preventScroll: s
+import * as k from "react";
+import * as ee from "react-dom";
+import { isElement as te } from "./als-react-ts-ui320.js";
+import { useValueAsRef as _ } from "./als-react-ts-ui318.js";
+import { useStableCallback as I } from "./als-react-ts-ui266.js";
+import { createChangeEventDetails as y } from "./als-react-ts-ui229.js";
+import { getDelay as F } from "./als-react-ts-ui378.js";
+import { useFloatingTree as re } from "./als-react-ts-ui364.js";
+import { useHoverInteractionSharedState as ne, safePolygonIdentifier as oe } from "./als-react-ts-ui376.js";
+import { triggerHover as C } from "./als-react-ts-ui231.js";
+import { getDocument as q, contains as L } from "./als-react-ts-ui312.js";
+import { isMouseLikePointerType as z } from "./als-react-ts-ui280.js";
+function N(l) {
+  return typeof l == "function" ? l() : l;
+}
+function pe(l, B = {}) {
+  const t = "rootStore" in l ? l.rootStore : l, {
+    dataRef: a,
+    events: H
+  } = t.context, {
+    enabled: O = !0,
+    delay: G = 0,
+    handleClose: J = null,
+    mouseOnly: x = !1,
+    restMs: K = 0,
+    move: A = !0,
+    triggerElement: V = null,
+    externalTree: Q,
+    isActiveTrigger: X = !0
+  } = B, Y = re(Q), {
+    pointerTypeRef: o,
+    interactedInsideRef: U,
+    handlerRef: p,
+    blockMouseMoveRef: E,
+    performedPointerEventsMutationRef: W,
+    unbindMouseMoveRef: D,
+    restTimeoutPendingRef: f,
+    openChangeTimeout: s,
+    restTimeout: m,
+    handleCloseOptionsRef: Z
+  } = ne(t), v = _(J), R = _(G), M = _(K);
+  X && (Z.current = v.current?.__options);
+  const T = I(() => U.current ? !0 : a.current.openEvent ? ["click", "mousedown"].includes(a.current.openEvent.type) : !1), b = k.useCallback((e, r = !0) => {
+    const g = F(R.current, "close", o.current);
+    g && !p.current ? s.start(g, () => t.setOpen(!1, y(C, e))) : r && (s.clear(), t.setOpen(!1, y(C, e)));
+  }, [R, p, t, o, s]), w = I(() => {
+    D.current(), p.current = void 0;
+  }), P = I(() => {
+    if (W.current) {
+      const e = q(t.select("domReferenceElement")).body;
+      e.style.pointerEvents = "", e.removeAttribute(oe), W.current = !1;
+    }
+  });
+  k.useEffect(() => {
+    if (!O)
+      return;
+    function e(r) {
+      r.open || (s.clear(), m.clear(), E.current = !0, f.current = !1);
+    }
+    return H.on("openchange", e), () => {
+      H.off("openchange", e);
+    };
+  }, [O, H, s, m, E, f]);
+  const j = I((e) => {
+    if (T() || !a.current.floatingContext)
+      return;
+    const r = t.context.triggerElements;
+    e.relatedTarget && r.hasElement(e.relatedTarget) || v.current?.({
+      ...a.current.floatingContext,
+      tree: Y,
+      x: e.clientX,
+      y: e.clientY,
+      onClose() {
+        P(), w(), T() || b(e);
+      }
+    })(e);
   });
-  a ? e() : n = requestAnimationFrame(e);
+  return k.useEffect(() => {
+    if (!O)
+      return;
+    const e = V ?? (X ? t.select("domReferenceElement") : null);
+    if (!te(e))
+      return;
+    function r(n) {
+      if (s.clear(), E.current = !1, x && !z(o.current) || N(M.current) > 0 && !F(R.current, "open"))
+        return;
+      const d = F(R.current, "open", o.current), c = t.select("domReferenceElement"), u = t.context.triggerElements, h = (u.hasElement(n.target) || u.hasMatchingElement(($) => L($, n.target))) && (!c || !L(c, n.target)), i = n.currentTarget ?? null;
+      d ? s.start(d, () => {
+        t.select("open") || t.setOpen(!0, y(C, n, i));
+      }) : (!t.select("open") || h) && t.setOpen(!0, y(C, n, i));
+    }
+    function g(n) {
+      if (T()) {
+        P();
+        return;
+      }
+      D.current();
+      const d = t.select("domReferenceElement"), c = q(d);
+      m.clear(), f.current = !1;
+      const u = t.context.triggerElements;
+      if (n.relatedTarget && u.hasElement(n.relatedTarget))
+        return;
+      if (v.current && a.current.floatingContext) {
+        t.select("open") || s.clear(), p.current = v.current({
+          ...a.current.floatingContext,
+          tree: Y,
+          x: n.clientX,
+          y: n.clientY,
+          onClose() {
+            P(), w(), T() || b(n, !0);
+          }
+        });
+        const i = p.current;
+        i(n), c.addEventListener("mousemove", i), D.current = () => {
+          c.removeEventListener("mousemove", i);
+        };
+        return;
+      }
+      (o.current === "touch" ? !L(t.select("floatingElement"), n.relatedTarget) : !0) && b(n);
+    }
+    function S(n) {
+      j(n);
+    }
+    return t.select("open") && e.addEventListener("mouseleave", S), A && e.addEventListener("mousemove", r, {
+      once: !0
+    }), e.addEventListener("mouseenter", r), e.addEventListener("mouseleave", g), () => {
+      e.removeEventListener("mouseleave", S), A && e.removeEventListener("mousemove", r), e.removeEventListener("mouseenter", r), e.removeEventListener("mouseleave", g);
+    };
+  }, [w, P, E, a, R, b, t, O, v, j, X, T, x, A, o, M, m, f, s, V, Y, D, p]), k.useMemo(() => {
+    function e(r) {
+      o.current = r.pointerType;
+    }
+    return {
+      onPointerDown: e,
+      onPointerEnter: e,
+      onMouseMove(r) {
+        const {
+          nativeEvent: g
+        } = r, S = r.currentTarget, n = t.select("domReferenceElement"), d = t.context.triggerElements, c = t.select("open"), u = (d.hasElement(r.target) || d.hasMatchingElement((i) => L(i, r.target))) && (!n || !L(n, r.target));
+        if (x && !z(o.current) || c && !u || N(M.current) === 0 || !u && f.current && r.movementX ** 2 + r.movementY ** 2 < 2)
+          return;
+        m.clear();
+        function h() {
+          !E.current && (!c || u) && t.setOpen(!0, y(C, g, S));
+        }
+        o.current === "touch" ? ee.flushSync(() => {
+          h();
+        }) : u && c ? h() : (f.current = !0, m.start(N(M.current), h));
+      }
+    };
+  }, [E, x, t, o, M, m, f]);
 }
 export {
-  r as enqueueFocus
+  pe as useHoverReferenceInteraction
 };

package/dist/als-react-ts-ui378.js

@@ -1,50 +1,200 @@
-import { getNodeName as V } from "./als-react-ts-ui339.js";
-import { getDocument as y } from "./als-react-ts-ui331.js";
-const u = {
-  inert: /* @__PURE__ */ new WeakMap(),
-  "aria-hidden": /* @__PURE__ */ new WeakMap(),
-  none: /* @__PURE__ */ new WeakMap()
-};
-function S(r) {
-  return r === "inert" ? u.inert : r === "aria-hidden" ? u["aria-hidden"] : u.none;
+import * as i from "react";
+import { isElement as ee } from "./als-react-ts-ui320.js";
+import { useTimeout as te } from "./als-react-ts-ui297.js";
+import { useValueAsRef as q } from "./als-react-ts-ui318.js";
+import { useStableCallback as D } from "./als-react-ts-ui266.js";
+import { useIsoLayoutEffect as ne } from "./als-react-ts-ui267.js";
+import { useFloatingTree as ce, useFloatingParentNodeId as fe } from "./als-react-ts-ui364.js";
+import { createChangeEventDetails as h } from "./als-react-ts-ui229.js";
+import { createAttribute as le } from "./als-react-ts-ui361.js";
+import { TYPEABLE_SELECTOR as ae } from "./als-react-ts-ui379.js";
+import { isMouseLikePointerType as K } from "./als-react-ts-ui280.js";
+import { getDocument as X, getTarget as me, contains as z } from "./als-react-ts-ui312.js";
+import { triggerHover as C } from "./als-react-ts-ui231.js";
+const re = le("safe-polygon"), de = `button,[role="button"],select,[tabindex]:not([tabindex="-1"]),${ae}`;
+function Ee(o) {
+  return o ? !!o.closest(de) : !1;
 }
-let h = /* @__PURE__ */ new WeakSet(), d = {}, m = 0;
-const E = (r) => r && (r.host || E(r.parentNode)), C = (r, o) => o.map((n) => {
-  if (r.contains(n))
-    return n;
-  const i = E(n);
-  return r.contains(i) ? i : null;
-}).filter((n) => n != null);
-function T(r, o, n, i) {
-  const c = "data-base-ui-inert", a = i ? "inert" : n ? "aria-hidden" : null, w = C(o, r), l = /* @__PURE__ */ new Set(), N = new Set(w), M = [];
-  d[c] || (d[c] = /* @__PURE__ */ new WeakMap());
-  const p = d[c];
-  w.forEach(b), A(o), l.clear();
-  function b(t) {
-    !t || l.has(t) || (l.add(t), t.parentNode && b(t.parentNode));
-  }
-  function A(t) {
-    !t || N.has(t) || [].forEach.call(t.children, (e) => {
-      if (V(e) !== "script")
-        if (l.has(e))
-          A(e);
-        else {
-          const k = a ? e.getAttribute(a) : null, s = k !== null && k !== "false", f = S(a), W = (f.get(e) || 0) + 1, g = (p.get(e) || 0) + 1;
-          f.set(e, W), p.set(e, g), M.push(e), W === 1 && s && h.add(e), g === 1 && e.setAttribute(c, ""), !s && a && e.setAttribute(a, a === "inert" ? "" : "true");
-        }
-    });
+function G(o, w, n) {
+  if (n && !K(n))
+    return 0;
+  if (typeof o == "number")
+    return o;
+  if (typeof o == "function") {
+    const s = o();
+    return typeof s == "number" ? s : s?.[w];
   }
-  return m += 1, () => {
-    M.forEach((t) => {
-      const e = S(a), s = (e.get(t) || 0) - 1, f = (p.get(t) || 0) - 1;
-      e.set(t, s), p.set(t, f), s || (!h.has(t) && a && t.removeAttribute(a), h.delete(t)), f || t.removeAttribute(c);
-    }), m -= 1, m || (u.inert = /* @__PURE__ */ new WeakMap(), u["aria-hidden"] = /* @__PURE__ */ new WeakMap(), u.none = /* @__PURE__ */ new WeakMap(), h = /* @__PURE__ */ new WeakSet(), d = {});
-  };
+  return o?.[w];
 }
-function O(r, o = !1, n = !1) {
-  const i = y(r[0]).body;
-  return T(r.concat(Array.from(i.querySelectorAll("[aria-live]"))), i, o, n);
+function J(o) {
+  return typeof o == "function" ? o() : o;
+}
+function xe(o, w = {}) {
+  const n = "rootStore" in o ? o.rootStore : o, s = n.useState("open"), a = n.useState("floatingElement"), b = n.useState("domReferenceElement"), {
+    dataRef: p,
+    events: _
+  } = n.context, {
+    enabled: l = !0,
+    delay: oe = 0,
+    handleClose: se = null,
+    mouseOnly: A = !1,
+    restMs: ue = 0,
+    move: B = !0,
+    triggerElement: Q = null,
+    externalTree: ie
+  } = w, O = ce(ie), U = fe(), v = q(se), x = q(oe), P = q(ue), g = i.useRef(void 0), I = i.useRef(!1), f = te(), F = i.useRef(void 0), m = te(), N = i.useRef(!0), V = i.useRef(!1), W = i.useRef(() => {
+  }), S = i.useRef(!1), H = D(() => {
+    const t = p.current.openEvent?.type;
+    return t?.includes("mouse") && t !== "mousedown";
+  }), y = D(() => I.current ? !0 : p.current.openEvent ? ["click", "mousedown"].includes(p.current.openEvent.type) : !1);
+  i.useEffect(() => {
+    if (!l)
+      return;
+    function t(r) {
+      r.open || (f.clear(), m.clear(), N.current = !0, S.current = !1);
+    }
+    return _.on("openchange", t), () => {
+      _.off("openchange", t);
+    };
+  }, [l, _, f, m]), i.useEffect(() => {
+    if (!l || !v.current || !s)
+      return;
+    function t(u) {
+      y() || H() && n.setOpen(!1, h(C, u, u.currentTarget ?? void 0));
+    }
+    const r = X(a).documentElement;
+    return r.addEventListener("mouseleave", t), () => {
+      r.removeEventListener("mouseleave", t);
+    };
+  }, [a, s, n, l, v, H, y]);
+  const k = i.useCallback((t, r = !0) => {
+    const u = G(x.current, "close", g.current);
+    u && !F.current ? f.start(u, () => n.setOpen(!1, h(C, t))) : r && (f.clear(), n.setOpen(!1, h(C, t)));
+  }, [x, n, f]), R = D(() => {
+    W.current(), F.current = void 0;
+  }), d = D(() => {
+    if (V.current) {
+      const t = X(a).body;
+      t.style.pointerEvents = "", t.removeAttribute(re), V.current = !1;
+    }
+  }), $ = D((t) => {
+    const r = me(t);
+    if (!Ee(r)) {
+      I.current = !1;
+      return;
+    }
+    I.current = !0;
+  });
+  i.useEffect(() => {
+    if (!l)
+      return;
+    function t(e) {
+      if (f.clear(), N.current = !1, A && !K(g.current) || J(P.current) > 0 && !G(x.current, "open"))
+        return;
+      const M = G(x.current, "open", g.current), T = e.currentTarget ?? void 0, j = n.select("domReferenceElement"), Y = j && T && !z(j, T);
+      M ? f.start(M, () => {
+        n.select("open") || n.setOpen(!0, h(C, e, T));
+      }) : (!s || Y) && n.setOpen(!0, h(C, e, T));
+    }
+    function r(e) {
+      if (y()) {
+        d();
+        return;
+      }
+      W.current();
+      const M = X(a);
+      m.clear(), S.current = !1;
+      const T = n.context.triggerElements;
+      if (e.relatedTarget && T.hasElement(e.relatedTarget))
+        return;
+      if (v.current && p.current.floatingContext) {
+        s || f.clear(), F.current = v.current({
+          ...p.current.floatingContext,
+          tree: O,
+          x: e.clientX,
+          y: e.clientY,
+          onClose() {
+            d(), R(), y() || k(e, !0);
+          }
+        });
+        const Y = F.current;
+        M.addEventListener("mousemove", Y), W.current = () => {
+          M.removeEventListener("mousemove", Y);
+        };
+        return;
+      }
+      (g.current === "touch" ? !z(a, e.relatedTarget) : !0) && k(e);
+    }
+    function u(e) {
+      if (y() || !p.current.floatingContext)
+        return;
+      const M = n.context.triggerElements;
+      e.relatedTarget && M.hasElement(e.relatedTarget) || v.current?.({
+        ...p.current.floatingContext,
+        tree: O,
+        x: e.clientX,
+        y: e.clientY,
+        onClose() {
+          d(), R(), y() || k(e);
+        }
+      })(e);
+    }
+    function L() {
+      f.clear(), d();
+    }
+    function E(e) {
+      y() || k(e, !1);
+    }
+    const c = Q ?? b;
+    if (ee(c)) {
+      const e = a;
+      return s && c.addEventListener("mouseleave", u), B && c.addEventListener("mousemove", t, {
+        once: !0
+      }), c.addEventListener("mouseenter", t), c.addEventListener("mouseleave", r), e && (e.addEventListener("mouseleave", u), e.addEventListener("mouseenter", L), e.addEventListener("mouseleave", E), e.addEventListener("pointerdown", $, !0)), () => {
+        s && c.removeEventListener("mouseleave", u), B && c.removeEventListener("mousemove", t), c.removeEventListener("mouseenter", t), c.removeEventListener("mouseleave", r), e && (e.removeEventListener("mouseleave", u), e.removeEventListener("mouseenter", L), e.removeEventListener("mouseleave", E), e.removeEventListener("pointerdown", $, !0));
+      };
+    }
+  }, [l, A, B, b, a, Q, n, k, R, d, s, O, x, v, p, y, P, f, m, $]), ne(() => {
+    if (l && s && v.current?.__options?.blockPointerEvents && H()) {
+      V.current = !0;
+      const t = a;
+      if (ee(b) && t) {
+        const r = X(a).body;
+        r.setAttribute(re, "");
+        const u = b, L = O?.nodesRef.current.find((E) => E.id === U)?.context?.elements.floating;
+        return L && (L.style.pointerEvents = ""), r.style.pointerEvents = "none", u.style.pointerEvents = "auto", t.style.pointerEvents = "auto", () => {
+          r.style.pointerEvents = "", u.style.pointerEvents = "", t.style.pointerEvents = "";
+        };
+      }
+    }
+  }, [l, s, U, O, v, H, b, a]), ne(() => {
+    s || (g.current = void 0, S.current = !1, I.current = !1, R(), d());
+  }, [s, R, d]), i.useEffect(() => () => {
+    R(), f.clear(), m.clear(), I.current = !1;
+  }, [l, b, R, f, m]), i.useEffect(() => d, [d]);
+  const Z = i.useMemo(() => {
+    function t(r) {
+      g.current = r.pointerType;
+    }
+    return {
+      onPointerDown: t,
+      onPointerEnter: t,
+      onMouseMove(r) {
+        const {
+          nativeEvent: u
+        } = r, L = r.currentTarget, E = n.select("domReferenceElement") && !z(n.select("domReferenceElement"), r.target);
+        function c() {
+          !N.current && (!n.select("open") || E) && n.setOpen(!0, h(C, u, L));
+        }
+        A && !K(g.current) || n.select("open") && !E || J(P.current) === 0 || !E && S.current && r.movementX ** 2 + r.movementY ** 2 < 2 || (m.clear(), g.current === "touch" || E ? c() : (S.current = !0, m.start(J(P.current), c)));
+      }
+    };
+  }, [A, n, P, m]);
+  return i.useMemo(() => l ? {
+    reference: Z
+  } : {}, [l, Z]);
 }
 export {
-  O as markOthers
+  G as getDelay,
+  xe as useHover
 };

package/dist/als-react-ts-ui379.js

@@ -1,6 +1,11 @@
-function n(r) {
-  return r == null ? r : "current" in r ? r.current : r;
-}
+const t = "data-base-ui-focusable", e = "active", o = "selected", n = "input:not([type='hidden']):not([disabled]),[contenteditable]:not([contenteditable='false']),textarea:not([disabled])", s = "ArrowLeft", c = "ArrowRight", E = "ArrowUp", a = "ArrowDown";
 export {
-  n as resolveRef
+  e as ACTIVE_KEY,
+  a as ARROW_DOWN,
+  s as ARROW_LEFT,
+  c as ARROW_RIGHT,
+  E as ARROW_UP,
+  t as FOCUSABLE_ATTRIBUTE,
+  o as SELECTED_KEY,
+  n as TYPEABLE_SELECTOR
 };