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

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

@@ -1,48 +1,143 @@
-import * as l from "react";
-import { FOCUSABLE_ATTRIBUTE as C, ACTIVE_KEY as s, SELECTED_KEY as E } from "./als-react-ts-ui390.js";
-function k(e = []) {
-  const a = e.map((n) => n?.reference), g = e.map((n) => n?.floating), f = e.map((n) => n?.item), t = e.map((n) => n?.trigger), o = l.useCallback(
-    (n) => u(n, e, "reference"),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    a
-  ), c = l.useCallback(
-    (n) => u(n, e, "floating"),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    g
-  ), i = l.useCallback(
-    (n) => u(n, e, "item"),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    f
-  ), r = l.useCallback(
-    (n) => u(n, e, "trigger"),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    t
-  );
-  return l.useMemo(() => ({
-    getReferenceProps: o,
-    getFloatingProps: c,
-    getItemProps: i,
-    getTriggerProps: r
-  }), [o, c, i, r]);
-}
-function u(e, a, g) {
-  const f = /* @__PURE__ */ new Map(), t = g === "item", o = {};
-  g === "floating" && (o.tabIndex = -1, o[C] = "");
-  for (const c in e)
-    t && e && (c === s || c === E) || (o[c] = e[c]);
-  for (let c = 0; c < a.length; c += 1) {
-    let i;
-    const r = a[c]?.[g];
-    typeof r == "function" ? i = e ? r(e) : null : i = r, i && m(o, i, t, f);
-  }
-  return m(o, e, t, f), o;
-}
-function m(e, a, g, f) {
-  for (const t in a) {
-    const o = a[t];
-    g && (t === s || t === E) || (t.startsWith("on") ? (f.has(t) || f.set(t, []), typeof o == "function" && (f.get(t)?.push(o), e[t] = (...c) => f.get(t)?.map((i) => i(...c)).find((i) => i !== void 0))) : e[t] = o);
-  }
-}
+import * as a from "react";
+import { useControlled as K } from "./als-react-ts-ui292.js";
+import { useStableCallback as Q } from "./als-react-ts-ui223.js";
+import { useMergedRefs as W } from "./als-react-ts-ui297.js";
+import { useIsoLayoutEffect as X } from "./als-react-ts-ui224.js";
+import { visuallyHidden as Y } from "./als-react-ts-ui376.js";
+import { useRenderElement as Z } from "./als-react-ts-ui220.js";
+import { useBaseUiId as $ } from "./als-react-ts-ui276.js";
+import { SwitchRootContext as ee } from "./als-react-ts-ui560.js";
+import { stateAttributesMapping as te } from "./als-react-ts-ui561.js";
+import { useField as oe } from "./als-react-ts-ui403.js";
+import { useFieldRootContext as re } from "./als-react-ts-ui398.js";
+import { useFormContext as ne } from "./als-react-ts-ui402.js";
+import { useLabelableContext as ie } from "./als-react-ts-ui399.js";
+import { useLabelableId as ae } from "./als-react-ts-ui400.js";
+import { createChangeEventDetails as se } from "./als-react-ts-ui273.js";
+import { useValueChanged as ce } from "./als-react-ts-ui406.js";
+import { jsxs as le, jsx as P } from "react/jsx-runtime";
+import { useButton as de } from "./als-react-ts-ui274.js";
+import { mergeProps as ue } from "./als-react-ts-ui323.js";
+import { none as me } from "./als-react-ts-ui275.js";
+const fe = /* @__PURE__ */ a.forwardRef(function(u, x) {
+  const {
+    checked: y,
+    className: he,
+    defaultChecked: I,
+    id: w,
+    inputRef: E,
+    name: S,
+    nativeButton: B = !1,
+    onCheckedChange: D,
+    readOnly: s = !1,
+    required: c = !1,
+    disabled: F = !1,
+    render: Ce,
+    ...V
+  } = u, {
+    clearErrors: M
+  } = ne(), {
+    state: m,
+    setTouched: N,
+    setDirty: L,
+    validityData: O,
+    setFilled: d,
+    setFocused: f,
+    shouldValidateOnChange: j,
+    validationMode: q,
+    disabled: A,
+    name: H,
+    validation: t
+  } = re(), {
+    labelId: T
+  } = ie(), o = A || F, n = H ?? S, p = Q(D), i = a.useRef(null), h = W(i, E, t.inputRef), l = a.useRef(null), C = $(), R = ae({
+    id: w,
+    implicit: !1,
+    controlRef: l
+  }), [e, b] = K({
+    controlled: y,
+    default: !!I,
+    name: "Switch",
+    state: "checked"
+  });
+  oe({
+    id: C,
+    commit: t.commit,
+    value: e,
+    controlRef: l,
+    name: n,
+    getValue: () => e
+  }), X(() => {
+    i.current && d(i.current.checked);
+  }, [i, d]), ce(e, () => {
+    M(n), L(e !== O.initialValue), d(e), j() ? t.commit(e) : t.commit(e, !0);
+  });
+  const {
+    getButtonProps: U,
+    buttonRef: _
+  } = de({
+    disabled: o,
+    native: B
+  }), z = {
+    id: C,
+    role: "switch",
+    "aria-checked": e,
+    "aria-readonly": s || void 0,
+    "aria-labelledby": T,
+    onFocus() {
+      o || f(!0);
+    },
+    onBlur() {
+      const r = i.current;
+      !r || o || (N(!0), f(!1), q === "onBlur" && t.commit(r.checked));
+    },
+    onClick(r) {
+      s || o || (r.preventDefault(), i?.current?.click());
+    }
+  }, G = a.useMemo(() => ue({
+    checked: e,
+    disabled: o,
+    id: R,
+    name: n,
+    required: c,
+    style: Y,
+    tabIndex: -1,
+    type: "checkbox",
+    "aria-hidden": !0,
+    ref: h,
+    onChange(r) {
+      if (r.nativeEvent.defaultPrevented)
+        return;
+      const v = r.target.checked, g = se(me, r.nativeEvent);
+      p?.(v, g), !g.isCanceled && b(v);
+    },
+    onFocus() {
+      l.current?.focus();
+    }
+  }, t.getInputValidationProps), [e, o, h, R, n, p, c, b, t]), k = a.useMemo(() => ({
+    ...m,
+    checked: e,
+    disabled: o,
+    readOnly: s,
+    required: c
+  }), [m, e, o, s, c]), J = Z("span", u, {
+    state: k,
+    ref: [x, l, _],
+    props: [z, t.getValidationProps, V, U],
+    stateAttributesMapping: te
+  });
+  return /* @__PURE__ */ le(ee.Provider, {
+    value: k,
+    children: [J, !e && n && /* @__PURE__ */ P("input", {
+      type: "hidden",
+      name: n,
+      value: "off"
+    }), /* @__PURE__ */ P("input", {
+      ...G
+    })]
+  });
+});
+process.env.NODE_ENV !== "production" && (fe.displayName = "SwitchRoot");
 export {
-  k as useInteractions
+  fe as SwitchRoot
 };

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

