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

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

@@ -0,0 +1,311 @@
+import * as n from "react";
+import { visuallyHidden as Ne } from "./als-react-ts-ui375.js";
+import { useMergedRefs as je } from "./als-react-ts-ui287.js";
+import { useRefWithInit as ze } from "./als-react-ts-ui240.js";
+import { useOnFirstRender as We } from "./als-react-ts-ui396.js";
+import { useControlled as ee } from "./als-react-ts-ui282.js";
+import { useIsoLayoutEffect as C } from "./als-react-ts-ui193.js";
+import { useStableCallback as V } from "./als-react-ts-ui192.js";
+import { useValueAsRef as Ye } from "./als-react-ts-ui337.js";
+import { SelectRootContext as Be, SelectFloatingContext as _e } from "./als-react-ts-ui397.js";
+import { useFieldRootContext as Ge } from "./als-react-ts-ui398.js";
+import { useLabelableContext as Je } from "./als-react-ts-ui399.js";
+import { useLabelableId as Ke } from "./als-react-ts-ui400.js";
+import { useTransitionStatus as Qe } from "./als-react-ts-ui344.js";
+import { selectors as y } from "./als-react-ts-ui401.js";
+import { createChangeEventDetails as te } from "./als-react-ts-ui246.js";
+import { useOpenChangeComplete as Xe } from "./als-react-ts-ui253.js";
+import { useFormContext as Ze } from "./als-react-ts-ui402.js";
+import { useField as $e } from "./als-react-ts-ui403.js";
+import { stringifyAsValue as q } from "./als-react-ts-ui404.js";
+import { defaultItemEquality as et, findItemIndex as oe } from "./als-react-ts-ui405.js";
+import { useValueChanged as tt } from "./als-react-ts-ui406.js";
+import { jsx as H, jsxs as ot } from "react/jsx-runtime";
+import { EMPTY_ARRAY as ne } from "./als-react-ts-ui303.js";
+import { useFloatingRootContext as nt } from "./als-react-ts-ui385.js";
+import { useClick as rt } from "./als-react-ts-ui262.js";
+import { useDismiss as st } from "./als-react-ts-ui330.js";
+import { useListNavigation as lt } from "./als-react-ts-ui391.js";
+import { useTypeahead as it } from "./als-react-ts-ui393.js";
+import { useInteractions as at } from "./als-react-ts-ui263.js";
+import { Store as ut } from "./als-react-ts-ui407.js";
+import { useStore as w } from "./als-react-ts-ui408.js";
+import { none as ct } from "./als-react-ts-ui248.js";
+function Yt(re) {
+  const {
+    id: N,
+    value: se,
+    defaultValue: j = null,
+    onValueChange: le,
+    open: ie,
+    defaultOpen: ae = !1,
+    onOpenChange: ue,
+    name: ce,
+    disabled: fe = !1,
+    readOnly: p = !1,
+    required: A = !1,
+    modal: S = !0,
+    actionsRef: z,
+    inputRef: de,
+    onOpenChangeComplete: E,
+    items: P,
+    multiple: r = !1,
+    itemToStringLabel: h,
+    itemToStringValue: i,
+    isItemEqualToValue: g = et,
+    children: me
+  } = re, {
+    clearErrors: pe
+  } = Ze(), {
+    setDirty: W,
+    shouldValidateOnChange: Y,
+    validityData: B,
+    setFilled: _,
+    name: ge,
+    disabled: Re,
+    validation: u
+  } = Ge(), {
+    controlId: he
+  } = Je(), I = Ke({
+    id: N
+  }), R = Re || fe, c = ge ?? ce, [t, ve] = ee({
+    controlled: se,
+    default: r ? j ?? ne : j,
+    name: "Select",
+    state: "value"
+  }), [l, Ie] = ee({
+    controlled: ie,
+    default: ae,
+    name: "Select",
+    state: "open"
+  }), M = n.useRef([]), G = n.useRef([]), T = n.useRef(null), be = n.useRef(null), xe = n.useRef(0), Ce = n.useRef(null), v = n.useRef([]), J = n.useRef(!1), Ve = n.useRef(!1), ye = n.useRef(null), we = n.useRef({
+    allowSelectedMouseUp: !1,
+    allowUnselectedMouseUp: !1
+  }), Ae = n.useRef(!1), {
+    mounted: O,
+    setMounted: Se,
+    transitionStatus: U
+  } = Qe(l), e = ze(() => new ut({
+    id: I,
+    modal: S,
+    multiple: r,
+    itemToStringLabel: h,
+    itemToStringValue: i,
+    isItemEqualToValue: g,
+    value: t,
+    open: l,
+    mounted: O,
+    transitionStatus: U,
+    items: P,
+    forceMount: !1,
+    touchModality: !1,
+    activeIndex: null,
+    selectedIndex: null,
+    popupProps: {},
+    triggerProps: {},
+    triggerElement: null,
+    positionerElement: null,
+    listElement: null,
+    scrollUpArrowVisible: !1,
+    scrollDownArrowVisible: !1,
+    hasScrollArrows: !1
+  })).current, K = w(e, y.activeIndex), Q = w(e, y.selectedIndex), Ee = w(e, y.triggerElement), Pe = w(e, y.positionerElement), Me = n.useMemo(() => r && Array.isArray(t) && t.length === 0 ? "" : q(t, i), [r, t, i]), Te = Ye(e.state.triggerElement);
+  $e({
+    id: I,
+    commit: u.commit,
+    value: t,
+    controlRef: Te,
+    name: c,
+    getValue: () => t
+  });
+  const X = n.useRef(t);
+  C(() => {
+    t !== X.current && e.set("forceMount", !0);
+  }, [e, t]), C(() => {
+    _(t !== null);
+  }, [t, _]), C(function() {
+    if (l)
+      return;
+    const s = v.current;
+    if (r) {
+      const d = Array.isArray(t) ? t : [];
+      if (d.length === 0) {
+        e.set("selectedIndex", null);
+        return;
+      }
+      const a = d[d.length - 1], x = oe(s, a, g);
+      e.set("selectedIndex", x === -1 ? null : x);
+      return;
+    }
+    const f = oe(s, t, g);
+    e.set("selectedIndex", f === -1 ? null : f);
+  }, [r, l, t, v, g, e]), tt(t, () => {
+    pe(c), W(t !== B.initialValue), Y() ? u.commit(t) : u.commit(t, !0);
+  });
+  const F = V((o, s) => {
+    if (ue?.(o, s), !s.isCanceled && (Ie(o), !o && e.state.activeIndex !== null)) {
+      const f = M.current[e.state.activeIndex];
+      queueMicrotask(() => {
+        f?.setAttribute("tabindex", "-1");
+      });
+    }
+  }), D = V(() => {
+    Se(!1), e.set("activeIndex", null), E?.(!1);
+  });
+  Xe({
+    enabled: !z,
+    open: l,
+    ref: T,
+    onComplete() {
+      l || D();
+    }
+  }), n.useImperativeHandle(z, () => ({
+    unmount: D
+  }), [D]);
+  const b = V((o, s) => {
+    le?.(o, s), !s.isCanceled && ve(o);
+  }), Z = V(() => {
+    const o = e.state.listElement || T.current;
+    if (!o)
+      return;
+    const s = o.scrollTop, f = o.scrollTop + o.clientHeight, d = s > 1, a = f < o.scrollHeight - 1;
+    e.state.scrollUpArrowVisible !== d && e.set("scrollUpArrowVisible", d), e.state.scrollDownArrowVisible !== a && e.set("scrollDownArrowVisible", a);
+  }), m = nt({
+    open: l,
+    onOpenChange: F,
+    elements: {
+      reference: Ee,
+      floating: Pe
+    }
+  }), Oe = rt(m, {
+    enabled: !p && !R,
+    event: "mousedown"
+  }), Ue = st(m, {
+    bubbles: !1
+  }), Fe = lt(m, {
+    enabled: !p && !R,
+    listRef: M,
+    activeIndex: K,
+    selectedIndex: Q,
+    disabledIndices: ne,
+    onNavigate(o) {
+      o === null && !l || e.set("activeIndex", o);
+    },
+    // Implement our own listeners since `onPointerLeave` on each option fires while scrolling with
+    // the `alignItemWithTrigger=true`, causing a performance issue on Chrome.
+    focusItemOnHover: !1
+  }), De = it(m, {
+    enabled: !p && !R && (l || !r),
+    listRef: G,
+    activeIndex: K,
+    selectedIndex: Q,
+    onMatch(o) {
+      l ? e.set("activeIndex", o) : b(v.current[o], te("none"));
+    },
+    onTypingChange(o) {
+      J.current = o;
+    }
+  }), {
+    getReferenceProps: L,
+    getFloatingProps: k,
+    getItemProps: $
+  } = at([Oe, Ue, Fe, De]);
+  We(() => {
+    e.update({
+      popupProps: k(),
+      triggerProps: L()
+    });
+  }), C(() => {
+    e.update({
+      id: I,
+      modal: S,
+      multiple: r,
+      value: t,
+      open: l,
+      mounted: O,
+      transitionStatus: U,
+      popupProps: k(),
+      triggerProps: L(),
+      items: P,
+      itemToStringLabel: h,
+      itemToStringValue: i,
+      isItemEqualToValue: g
+    });
+  }, [e, I, S, r, t, l, O, U, k, L, P, h, i, g]);
+  const Le = n.useMemo(() => ({
+    store: e,
+    name: c,
+    required: A,
+    disabled: R,
+    readOnly: p,
+    multiple: r,
+    itemToStringLabel: h,
+    itemToStringValue: i,
+    setValue: b,
+    setOpen: F,
+    listRef: M,
+    popupRef: T,
+    scrollHandlerRef: be,
+    handleScrollArrowVisibility: Z,
+    scrollArrowsMountedCountRef: xe,
+    getItemProps: $,
+    events: m.context.events,
+    valueRef: Ce,
+    valuesRef: v,
+    labelsRef: G,
+    typingRef: J,
+    selectionRef: we,
+    selectedItemTextRef: ye,
+    validation: u,
+    onOpenChangeComplete: E,
+    keyboardActiveRef: Ve,
+    alignItemWithTriggerActiveRef: Ae,
+    initialValueRef: X
+  }), [e, c, A, R, p, r, h, i, b, F, $, m.context.events, u, E, Z]), ke = je(de, u.inputRef), qe = r && Array.isArray(t) && t.length > 0, He = n.useMemo(() => !r || !Array.isArray(t) || !c ? null : t.map((o) => {
+    const s = q(o, i);
+    return /* @__PURE__ */ H("input", {
+      type: "hidden",
+      name: c,
+      value: s
+    }, s);
+  }), [r, t, c, i]);
+  return /* @__PURE__ */ H(Be.Provider, {
+    value: Le,
+    children: /* @__PURE__ */ ot(_e.Provider, {
+      value: m,
+      children: [me, /* @__PURE__ */ H("input", {
+        ...u.getInputValidationProps({
+          onFocus() {
+            e.state.triggerElement?.focus();
+          },
+          // Handle browser autofill.
+          onChange(o) {
+            if (o.nativeEvent.defaultPrevented)
+              return;
+            const s = o.target.value, f = te(ct, o.nativeEvent);
+            function d() {
+              if (r)
+                return;
+              const a = v.current.find((x) => q(x, i).toLowerCase() === s.toLowerCase());
+              a != null && (W(a !== B.initialValue), b(a, f), Y() && u.commit(a));
+            }
+            e.set("forceMount", !0), queueMicrotask(d);
+          }
+        }),
+        id: N || he || void 0,
+        name: r ? void 0 : c,
+        value: Me,
+        disabled: R,
+        required: A && !qe,
+        readOnly: p,
+        ref: ke,
+        style: Ne,
+        tabIndex: -1,
+        "aria-hidden": !0
+      }), He]
+    })
+  });
+}
+export {
+  Yt as SelectRoot
+};

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

