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

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

@@ -1,170 +1,40 @@
-import * as s from "react";
-import * as F from "react-dom";
-import { ownerDocument as W } from "./als-react-ts-ui372.js";
-import { isWebKit as Y } from "./als-react-ts-ui371.js";
-import { useValueAsRef as J } from "./als-react-ts-ui337.js";
-import { useStableCallback as I } from "./als-react-ts-ui192.js";
-import { useNumberFieldRootContext as H } from "./als-react-ts-ui498.js";
-import { stateAttributesMapping as Q } from "./als-react-ts-ui499.js";
-import { NumberFieldScrubAreaContext as Z } from "./als-react-ts-ui504.js";
-import { useRenderElement as ee } from "./als-react-ts-ui189.js";
-import { getViewportRect as te } from "./als-react-ts-ui505.js";
-import { subscribeToVisualViewportResize as re } from "./als-react-ts-ui506.js";
-import { DEFAULT_STEP as ne } from "./als-react-ts-ui501.js";
-import { createGenericEventDetails as oe } from "./als-react-ts-ui246.js";
-import { jsx as ue } from "react/jsx-runtime";
-import { getWindow as se } from "./als-react-ts-ui339.js";
-import { scrub as O } from "./als-react-ts-ui248.js";
-const ie = /* @__PURE__ */ s.forwardRef(function(g, U) {
-  const {
-    render: ae,
-    className: fe,
-    direction: d = "horizontal",
-    pixelSensitivity: h = 2,
-    teleportDistance: x,
-    ...$
-  } = g, {
-    state: z
-  } = H(), {
-    isScrubbing: f,
-    setIsScrubbing: G,
-    disabled: p,
-    readOnly: b,
-    value: _,
-    inputRef: y,
-    incrementValue: A,
-    getStepAmount: C,
-    onValueCommitted: D,
-    lastChangedValueRef: L,
-    valueRef: P
-  } = H(), j = J(_), l = s.useRef(null), v = s.useRef(!1), c = s.useRef(null), R = s.useRef({
-    x: 0,
-    y: 0
-  }), w = s.useRef(1), [T, q] = s.useState(!1), [V, M] = s.useState(!1);
-  s.useEffect(() => {
-    if (!(!f || !c.current))
-      return re(c.current, w);
-  }, [f]);
-  function N(e, r) {
-    c.current && (c.current.style.transform = `translate3d(${e}px,${r}px,0) scale(${1 / w.current})`);
+import { TransitionStatusDataAttributes as p } from "./als-react-ts-ui228.js";
+let r = (function(n) {
+  return n.open = "data-open", n.closed = "data-closed", n[n.startingStyle = p.startingStyle] = "startingStyle", n[n.endingStyle = p.endingStyle] = "endingStyle", n.anchorHidden = "data-anchor-hidden", n;
+})({}), e = /* @__PURE__ */ (function(n) {
+  return n.popupOpen = "data-popup-open", n.pressed = "data-pressed", n;
+})({});
+const t = {
+  [e.popupOpen]: ""
+}, d = {
+  [e.popupOpen]: "",
+  [e.pressed]: ""
+}, O = {
+  [r.open]: ""
+}, l = {
+  [r.closed]: ""
+}, s = {
+  [r.anchorHidden]: ""
+}, i = {
+  open(n) {
+    return n ? t : null;
   }
-  const k = I(({
-    movementX: e,
-    movementY: r
-  }) => {
-    const n = c.current, u = l.current;
-    if (!n || !u)
-      return;
-    const t = te(x, u), i = R.current, o = {
-      x: Math.round(i.x + e),
-      y: Math.round(i.y + r)
-    }, a = n.offsetWidth, m = n.offsetHeight;
-    o.x + a / 2 < t.x ? o.x = t.width - a / 2 : o.x + a / 2 > t.width && (o.x = t.x - a / 2), o.y + m / 2 < t.y ? o.y = t.height - m / 2 : o.y + m / 2 > t.height && (o.y = t.y - m / 2), R.current = o, N(o.x, o.y);
-  }), S = I((e, {
-    clientX: r,
-    clientY: n
-  }) => {
-    F.flushSync(() => {
-      G(e);
-    });
-    const u = c.current;
-    if (!u || !e)
-      return;
-    const t = {
-      x: r - u.offsetWidth / 2,
-      y: n - u.offsetHeight / 2
-    };
-    R.current = t, N(t.x, t.y);
-  });
-  s.useEffect(function() {
-    if (!y.current || p || b || !f)
-      return;
-    let r = 0;
-    function n(i) {
-      try {
-        W(l.current).exitPointerLock();
-      } catch {
-      } finally {
-        v.current = !1, S(!1, i), D(L.current ?? P.current, oe(O, i));
-      }
-    }
-    function u(i) {
-      if (!v.current)
-        return;
-      i.preventDefault(), k(i);
-      const {
-        movementX: o,
-        movementY: a
-      } = i;
-      if (r += d === "vertical" ? a : o, Math.abs(r) >= h) {
-        r = 0;
-        const m = d === "vertical" ? -a : o, X = C(i) ?? ne, E = m * X;
-        E !== 0 && A(Math.abs(E), {
-          direction: E >= 0 ? 1 : -1,
-          event: i,
-          reason: O
-        });
-      }
-    }
-    const t = se(y.current);
-    return t.addEventListener("pointerup", n, !0), t.addEventListener("pointermove", u, !0), () => {
-      t.removeEventListener("pointerup", n, !0), t.removeEventListener("pointermove", u, !0);
-    };
-  }, [p, b, f, A, j, C, y, S, k, d, h, L, D, P]), s.useEffect(function() {
-    const r = l.current;
-    if (!r || p || b)
-      return;
-    function n(u) {
-      u.touches.length === 1 && u.preventDefault();
-    }
-    return r.addEventListener("touchstart", n), () => {
-      r.removeEventListener("touchstart", n);
-    };
-  }, [p, b]);
-  const B = ee("span", g, {
-    ref: [U, l],
-    state: z,
-    props: [{
-      role: "presentation",
-      style: {
-        touchAction: "none",
-        WebkitUserSelect: "none",
-        userSelect: "none"
-      },
-      async onPointerDown(e) {
-        const r = !e.button || e.button === 0;
-        if (e.defaultPrevented || b || !r || p)
-          return;
-        const n = e.pointerType === "touch";
-        if (q(n), e.pointerType === "mouse" && (e.preventDefault(), y.current?.focus()), v.current = !0, S(!0, e.nativeEvent), !n && !Y)
-          try {
-            await W(l.current).body.requestPointerLock(), M(!1);
-          } catch {
-            M(!0);
-          } finally {
-            v.current && F.flushSync(() => {
-              S(!0, e.nativeEvent);
-            });
-          }
-      }
-    }, $],
-    stateAttributesMapping: Q
-  }), K = s.useMemo(() => ({
-    isScrubbing: f,
-    isTouchInput: T,
-    isPointerLockDenied: V,
-    scrubAreaCursorRef: c,
-    scrubAreaRef: l,
-    direction: d,
-    pixelSensitivity: h,
-    teleportDistance: x
-  }), [f, T, V, d, h, x]);
-  return /* @__PURE__ */ ue(Z.Provider, {
-    value: K,
-    children: B
-  });
-});
-process.env.NODE_ENV !== "production" && (ie.displayName = "NumberFieldScrubArea");
+}, a = {
+  open(n) {
+    return n ? d : null;
+  }
+}, o = {
+  open(n) {
+    return n ? O : l;
+  },
+  anchorHidden(n) {
+    return n ? s : null;
+  }
+};
 export {
-  ie as NumberFieldScrubArea
+  r as CommonPopupDataAttributes,
+  e as CommonTriggerDataAttributes,
+  o as popupStateMapping,
+  a as pressableTriggerOpenStateMapping,
+  i as triggerOpenStateMapping
 };

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

@@ -1,41 +1,16 @@
-import * as o from "react";
-import * as p from "react-dom";
-import { isWebKit as d } from "./als-react-ts-ui371.js";
-import { ownerDocument as b } from "./als-react-ts-ui372.js";
-import { useNumberFieldRootContext as f } from "./als-react-ts-ui498.js";
-import { stateAttributesMapping as N } from "./als-react-ts-ui499.js";
-import { useNumberFieldScrubAreaContext as R } from "./als-react-ts-ui504.js";
-import { useRenderElement as A } from "./als-react-ts-ui189.js";
-const C = /* @__PURE__ */ o.forwardRef(function(e, t) {
-  const {
-    render: S,
-    className: D,
-    ...s
-  } = e, {
-    state: n
-  } = f(), {
-    isScrubbing: i,
-    isTouchInput: m,
-    isPointerLockDenied: u,
-    scrubAreaCursorRef: a
-  } = R(), [c, l] = o.useState(null), r = A("span", e, {
-    enabled: i && !d && !m && !u,
-    ref: [t, a, l],
-    state: n,
-    props: [{
-      role: "presentation",
-      style: {
-        position: "fixed",
-        top: 0,
-        left: 0,
-        pointerEvents: "none"
-      }
-    }, s],
-    stateAttributesMapping: N
-  });
-  return r && /* @__PURE__ */ p.createPortal(r, b(c).body);
-});
-process.env.NODE_ENV !== "production" && (C.displayName = "NumberFieldScrubAreaCursor");
+let n = /* @__PURE__ */ (function(t) {
+  return t.startingStyle = "data-starting-style", t.endingStyle = "data-ending-style", t;
+})({});
+const e = {
+  [n.startingStyle]: ""
+}, i = {
+  [n.endingStyle]: ""
+}, r = {
+  transitionStatus(t) {
+    return t === "starting" ? e : t === "ending" ? i : null;
+  }
+};
 export {
-  C as NumberFieldScrubAreaCursor
+  n as TransitionStatusDataAttributes,
+  r as transitionStatusMapping
 };

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

@@ -1,55 +1,35 @@
-const _ = "_group_1qx6w_10", r = "_radio_1qx6w_16", o = "_groupLabel_1qx6w_24", i = "_required_1qx6w_45", e = "_radioGroup_1qx6w_54", d = "_item_1qx6w_74", a = "_indicator_1qx6w_215", t = "_content_1qx6w_257", l = "_label_1qx6w_264", s = "_description_1qx6w_283", x = "_helperText_1qx6w_306", c = "_errorText_1qx6w_313", n = {
-  group: _,
-  "group--error": "_group--error_1qx6w_16",
-  radio: r,
-  groupLabel: o,
-  "groupLabel--sm": "_groupLabel--sm_1qx6w_33",
-  "groupLabel--md": "_groupLabel--md_1qx6w_37",
-  "groupLabel--lg": "_groupLabel--lg_1qx6w_41",
-  required: i,
-  radioGroup: e,
-  "radioGroup--vertical": "_radioGroup--vertical_1qx6w_59",
-  "radioGroup--horizontal": "_radioGroup--horizontal_1qx6w_64",
-  item: d,
-  "item--sm": "_item--sm_1qx6w_83",
-  "item--md": "_item--md_1qx6w_87",
-  "item--lg": "_item--lg_1qx6w_91",
-  "item--disabled": "_item--disabled_1qx6w_95",
-  "radio--sm": "_radio--sm_1qx6w_121",
-  "radio--md": "_radio--md_1qx6w_126",
-  "radio--lg": "_radio--lg_1qx6w_131",
-  "radio--primary": "_radio--primary_1qx6w_143",
-  "radio--secondary": "_radio--secondary_1qx6w_149",
-  "radio--success": "_radio--success_1qx6w_155",
-  "radio--error": "_radio--error_1qx6w_161",
-  indicator: a,
-  "indicator--sm": "_indicator--sm_1qx6w_238",
-  "indicator--md": "_indicator--md_1qx6w_243",
-  "indicator--lg": "_indicator--lg_1qx6w_248",
-  content: t,
-  label: l,
-  "label--sm": "_label--sm_1qx6w_271",
-  "label--md": "_label--md_1qx6w_275",
-  "label--lg": "_label--lg_1qx6w_279",
-  description: s,
-  "description--sm": "_description--sm_1qx6w_290",
-  "description--md": "_description--md_1qx6w_294",
-  "description--lg": "_description--lg_1qx6w_298",
-  helperText: x,
-  errorText: c
-};
+import { EMPTY_OBJECT as r } from "./als-react-ts-ui304.js";
+function u(e, t, n, a) {
+  let o = !1, l = !1;
+  const s = a ?? r;
+  return {
+    reason: e,
+    event: t ?? new Event("base-ui"),
+    cancel() {
+      o = !0;
+    },
+    allowPropagation() {
+      l = !0;
+    },
+    get isCanceled() {
+      return o;
+    },
+    get isPropagationAllowed() {
+      return l;
+    },
+    trigger: n,
+    ...s
+  };
+}
+function d(e, t, n) {
+  const a = n ?? r;
+  return {
+    reason: e,
+    event: t ?? new Event("base-ui"),
+    ...a
+  };
+}
 export {
-  t as content,
-  n as default,
-  s as description,
-  c as errorText,
-  _ as group,
-  o as groupLabel,
-  x as helperText,
-  a as indicator,
-  d as item,
-  l as label,
-  r as radio,
-  e as radioGroup,
-  i as required
+  u as createChangeEventDetails,
+  d as createGenericEventDetails
 };

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

@@ -1,141 +1,91 @@
-import * as n from "react";
-import { useControlled as Z } from "./als-react-ts-ui282.js";
-import { useMergedRefs as $ } from "./als-react-ts-ui287.js";
-import { useStableCallback as l } from "./als-react-ts-ui192.js";
-import { visuallyHidden as ee } from "./als-react-ts-ui375.js";
-import { useBaseUiId as oe } from "./als-react-ts-ui249.js";
-import { SHIFT as te } from "./als-react-ts-ui254.js";
-import { CompositeRoot as re } from "./als-react-ts-ui484.js";
-import { useField as ae } from "./als-react-ts-ui403.js";
-import { useFieldRootContext as ie } from "./als-react-ts-ui398.js";
-import { fieldValidityMapping as ne } from "./als-react-ts-ui409.js";
-import { useFieldsetRootContext as se } from "./als-react-ts-ui418.js";
-import { useFormContext as le } from "./als-react-ts-ui402.js";
-import { useLabelableContext as de } from "./als-react-ts-ui399.js";
-import { useValueChanged as ue } from "./als-react-ts-ui406.js";
-import { RadioGroupContext as me } from "./als-react-ts-ui496.js";
-import { jsxs as fe, jsx as P } from "react/jsx-runtime";
-import { NOOP as ce } from "./als-react-ts-ui303.js";
-import { contains as pe } from "./als-react-ts-ui331.js";
-import { mergeProps as be } from "./als-react-ts-ui304.js";
-const ge = [te], Ce = /* @__PURE__ */ n.forwardRef(function(x, F) {
+import * as i from "react";
+import { isHTMLElement as K } from "./als-react-ts-ui320.js";
+import { useStableCallback as d } from "./als-react-ts-ui266.js";
+import { error as m } from "./als-react-ts-ui321.js";
+import { useIsoLayoutEffect as N } from "./als-react-ts-ui267.js";
+import { useCompositeRootContext as O } from "./als-react-ts-ui322.js";
+import { useFocusableWhenDisabled as T } from "./als-react-ts-ui323.js";
+import { mergeProps as U, makeEventPreventable as b } from "./als-react-ts-ui305.js";
+function F(a = {}) {
   const {
-    render: I,
-    className: v,
-    disabled: M,
-    readOnly: r,
-    required: a,
-    onValueChange: N,
-    value: O,
-    defaultValue: k,
-    name: E,
-    inputRef: S,
-    id: T,
-    ...p
-  } = x, {
-    setTouched: b,
-    setFocused: m,
-    shouldValidateOnChange: D,
-    validationMode: G,
-    name: w,
-    disabled: K,
-    state: d,
-    validation: t,
-    setDirty: q,
-    setFilled: A,
-    validityData: B
-  } = ie(), {
-    labelId: H
-  } = de(), {
-    clearErrors: j
-  } = le(), U = se(!0), i = K || M, s = w ?? E, g = oe(T), [e, _] = Z({
-    controlled: O,
-    default: k,
-    name: "RadioGroup",
-    state: "value"
-  }), f = l(N), C = l((o, V) => {
-    f(o, V), !V.isCanceled && _(o);
-  }), u = n.useRef(null), R = l((o) => {
-    u.current == null && o != null && (u.current = o);
+    disabled: o = !1,
+    focusableWhenDisabled: h,
+    tabIndex: D = 0,
+    native: n = !0
+  } = a, r = i.useRef(null), u = O(!0) !== void 0, f = d(() => {
+    const t = r.current;
+    return !!(t?.tagName === "A" && t?.href);
+  }), {
+    props: s
+  } = T({
+    focusableWhenDisabled: h,
+    disabled: o,
+    composite: u,
+    tabIndex: D,
+    isNativeButton: n
   });
-  ae({
-    id: g,
-    commit: t.commit,
-    value: e,
-    controlRef: u,
-    name: s,
-    getValue: () => e ?? null
-  }), ue(e, () => {
-    j(s), q(e !== B.initialValue), A(e != null), D() ? t.commit(e) : t.commit(e, !0);
+  process.env.NODE_ENV !== "production" && i.useEffect(() => {
+    if (!r.current)
+      return;
+    const t = r.current.tagName === "BUTTON";
+    n ? t || m("A component that acts as a button was not rendered as a native <button>, which does not match the default. Ensure that the element passed to the `render` prop of the component is a real <button>, or set the `nativeButton` prop on the component to `false`.") : t && m("A component that acts as a button was rendered as a native <button>, which does not match the default. Ensure that the element passed to the `render` prop of the component is not a real <button>, or set the `nativeButton` prop on the component to `true`.");
+  }, [n]);
+  const l = i.useCallback(() => {
+    const t = r.current;
+    I(t) && u && o && s.disabled === void 0 && t.disabled && (t.disabled = !1);
+  }, [o, s.disabled, u]);
+  N(l, [l]);
+  const y = i.useCallback((t = {}) => {
+    const {
+      onClick: c,
+      onMouseDown: k,
+      onKeyUp: E,
+      onKeyDown: g,
+      onPointerDown: B,
+      ...C
+    } = t;
+    return U({
+      type: n ? "button" : void 0,
+      onClick(e) {
+        if (o) {
+          e.preventDefault();
+          return;
+        }
+        c?.(e);
+      },
+      onMouseDown(e) {
+        o || k?.(e);
+      },
+      onKeyDown(e) {
+        if (o || (b(e), g?.(e)), e.baseUIHandlerPrevented)
+          return;
+        const P = e.target === e.currentTarget && !n && !f() && !o, p = e.key === "Enter", x = e.key === " ";
+        P && ((x || p) && e.preventDefault(), p && c?.(e));
+      },
+      onKeyUp(e) {
+        o || (b(e), E?.(e)), !e.baseUIHandlerPrevented && e.target === e.currentTarget && !n && !o && e.key === " " && c?.(e);
+      },
+      onPointerDown(e) {
+        if (o) {
+          e.preventDefault();
+          return;
+        }
+        B?.(e);
+      }
+    }, n ? void 0 : {
+      role: "button"
+    }, s, C);
+  }, [o, s, n, f]), w = d((t) => {
+    r.current = t, l();
   });
-  const [h, c] = n.useState(!1), z = l((o) => {
-    pe(o.currentTarget, o.relatedTarget) || (b(!0), m(!1), G === "onBlur" && t.commit(e));
-  }), J = l((o) => {
-    o.key.startsWith("Arrow") && (b(!0), c(!0), m(!0));
-  }), y = n.useMemo(() => e == null ? "" : typeof e == "string" ? e : JSON.stringify(e), [e]), L = $(t.inputRef, S), W = be({
-    value: y,
-    ref: L,
-    id: g,
-    name: y ? s : void 0,
-    disabled: i,
-    readOnly: r,
-    required: a,
-    "aria-labelledby": p["aria-labelledby"] ?? U?.legendId,
-    "aria-hidden": !0,
-    tabIndex: -1,
-    style: ee,
-    onChange: ce,
-    // suppress a Next.js error
-    onFocus() {
-      u.current?.focus();
-    }
-  }, t.getInputValidationProps), Y = n.useMemo(() => ({
-    ...d,
-    disabled: i ?? !1,
-    required: a ?? !1,
-    readOnly: r ?? !1
-  }), [d, i, r, a]), Q = n.useMemo(() => ({
-    ...d,
-    checkedValue: e,
-    disabled: i,
-    validation: t,
-    name: s,
-    onValueChange: f,
-    readOnly: r,
-    registerControlRef: R,
-    required: a,
-    setCheckedValue: C,
-    setTouched: c,
-    touched: h
-  }), [e, i, t, d, s, f, r, R, a, C, c, h]), X = {
-    role: "radiogroup",
-    "aria-required": a || void 0,
-    "aria-disabled": i || void 0,
-    "aria-readonly": r || void 0,
-    "aria-labelledby": H,
-    onFocus() {
-      m(!0);
-    },
-    onBlur: z,
-    onKeyDownCapture: J
+  return {
+    getButtonProps: y,
+    buttonRef: w
   };
-  return /* @__PURE__ */ fe(me.Provider, {
-    value: Q,
-    children: [/* @__PURE__ */ P(re, {
-      render: I,
-      className: v,
-      state: Y,
-      props: [X, t.getValidationProps, p],
-      refs: [F],
-      stateAttributesMapping: ne,
-      enableHomeAndEndKeys: !1,
-      modifierKeys: ge
-    }), /* @__PURE__ */ P("input", {
-      ...W
-    })]
-  });
-});
-process.env.NODE_ENV !== "production" && (Ce.displayName = "RadioGroup");
+}
+function I(a) {
+  return K(a) && a.tagName === "BUTTON";
+}
 export {
-  Ce as RadioGroup
+  F as useButton
 };

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

@@ -1,37 +1,28 @@
-import * as o from "react";
-import { useRenderElement as u } from "./als-react-ts-ui189.js";
-import { useRadioRootContext as l } from "./als-react-ts-ui512.js";
-import { stateAttributesMapping as R } from "./als-react-ts-ui511.js";
-import { useOpenChangeComplete as C } from "./als-react-ts-ui253.js";
-import { useTransitionStatus as M } from "./als-react-ts-ui344.js";
-const N = /* @__PURE__ */ o.forwardRef(function(n, i) {
-  const {
-    render: E,
-    className: I,
-    keepMounted: d = !1,
-    ...c
-  } = n, t = l(), e = t.checked, {
-    transitionStatus: r,
-    setMounted: m
-  } = M(e), p = o.useMemo(() => ({
-    ...t,
-    transitionStatus: r
-  }), [t, r]), s = o.useRef(null), a = d || e, f = u("span", n, {
-    enabled: a,
-    ref: [i, s],
-    state: p,
-    props: c,
-    stateAttributesMapping: R
-  });
-  return C({
-    open: e,
-    ref: s,
-    onComplete() {
-      e || m(!1);
-    }
-  }), a ? f : null;
-});
-process.env.NODE_ENV !== "production" && (N.displayName = "RadioIndicator");
+const s = "none", e = "trigger-press", t = "trigger-hover", n = "trigger-focus", o = "outside-press", r = "item-press", c = "close-press", i = "link-press", p = "clear-press", a = "track-press", g = "input-change", u = "input-clear", l = "input-blur", d = "input-paste", P = "focus-out", b = "escape-key", k = "list-navigation", v = "keyboard", m = "pointer", w = "drag", y = "scrub", f = "cancel-open", h = "sibling-open", O = "imperative-action", z = "window-resize";
 export {
-  N as RadioIndicator
+  f as cancelOpen,
+  p as clearPress,
+  c as closePress,
+  w as drag,
+  b as escapeKey,
+  P as focusOut,
+  O as imperativeAction,
+  l as inputBlur,
+  g as inputChange,
+  u as inputClear,
+  d as inputPaste,
+  r as itemPress,
+  v as keyboard,
+  i as linkPress,
+  k as listNavigation,
+  s as none,
+  o as outsidePress,
+  m as pointer,
+  y as scrub,
+  h as siblingOpen,
+  a as trackPress,
+  n as triggerFocus,
+  t as triggerHover,
+  e as triggerPress,
+  z as windowResize
 };