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

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

@@ -1,23 +1,48 @@
-import * as e from "react";
-const t = /* @__PURE__ */ e.createContext({
-  register: () => {
-  },
-  unregister: () => {
-  },
-  subscribeMapChange: () => () => {
-  },
-  elementsRef: {
-    current: []
-  },
-  nextIndexRef: {
-    current: 0
-  }
+import * as r from "react";
+import { useRenderElement as f } from "./als-react-ts-ui226.js";
+import { useNavigationMenuRootContext as g } from "./als-react-ts-ui513.js";
+import { transitionStatusMapping as M } from "./als-react-ts-ui228.js";
+import { useBaseUiId as N } from "./als-react-ts-ui232.js";
+import { useNavigationMenuPositionerContext as v } from "./als-react-ts-ui522.js";
+import { useDirection as P } from "./als-react-ts-ui270.js";
+import { popupStateMapping as h } from "./als-react-ts-ui227.js";
+const b = {
+  ...h,
+  ...M
+}, x = /* @__PURE__ */ r.forwardRef(function(n, a) {
+  const {
+    className: R,
+    render: S,
+    id: p,
+    ...d
+  } = n, {
+    open: o,
+    transitionStatus: s,
+    setPopupElement: m
+  } = g(), e = v(), l = P(), u = N(p), c = r.useMemo(() => ({
+    open: o,
+    transitionStatus: s,
+    side: e.side,
+    align: e.align,
+    anchorHidden: e.anchorHidden
+  }), [o, s, e.side, e.align, e.anchorHidden]);
+  let t = e.side === "top", i = e.side === "left";
+  return l === "rtl" ? (t = t || e.side === "inline-end", i = i || e.side === "inline-end") : (t = t || e.side === "inline-start", i = i || e.side === "inline-start"), f("nav", n, {
+    state: c,
+    ref: [a, m],
+    props: [{
+      id: u,
+      tabIndex: -1,
+      style: t ? {
+        position: "absolute",
+        [e.side === "top" ? "bottom" : "top"]: "0",
+        [i ? "right" : "left"]: "0"
+      } : {}
+    }, d],
+    stateAttributesMapping: b
+  });
 });
-process.env.NODE_ENV !== "production" && (t.displayName = "CompositeListContext");
-function n() {
-  return e.useContext(t);
-}
+process.env.NODE_ENV !== "production" && (x.displayName = "NavigationMenuPopup");
 export {
-  t as CompositeListContext,
-  n as useCompositeListContext
+  x as NavigationMenuPopup
 };

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

@@ -1,20 +1,84 @@
-import * as n from "react";
-import { SafeReact as f } from "./als-react-ts-ui282.js";
-let o = 0;
-function l(u, t = "mui") {
-  const [e, s] = n.useState(u), c = u || e;
-  return n.useEffect(() => {
-    e == null && (o += 1, s(`${t}-${o}`));
-  }, [e, t]), c;
-}
-const a = f.useId;
-function I(u, t) {
-  if (a !== void 0) {
-    const e = a();
-    return u ?? (t ? `${t}-${e}` : e);
-  }
-  return l(u, t);
+import * as w from "react";
+import { useIsoLayoutEffect as I } from "./als-react-ts-ui267.js";
+import { useId as M } from "./als-react-ts-ui306.js";
+import { inertValue as P } from "./als-react-ts-ui239.js";
+import { useRenderElement as F } from "./als-react-ts-ui226.js";
+import { useNavigationMenuRootContext as x } from "./als-react-ts-ui513.js";
+import { FocusGuard as v } from "./als-react-ts-ui360.js";
+import { getEmptyRootContext as y } from "./als-react-ts-ui385.js";
+import { useNavigationMenuPositionerContext as b } from "./als-react-ts-ui522.js";
+import { jsx as o, jsxs as B } from "react/jsx-runtime";
+import { contains as _ } from "./als-react-ts-ui312.js";
+import { isOutsideEvent as T, getNextTabbable as j, getPreviousTabbable as G } from "./als-react-ts-ui366.js";
+const D = y();
+function N({
+  children: s
+}) {
+  const {
+    beforeInsideRef: r,
+    beforeOutsideRef: f,
+    afterInsideRef: p,
+    afterOutsideRef: d,
+    positionerElement: n,
+    viewportElement: a,
+    floatingRootContext: u
+  } = x(), c = !!b(!0), e = n || a;
+  return !u && !c ? s : /* @__PURE__ */ B(w.Fragment, {
+    children: [/* @__PURE__ */ o(v, {
+      ref: r,
+      onFocus: (t) => {
+        e && T(t, e) ? j(e)?.focus() : f.current?.focus();
+      }
+    }), s, /* @__PURE__ */ o(v, {
+      ref: p,
+      onFocus: (t) => {
+        e && T(t, e) ? G(e)?.focus() : d.current?.focus();
+      }
+    })]
+  });
 }
+const L = /* @__PURE__ */ w.forwardRef(function(r, f) {
+  const {
+    className: p,
+    render: d,
+    children: n,
+    id: a,
+    ...u
+  } = r, c = M(a), {
+    setViewportElement: e,
+    setViewportTargetElement: t,
+    floatingRootContext: V,
+    prevTriggerElementRef: g,
+    viewportInert: h,
+    setViewportInert: O
+  } = x(), m = !!b(!0), i = (V || D).useState("domReferenceElement");
+  I(() => {
+    i && (g.current = i);
+  }, [i, g]);
+  const E = F("div", r, {
+    ref: [f, e],
+    props: [{
+      id: c,
+      onBlur(R) {
+        const l = R.relatedTarget, C = R.currentTarget;
+        l && !_(C, l) && l !== i && O(!0);
+      },
+      ...!m && h && {
+        inert: P(!0)
+      },
+      children: m ? n : /* @__PURE__ */ o(N, {
+        children: /* @__PURE__ */ o("div", {
+          ref: t,
+          children: n
+        })
+      })
+    }, u]
+  });
+  return m ? /* @__PURE__ */ o(N, {
+    children: E
+  }) : E;
+});
+process.env.NODE_ENV !== "production" && (L.displayName = "NavigationMenuViewport");
 export {
-  I as useId
+  L as NavigationMenuViewport
 };

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

@@ -1,28 +1,38 @@
-import * as l from "react-dom";
-import { useAnimationFrame as m } from "./als-react-ts-ui223.js";
-import { useStableCallback as u } from "./als-react-ts-ui160.js";
-import { resolveRef as c } from "./als-react-ts-ui283.js";
-function S(s, f = !1, a = !0) {
-  const i = m();
-  return u((r, t = null) => {
-    i.cancel();
-    const e = c(s);
-    e != null && (typeof e.getAnimations != "function" || globalThis.BASE_UI_ANIMATIONS_DISABLED ? r() : i.request(() => {
-      function o() {
-        e && Promise.all(e.getAnimations().map((n) => n.finished)).then(() => {
-          t != null && t.aborted || l.flushSync(r);
-        }).catch(() => {
-          if (a) {
-            if (t != null && t.aborted)
-              return;
-            l.flushSync(r);
-          } else e.getAnimations().length > 0 && e.getAnimations().some((n) => n.pending || n.playState !== "finished") && o();
-        });
-      }
-      f ? i.request(o) : o();
-    }));
+import * as i from "react";
+import { useNavigationMenuPositionerContext as c } from "./als-react-ts-ui522.js";
+import { useNavigationMenuRootContext as d } from "./als-react-ts-ui513.js";
+import { popupStateMapping as f } from "./als-react-ts-ui227.js";
+import { useRenderElement as l } from "./als-react-ts-ui226.js";
+const N = /* @__PURE__ */ i.forwardRef(function(e, a) {
+  const {
+    className: M,
+    render: v,
+    ...s
+  } = e, {
+    open: t
+  } = d(), {
+    arrowRef: p,
+    side: o,
+    align: r,
+    arrowUncentered: n,
+    arrowStyles: m
+  } = c(), u = i.useMemo(() => ({
+    open: t,
+    side: o,
+    align: r,
+    uncentered: n
+  }), [t, o, r, n]);
+  return l("div", e, {
+    state: u,
+    ref: [a, p],
+    props: [{
+      style: m,
+      "aria-hidden": !0
+    }, s],
+    stateAttributesMapping: f
   });
-}
+});
+process.env.NODE_ENV !== "production" && (N.displayName = "NavigationMenuArrow");
 export {
-  S as useAnimationsFinished
+  N as NavigationMenuArrow
 };

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

@@ -1,45 +1,39 @@
-import * as c from "react";
-import * as d from "react-dom";
-import { useIsoLayoutEffect as a } from "./als-react-ts-ui161.js";
-import { AnimationFrame as u } from "./als-react-ts-ui223.js";
-function q(t, s = !1, f = !1) {
-  const [r, n] = c.useState(t && s ? "idle" : void 0), [i, m] = c.useState(t);
-  return t && !i && (m(!0), n("starting")), !t && i && r !== "ending" && !f && n("ending"), !t && !i && r === "ending" && n(void 0), a(() => {
-    if (!t && i && r !== "ending" && f) {
-      const e = u.request(() => {
-        n("ending");
-      });
-      return () => {
-        u.cancel(e);
-      };
-    }
-  }, [t, i, r, f]), a(() => {
-    if (!t || s)
-      return;
-    const e = u.request(() => {
-      d.flushSync(() => {
-        n(void 0);
-      });
-    });
-    return () => {
-      u.cancel(e);
-    };
-  }, [s, t]), a(() => {
-    if (!t || !s)
-      return;
-    t && i && r !== "idle" && n("starting");
-    const e = u.request(() => {
-      n("idle");
-    });
-    return () => {
-      u.cancel(e);
-    };
-  }, [s, t, i, n, r]), c.useMemo(() => ({
+import * as n from "react";
+import { useRenderElement as p } from "./als-react-ts-ui226.js";
+import { useNavigationMenuRootContext as m } from "./als-react-ts-ui513.js";
+import { transitionStatusMapping as u } from "./als-react-ts-ui228.js";
+import { popupStateMapping as c } from "./als-react-ts-ui227.js";
+const d = {
+  ...c,
+  ...u
+}, f = /* @__PURE__ */ n.forwardRef(function(e, r) {
+  const {
+    className: M,
+    render: N,
+    ...a
+  } = e, {
+    open: t,
     mounted: i,
-    setMounted: m,
-    transitionStatus: r
-  }), [i, r]);
-}
+    transitionStatus: o
+  } = m(), s = n.useMemo(() => ({
+    open: t,
+    transitionStatus: o
+  }), [t, o]);
+  return p("div", e, {
+    state: s,
+    ref: r,
+    props: [{
+      role: "presentation",
+      hidden: !i,
+      style: {
+        userSelect: "none",
+        WebkitUserSelect: "none"
+      }
+    }, a],
+    stateAttributesMapping: d
+  });
+});
+process.env.NODE_ENV !== "production" && (f.displayName = "NavigationMenuBackdrop");
 export {
-  q as useTransitionStatus
+  f as NavigationMenuBackdrop
 };

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

@@ -1,7 +1,24 @@
-import { TransitionStatusDataAttributes as d } from "./als-react-ts-ui189.js";
-let g = (function(n) {
-  return n.open = "data-open", n.closed = "data-closed", n[n.startingStyle = d.startingStyle] = "startingStyle", n[n.endingStyle = d.endingStyle] = "endingStyle", n;
-})({});
+import * as i from "react";
+import { useNavigationMenuRootContext as u } from "./als-react-ts-ui513.js";
+import { NavigationMenuPortalContext as l } from "./als-react-ts-ui521.js";
+import { jsx as t } from "react/jsx-runtime";
+import { FloatingPortal as s } from "./als-react-ts-ui241.js";
+const f = /* @__PURE__ */ i.forwardRef(function(r, e) {
+  const {
+    keepMounted: o = !1,
+    ...n
+  } = r, {
+    mounted: a
+  } = u();
+  return a || o ? /* @__PURE__ */ t(l.Provider, {
+    value: o,
+    children: /* @__PURE__ */ t(s, {
+      ref: e,
+      ...n
+    })
+  }) : null;
+});
+process.env.NODE_ENV !== "production" && (f.displayName = "NavigationMenuPortal");
 export {
-  g as CollapsiblePanelDataAttributes
+  f as NavigationMenuPortal
 };

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

@@ -1,9 +1,13 @@
-import { jsx as r } from "react/jsx-runtime";
-import o from "./als-react-ts-ui78.js";
-function m(t) {
-  return /* @__PURE__ */ r("div", { className: o.root });
-}
+import { ALSNumberFieldScrubAreaCursor as e, ALSNumberFieldScrubArea as r, ALSNumberFieldDecrement as u, ALSNumberFieldIncrement as m, ALSNumberFieldInput as b, ALSNumberFieldGroup as o, ALSNumberFieldRoot as A } from "./als-react-ts-ui78.js";
+const t = {
+  Root: A,
+  Group: o,
+  Input: b,
+  Increment: m,
+  Decrement: u,
+  ScrubArea: r,
+  ScrubAreaCursor: e
+};
 export {
-  m as ALSNumberField,
-  m as default
+  t as ALSNumberField
 };

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

@@ -1,6 +1,10 @@
-let n = /* @__PURE__ */ (function(e) {
-  return e.panelOpen = "data-panel-open", e;
-})({});
+const a = "_menubar_swhih_5", e = {
+  menubar: a,
+  "menubar--horizontal": "_menubar--horizontal_swhih_15",
+  "menubar--vertical": "_menubar--vertical_swhih_20",
+  "menubar--disabled": "_menubar--disabled_swhih_26"
+};
 export {
-  n as CollapsibleTriggerDataAttributes
+  e as default,
+  a as menubar
 };

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

@@ -1,136 +1,89 @@
-function c() {
-  return typeof window < "u";
-}
-function u(t) {
-  return p(t) ? (t.nodeName || "").toLowerCase() : "#document";
-}
-function i(t) {
-  var e;
-  return (t == null || (e = t.ownerDocument) == null ? void 0 : e.defaultView) || window;
-}
-function N(t) {
-  var e;
-  return (e = (p(t) ? t.ownerDocument : t.document) || window.document) == null ? void 0 : e.documentElement;
-}
-function p(t) {
-  return c() ? t instanceof Node || t instanceof i(t).Node : !1;
-}
-function m(t) {
-  return c() ? t instanceof Element || t instanceof i(t).Element : !1;
-}
-function w(t) {
-  return c() ? t instanceof HTMLElement || t instanceof i(t).HTMLElement : !1;
-}
-function f(t) {
-  return !c() || typeof ShadowRoot > "u" ? !1 : t instanceof ShadowRoot || t instanceof i(t).ShadowRoot;
-}
-const E = /* @__PURE__ */ new Set(["inline", "contents"]);
-function y(t) {
+import * as t from "react";
+import { useScrollLock as E } from "./als-react-ts-ui307.js";
+import { MenubarContext as R, useMenubarContext as x } from "./als-react-ts-ui447.js";
+import { useOpenInteractionType as F } from "./als-react-ts-ui308.js";
+import { CompositeRoot as T } from "./als-react-ts-ui448.js";
+import { useBaseUiId as P } from "./als-react-ts-ui232.js";
+import { jsx as a } from "react/jsx-runtime";
+import { FloatingTree as y, useFloatingNodeId as H, useFloatingTree as w, FloatingNode as A } from "./als-react-ts-ui364.js";
+const U = {
+  hasSubmenuOpen(i) {
+    return {
+      "data-has-submenu-open": i ? "true" : "false"
+    };
+  }
+}, j = /* @__PURE__ */ t.forwardRef(function(r, s) {
   const {
-    overflow: e,
-    overflowX: n,
-    overflowY: o,
-    display: r
-  } = S(t);
-  return /auto|scroll|overlay|hidden|clip/.test(e + o + n) && !E.has(r);
-}
-const T = /* @__PURE__ */ new Set(["table", "td", "th"]);
-function A(t) {
-  return T.has(u(t));
-}
-const v = [":popover-open", ":modal"];
-function L(t) {
-  return v.some((e) => {
-    try {
-      return t.matches(e);
-    } catch {
-      return !1;
+    orientation: e = "horizontal",
+    loopFocus: p = !0,
+    render: o,
+    className: b,
+    modal: u = !0,
+    disabled: f = !1,
+    id: h,
+    ...g
+  } = r, [c, l] = t.useState(null), [n, M] = t.useState(!1), {
+    openMethod: O,
+    triggerProps: S,
+    reset: d
+  } = F(n);
+  t.useEffect(() => {
+    n || d();
+  }, [n, d]), E(u && n && O !== "touch", c);
+  const m = P(h), I = t.useMemo(() => ({
+    orientation: e,
+    modal: u,
+    hasSubmenuOpen: n
+  }), [e, u, n]), N = t.useRef(null), v = t.useRef(!1), C = t.useMemo(() => ({
+    contentElement: c,
+    setContentElement: l,
+    setHasSubmenuOpen: M,
+    hasSubmenuOpen: n,
+    modal: u,
+    disabled: f,
+    orientation: e,
+    allowMouseUpTriggerRef: v,
+    rootId: m
+  }), [c, n, u, f, e, m]);
+  return /* @__PURE__ */ a(R.Provider, {
+    value: C,
+    children: /* @__PURE__ */ a(y, {
+      children: /* @__PURE__ */ a(k, {
+        children: /* @__PURE__ */ a(T, {
+          render: o,
+          className: b,
+          state: I,
+          stateAttributesMapping: U,
+          refs: [s, l, N],
+          props: [{
+            role: "menubar",
+            id: m
+          }, S, g],
+          orientation: e,
+          loopFocus: p,
+          highlightItemOnHover: n
+        })
+      })
+    })
+  });
+});
+process.env.NODE_ENV !== "production" && (j.displayName = "Menubar");
+function k(i) {
+  const r = H(), {
+    events: s
+  } = w(), e = x();
+  return t.useEffect(() => {
+    function p(o) {
+      !o.nodeId || o.parentNodeId !== r || (o.open ? e.hasSubmenuOpen || e.setHasSubmenuOpen(!0) : o.reason !== "sibling-open" && o.reason !== "list-navigation" && e.setHasSubmenuOpen(!1));
     }
+    return s.on("menuopenchange", p), () => {
+      s.off("menuopenchange", p);
+    };
+  }, [s, r, e]), /* @__PURE__ */ a(A, {
+    id: r,
+    children: i.children
   });
 }
-const D = ["transform", "translate", "scale", "rotate", "perspective"], C = ["transform", "translate", "scale", "rotate", "perspective", "filter"], k = ["paint", "layout", "strict", "content"];
-function V(t) {
-  const e = O(), n = m(t) ? S(t) : t;
-  return D.some((o) => n[o] ? n[o] !== "none" : !1) || (n.containerType ? n.containerType !== "normal" : !1) || !e && (n.backdropFilter ? n.backdropFilter !== "none" : !1) || !e && (n.filter ? n.filter !== "none" : !1) || C.some((o) => (n.willChange || "").includes(o)) || k.some((o) => (n.contain || "").includes(o));
-}
-function B(t) {
-  let e = s(t);
-  for (; w(e) && !h(e); ) {
-    if (V(e))
-      return e;
-    if (L(e))
-      return null;
-    e = s(e);
-  }
-  return null;
-}
-function O() {
-  return typeof CSS > "u" || !CSS.supports ? !1 : CSS.supports("-webkit-backdrop-filter", "none");
-}
-const R = /* @__PURE__ */ new Set(["html", "body", "#document"]);
-function h(t) {
-  return R.has(u(t));
-}
-function S(t) {
-  return i(t).getComputedStyle(t);
-}
-function F(t) {
-  return m(t) ? {
-    scrollLeft: t.scrollLeft,
-    scrollTop: t.scrollTop
-  } : {
-    scrollLeft: t.scrollX,
-    scrollTop: t.scrollY
-  };
-}
-function s(t) {
-  if (u(t) === "html")
-    return t;
-  const e = (
-    // Step into the shadow DOM of the parent of a slotted node.
-    t.assignedSlot || // DOM Element detected.
-    t.parentNode || // ShadowRoot detected.
-    f(t) && t.host || // Fallback.
-    N(t)
-  );
-  return f(e) ? e.host : e;
-}
-function b(t) {
-  const e = s(t);
-  return h(e) ? t.ownerDocument ? t.ownerDocument.body : t.body : w(e) && y(e) ? e : b(e);
-}
-function d(t, e, n) {
-  var o;
-  e === void 0 && (e = []), n === void 0 && (n = !0);
-  const r = b(t), g = r === ((o = t.ownerDocument) == null ? void 0 : o.body), l = i(r);
-  if (g) {
-    const a = _(l);
-    return e.concat(l, l.visualViewport || [], y(r) ? r : [], a && n ? d(a) : []);
-  }
-  return e.concat(r, d(r, [], n));
-}
-function _(t) {
-  return t.parent && Object.getPrototypeOf(t.parent) ? t.frameElement : null;
-}
 export {
-  S as getComputedStyle,
-  B as getContainingBlock,
-  N as getDocumentElement,
-  _ as getFrameElement,
-  b as getNearestOverflowAncestor,
-  u as getNodeName,
-  F as getNodeScroll,
-  d as getOverflowAncestors,
-  s as getParentNode,
-  i as getWindow,
-  V as isContainingBlock,
-  m as isElement,
-  w as isHTMLElement,
-  h as isLastTraversableNode,
-  p as isNode,
-  y as isOverflowElement,
-  f as isShadowRoot,
-  A as isTableElement,
-  L as isTopLayer,
-  O as isWebKit
+  j as Menubar
 };

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

@@ -1,8 +1,9 @@
-import * as o from "react";
-const e = [];
-function n(t) {
-  o.useEffect(t, e);
+import * as c from "react";
+const e = {};
+function f(r, n) {
+  const t = c.useRef(e);
+  return t.current === e && (t.current = r(n)), t;
 }
 export {
-  n as useOnMount
+  f as useRefWithInit
 };