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

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

@@ -0,0 +1,89 @@
+import * as t from "react";
+import { useScrollLock as E } from "./als-react-ts-ui326.js";
+import { MenubarContext as R, useMenubarContext as x } from "./als-react-ts-ui482.js";
+import { useOpenInteractionType as F } from "./als-react-ts-ui327.js";
+import { CompositeRoot as T } from "./als-react-ts-ui484.js";
+import { useBaseUiId as P } from "./als-react-ts-ui249.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-ui356.js";
+const U = {
+  hasSubmenuOpen(i) {
+    return {
+      "data-has-submenu-open": i ? "true" : "false"
+    };
+  }
+}, j = /* @__PURE__ */ t.forwardRef(function(r, s) {
+  const {
+    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
+  });
+}
+export {
+  j as Menubar
+};

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

@@ -0,0 +1,41 @@
+const a = "_root_1adzq_6", _ = "_label_1adzq_28", r = "_track_1adzq_48", t = "_indicator_1adzq_91", d = "_value_1adzq_119", o = "_meterFill_1adzq_1", i = {
+  root: a,
+  "root--sm": "_root--sm_1adzq_15",
+  "root--md": "_root--md_1adzq_19",
+  "root--lg": "_root--lg_1adzq_23",
+  label: _,
+  "label--sm": "_label--sm_1adzq_35",
+  "label--md": "_label--md_1adzq_39",
+  "label--lg": "_label--lg_1adzq_43",
+  track: r,
+  "track--sm": "_track--sm_1adzq_57",
+  "track--md": "_track--md_1adzq_61",
+  "track--lg": "_track--lg_1adzq_65",
+  "track--primary": "_track--primary_1adzq_70",
+  "track--success": "_track--success_1adzq_74",
+  "track--warning": "_track--warning_1adzq_78",
+  "track--error": "_track--error_1adzq_82",
+  "track--info": "_track--info_1adzq_86",
+  indicator: t,
+  "indicator--primary": "_indicator--primary_1adzq_98",
+  "indicator--success": "_indicator--success_1adzq_102",
+  "indicator--warning": "_indicator--warning_1adzq_106",
+  "indicator--error": "_indicator--error_1adzq_110",
+  "indicator--info": "_indicator--info_1adzq_114",
+  value: d,
+  "value--sm": "_value--sm_1adzq_127",
+  "value--md": "_value--md_1adzq_131",
+  "value--lg": "_value--lg_1adzq_135",
+  "indicator--animated": "_indicator--animated_1adzq_152",
+  meterFill: o,
+  "root--inline": "_root--inline_1adzq_162"
+};
+export {
+  i as default,
+  t as indicator,
+  _ as label,
+  o as meterFill,
+  a as root,
+  r as track,
+  d as value
+};

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

@@ -0,0 +1,50 @@
+import * as m from "react";
+import { MeterRootContext as b } from "./als-react-ts-ui493.js";
+import { formatNumber as c } from "./als-react-ts-ui494.js";
+import { useRenderElement as M } from "./als-react-ts-ui189.js";
+import { jsx as N } from "react/jsx-runtime";
+function y(o, t, r) {
+  return r ? c(o, t, r) : c(o / 100, t, {
+    style: "percent"
+  });
+}
+const E = /* @__PURE__ */ m.forwardRef(function(t, r) {
+  const {
+    format: u,
+    getAriaValueText: s,
+    locale: d,
+    max: l = 100,
+    min: n = 0,
+    value: e,
+    render: P,
+    className: w,
+    ...p
+  } = t, [v, f] = m.useState(), a = y(e, d, u);
+  let i = `${e}%`;
+  s ? i = s(a, e) : u && (i = a);
+  const x = {
+    "aria-labelledby": v,
+    "aria-valuemax": l,
+    "aria-valuemin": n,
+    "aria-valuenow": e,
+    "aria-valuetext": i,
+    role: "meter"
+  }, R = m.useMemo(() => ({
+    formattedValue: a,
+    max: l,
+    min: n,
+    setLabelId: f,
+    value: e
+  }), [a, l, n, f, e]), V = M("div", t, {
+    ref: r,
+    props: [x, p]
+  });
+  return /* @__PURE__ */ N(b.Provider, {
+    value: R,
+    children: V
+  });
+});
+process.env.NODE_ENV !== "production" && (E.displayName = "MeterRoot");
+export {
+  E as MeterRoot
+};

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