@@ -0,0 +1,15 @@
+import { ALSComboboxValue as o, ALSComboboxEmpty as b, ALSComboboxItem as m, ALSComboboxList as L, ALSComboboxPopup as t, ALSComboboxIcon as x, ALSComboboxInput as p, ALSComboboxLabel as A, ALSComboboxRoot as C } from "./als-react-ts-ui65.js";
+const e = {
+  Root: C,
+  Label: A,
+  Input: p,
+  Icon: x,
+  Popup: t,
+  List: L,
+  Item: m,
+  Empty: b,
+  Value: o
+};
+export {
+  e as ALSCombobox
+};

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

@@ -0,0 +1,223 @@
+import { jsx as i } from "react/jsx-runtime";
+import { createContext as R, forwardRef as c, useContext as V } from "react";
+import { clsx as s } from "./als-react-ts-ui56.js";
+import r from "./als-react-ts-ui307.js";
+import { SliderControl as I } from "./als-react-ts-ui308.js";
+import { SliderTrack as j } from "./als-react-ts-ui309.js";
+import { SliderIndicator as E } from "./als-react-ts-ui310.js";
+import { SliderThumb as P } from "./als-react-ts-ui311.js";
+import { SliderValue as g } from "./als-react-ts-ui312.js";
+import { SliderRoot as q } from "./als-react-ts-ui313.js";
+const b = R({
+  size: "md",
+  variant: "primary",
+  disabled: !1,
+  orientation: "horizontal",
+  showValue: !1
+}), n = () => {
+  const e = V(b);
+  if (!e)
+    throw new Error(
+      "ALSSlider compound components must be used within ALSSlider.Root"
+    );
+  return e;
+}, B = ({
+  size: e = "md",
+  variant: t = "primary",
+  disabled: o = !1,
+  orientation: a = "horizontal",
+  showValue: l = !1,
+  defaultValue: m,
+  value: d,
+  onValueChange: S,
+  onValueCommitted: u,
+  min: p = 0,
+  max: L = 100,
+  step: A = 1,
+  largeStep: f = 10,
+  minStepsBetweenValues: N = 0,
+  format: h,
+  name: y,
+  thumbAlignment: $ = "center",
+  thumbCollisionBehavior: v = "push",
+  className: x,
+  style: z,
+  children: C,
+  "aria-label": k,
+  "aria-labelledby": T
+}) => {
+  const w = {
+    size: e,
+    variant: t,
+    disabled: o,
+    orientation: a,
+    showValue: l
+  };
+  return /* @__PURE__ */ i(b.Provider, { value: w, children: /* @__PURE__ */ i(
+    q,
+    {
+      defaultValue: m,
+      value: d,
+      onValueChange: S,
+      onValueCommitted: u,
+      min: p,
+      max: L,
+      step: A,
+      largeStep: f,
+      minStepsBetweenValues: N,
+      format: h,
+      name: y,
+      disabled: o,
+      orientation: a,
+      thumbAlignment: $,
+      thumbCollisionBehavior: v,
+      "aria-label": k,
+      "aria-labelledby": T,
+      className: s(
+        r.root,
+        r[`root--${e}`],
+        r[`root--${t}`],
+        o && r["root--disabled"],
+        x
+      ),
+      style: z,
+      children: C
+    }
+  ) });
+};
+B.displayName = "ALSSlider.Root";
+const D = c(({ className: e, style: t, children: o }, a) => {
+  const { size: l } = n();
+  return /* @__PURE__ */ i(
+    I,
+    {
+      ref: a,
+      className: s(
+        r.control,
+        r[`control--${l}`],
+        e
+      ),
+      style: t,
+      children: o
+    }
+  );
+});
+D.displayName = "ALSSlider.Control";
+const F = c(
+  ({ className: e, style: t, children: o }, a) => {
+    const { size: l, variant: m } = n();
+    return /* @__PURE__ */ i(
+      j,
+      {
+        ref: a,
+        className: s(
+          r.track,
+          r[`track--${l}`],
+          r[`track--${m}`],
+          e
+        ),
+        style: t,
+        children: o
+      }
+    );
+  }
+);
+F.displayName = "ALSSlider.Track";
+const G = c(({ className: e, style: t }, o) => {
+  const { variant: a } = n();
+  return /* @__PURE__ */ i(
+    E,
+    {
+      ref: o,
+      className: s(
+        r.indicator,
+        r[`indicator--${a}`],
+        e
+      ),
+      style: t
+    }
+  );
+});
+G.displayName = "ALSSlider.Indicator";
+const H = c(
+  ({
+    index: e,
+    className: t,
+    style: o,
+    getAriaLabel: a,
+    getAriaValueText: l,
+    tabIndex: m,
+    disabled: d,
+    onFocus: S,
+    onBlur: u
+  }, p) => {
+    const { size: L, variant: A } = n();
+    return /* @__PURE__ */ i(
+      P,
+      {
+        ref: p,
+        index: e,
+        getAriaLabel: a,
+        getAriaValueText: l,
+        tabIndex: m,
+        disabled: d,
+        onFocus: S,
+        onBlur: u,
+        className: s(
+          r.thumb,
+          r[`thumb--${L}`],
+          r[`thumb--${A}`],
+          t
+        ),
+        style: o
+      }
+    );
+  }
+);
+H.displayName = "ALSSlider.Thumb";
+const J = ({
+  children: e,
+  className: t,
+  style: o
+}) => {
+  const { size: a, variant: l } = n();
+  return /* @__PURE__ */ i(
+    g,
+    {
+      className: s(
+        r.value,
+        r[`value--${a}`],
+        r[`value--${l}`],
+        t
+      ),
+      style: o,
+      children: e
+    }
+  );
+};
+J.displayName = "ALSSlider.Value";
+const K = ({
+  className: e,
+  style: t,
+  children: o
+}) => {
+  const { size: a } = n();
+  return /* @__PURE__ */ i(
+    "span",
+    {
+      className: s(r.label, r[`label--${a}`], e),
+      style: t,
+      children: o
+    }
+  );
+};
+K.displayName = "ALSSlider.Label";
+export {
+  D as ALSSliderControl,
+  G as ALSSliderIndicator,
+  K as ALSSliderLabel,
+  B as ALSSliderRoot,
+  H as ALSSliderThumb,
+  F as ALSSliderTrack,
+  J as ALSSliderValue
+};

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

