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

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

@@ -1,100 +1,6 @@
-import * as e from "react";
-import * as q from "react-dom";
-import { useControlled as z } from "./als-react-ts-ui282.js";
-import { useStableCallback as r } from "./als-react-ts-ui192.js";
-import { PreviewCardRootContext as B } from "./als-react-ts-ui532.js";
-import { OPEN_DELAY as x, CLOSE_DELAY as D } from "./als-react-ts-ui533.js";
-import { useFocusWithDelay as G } from "./als-react-ts-ui534.js";
-import { useOpenChangeComplete as J } from "./als-react-ts-ui253.js";
-import { useTransitionStatus as Q } from "./als-react-ts-ui344.js";
-import { jsx as X } from "react/jsx-runtime";
-import { useFloatingRootContext as Z } from "./als-react-ts-ui385.js";
-import { useHover as $ } from "./als-react-ts-ui389.js";
-import { safePolygon as ee } from "./als-react-ts-ui360.js";
-import { useDismiss as oe } from "./als-react-ts-ui330.js";
-import { useInteractions as te } from "./als-react-ts-ui263.js";
-import { triggerHover as F, triggerFocus as ne, triggerPress as se, escapeKey as re } from "./als-react-ts-ui248.js";
-function Pe(u) {
-  const {
-    open: T,
-    defaultOpen: H,
-    onOpenChange: M,
-    onOpenChangeComplete: a,
-    actionsRef: p
-  } = u, f = e.useRef(x), g = e.useRef(D), d = r((o) => {
-    f.current = o.delay ?? x, g.current = o.closeDelay ?? D;
-  }), [b, I] = e.useState(null), [i, L] = e.useState(null), [V, C] = e.useState(), y = e.useRef(null), [n, A] = z({
-    controlled: T,
-    default: H,
-    name: "PreviewCard",
-    state: "open"
-  }), U = r(M), {
-    mounted: R,
-    setMounted: l,
-    transitionStatus: h
-  } = Q(n), c = r(() => {
-    l(!1), a?.(!1);
-  });
-  J({
-    enabled: !p,
-    open: n,
-    ref: y,
-    onComplete() {
-      n || c();
-    }
-  }), e.useImperativeHandle(p, () => ({
-    unmount: c
-  }), [c]);
-  const m = r((o, t) => {
-    const N = t.reason === F, v = o && t.reason === ne, W = !o && (t.reason === se || t.reason === re);
-    if (U(o, t), t.isCanceled)
-      return;
-    function w() {
-      A(o);
-    }
-    N ? q.flushSync(w) : w(), v || W ? C(v ? "focus" : "dismiss") : t.reason === F && C(void 0);
-  }), s = Z({
-    elements: {
-      reference: b,
-      floating: i
-    },
-    open: n,
-    onOpenChange: m
-  }), P = V, O = () => f.current, Y = () => g.current, _ = $(s, {
-    mouseOnly: !0,
-    move: !1,
-    handleClose: ee(),
-    restMs: O,
-    delay: () => ({
-      close: Y()
-    })
-  }), j = G(s, {
-    delay: O
-  }), k = oe(s), {
-    getReferenceProps: S,
-    getFloatingProps: E
-  } = te([_, j, k]), K = e.useMemo(() => ({
-    open: n,
-    setOpen: m,
-    mounted: R,
-    setMounted: l,
-    setTriggerElement: I,
-    positionerElement: i,
-    setPositionerElement: L,
-    popupRef: y,
-    triggerProps: S(),
-    popupProps: E(),
-    floatingRootContext: s,
-    instantType: P,
-    transitionStatus: h,
-    onOpenChangeComplete: a,
-    writeDelayRefs: d
-  }), [n, m, R, l, i, S, E, s, P, h, a, d]);
-  return /* @__PURE__ */ X(B.Provider, {
-    value: K,
-    children: u.children
-  });
+function i(t) {
+  return t == null || t.hasAttribute("disabled") || t.getAttribute("aria-disabled") === "true";
 }
 export {
-  Pe as PreviewCardRoot
+  i as isElementDisabled
 };

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

@@ -1,31 +1,21 @@
-const _ = "_container_z6vxp_6", t = "_labelContainer_z6vxp_26", i = "_label_z6vxp_26", s = "_required_z6vxp_46", c = "_description_z6vxp_51", e = "_thumb_z6vxp_145", n = {
-  container: _,
-  "container--left": "_container--left_z6vxp_12",
-  "container--right": "_container--right_z6vxp_16",
-  "container--disabled": "_container--disabled_z6vxp_20",
-  labelContainer: t,
-  label: i,
-  required: s,
-  description: c,
-  switch: "_switch_z6vxp_61",
-  "switch--primary": "_switch--primary_z6vxp_93",
-  "switch--success": "_switch--success_z6vxp_101",
-  "switch--warning": "_switch--warning_z6vxp_109",
-  "switch--error": "_switch--error_z6vxp_117",
-  "switch--sm": "_switch--sm_z6vxp_126",
-  "switch--md": "_switch--md_z6vxp_132",
-  "switch--lg": "_switch--lg_z6vxp_138",
-  thumb: e,
-  "thumb--sm": "_thumb--sm_z6vxp_158",
-  "thumb--md": "_thumb--md_z6vxp_163",
-  "thumb--lg": "_thumb--lg_z6vxp_168"
+import { CollapsiblePanelDataAttributes as e } from "./als-react-ts-ui347.js";
+import { CollapsibleTriggerDataAttributes as n } from "./als-react-ts-ui349.js";
+const r = {
+  [e.open]: ""
+}, p = {
+  [e.closed]: ""
+}, a = {
+  open(t) {
+    return t ? {
+      [n.panelOpen]: ""
+    } : null;
+  }
+}, i = {
+  open(t) {
+    return t ? r : p;
+  }
 };
 export {
-  _ as container,
-  n as default,
-  c as description,
-  i as label,
-  t as labelContainer,
-  s as required,
-  e as thumb
+  i as collapsibleOpenStateMapping,
+  a as triggerOpenStateMapping
 };

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

@@ -1,143 +1,25 @@
-import * as a from "react";
-import { useControlled as K } from "./als-react-ts-ui282.js";
-import { useStableCallback as Q } from "./als-react-ts-ui192.js";
-import { useMergedRefs as W } from "./als-react-ts-ui287.js";
-import { useIsoLayoutEffect as X } from "./als-react-ts-ui193.js";
-import { visuallyHidden as Y } from "./als-react-ts-ui375.js";
-import { useRenderElement as Z } from "./als-react-ts-ui189.js";
-import { useBaseUiId as $ } from "./als-react-ts-ui249.js";
-import { SwitchRootContext as ee } from "./als-react-ts-ui550.js";
-import { stateAttributesMapping as te } from "./als-react-ts-ui551.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-ui246.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-ui247.js";
-import { mergeProps as ue } from "./als-react-ts-ui304.js";
-import { none as me } from "./als-react-ts-ui248.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");
+import { isAndroid as r, isJSDOM as o } from "./als-react-ts-ui351.js";
+function n(i) {
+  i.preventDefault(), i.stopPropagation();
+}
+function p(i) {
+  return "nativeEvent" in i;
+}
+function e(i) {
+  return i.mozInputSource === 0 && i.isTrusted ? !0 : r && i.pointerType ? i.type === "click" && i.buttons === 1 : i.detail === 0 && !i.pointerType;
+}
+function c(i) {
+  return o ? !1 : !r && i.width === 0 && i.height === 0 || r && i.width === 1 && i.height === 1 && i.pressure === 0 && i.detail === 0 && i.pointerType === "mouse" || // iOS VoiceOver returns 0.333• for width/height.
+  i.width < 1 && i.height < 1 && i.pressure === 0 && i.detail === 0 && i.pointerType === "touch";
+}
+function f(i, u) {
+  const t = ["mouse", "pen"];
+  return u || t.push("", void 0), t.includes(i);
+}
 export {
-  fe as SwitchRoot
+  f as isMouseLikePointerType,
+  p as isReactEvent,
+  e as isVirtualClick,
+  c as isVirtualPointerEvent,
+  n as stopEvent
 };

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

@@ -1,27 +1,167 @@
-import * as n from "react";
-import { useSwitchRootContext as m } from "./als-react-ts-ui550.js";
-import { useRenderElement as a } from "./als-react-ts-ui189.js";
-import { useFieldRootContext as c } from "./als-react-ts-ui398.js";
-import { stateAttributesMapping as p } from "./als-react-ts-ui551.js";
-const f = /* @__PURE__ */ n.forwardRef(function(t, e) {
+import * as f from "react";
+import { useIsoLayoutEffect as g } from "./als-react-ts-ui267.js";
+import { useStableCallback as B } from "./als-react-ts-ui266.js";
+import { useMergedRefs as k } from "./als-react-ts-ui272.js";
+import { useOnMount as z } from "./als-react-ts-ui345.js";
+import { useAnimationFrame as V, AnimationFrame as s } from "./als-react-ts-ui346.js";
+import { warn as U } from "./als-react-ts-ui268.js";
+import { createChangeEventDetails as _ } from "./als-react-ts-ui229.js";
+import { CollapsiblePanelDataAttributes as v } from "./als-react-ts-ui347.js";
+import { AccordionRootDataAttributes as G } from "./als-react-ts-ui348.js";
+import { none as J } from "./als-react-ts-ui231.js";
+function oe(H) {
   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");
+    abortControllerRef: r,
+    animationTypeRef: i,
+    externalRef: W,
+    height: x,
+    hiddenUntilFound: d,
+    keepMounted: w,
+    id: O,
+    mounted: R,
+    onOpenChange: D,
+    open: l,
+    panelRef: a,
+    runOnceAnimationsFinish: h,
+    setDimensions: c,
+    setMounted: m,
+    setOpen: E,
+    setVisible: A,
+    transitionDimensionRef: C,
+    visible: P,
+    width: I
+  } = H, p = f.useRef(!1), M = f.useRef(null), F = f.useRef(l), S = f.useRef(l), N = V(), y = f.useMemo(() => i.current === "css-animation" ? !P : !l && !R, [l, R, P, i]), L = B((e) => {
+    if (!e)
+      return;
+    if (i.current == null || C.current == null) {
+      const t = getComputedStyle(e), u = t.animationName !== "none" && t.animationName !== "", b = t.transitionDuration !== "0s" && t.transitionDuration !== "";
+      u && b ? process.env.NODE_ENV !== "production" && U("CSS transitions and CSS animations both detected on Collapsible or Accordion panel.", "Only one of either animation type should be used.") : t.animationName === "none" && t.transitionDuration !== "0s" ? i.current = "css-transition" : t.animationName !== "none" && t.transitionDuration === "0s" ? i.current = "css-animation" : i.current = "none", e.getAttribute(G.orientation) === "horizontal" || t.transitionProperty.indexOf("width") > -1 ? C.current = "width" : C.current = "height";
+    }
+    if (i.current !== "css-transition")
+      return;
+    (x === void 0 || I === void 0) && (c({
+      height: e.scrollHeight,
+      width: e.scrollWidth
+    }), S.current && e.style.setProperty("transition-duration", "0s"));
+    let o = -1, n = -1;
+    return o = s.request(() => {
+      S.current = !1, n = s.request(() => {
+        setTimeout(() => {
+          e.style.removeProperty("transition-duration");
+        });
+      });
+    }), () => {
+      s.cancel(o), s.cancel(n);
+    };
+  }), j = k(W, a, L);
+  return g(() => {
+    if (i.current !== "css-transition")
+      return;
+    const e = a.current;
+    if (!e)
+      return;
+    let o = -1;
+    if (r.current != null && (r.current.abort(), r.current = null), l) {
+      const n = {
+        "justify-content": e.style.justifyContent,
+        "align-items": e.style.alignItems,
+        "align-content": e.style.alignContent,
+        "justify-items": e.style.justifyItems
+      };
+      Object.keys(n).forEach((t) => {
+        e.style.setProperty(t, "initial", "important");
+      }), !S.current && !w && e.setAttribute(v.startingStyle, ""), c({
+        height: e.scrollHeight,
+        width: e.scrollWidth
+      }), o = s.request(() => {
+        Object.entries(n).forEach(([t, u]) => {
+          u === "" ? e.style.removeProperty(t) : e.style.setProperty(t, u);
+        });
+      });
+    } else {
+      if (e.scrollHeight === 0 && e.scrollWidth === 0)
+        return;
+      c({
+        height: e.scrollHeight,
+        width: e.scrollWidth
+      });
+      const n = new AbortController();
+      r.current = n;
+      const t = n.signal;
+      let u = null;
+      const b = v.endingStyle;
+      return u = new MutationObserver((T) => {
+        T.some((q) => q.type === "attributes" && q.attributeName === b) && (u?.disconnect(), u = null, h(() => {
+          c({
+            height: 0,
+            width: 0
+          }), e.style.removeProperty("content-visibility"), m(!1), r.current === n && (r.current = null);
+        }, t));
+      }), u.observe(e, {
+        attributes: !0,
+        attributeFilter: [b]
+      }), () => {
+        u?.disconnect(), N.cancel(), r.current === n && (n.abort(), r.current = null);
+      };
+    }
+    return () => {
+      s.cancel(o);
+    };
+  }, [r, i, N, d, w, R, l, a, h, c, m]), g(() => {
+    if (i.current !== "css-animation")
+      return;
+    const e = a.current;
+    e && (M.current = e.style.animationName || M.current, e.style.setProperty("animation-name", "none"), c({
+      height: e.scrollHeight,
+      width: e.scrollWidth
+    }), !F.current && !p.current && e.style.removeProperty("animation-name"), l ? (r.current != null && (r.current.abort(), r.current = null), m(!0), A(!0)) : (r.current = new AbortController(), h(() => {
+      m(!1), A(!1), r.current = null;
+    }, r.current.signal)));
+  }, [r, i, l, a, h, c, m, A, P]), z(() => {
+    const e = s.request(() => {
+      F.current = !1;
+    });
+    return () => s.cancel(e);
+  }), g(() => {
+    if (!d)
+      return;
+    const e = a.current;
+    if (!e)
+      return;
+    let o = -1, n = -1;
+    return l && p.current && (e.style.transitionDuration = "0s", c({
+      height: e.scrollHeight,
+      width: e.scrollWidth
+    }), o = s.request(() => {
+      p.current = !1, n = s.request(() => {
+        setTimeout(() => {
+          e.style.removeProperty("transition-duration");
+        });
+      });
+    })), () => {
+      s.cancel(o), s.cancel(n);
+    };
+  }, [d, l, a, c]), g(() => {
+    const e = a.current;
+    e && d && y && (e.setAttribute("hidden", "until-found"), i.current === "css-transition" && e.setAttribute(v.startingStyle, ""));
+  }, [d, y, i, a]), f.useEffect(function() {
+    const o = a.current;
+    if (!o)
+      return;
+    function n(t) {
+      p.current = !0, E(!0), D(!0, _(J, t));
+    }
+    return o.addEventListener("beforematch", n), () => {
+      o.removeEventListener("beforematch", n);
+    };
+  }, [D, a, E]), f.useMemo(() => ({
+    props: {
+      hidden: y,
+      id: O,
+      ref: j
+    }
+  }), [y, O, j]);
+}
 export {
-  f as SwitchThumb
+  oe as useCollapsiblePanel
 };

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

@@ -1,31 +1,6 @@
-import * as n from "react";
-function d({
-  controlled: o,
-  default: s,
-  name: t,
-  state: i = "value"
-}) {
-  const {
-    current: e
-  } = n.useRef(o !== void 0), [l, c] = n.useState(s), u = e ? o : l;
-  if (process.env.NODE_ENV !== "production") {
-    n.useEffect(() => {
-      e !== (o !== void 0) && console.error([`Base UI: A component is changing the ${e ? "" : "un"}controlled ${i} state of ${t} to be ${e ? "un" : ""}controlled.`, "Elements should not switch from uncontrolled to controlled (or vice versa).", `Decide between using a controlled or uncontrolled ${t} element for the lifetime of the component.`, "The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.", "More info: https://fb.me/react-controlled-components"].join(`
-`));
-    }, [i, t, o]);
-    const {
-      current: r
-    } = n.useRef(s);
-    n.useEffect(() => {
-      !e && JSON.stringify(r) !== JSON.stringify(s) && console.error([`Base UI: A component is changing the default ${i} state of an uncontrolled ${t} after being initialized. To suppress this warning opt to use a controlled ${t}.`].join(`
-`));
-    }, [JSON.stringify(s)]);
-  }
-  const f = n.useCallback((r) => {
-    e || c(r);
-  }, []);
-  return [u, f];
-}
+let e = /* @__PURE__ */ (function(n) {
+  return n.accordionPanelHeight = "--accordion-panel-height", n.accordionPanelWidth = "--accordion-panel-width", n;
+})({});
 export {
-  d as useControlled
+  e as AccordionPanelCssVars
 };

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

@@ -1,11 +1,44 @@
-let n;
-process.env.NODE_ENV !== "production" && (n = /* @__PURE__ */ new Set());
-function s(...o) {
-  if (process.env.NODE_ENV !== "production") {
-    const e = o.join(" ");
-    n.has(e) || (n.add(e), console.warn(`Base UI: ${e}`));
-  }
-}
+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"
+};
 export {
-  s as warn
+  r as content,
+  v as corner,
+  d as default,
+  t as fadeOverlay,
+  o as root,
+  e as scrollbar,
+  l as thumb,
+  _ as viewport
 };