@@ -0,0 +1,25 @@
+import * as a from "react";
+import { useIsoLayoutEffect as i } from "./als-react-ts-ui193.js";
+import { useBaseUiId as f } from "./als-react-ts-ui249.js";
+import { useMeterRootContext as m } from "./als-react-ts-ui493.js";
+import { useRenderElement as d } from "./als-react-ts-ui189.js";
+const p = /* @__PURE__ */ a.forwardRef(function(t, o) {
+  const {
+    render: c,
+    className: l,
+    id: s,
+    ...n
+  } = t, e = f(s), {
+    setLabelId: r
+  } = m();
+  return i(() => (r(e), () => r(void 0)), [e, r]), d("span", t, {
+    ref: o,
+    props: [{
+      id: e
+    }, n]
+  });
+});
+process.env.NODE_ENV !== "production" && (p.displayName = "MeterLabel");
+export {
+  p as MeterLabel
+};

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

@@ -0,0 +1,17 @@
+import * as o from "react";
+import { useRenderElement as a } from "./als-react-ts-ui189.js";
+const s = /* @__PURE__ */ o.forwardRef(function(e, r) {
+  const {
+    render: n,
+    className: f,
+    ...t
+  } = e;
+  return a("div", e, {
+    ref: r,
+    props: t
+  });
+});
+process.env.NODE_ENV !== "production" && (s.displayName = "MeterTrack");
+export {
+  s as MeterTrack
+};

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

@@ -0,0 +1,25 @@
+import * as i from "react";
+import { valueToPercent as a } from "./als-react-ts-ui495.js";
+import { useMeterRootContext as s } from "./als-react-ts-ui493.js";
+import { useRenderElement as c } from "./als-react-ts-ui189.js";
+const m = /* @__PURE__ */ i.forwardRef(function(t, r) {
+  const {
+    render: p,
+    className: f,
+    ...o
+  } = t, e = s(), n = a(e.value, e.min, e.max);
+  return c("div", t, {
+    ref: r,
+    props: [{
+      style: {
+        insetInlineStart: 0,
+        height: "inherit",
+        width: `${n}%`
+      }
+    }, o]
+  });
+});
+process.env.NODE_ENV !== "production" && (m.displayName = "MeterIndicator");
+export {
+  m as MeterIndicator
+};

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

@@ -0,0 +1,25 @@
+import * as s from "react";
+import { useMeterRootContext as i } from "./als-react-ts-ui493.js";
+import { useRenderElement as u } from "./als-react-ts-ui189.js";
+const f = /* @__PURE__ */ s.forwardRef(function(e, n) {
+  const {
+    className: c,
+    render: d,
+    children: r,
+    ...a
+  } = e, {
+    value: t,
+    formattedValue: o
+  } = i();
+  return u("span", e, {
+    ref: n,
+    props: [{
+      "aria-hidden": !0,
+      children: typeof r == "function" ? r(o, t) : (o || t) ?? ""
+    }, a]
+  });
+});
+process.env.NODE_ENV !== "production" && (f.displayName = "MeterValue");
+export {
+  f as MeterValue
+};

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