@@ -0,0 +1,26 @@
+const o = "_viewport_x4zrf_2", t = "_root_x4zrf_16", r = "_content_x4zrf_120", _ = "_title_x4zrf_133", c = "_description_x4zrf_158", n = "_action_x4zrf_166", e = "_close_x4zrf_194", s = "_closeIcon_x4zrf_225", i = {
+  viewport: o,
+  root: t,
+  "root--success": "_root--success_x4zrf_99",
+  "root--error": "_root--error_x4zrf_103",
+  "root--warning": "_root--warning_x4zrf_107",
+  "root--info": "_root--info_x4zrf_111",
+  "root--default": "_root--default_x4zrf_115",
+  content: r,
+  title: _,
+  description: c,
+  action: n,
+  close: e,
+  closeIcon: s
+};
+export {
+  n as action,
+  e as close,
+  s as closeIcon,
+  r as content,
+  i as default,
+  c as description,
+  t as root,
+  _ as title,
+  o as viewport
+};

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

@@ -0,0 +1,25 @@
+import i from "./als-react-ts-ui259.js";
+import * as n from "react";
+import { ToastContext as m } from "./als-react-ts-ui429.js";
+function p() {
+  const o = n.useContext(m);
+  if (!o)
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: useToastManager must be used within <Toast.Provider>." : i(73));
+  const {
+    toasts: t,
+    add: e,
+    close: r,
+    update: s,
+    promise: a
+  } = o;
+  return n.useMemo(() => ({
+    toasts: t,
+    add: e,
+    close: r,
+    update: s,
+    promise: a
+  }), [t, e, r, s, a]);
+}
+export {
+  p as useToastManager
+};