@@ -1,7 +1,27 @@
-import { CommonPopupDataAttributes as d } from "./als-react-ts-ui244.js";
-let y = (function(n) {
-  return n[n.open = d.open] = "open", n[n.closed = d.closed] = "closed", n[n.startingStyle = d.startingStyle] = "startingStyle", n[n.endingStyle = d.endingStyle] = "endingStyle", n.nested = "data-nested", n.nestedDialogOpen = "data-nested-dialog-open", n;
-})({});
+import * as n from "react";
+import { useSwitchRootContext as m } from "./als-react-ts-ui560.js";
+import { useRenderElement as a } from "./als-react-ts-ui220.js";
+import { useFieldRootContext as c } from "./als-react-ts-ui398.js";
+import { stateAttributesMapping as p } from "./als-react-ts-ui561.js";
+const f = /* @__PURE__ */ n.forwardRef(function(t, e) {
+  const {
+    render: d,
+    className: h,
+    ...o
+  } = t, {
+    state: r
+  } = c(), s = m(), i = {
+    ...r,
+    ...s
+  };
+  return a("span", t, {
+    state: i,
+    ref: e,
+    stateAttributesMapping: p,
+    props: o
+  });
+});
+process.env.NODE_ENV !== "production" && (f.displayName = "SwitchThumb");
 export {
-  y as DialogViewportDataAttributes
+  f as SwitchThumb
 };

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