@@ -0,0 +1,59 @@
+const _ = "_root_17v0f_9", r = "_list_17v0f_48", o = "_item_17v0f_60", t = "_trigger_17v0f_71", i = "_icon_17v0f_157", n = "_positioner_17v0f_171", l = "_popup_17v0f_226", e = "_content_17v0f_271", f = "_viewport_17v0f_311", p = "_link_17v0f_321", v = "_linkCard_17v0f_369", a = "_linkCardTitle_17v0f_383", s = "_linkCardDescription_17v0f_391", g = "_arrow_17v0f_402", c = "_arrowFill_17v0f_428", d = "_arrowOuterStroke_17v0f_432", k = "_arrowInnerStroke_17v0f_436", m = "_backdrop_17v0f_443", u = {
+  root: _,
+  "root--default": "_root--default_17v0f_17",
+  "root--filled": "_root--filled_17v0f_22",
+  "root--minimal": "_root--minimal_17v0f_27",
+  "root--sm": "_root--sm_17v0f_33",
+  "root--md": "_root--md_17v0f_37",
+  "root--lg": "_root--lg_17v0f_41",
+  list: r,
+  item: o,
+  trigger: t,
+  "trigger--sm": "_trigger--sm_17v0f_94",
+  "trigger--md": "_trigger--md_17v0f_100",
+  "trigger--lg": "_trigger--lg_17v0f_106",
+  "trigger--default": "_trigger--default_17v0f_113",
+  "trigger--filled": "_trigger--filled_17v0f_124",
+  "trigger--minimal": "_trigger--minimal_17v0f_137",
+  icon: i,
+  positioner: n,
+  popup: l,
+  "popup--default": "_popup--default_17v0f_255",
+  "popup--filled": "_popup--filled_17v0f_259",
+  "popup--minimal": "_popup--minimal_17v0f_263",
+  content: e,
+  viewport: f,
+  link: p,
+  "link--sm": "_link--sm_17v0f_351",
+  "link--md": "_link--md_17v0f_356",
+  "link--lg": "_link--lg_17v0f_361",
+  linkCard: v,
+  linkCardTitle: a,
+  linkCardDescription: s,
+  arrow: g,
+  arrowFill: c,
+  arrowOuterStroke: d,
+  arrowInnerStroke: k,
+  backdrop: m
+};
+export {
+  g as arrow,
+  c as arrowFill,
+  k as arrowInnerStroke,
+  d as arrowOuterStroke,
+  m as backdrop,
+  e as content,
+  u as default,
+  i as icon,
+  o as item,
+  p as link,
+  v as linkCard,
+  s as linkCardDescription,
+  a as linkCardTitle,
+  r as list,
+  l as popup,
+  n as positioner,
+  _ as root,
+  t as trigger,
+  f as viewport
+};

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

