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

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

@@ -1,81 +1,41 @@
-import * as a from "react";
-import { useRefWithInit as T } from "./als-react-ts-ui240.js";
-import { useStableCallback as l } from "./als-react-ts-ui192.js";
-import { useIsoLayoutEffect as f } from "./als-react-ts-ui193.js";
-import { CompositeListContext as D } from "./als-react-ts-ui345.js";
-import { jsx as L } from "react/jsx-runtime";
-function k(h) {
+import * as i from "react";
+import { jsx as a } from "react/jsx-runtime";
+const c = /* @__PURE__ */ i.forwardRef(function(r, n) {
   const {
-    children: N,
-    elementsRef: t,
-    labelsRef: o,
-    onMapChange: _
-  } = h, E = l(_), O = a.useRef(0), d = T(R).current, i = T(P).current, [p, M] = a.useState(0), c = a.useRef(p), C = l((e, u) => {
-    i.set(e, u ?? null), c.current += 1, M(c.current);
-  }), I = l((e) => {
-    i.delete(e), c.current += 1, M(c.current);
-  }), r = a.useMemo(() => {
-    const e = /* @__PURE__ */ new Map();
-    return Array.from(i.keys()).sort(S).forEach((n, m) => {
-      const s = i.get(n) ?? {};
-      e.set(n, {
-        ...s,
-        index: m
-      });
-    }), e;
-  }, [i, p]);
-  f(() => {
-    if (typeof MutationObserver != "function" || r.size === 0)
-      return;
-    const e = new MutationObserver((u) => {
-      const n = /* @__PURE__ */ new Set(), m = (s) => n.has(s) ? n.delete(s) : n.add(s);
-      u.forEach((s) => {
-        s.removedNodes.forEach(m), s.addedNodes.forEach(m);
-      }), n.size === 0 && (c.current += 1, M(c.current));
-    });
-    return r.forEach((u, n) => {
-      n.parentElement && e.observe(n.parentElement, {
-        childList: !0
-      });
-    }), () => {
-      e.disconnect();
-    };
-  }, [r]), f(() => {
-    c.current === p && (t.current.length !== r.size && (t.current.length = r.size), o && o.current.length !== r.size && (o.current.length = r.size), O.current = r.size), E(r);
-  }, [E, r, t, o, p]), f(() => () => {
-    t.current = [];
-  }, [t]), f(() => () => {
-    o && (o.current = []);
-  }, [o]);
-  const g = l((e) => (d.add(e), () => {
-    d.delete(e);
-  }));
-  f(() => {
-    d.forEach((e) => e(r));
-  }, [d, r]);
-  const b = a.useMemo(() => ({
-    register: C,
-    unregister: I,
-    subscribeMapChange: g,
-    elementsRef: t,
-    labelsRef: o,
-    nextIndexRef: O
-  }), [C, I, g, t, o, O]);
-  return /* @__PURE__ */ L(D.Provider, {
-    value: b,
-    children: N
+    cutout: e,
+    ...p
+  } = r;
+  let o;
+  if (e) {
+    const t = e?.getBoundingClientRect();
+    o = `polygon(
+      0% 0%,
+      100% 0%,
+      100% 100%,
+      0% 100%,
+      0% 0%,
+      ${t.left}px ${t.top}px,
+      ${t.left}px ${t.bottom}px,
+      ${t.right}px ${t.bottom}px,
+      ${t.right}px ${t.top}px,
+      ${t.left}px ${t.top}px
+    )`;
+  }
+  return /* @__PURE__ */ a("div", {
+    ref: n,
+    role: "presentation",
+    "data-base-ui-inert": "",
+    ...p,
+    style: {
+      position: "fixed",
+      inset: 0,
+      userSelect: "none",
+      WebkitUserSelect: "none",
+      clipPath: o
+    }
   });
-}
-function P() {
-  return /* @__PURE__ */ new Map();
-}
-function R() {
-  return /* @__PURE__ */ new Set();
-}
-function S(h, N) {
-  const t = h.compareDocumentPosition(N);
-  return t & Node.DOCUMENT_POSITION_FOLLOWING || t & Node.DOCUMENT_POSITION_CONTAINED_BY ? -1 : t & Node.DOCUMENT_POSITION_PRECEDING || t & Node.DOCUMENT_POSITION_CONTAINS ? 1 : 0;
-}
+});
+process.env.NODE_ENV !== "production" && (c.displayName = "InternalBackdrop");
 export {
-  k as CompositeList
+  c as InternalBackdrop
 };

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

@@ -1,10 +1,127 @@
 import * as t from "react";
-const e = /* @__PURE__ */ t.createContext(void 0);
-process.env.NODE_ENV !== "production" && (e.displayName = "DirectionContext");
-function o() {
-  return t.useContext(e)?.direction ?? "ltr";
+import * as h from "react-dom";
+import { isNode as M } from "./als-react-ts-ui338.js";
+import { useId as D } from "./als-react-ts-ui335.js";
+import { useIsoLayoutEffect as V } from "./als-react-ts-ui224.js";
+import { FocusGuard as S } from "./als-react-ts-ui354.js";
+import { createChangeEventDetails as w } from "./als-react-ts-ui273.js";
+import { createAttribute as G } from "./als-react-ts-ui377.js";
+import { useRenderElement as _ } from "./als-react-ts-ui220.js";
+import { ownerVisuallyHidden as j } from "./als-react-ts-ui287.js";
+import { jsxs as T, jsx as P } from "react/jsx-runtime";
+import { enableFocusInside as I, isOutsideEvent as g, getPreviousTabbable as q, getNextTabbable as A, disableFocusInside as B } from "./als-react-ts-ui357.js";
+import { EMPTY_OBJECT as H } from "./als-react-ts-ui322.js";
+import { focusOut as J } from "./als-react-ts-ui275.js";
+const F = /* @__PURE__ */ t.createContext(null);
+process.env.NODE_ENV !== "production" && (F.displayName = "PortalContext");
+const Y = () => t.useContext(F), k = G("portal");
+function z(N = {}) {
+  const {
+    ref: f,
+    container: s,
+    componentProps: b = H,
+    elementProps: E,
+    elementState: x
+  } = N, d = D(), m = Y()?.portalNode, [e, c] = t.useState(null), [p, u] = t.useState(null), n = t.useRef(null);
+  V(() => {
+    if (s === null) {
+      n.current && (n.current = null, u(null), c(null));
+      return;
+    }
+    if (d == null)
+      return;
+    const a = (s && (M(s) ? s : s.current)) ?? m ?? document.body;
+    if (a == null) {
+      n.current && (n.current = null, u(null), c(null));
+      return;
+    }
+    n.current !== a && (n.current = a, u(null), c(a));
+  }, [s, m, d]);
+  const i = _("div", b, {
+    ref: [f, u],
+    state: x,
+    props: [{
+      id: d,
+      [k]: ""
+    }, E]
+  });
+  return {
+    portalNode: p,
+    portalSubtree: e && i ? /* @__PURE__ */ h.createPortal(i, e) : null
+  };
 }
+const K = /* @__PURE__ */ t.forwardRef(function(f, s) {
+  const {
+    children: b,
+    container: E,
+    className: x,
+    render: d,
+    renderGuards: R,
+    ...m
+  } = f, {
+    portalNode: e,
+    portalSubtree: c
+  } = z({
+    container: E,
+    ref: s,
+    componentProps: f,
+    elementProps: m
+  }), p = t.useRef(null), u = t.useRef(null), n = t.useRef(null), i = t.useRef(null), [o, a] = t.useState(null), C = o?.modal, O = o?.open, v = typeof R == "boolean" ? R : !!o && !o.modal && o.open && !!e;
+  t.useEffect(() => {
+    if (!e || C)
+      return;
+    function r(l) {
+      e && g(l) && (l.type === "focusin" ? I : B)(e);
+    }
+    return e.addEventListener("focusin", r, !0), e.addEventListener("focusout", r, !0), () => {
+      e.removeEventListener("focusin", r, !0), e.removeEventListener("focusout", r, !0);
+    };
+  }, [e, C]), t.useEffect(() => {
+    !e || O || I(e);
+  }, [O, e]);
+  const L = t.useMemo(() => ({
+    beforeOutsideRef: p,
+    afterOutsideRef: u,
+    beforeInsideRef: n,
+    afterInsideRef: i,
+    portalNode: e,
+    setFocusManagerState: a
+  }), [e]);
+  return /* @__PURE__ */ T(t.Fragment, {
+    children: [c, /* @__PURE__ */ T(F.Provider, {
+      value: L,
+      children: [v && e && /* @__PURE__ */ P(S, {
+        "data-type": "outside",
+        ref: p,
+        onFocus: (r) => {
+          if (g(r, e))
+            n.current?.focus();
+          else {
+            const l = o ? o.domReference : null;
+            q(l)?.focus();
+          }
+        }
+      }), v && e && /* @__PURE__ */ P("span", {
+        "aria-owns": e.id,
+        style: j
+      }), e && /* @__PURE__ */ h.createPortal(b, e), v && e && /* @__PURE__ */ P(S, {
+        "data-type": "outside",
+        ref: u,
+        onFocus: (r) => {
+          if (g(r, e))
+            i.current?.focus();
+          else {
+            const l = o ? o.domReference : null;
+            A(l)?.focus(), o?.closeOnFocusOut && o?.onOpenChange(!1, w(J, r.nativeEvent));
+          }
+        }
+      })]
+    })]
+  });
+});
+process.env.NODE_ENV !== "production" && (K.displayName = "FloatingPortal");
 export {
-  e as DirectionContext,
-  o as useDirection
+  K as FloatingPortal,
+  z as useFloatingPortalNode,
+  Y as usePortalContext
 };

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

@@ -1,14 +1,7 @@
-import n from "./als-react-ts-ui259.js";
-import * as t from "react";
-const e = /* @__PURE__ */ t.createContext(void 0);
-process.env.NODE_ENV !== "production" && (e.displayName = "AccordionRootContext");
-function c() {
-  const o = t.useContext(e);
-  if (o === void 0)
-    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: AccordionRootContext is missing. Accordion parts must be placed within <Accordion.Root>." : n(10));
-  return o;
+function o(r, ...a) {
+  const e = new URL(`https://base-ui.com/production-error/${r}`);
+  return a.forEach((s) => e.searchParams.append("args[]", s)), `Base UI error #${r}; visit ${e} for the full message.`;
 }
 export {
-  e as AccordionRootContext,
-  c as useAccordionRootContext
+  o as default
 };

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

@@ -1,69 +1,23 @@
-import { useRefWithInit as r } from "./als-react-ts-ui240.js";
-function b(n, e, c, t) {
-  const l = r(i).current;
-  return s(l, n, e, c, t) && o(l, [n, e, c, t]), l.callback;
-}
-function h(n) {
-  const e = r(i).current;
-  return f(e, n) && o(e, n), e.callback;
-}
-function i() {
-  return {
-    callback: null,
-    cleanup: null,
-    refs: []
-  };
-}
-function s(n, e, c, t, l) {
-  return n.refs[0] !== e || n.refs[1] !== c || n.refs[2] !== t || n.refs[3] !== l;
-}
-function f(n, e) {
-  return n.refs.length !== e.length || n.refs.some((c, t) => c !== e[t]);
-}
-function o(n, e) {
-  if (n.refs = e, e.every((c) => c == null)) {
-    n.callback = null;
-    return;
+const n = 500, t = 500, i = {
+  style: {
+    transition: "none"
   }
-  n.callback = (c) => {
-    if (n.cleanup && (n.cleanup(), n.cleanup = null), c != null) {
-      const t = Array(e.length).fill(null);
-      for (let l = 0; l < e.length; l += 1) {
-        const u = e[l];
-        if (u != null)
-          switch (typeof u) {
-            case "function": {
-              const a = u(c);
-              typeof a == "function" && (t[l] = a);
-              break;
-            }
-            case "object": {
-              u.current = c;
-              break;
-            }
-          }
-      }
-      n.cleanup = () => {
-        for (let l = 0; l < e.length; l += 1) {
-          const u = e[l];
-          if (u != null)
-            switch (typeof u) {
-              case "function": {
-                const a = t[l];
-                typeof a == "function" ? a() : u(null);
-                break;
-              }
-              case "object": {
-                u.current = null;
-                break;
-              }
-            }
-        }
-      };
-    }
-  };
-}
+}, I = "data-base-ui-click-trigger", o = {
+  fallbackAxisSide: "none"
+}, s = {
+  fallbackAxisSide: "end"
+}, e = {
+  clipPath: "inset(50%)",
+  position: "fixed",
+  top: 0,
+  left: 0
+};
 export {
-  b as useMergedRefs,
-  h as useMergedRefsN
+  I as CLICK_TRIGGER_IDENTIFIER,
+  i as DISABLED_TRANSITIONS_STYLE,
+  o as DROPDOWN_COLLISION_AVOIDANCE,
+  t as PATIENT_CLICK_THRESHOLD,
+  s as POPUP_COLLISION_AVOIDANCE,
+  n as TYPEAHEAD_RESET_MS,
+  e as ownerVisuallyHidden
 };

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

@@ -1,66 +1,83 @@
-import * as e from "react";
-import { useControlled as A } from "./als-react-ts-ui282.js";
-import { useIsoLayoutEffect as B } from "./als-react-ts-ui193.js";
-import { useStableCallback as H } from "./als-react-ts-ui192.js";
-import { useBaseUiId as K } from "./als-react-ts-ui249.js";
-import { createChangeEventDetails as L } from "./als-react-ts-ui246.js";
-import { useAnimationsFinished as V } from "./als-react-ts-ui338.js";
-import { useTransitionStatus as j } from "./als-react-ts-ui344.js";
-import { triggerPress as q } from "./als-react-ts-ui248.js";
-function Z(F) {
+import * as g from "react";
+import { useStableCallback as a } from "./als-react-ts-ui223.js";
+import { useIsoLayoutEffect as o } from "./als-react-ts-ui224.js";
+import { useTransitionStatus as f } from "./als-react-ts-ui349.js";
+import { useOpenChangeComplete as m } from "./als-react-ts-ui280.js";
+function d(n, t) {
+  const e = g.useRef(null);
+  return g.useCallback((r) => {
+    if (n !== void 0 && (e.current !== null && (t.context.triggerElements.delete(e.current), e.current = null), r !== null))
+      return e.current = n, t.context.triggerElements.add(n, r), () => {
+        e.current !== null && (t.context.triggerElements.delete(e.current), e.current = null);
+      };
+  }, [t, n]);
+}
+function x(n, t, e, r) {
+  const i = e.useState("isMountedByTrigger", n), l = d(n, e), c = a((u) => {
+    const s = l(u);
+    return u !== null && e.select("open") && e.select("activeTriggerId") == null && e.update({
+      activeTriggerId: n,
+      activeTriggerElement: u,
+      ...r
+    }), s;
+  });
+  return o(() => {
+    i && e.update({
+      activeTriggerElement: t,
+      ...r
+    });
+  }, [i, e, t, ...Object.values(r)]), {
+    registerTrigger: c,
+    isMountedByThisTrigger: i
+  };
+}
+function C(n) {
+  const t = n.useState("open");
+  o(() => {
+    if (t && !n.select("activeTriggerId") && n.context.triggerElements.size === 1) {
+      const e = n.context.triggerElements.entries().next();
+      if (!e.done) {
+        const [r, i] = e.value;
+        n.update({
+          activeTriggerId: r,
+          activeTriggerElement: i
+        });
+      }
+    }
+  }, [t, n]);
+}
+function S(n, t, e) {
   const {
-    open: r,
-    defaultOpen: M,
-    onOpenChange: E,
-    disabled: d
-  } = F, m = r !== void 0, [n, u] = A({
-    controlled: r,
-    default: M,
-    name: "Collapsible",
-    state: "open"
-  }), {
-    mounted: i,
-    setMounted: o,
-    transitionStatus: p
-  } = j(n, !0, !0), [l, f] = e.useState(n), [{
-    height: h,
-    width: R
-  }, S] = e.useState({
-    height: void 0,
-    width: void 0
-  }), T = K(), [U, k] = e.useState(), C = U ?? T, [w, b] = e.useState(!1), [c, g] = e.useState(!1), v = e.useRef(null), t = e.useRef(null), I = e.useRef(null), a = e.useRef(null), O = V(a, !1), P = H((x) => {
-    const s = !n, y = L(q, x.nativeEvent);
-    if (E(s, y), y.isCanceled)
-      return;
-    const D = a.current;
-    t.current === "css-animation" && D != null && D.style.removeProperty("animation-name"), !w && !c && (t.current != null && t.current !== "css-animation" && !i && s && o(!0), t.current === "css-animation" && (!l && s && f(!0), !i && s && o(!0))), u(s), t.current === "none" && i && !s && o(!1);
+    mounted: r,
+    setMounted: i,
+    transitionStatus: l
+  } = f(n);
+  t.useSyncedValues({
+    mounted: r,
+    transitionStatus: l
   });
-  return B(() => {
-    m && t.current === "none" && !c && !n && o(!1);
-  }, [m, c, n, r, o]), e.useMemo(() => ({
-    abortControllerRef: v,
-    animationTypeRef: t,
-    disabled: d,
-    handleTrigger: P,
-    height: h,
-    mounted: i,
+  const c = a(() => {
+    i(!1), t.update({
+      activeTriggerId: null,
+      activeTriggerElement: null,
+      mounted: !1
+    }), e?.(), t.context.onOpenChangeComplete?.(!1);
+  }), u = t.useState("preventUnmountingOnClose");
+  return m({
+    enabled: !u,
     open: n,
-    panelId: C,
-    panelRef: a,
-    runOnceAnimationsFinish: O,
-    setDimensions: S,
-    setHiddenUntilFound: b,
-    setKeepMounted: g,
-    setMounted: o,
-    setOpen: u,
-    setPanelIdState: k,
-    setVisible: f,
-    transitionDimensionRef: I,
-    transitionStatus: p,
-    visible: l,
-    width: R
-  }), [v, t, d, P, h, i, n, C, a, O, S, b, g, o, u, f, I, p, l, R]);
+    ref: t.context.popupRef,
+    onComplete() {
+      n || c();
+    }
+  }), {
+    forceUnmount: c,
+    transitionStatus: l
+  };
 }
 export {
-  Z as useCollapsibleRoot
+  C as useImplicitActiveTrigger,
+  S as useOpenStateTransitions,
+  x as useTriggerDataForwarding,
+  d as useTriggerRegistration
 };

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

@@ -1,14 +1,66 @@
-import s from "./als-react-ts-ui259.js";
-import * as e from "react";
-const t = /* @__PURE__ */ e.createContext(void 0);
-process.env.NODE_ENV !== "production" && (t.displayName = "CollapsibleRootContext");
-function i() {
-  const o = e.useContext(t);
-  if (o === void 0)
-    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: CollapsibleRootContext is missing. Collapsible parts must be placed within <Collapsible.Root>." : s(15));
-  return o;
+import * as O from "react";
+import { useAnimationFrame as P } from "./als-react-ts-ui347.js";
+import { useTimeout as b } from "./als-react-ts-ui226.js";
+import { createChangeEventDetails as v } from "./als-react-ts-ui273.js";
+import { isTypeableElement as I } from "./als-react-ts-ui330.js";
+import { EMPTY_OBJECT as x } from "./als-react-ts-ui322.js";
+import { isMouseLikePointerType as R } from "./als-react-ts-ui305.js";
+import { triggerPress as k } from "./als-react-ts-ui275.js";
+function L(d, M = {}) {
+  const e = "rootStore" in d ? d.rootStore : d, T = e.context.dataRef, {
+    enabled: h = !0,
+    event: a = "click",
+    toggle: g = !0,
+    ignoreMouse: y = !1,
+    stickIfOpen: E = !0,
+    touchOpenDelay: n = 0
+  } = M, i = O.useRef(void 0), w = P(), m = b(), C = O.useMemo(() => ({
+    onPointerDown(t) {
+      i.current = t.pointerType;
+    },
+    onMouseDown(t) {
+      const o = i.current, r = t.nativeEvent, u = e.select("open");
+      if (t.button !== 0 || a === "click" || R(o, !0) && y)
+        return;
+      const s = T.current.openEvent, f = s?.type, l = e.select("domReferenceElement") !== t.currentTarget, c = u && l || !(u && g && (!(s && E) || f === "click" || f === "mousedown"));
+      if (I(r.target)) {
+        const p = v(k, r, r.target);
+        c && o === "touch" && n > 0 ? m.start(n, () => {
+          e.setOpen(!0, p);
+        }) : e.setOpen(c, p);
+        return;
+      }
+      const D = t.currentTarget;
+      w.request(() => {
+        const p = v(k, r, D);
+        c && o === "touch" && n > 0 ? m.start(n, () => {
+          e.setOpen(!0, p);
+        }) : e.setOpen(c, p);
+      });
+    },
+    onClick(t) {
+      if (a === "mousedown-only")
+        return;
+      const o = i.current;
+      if (a === "mousedown" && o) {
+        i.current = void 0;
+        return;
+      }
+      if (R(o, !0) && y)
+        return;
+      const r = e.select("open"), u = T.current.openEvent, s = u?.type, f = e.select("domReferenceElement") !== t.currentTarget, l = r && f || !(r && g && (!(u && E) || s === "click" || s === "mousedown" || s === "keydown" || s === "keyup")), c = v(k, t.nativeEvent, t.currentTarget);
+      l && o === "touch" && n > 0 ? m.start(n, () => {
+        e.setOpen(!0, c);
+      }) : e.setOpen(l, c);
+    },
+    onKeyDown() {
+      i.current = void 0;
+    }
+  }), [T, a, y, e, E, g, w, m, n]);
+  return O.useMemo(() => h ? {
+    reference: C
+  } : x, [h, C]);
 }
 export {
-  t as CollapsibleRootContext,
-  i as useCollapsibleRootContext
+  L as useClick
 };

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

@@ -1,7 +1,7 @@
 import { jsxs as L, jsx as s } from "react/jsx-runtime";
 import { forwardRef as N } from "react";
 import { clsx as e } from "./als-react-ts-ui56.js";
-import r from "./als-react-ts-ui239.js";
+import r from "./als-react-ts-ui265.js";
 import { Separator as l } from "./als-react-ts-ui107.js";
 const S = N(
   ({