@@ -1,44 +1,27 @@
-const o = "_root_169v1_9", _ = "_viewport_169v1_54", t = "_fadeOverlay_169v1_82", r = "_content_169v1_119", e = "_scrollbar_169v1_145", l = "_thumb_169v1_213", v = "_corner_169v1_256", d = {
-  root: o,
-  "root--sm": "_root--sm_169v1_19",
-  "root--md": "_root--md_169v1_23",
-  "root--lg": "_root--lg_169v1_27",
-  "root--full": "_root--full_169v1_31",
-  "root--default": "_root--default_169v1_37",
-  "root--subtle": "_root--subtle_169v1_41",
-  "root--bordered": "_root--bordered_169v1_46",
-  viewport: _,
-  "viewport--default": "_viewport--default_169v1_67",
-  "viewport--subtle": "_viewport--subtle_169v1_71",
-  "viewport--bordered": "_viewport--bordered_169v1_75",
-  fadeOverlay: t,
-  "fadeOverlay--top": "_fadeOverlay--top_169v1_92",
-  "fadeOverlay--bottom": "_fadeOverlay--bottom_169v1_104",
-  content: r,
-  "content--sm": "_content--sm_169v1_126",
-  "content--md": "_content--md_169v1_130",
-  "content--lg": "_content--lg_169v1_134",
-  "content--full": "_content--full_169v1_138",
-  scrollbar: e,
-  "scrollbar--default": "_scrollbar--default_169v1_198",
-  "scrollbar--subtle": "_scrollbar--subtle_169v1_202",
-  "scrollbar--bordered": "_scrollbar--bordered_169v1_206",
-  thumb: l,
-  "thumb--default": "_thumb--default_169v1_229",
-  "thumb--subtle": "_thumb--subtle_169v1_237",
-  "thumb--bordered": "_thumb--bordered_169v1_245",
-  corner: v,
-  "corner--default": "_corner--default_169v1_260",
-  "corner--subtle": "_corner--subtle_169v1_261",
-  "corner--bordered": "_corner--bordered_169v1_262"
+const a = "_separator_1xnsi_6", r = "_separatorContainer_1xnsi_155", s = "_separatorLine_1xnsi_162", t = "_separatorLabel_1xnsi_168", e = {
+  separator: a,
+  "separator--horizontal": "_separator--horizontal_1xnsi_13",
+  "separator--vertical": "_separator--vertical_1xnsi_18",
+  "separator--sm": "_separator--sm_1xnsi_25",
+  "separator--md": "_separator--md_1xnsi_29",
+  "separator--lg": "_separator--lg_1xnsi_33",
+  "separator--solid": "_separator--solid_1xnsi_51",
+  "separator--dashed": "_separator--dashed_1xnsi_56",
+  "separator--dotted": "_separator--dotted_1xnsi_89",
+  "separator--default": "_separator--default_1xnsi_123",
+  "separator--subtle": "_separator--subtle_1xnsi_128",
+  "separator--strong": "_separator--strong_1xnsi_133",
+  "separator--primary": "_separator--primary_1xnsi_138",
+  "separator--with-spacing": "_separator--with-spacing_1xnsi_144",
+  separatorContainer: r,
+  separatorLine: s,
+  separatorLabel: t,
+  "separator--with-label": "_separator--with-label_1xnsi_178"
 };
 export {
-  r as content,
-  v as corner,
-  d as default,
-  t as fadeOverlay,
-  o as root,
-  e as scrollbar,
-  l as thumb,
-  _ as viewport
+  e as default,
+  a as separator,
+  r as separatorContainer,
+  t as separatorLabel,
+  s as separatorLine
 };

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

@@ -1,160 +1,109 @@
-import * as t from "react";
-import { useStableCallback as b } from "./als-react-ts-ui192.js";
-import { useTimeout as q } from "./als-react-ts-ui195.js";
-import { ScrollAreaRootContext as mt } from "./als-react-ts-ui539.js";
-import { useRenderElement as ht } from "./als-react-ts-ui189.js";
-import { ScrollAreaRootCssVars as J } from "./als-react-ts-ui540.js";
-import { SCROLL_TIMEOUT as E } from "./als-react-ts-ui541.js";
-import { getOffset as x } from "./als-react-ts-ui542.js";
-import { ScrollAreaScrollbarDataAttributes as pt } from "./als-react-ts-ui543.js";
-import { styleDisableScrollbar as St } from "./als-react-ts-ui415.js";
-import { useBaseUiId as Rt } from "./als-react-ts-ui249.js";
-import { scrollAreaStateAttributesMapping as gt } from "./als-react-ts-ui544.js";
-import { jsxs as bt } from "react/jsx-runtime";
-import { contains as Et } from "./als-react-ts-ui331.js";
-const K = {
-  width: 0,
-  height: 0
-}, xt = {
-  xStart: !1,
-  xEnd: !1,
-  yStart: !1,
-  yEnd: !1
-}, vt = /* @__PURE__ */ t.forwardRef(function(l, Q) {
-  const {
-    render: Tt,
-    className: wt,
-    overflowEdgeThreshold: tt,
-    ...et
-  } = l, [A, S] = t.useState(!1), [M, u] = t.useState(!1), [C, f] = t.useState(!1), [R, rt] = t.useState(K), [P, ot] = t.useState(K), [D, L] = t.useState(!1), [a, nt] = t.useState(xt), W = Rt(), g = t.useRef(null), r = t.useRef(null), m = t.useRef(null), h = t.useRef(null), o = t.useRef(null), n = t.useRef(null), z = t.useRef(null), v = t.useRef(!1), I = t.useRef(0), U = t.useRef(0), _ = t.useRef(0), N = t.useRef(0), i = t.useRef("vertical"), V = q(), F = q(), y = t.useRef({
-    x: 0,
-    y: 0
-  }), [s, st] = t.useState({
-    scrollbarYHidden: !1,
-    scrollbarXHidden: !1,
-    cornerHidden: !1
-  }), $ = yt(tt), j = b((e) => {
-    const d = e.x - y.current.x, p = e.y - y.current.y;
-    y.current = e, p !== 0 && (f(!0), V.start(E, () => {
-      f(!1);
-    })), d !== 0 && (u(!0), F.start(E, () => {
-      u(!1);
-    }));
-  }), k = b((e) => {
-    e.button === 0 && (v.current = !0, I.current = e.clientY, U.current = e.clientX, i.current = e.currentTarget.getAttribute(pt.orientation), r.current && (_.current = r.current.scrollTop, N.current = r.current.scrollLeft), o.current && i.current === "vertical" && o.current.setPointerCapture(e.pointerId), n.current && i.current === "horizontal" && n.current.setPointerCapture(e.pointerId));
-  }), B = b((e) => {
-    if (!v.current)
-      return;
-    const d = e.clientY - I.current, p = e.clientX - U.current;
-    if (r.current) {
-      const it = r.current.scrollHeight, ut = r.current.clientHeight, ft = r.current.scrollWidth, dt = r.current.clientWidth;
-      if (o.current && m.current && i.current === "vertical") {
-        const w = x(m.current, "padding", "y"), H = x(o.current, "margin", "y"), X = o.current.offsetHeight, Y = m.current.offsetHeight - X - w - H, O = d / Y;
-        r.current.scrollTop = _.current + O * (it - ut), e.preventDefault(), f(!0), V.start(E, () => {
-          f(!1);
-        });
+import { jsx as l } from "react/jsx-runtime";
+import { createContext as f, forwardRef as i, useContext as p } from "react";
+import n from "./als-react-ts-ui525.js";
+import { TabsRoot as d } from "./als-react-ts-ui526.js";
+import { TabsList as L } from "./als-react-ts-ui527.js";
+import { TabsTab as N } from "./als-react-ts-ui528.js";
+import { TabsIndicator as A } from "./als-react-ts-ui529.js";
+import { TabsPanel as S } from "./als-react-ts-ui530.js";
+const c = f({
+  size: "md"
+}), u = () => p(c), C = i(
+  ({
+    value: s,
+    defaultValue: o = 0,
+    onValueChange: t,
+    orientation: a = "horizontal",
+    size: e = "md",
+    className: r,
+    children: m
+  }, b) => {
+    const T = [
+      n.root,
+      n[`root--${a}`],
+      r
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ l(c.Provider, { value: { size: e }, children: /* @__PURE__ */ l(
+      d,
+      {
+        ref: b,
+        value: s,
+        defaultValue: o,
+        onValueChange: t,
+        orientation: a,
+        className: T,
+        children: m
       }
-      if (n.current && h.current && i.current === "horizontal") {
-        const w = x(h.current, "padding", "x"), H = x(n.current, "margin", "x"), X = n.current.offsetWidth, Y = h.current.offsetWidth - X - w - H, O = p / Y;
-        r.current.scrollLeft = N.current + O * (ft - dt), e.preventDefault(), u(!0), F.start(E, () => {
-          u(!1);
-        });
+    ) });
+  }
+);
+C.displayName = "ALSTabs.Root";
+const j = i(
+  ({ activateOnFocus: s = !1, loopFocus: o = !0, className: t, children: a }, e) => {
+    const r = [n.list, t].filter(Boolean).join(" ");
+    return /* @__PURE__ */ l(
+      L,
+      {
+        ref: e,
+        activateOnFocus: s,
+        loopFocus: o,
+        className: r,
+        children: a
+      }
+    );
+  }
+);
+j.displayName = "ALSTabs.List";
+const x = i(
+  ({ value: s, disabled: o = !1, className: t, children: a }, e) => {
+    const { size: r } = u(), m = [n.tab, n[`tab--${r}`], t].filter(Boolean).join(" ");
+    return /* @__PURE__ */ l(
+      N,
+      {
+        ref: e,
+        value: s,
+        disabled: o,
+        className: m,
+        children: a
       }
-    }
-  }), G = b((e) => {
-    v.current = !1, o.current && i.current === "vertical" && o.current.releasePointerCapture(e.pointerId), n.current && i.current === "horizontal" && n.current.releasePointerCapture(e.pointerId);
-  });
-  function Z(e) {
-    const d = e.pointerType === "touch";
-    if (L(d), !d) {
-      const p = Et(g.current, e.target);
-      S(p);
-    }
+    );
   }
-  const T = t.useMemo(() => ({
-    hasOverflowX: !s.scrollbarXHidden,
-    hasOverflowY: !s.scrollbarYHidden,
-    overflowXStart: a.xStart,
-    overflowXEnd: a.xEnd,
-    overflowYStart: a.yStart,
-    overflowYEnd: a.yEnd,
-    cornerHidden: s.cornerHidden
-  }), [s.scrollbarXHidden, s.scrollbarYHidden, s.cornerHidden, a]), ct = {
-    role: "presentation",
-    onPointerEnter: Z,
-    onPointerMove: Z,
-    onPointerDown({
-      pointerType: e
-    }) {
-      L(e === "touch");
-    },
-    onPointerLeave() {
-      S(!1);
-    },
-    style: {
-      position: "relative",
-      [J.scrollAreaCornerHeight]: `${R.height}px`,
-      [J.scrollAreaCornerWidth]: `${R.width}px`
-    }
-  }, lt = ht("div", l, {
-    state: T,
-    ref: [Q, g],
-    props: [ct, et],
-    stateAttributesMapping: gt
-  }), at = t.useMemo(() => ({
-    handlePointerDown: k,
-    handlePointerMove: B,
-    handlePointerUp: G,
-    handleScroll: j,
-    cornerSize: R,
-    setCornerSize: rt,
-    thumbSize: P,
-    setThumbSize: ot,
-    touchModality: D,
-    cornerRef: z,
-    scrollingX: M,
-    setScrollingX: u,
-    scrollingY: C,
-    setScrollingY: f,
-    hovering: A,
-    setHovering: S,
-    viewportRef: r,
-    rootRef: g,
-    scrollbarYRef: m,
-    scrollbarXRef: h,
-    thumbYRef: o,
-    thumbXRef: n,
-    rootId: W,
-    hiddenState: s,
-    setHiddenState: st,
-    overflowEdges: a,
-    setOverflowEdges: nt,
-    viewportState: T,
-    overflowEdgeThreshold: $
-  }), [k, B, G, j, R, P, D, z, M, u, C, f, A, S, r, g, m, h, o, n, W, s, a, T, $]);
-  return /* @__PURE__ */ bt(mt.Provider, {
-    value: at,
-    children: [St.element, lt]
-  });
-});
-process.env.NODE_ENV !== "production" && (vt.displayName = "ScrollAreaRoot");
-function yt(c) {
-  if (typeof c == "number") {
-    const l = Math.max(0, c);
-    return {
-      xStart: l,
-      xEnd: l,
-      yStart: l,
-      yEnd: l
-    };
+);
+x.displayName = "ALSTabs.Tab";
+const y = i(
+  ({ className: s, renderBeforeHydration: o = !1 }, t) => {
+    const a = [n.indicator, s].filter(Boolean).join(" ");
+    return /* @__PURE__ */ l(
+      A,
+      {
+        ref: t,
+        renderBeforeHydration: o,
+        className: a
+      }
+    );
+  }
+);
+y.displayName = "ALSTabs.Indicator";
+const B = i(
+  ({ value: s, keepMounted: o = !1, className: t, children: a }, e) => {
+    const r = [n.panel, t].filter(Boolean).join(" ");
+    return /* @__PURE__ */ l(
+      S,
+      {
+        ref: e,
+        value: s,
+        keepMounted: o,
+        className: r,
+        children: a
+      }
+    );
   }
-  return {
-    xStart: Math.max(0, c?.xStart || 0),
-    xEnd: Math.max(0, c?.xEnd || 0),
-    yStart: Math.max(0, c?.yStart || 0),
-    yEnd: Math.max(0, c?.yEnd || 0)
-  };
-}
+);
+B.displayName = "ALSTabs.Panel";
 export {
-  vt as ScrollAreaRoot
+  y as ALSTabsIndicator,
+  j as ALSTabsList,
+  B as ALSTabsPanel,
+  C as ALSTabsRoot,
+  x as ALSTabsTab
 };