@@ -0,0 +1,144 @@
+import * as e from "react";
+import { isHTMLElement as Z } from "./als-react-ts-ui339.js";
+import { useControlled as ee } from "./als-react-ts-ui282.js";
+import { useStableCallback as B } from "./als-react-ts-ui192.js";
+import { ownerDocument as H } from "./als-react-ts-ui372.js";
+import { useRenderElement as te } from "./als-react-ts-ui189.js";
+import { NavigationMenuRootContext as ne, useNavigationMenuRootContext as U, NavigationMenuTreeContext as oe } from "./als-react-ts-ui521.js";
+import { useOpenChangeComplete as A } from "./als-react-ts-ui253.js";
+import { useTransitionStatus as re } from "./als-react-ts-ui344.js";
+import { setFixedSize as L } from "./als-react-ts-ui522.js";
+import { jsx as p } from "react/jsx-runtime";
+import { useFloatingParentNodeId as se, FloatingTree as ue, useFloatingNodeId as le } from "./als-react-ts-ui356.js";
+import { activeElement as ie, contains as ae } from "./als-react-ts-ui331.js";
+import { triggerHover as ce, outsidePress as fe, focusOut as de } from "./als-react-ts-ui248.js";
+const me = /* @__PURE__ */ new Set([ce, fe, de]), pe = /* @__PURE__ */ e.forwardRef(function(c, S) {
+  const {
+    defaultValue: w = null,
+    value: M,
+    onValueChange: P,
+    actionsRef: R,
+    delay: v = 50,
+    closeDelay: g = 50,
+    orientation: f = "horizontal",
+    onOpenChangeComplete: b
+  } = c, i = se() != null, [o, C] = ee({
+    controlled: M,
+    default: w,
+    name: "NavigationMenu",
+    state: "value"
+  }), t = o != null, r = e.useRef(void 0), d = e.useRef(null), [s, _] = e.useState(null), [n, $] = e.useState(null), [x, q] = e.useState(null), [E, G] = e.useState(null), [F, h] = e.useState(null), [T, N] = e.useState(void 0), [V, I] = e.useState(!1), m = e.useRef(null), O = e.useRef(null), J = e.useRef(null), K = e.useRef(null), Q = e.useRef(null), W = e.useRef(null), {
+    mounted: y,
+    setMounted: X,
+    transitionStatus: k
+  } = re(t);
+  e.useEffect(() => {
+    I(!1);
+  }, [o]);
+  const D = B((u, l) => {
+    u || (r.current = l.reason, h(null), N(void 0), s && n && (L(n, "popup"), L(s, "positioner"))), u !== o && P?.(u, l), !l.isCanceled && C(u);
+  }), j = B(() => {
+    const u = H(d.current), l = ie(u);
+    !(r.current ? me.has(r.current) : !1) && Z(m.current) && (l === H(n).body || ae(n, l)) && n && (m.current.focus({
+      preventScroll: !0
+    }), m.current = void 0), X(!1), b?.(!1), h(null), N(void 0), O.current = null, r.current = void 0;
+  });
+  A({
+    enabled: !R,
+    open: t,
+    ref: {
+      current: n
+    },
+    onComplete() {
+      t || j();
+    }
+  }), A({
+    enabled: !R,
+    open: t,
+    ref: {
+      current: E
+    },
+    onComplete() {
+      t || j();
+    }
+  });
+  const Y = e.useMemo(() => ({
+    open: t,
+    value: o,
+    setValue: D,
+    mounted: y,
+    transitionStatus: k,
+    positionerElement: s,
+    setPositionerElement: _,
+    popupElement: n,
+    setPopupElement: $,
+    viewportElement: x,
+    setViewportElement: q,
+    viewportTargetElement: E,
+    setViewportTargetElement: G,
+    activationDirection: F,
+    setActivationDirection: h,
+    floatingRootContext: T,
+    setFloatingRootContext: N,
+    currentContentRef: O,
+    nested: i,
+    rootRef: d,
+    beforeInsideRef: J,
+    afterInsideRef: K,
+    beforeOutsideRef: Q,
+    afterOutsideRef: W,
+    prevTriggerElementRef: m,
+    delay: v,
+    closeDelay: g,
+    orientation: f,
+    viewportInert: V,
+    setViewportInert: I
+  }), [t, o, D, y, k, s, n, x, E, F, T, i, v, g, f, V]), z = /* @__PURE__ */ p(ne.Provider, {
+    value: Y,
+    children: /* @__PURE__ */ p(Re, {
+      componentProps: c,
+      forwardedRef: S,
+      children: c.children
+    })
+  });
+  return i ? z : /* @__PURE__ */ p(ue, {
+    children: z
+  });
+});
+process.env.NODE_ENV !== "production" && (pe.displayName = "NavigationMenuRoot");
+function Re(a) {
+  const {
+    className: c,
+    render: S,
+    defaultValue: w,
+    value: M,
+    onValueChange: P,
+    actionsRef: R,
+    delay: v,
+    closeDelay: g,
+    orientation: f,
+    onOpenChangeComplete: b,
+    ...i
+  } = a.componentProps, o = le(), {
+    rootRef: C,
+    nested: t
+  } = U(), {
+    open: r
+  } = U(), d = e.useMemo(() => ({
+    open: r,
+    nested: t
+  }), [r, t]), s = te(t ? "div" : "nav", a.componentProps, {
+    state: d,
+    ref: [a.forwardedRef, C],
+    props: [{
+      "aria-orientation": f
+    }, i]
+  });
+  return /* @__PURE__ */ p(oe.Provider, {
+    value: o,
+    children: s
+  });
+}
+export {
+  pe as NavigationMenuRoot
+};

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

@@ -0,0 +1,62 @@
+import * as r from "react";
+import { CompositeRoot as T } from "./als-react-ts-ui484.js";
+import { useNavigationMenuRootContext as y } from "./als-react-ts-ui521.js";
+import { NAVIGATION_MENU_TRIGGER_IDENTIFIER as C } from "./als-react-ts-ui523.js";
+import { NavigationMenuDismissContext as p } from "./als-react-ts-ui524.js";
+import { getEmptyRootContext as h } from "./als-react-ts-ui395.js";
+import { useRenderElement as w } from "./als-react-ts-ui189.js";
+import { jsx as s } from "react/jsx-runtime";
+import { useDismiss as A } from "./als-react-ts-ui330.js";
+import { EMPTY_OBJECT as D } from "./als-react-ts-ui303.js";
+import { getTarget as I } from "./als-react-ts-ui331.js";
+const b = /* @__PURE__ */ r.forwardRef(function(i, a) {
+  const {
+    className: f,
+    render: d,
+    ...g
+  } = i, {
+    orientation: t,
+    open: m,
+    floatingRootContext: l,
+    positionerElement: N,
+    value: E,
+    nested: e
+  } = y(), v = r.useMemo(() => h(), []), M = A(l || v, {
+    enabled: N ? !0 : !E,
+    outsidePressEvent: "intentional",
+    outsidePress(o) {
+      return I(o)?.closest(`[${C}]`) === null;
+    }
+  }), n = l ? M : void 0, c = r.useMemo(() => ({
+    open: m
+  }), [m]), R = e ? {} : {
+    onKeyDown(o) {
+      (t === "horizontal" && (o.key === "ArrowLeft" || o.key === "ArrowRight") || t === "vertical" && (o.key === "ArrowUp" || o.key === "ArrowDown")) && o.stopPropagation();
+    }
+  }, u = [n?.floating || D, R, g], x = w("ul", i, {
+    state: c,
+    ref: a,
+    props: u,
+    enabled: e
+  });
+  return e ? /* @__PURE__ */ s(p.Provider, {
+    value: n,
+    children: x
+  }) : /* @__PURE__ */ s(p.Provider, {
+    value: n,
+    children: /* @__PURE__ */ s(T, {
+      render: d,
+      className: f,
+      state: c,
+      refs: [a],
+      props: u,
+      loopFocus: !1,
+      orientation: t,
+      tag: "ul"
+    })
+  });
+});
+process.env.NODE_ENV !== "production" && (b.displayName = "NavigationMenuList");
+export {
+  b as NavigationMenuList
+};

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

@@ -0,0 +1,34 @@
+import { ALSNavigationMenuLinkCard as i, ALSNavigationMenuBackdrop as n, ALSNavigationMenuArrow as o, ALSNavigationMenuViewport as a, ALSNavigationMenuPopup as t, ALSNavigationMenuPositioner as e, ALSNavigationMenuPortal as r, ALSNavigationMenuLink as L, ALSNavigationMenuContent as g, ALSNavigationMenuIcon as u, ALSNavigationMenuTrigger as A, ALSNavigationMenuItem as v, ALSNavigationMenuList as M, ALSNavigationMenuRoot as N } from "./als-react-ts-ui77.js";
+const p = {
+  /** Groups all parts of the navigation menu */
+  Root: N,
+  /** Contains a list of navigation menu items */
+  List: M,
+  /** An individual navigation menu item */
+  Item: v,
+  /** Opens the navigation menu popup when hovered or clicked */
+  Trigger: A,
+  /** An icon that indicates the trigger opens a menu */
+  Icon: u,
+  /** A container for the content of the navigation menu item */
+  Content: g,
+  /** A link in the navigation menu */
+  Link: L,
+  /** A portal element that moves the popup to a different part of the DOM */
+  Portal: r,
+  /** Positions the navigation menu against the currently active trigger */
+  Positioner: e,
+  /** A container for the navigation menu contents */
+  Popup: t,
+  /** The clipping viewport of the navigation menu's current content */
+  Viewport: a,
+  /** Displays an element pointing toward the navigation menu's current anchor */
+  Arrow: o,
+  /** A backdrop for the navigation menu popup */
+  Backdrop: n,
+  /** A styled link card for use within navigation menu content */
+  LinkCard: i
+};
+export {
+  p as ALSNavigationMenu
+};

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

@@ -0,0 +1,26 @@
+import * as t from "react";
+import { useRenderElement as u } from "./als-react-ts-ui189.js";
+import { NavigationMenuItemContext as l } from "./als-react-ts-ui525.js";
+import { useBaseUiId as c } from "./als-react-ts-ui249.js";
+import { jsx as f } from "react/jsx-runtime";
+const p = /* @__PURE__ */ t.forwardRef(function(e, r) {
+  const {
+    className: d,
+    render: N,
+    value: n,
+    ...a
+  } = e, i = c(), o = n ?? i, m = u("li", e, {
+    ref: r,
+    props: a
+  }), s = t.useMemo(() => ({
+    value: o
+  }), [o]);
+  return /* @__PURE__ */ f(l.Provider, {
+    value: s,
+    children: m
+  });
+});
+process.env.NODE_ENV !== "production" && (p.displayName = "NavigationMenuItem");
+export {
+  p as NavigationMenuItem
+};