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

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

@@ -0,0 +1,208 @@
+import { jsx as r } from "react/jsx-runtime";
+import * as m from "react";
+import { clsx as p } from "./als-react-ts-ui56.js";
+import a from "./als-react-ts-ui130.js";
+import c from "./als-react-ts-ui95.js";
+import s from "./als-react-ts-ui131.js";
+import u from "./als-react-ts-ui132.js";
+import { ComboboxInput as A } from "./als-react-ts-ui133.js";
+import { ComboboxTrigger as i } from "./als-react-ts-ui134.js";
+import { ComboboxIcon as f } from "./als-react-ts-ui135.js";
+import { ComboboxClear as n } from "./als-react-ts-ui136.js";
+import { ComboboxBackdrop as S } from "./als-react-ts-ui137.js";
+import { ComboboxPositioner as L } from "./als-react-ts-ui138.js";
+import { ComboboxPopup as d } from "./als-react-ts-ui139.js";
+import { ComboboxArrow as b } from "./als-react-ts-ui140.js";
+import { ComboboxStatus as N } from "./als-react-ts-ui141.js";
+import { ComboboxEmpty as w } from "./als-react-ts-ui142.js";
+import { ComboboxList as C } from "./als-react-ts-ui143.js";
+import { ComboboxRow as R } from "./als-react-ts-ui144.js";
+import { ComboboxItem as y } from "./als-react-ts-ui145.js";
+import { ComboboxGroup as x } from "./als-react-ts-ui146.js";
+import { ComboboxGroupLabel as g } from "./als-react-ts-ui147.js";
+import { Separator as I } from "./als-react-ts-ui107.js";
+import { AutocompleteRoot as P } from "./als-react-ts-ui148.js";
+import { ComboboxCollection as h } from "./als-react-ts-ui149.js";
+import { ComboboxPortal as G } from "./als-react-ts-ui150.js";
+import { AutocompleteValue as k } from "./als-react-ts-ui151.js";
+const wo = P, z = m.forwardRef(({ className: o, placeholder: e = "Search...", ...t }, l) => /* @__PURE__ */ r(
+  A,
+  {
+    ref: l,
+    className: p(a.input, o),
+    placeholder: e,
+    ...t
+  }
+));
+z.displayName = "ALSAutocomplete.Input";
+const B = m.forwardRef(({ className: o, children: e, ...t }, l) => /* @__PURE__ */ r(
+  i,
+  {
+    ref: l,
+    className: p(a.trigger, o),
+    ...t,
+    children: e || /* @__PURE__ */ r(c, { size: 16 })
+  }
+));
+B.displayName = "ALSAutocomplete.Trigger";
+const E = m.forwardRef(({ className: o, children: e, ...t }, l) => /* @__PURE__ */ r(
+  f,
+  {
+    ref: l,
+    className: p(a.icon, o),
+    ...t,
+    children: e || /* @__PURE__ */ r(s, { size: 16 })
+  }
+));
+E.displayName = "ALSAutocomplete.Icon";
+const T = m.forwardRef(({ className: o, children: e, ...t }, l) => /* @__PURE__ */ r(
+  n,
+  {
+    ref: l,
+    className: p(a.clear, o),
+    ...t,
+    children: e || /* @__PURE__ */ r(u, { size: 16 })
+  }
+));
+T.displayName = "ALSAutocomplete.Clear";
+function Co(o) {
+  return /* @__PURE__ */ r(k, { ...o });
+}
+function Ro(o) {
+  return /* @__PURE__ */ r(G, { ...o });
+}
+const V = m.forwardRef(({ className: o, ...e }, t) => /* @__PURE__ */ r(
+  S,
+  {
+    ref: t,
+    className: p(a.backdrop, o),
+    ...e
+  }
+));
+V.displayName = "ALSAutocomplete.Backdrop";
+const j = m.forwardRef(({ className: o, ...e }, t) => /* @__PURE__ */ r(
+  L,
+  {
+    ref: t,
+    className: p(o),
+    sideOffset: 4,
+    ...e
+  }
+));
+j.displayName = "ALSAutocomplete.Positioner";
+const v = m.forwardRef(({ className: o, ...e }, t) => /* @__PURE__ */ r(
+  d,
+  {
+    ref: t,
+    className: p(a.popup, o),
+    ...e
+  }
+));
+v.displayName = "ALSAutocomplete.Popup";
+const D = m.forwardRef(({ className: o, ...e }, t) => /* @__PURE__ */ r(
+  b,
+  {
+    ref: t,
+    className: p(a.arrow, o),
+    ...e
+  }
+));
+D.displayName = "ALSAutocomplete.Arrow";
+const O = m.forwardRef(({ className: o, ...e }, t) => /* @__PURE__ */ r(
+  N,
+  {
+    ref: t,
+    className: p(a.status, o),
+    ...e
+  }
+));
+O.displayName = "ALSAutocomplete.Status";
+const X = m.forwardRef(({ className: o, children: e, ...t }, l) => /* @__PURE__ */ r(
+  w,
+  {
+    ref: l,
+    className: p(a.empty, o),
+    ...t,
+    children: e || "No results found"
+  }
+));
+X.displayName = "ALSAutocomplete.Empty";
+const q = m.forwardRef(({ className: o, ...e }, t) => /* @__PURE__ */ r(
+  C,
+  {
+    ref: t,
+    className: p(a.list, o),
+    ...e
+  }
+));
+q.displayName = "ALSAutocomplete.List";
+function yo(o) {
+  return /* @__PURE__ */ r(h, { ...o });
+}
+const F = m.forwardRef(({ className: o, ...e }, t) => /* @__PURE__ */ r(
+  R,
+  {
+    ref: t,
+    className: p(a.row, o),
+    ...e
+  }
+));
+F.displayName = "ALSAutocomplete.Row";
+const H = m.forwardRef(({ className: o, ...e }, t) => /* @__PURE__ */ r(
+  y,
+  {
+    ref: t,
+    className: p(a.item, o),
+    ...e
+  }
+));
+H.displayName = "ALSAutocomplete.Item";
+const J = m.forwardRef(({ className: o, ...e }, t) => /* @__PURE__ */ r(
+  x,
+  {
+    ref: t,
+    className: p(a.group, o),
+    ...e
+  }
+));
+J.displayName = "ALSAutocomplete.Group";
+const K = m.forwardRef(({ className: o, ...e }, t) => /* @__PURE__ */ r(
+  g,
+  {
+    ref: t,
+    className: p(a.groupLabel, o),
+    ...e
+  }
+));
+K.displayName = "ALSAutocomplete.GroupLabel";
+const M = m.forwardRef(({ className: o, ...e }, t) => /* @__PURE__ */ r(
+  I,
+  {
+    ref: t,
+    className: p(a.separator, o),
+    ...e
+  }
+));
+M.displayName = "ALSAutocomplete.Separator";
+export {
+  D as ALSAutocompleteArrow,
+  V as ALSAutocompleteBackdrop,
+  T as ALSAutocompleteClear,
+  yo as ALSAutocompleteCollection,
+  X as ALSAutocompleteEmpty,
+  J as ALSAutocompleteGroup,
+  K as ALSAutocompleteGroupLabel,
+  E as ALSAutocompleteIcon,
+  z as ALSAutocompleteInput,
+  H as ALSAutocompleteItem,
+  q as ALSAutocompleteList,
+  v as ALSAutocompletePopup,
+  Ro as ALSAutocompletePortal,
+  j as ALSAutocompletePositioner,
+  wo as ALSAutocompleteRoot,
+  F as ALSAutocompleteRow,
+  M as ALSAutocompleteSeparator,
+  O as ALSAutocompleteStatus,
+  B as ALSAutocompleteTrigger,
+  Co as ALSAutocompleteValue
+};

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

@@ -0,0 +1,17 @@
+function a(r) {
+  var n, f, t = "";
+  if (typeof r == "string" || typeof r == "number") t += r;
+  else if (typeof r == "object") if (Array.isArray(r)) {
+    var o = r.length;
+    for (n = 0; n < o; n++) r[n] && (f = a(r[n])) && (t && (t += " "), t += f);
+  } else for (f in r) r[f] && (t && (t += " "), t += f);
+  return t;
+}
+function i() {
+  for (var r, n, f = 0, t = "", o = arguments.length; f < o; f++) (r = arguments[f]) && (n = a(r)) && (t && (t += " "), t += n);
+  return t;
+}
+export {
+  i as clsx,
+  i as default
+};

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

@@ -0,0 +1,24 @@
+const a = "_root_ncbbj_5", _ = "_image_ncbbj_66", s = "_fallback_ncbbj_88", t = "_statusIndicator_ncbbj_116", n = {
+  root: a,
+  "size-sm": "_size-sm_ncbbj_22",
+  "size-md": "_size-md_ncbbj_28",
+  "size-lg": "_size-lg_ncbbj_34",
+  "size-xl": "_size-xl_ncbbj_40",
+  "variant-circular": "_variant-circular_ncbbj_50",
+  "variant-rounded": "_variant-rounded_ncbbj_54",
+  "variant-square": "_variant-square_ncbbj_58",
+  image: _,
+  fallback: s,
+  statusIndicator: t,
+  "status-online": "_status-online_ncbbj_129",
+  "status-offline": "_status-offline_ncbbj_133",
+  "status-away": "_status-away_ncbbj_137",
+  "status-busy": "_status-busy_ncbbj_141"
+};
+export {
+  n as default,
+  s as fallback,
+  _ as image,
+  a as root,
+  t as statusIndicator
+};

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

@@ -0,0 +1,30 @@
+import * as e from "react";
+import { useRenderElement as p } from "./als-react-ts-ui166.js";
+import { AvatarRootContext as u } from "./als-react-ts-ui226.js";
+import { avatarStateAttributesMapping as c } from "./als-react-ts-ui227.js";
+import { jsx as d } from "react/jsx-runtime";
+const f = /* @__PURE__ */ e.forwardRef(function(o, r) {
+  const {
+    className: v,
+    render: R,
+    ...s
+  } = o, [t, a] = e.useState("idle"), n = e.useMemo(() => ({
+    imageLoadingStatus: t
+  }), [t]), i = e.useMemo(() => ({
+    imageLoadingStatus: t,
+    setImageLoadingStatus: a
+  }), [t, a]), m = p("span", o, {
+    state: n,
+    ref: r,
+    props: s,
+    stateAttributesMapping: c
+  });
+  return /* @__PURE__ */ d(u.Provider, {
+    value: i,
+    children: m
+  });
+});
+process.env.NODE_ENV !== "production" && (f.displayName = "AvatarRoot");
+export {
+  f as AvatarRoot
+};

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

@@ -0,0 +1,39 @@
+import * as r from "react";
+import { useStableCallback as d } from "./als-react-ts-ui160.js";
+import { useIsoLayoutEffect as f } from "./als-react-ts-ui161.js";
+import { useRenderElement as p } from "./als-react-ts-ui166.js";
+import { useAvatarRootContext as l } from "./als-react-ts-ui226.js";
+import { avatarStateAttributesMapping as S } from "./als-react-ts-ui227.js";
+import { useImageLoadingStatus as L } from "./als-react-ts-ui228.js";
+const v = /* @__PURE__ */ r.forwardRef(function(e, n) {
+  const {
+    className: I,
+    render: b,
+    onLoadingStatusChange: s,
+    referrerPolicy: i,
+    crossOrigin: m,
+    ...g
+  } = e, u = l(), t = L(e.src, {
+    referrerPolicy: i,
+    crossOrigin: m
+  }), a = d((o) => {
+    s?.(o), u.setImageLoadingStatus(o);
+  });
+  f(() => {
+    t !== "idle" && a(t);
+  }, [t, a]);
+  const c = r.useMemo(() => ({
+    imageLoadingStatus: t
+  }), [t]);
+  return p("img", e, {
+    state: c,
+    ref: n,
+    props: g,
+    stateAttributesMapping: S,
+    enabled: t === "loaded"
+  });
+});
+process.env.NODE_ENV !== "production" && (v.displayName = "AvatarImage");
+export {
+  v as AvatarImage
+};

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

@@ -0,0 +1,103 @@
+import { jsx as m, jsxs as u } from "react/jsx-runtime";
+import * as e from "react";
+import { clsx as s } from "./als-react-ts-ui56.js";
+import r from "./als-react-ts-ui57.js";
+import { AvatarRoot as L } from "./als-react-ts-ui58.js";
+import { AvatarImage as x } from "./als-react-ts-ui59.js";
+import { AvatarFallback as R } from "./als-react-ts-ui60.js";
+const l = e.createContext(
+  void 0
+), A = () => {
+  const t = e.useContext(l);
+  if (!t)
+    throw new Error(
+      "ALSAvatar compound components must be used within ALSAvatar.Root"
+    );
+  return t;
+}, i = e.forwardRef(
+  ({
+    size: t = "md",
+    variant: o = "circular",
+    status: a,
+    className: n,
+    children: c,
+    ...d
+  }, p) => {
+    const S = e.useMemo(
+      () => ({ size: t, variant: o, status: a }),
+      [t, o, a]
+    );
+    return /* @__PURE__ */ m(l.Provider, { value: S, children: /* @__PURE__ */ u(
+      L,
+      {
+        ref: p,
+        className: s(
+          r.root,
+          r[`size-${t}`],
+          r[`variant-${o}`],
+          a && r[`status-${a}`],
+          n
+        ),
+        ...d,
+        children: [
+          c,
+          a && /* @__PURE__ */ m(
+            "span",
+            {
+              className: s(
+                r.statusIndicator,
+                r[`status-${a}`]
+              ),
+              "aria-label": `Status: ${a}`
+            }
+          )
+        ]
+      }
+    ) });
+  }
+);
+i.displayName = "ALSAvatar.Root";
+const v = e.forwardRef(
+  ({ className: t, alt: o, ...a }, n) => {
+    const { variant: c } = A();
+    return /* @__PURE__ */ m(
+      x,
+      {
+        ref: n,
+        className: s(
+          r.image,
+          r[`variant-${c}`],
+          t
+        ),
+        alt: o,
+        ...a
+      }
+    );
+  }
+);
+v.displayName = "ALSAvatar.Image";
+const f = e.forwardRef(({ className: t, children: o, ...a }, n) => {
+  const { variant: c } = A();
+  return /* @__PURE__ */ m(
+    R,
+    {
+      ref: n,
+      className: s(
+        r.fallback,
+        r[`variant-${c}`],
+        t
+      ),
+      ...a,
+      children: o
+    }
+  );
+});
+f.displayName = "ALSAvatar.Fallback";
+const I = {
+  Root: i,
+  Image: v,
+  Fallback: f
+};
+export {
+  I as ALSAvatar
+};

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

@@ -0,0 +1,30 @@
+import * as t from "react";
+import { useTimeout as u } from "./als-react-ts-ui229.js";
+import { useRenderElement as d } from "./als-react-ts-ui166.js";
+import { useAvatarRootContext as c } from "./als-react-ts-ui226.js";
+import { avatarStateAttributesMapping as f } from "./als-react-ts-ui227.js";
+const p = /* @__PURE__ */ t.forwardRef(function(s, o) {
+  const {
+    className: v,
+    render: A,
+    delay: e,
+    ...n
+  } = s, {
+    imageLoadingStatus: a
+  } = c(), [i, m] = t.useState(e === void 0), r = u();
+  t.useEffect(() => (e !== void 0 && r.start(e, () => m(!0)), r.clear), [r, e]);
+  const l = t.useMemo(() => ({
+    imageLoadingStatus: a
+  }), [a]);
+  return d("span", s, {
+    state: l,
+    ref: o,
+    props: n,
+    stateAttributesMapping: f,
+    enabled: a !== "loaded" && i
+  });
+});
+process.env.NODE_ENV !== "production" && (p.displayName = "AvatarFallback");
+export {
+  p as AvatarFallback
+};

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

@@ -0,0 +1,24 @@
+const e = "_button_1enjc_2", _ = "_block_1enjc_34", n = "_disabled_1enjc_372", s = {
+  button: e,
+  block: _,
+  "size-sm": "_size-sm_1enjc_40",
+  "size-md": "_size-md_1enjc_46",
+  "size-lg": "_size-lg_1enjc_51",
+  "size-full": "_size-full_1enjc_57",
+  "variant-primary": "_variant-primary_1enjc_68",
+  "style-full": "_style-full_1enjc_68",
+  "style-outline": "_style-outline_1enjc_87",
+  "style-ghost": "_style-ghost_1enjc_100",
+  "style-empty": "_style-empty_1enjc_112",
+  "variant-secondary": "_variant-secondary_1enjc_129",
+  "variant-success": "_variant-success_1enjc_189",
+  "variant-danger": "_variant-danger_1enjc_250",
+  "variant-warning": "_variant-warning_1enjc_311",
+  disabled: n
+};
+export {
+  _ as block,
+  e as button,
+  s as default,
+  n as disabled
+};

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

@@ -0,0 +1,7 @@
+const o = "_root_11pg6_1", t = {
+  root: o
+};
+export {
+  t as default,
+  o as root
+};

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

@@ -0,0 +1,7 @@
+const o = "_root_1mrxf_1", t = {
+  root: o
+};
+export {
+  t as default,
+  o as root
+};

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

@@ -0,0 +1,7 @@
+const o = "_root_1yvsq_1", t = {
+  root: o
+};
+export {
+  t as default,
+  o as root
+};

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

@@ -0,0 +1,7 @@
+const o = "_root_1kg0t_1", t = {
+  root: o
+};
+export {
+  t as default,
+  o as root
+};

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

@@ -0,0 +1,7 @@
+const o = "_root_9j2r3_1", t = {
+  root: o
+};
+export {
+  t as default,
+  o as root
+};

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

@@ -0,0 +1,25 @@
+const p = "_backdrop_n0fed_10", e = "_popup_n0fed_32", o = "_title_n0fed_137", _ = "_description_n0fed_150", n = "_close_n0fed_161", c = "_closeIcon_n0fed_194", t = "_trigger_n0fed_203", d = {
+  backdrop: p,
+  popup: e,
+  "popup--default": "_popup--default_n0fed_59",
+  "popup--centered": "_popup--centered_n0fed_74",
+  "popup--fullscreen": "_popup--fullscreen_n0fed_89",
+  "popup--sm": "_popup--sm_n0fed_111",
+  "popup--md": "_popup--md_n0fed_117",
+  "popup--lg": "_popup--lg_n0fed_123",
+  title: o,
+  description: _,
+  close: n,
+  closeIcon: c,
+  trigger: t
+};
+export {
+  p as backdrop,
+  n as close,
+  c as closeIcon,
+  d as default,
+  _ as description,
+  e as popup,
+  o as title,
+  t as trigger
+};

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

@@ -0,0 +1,50 @@
+import * as x from "react";
+import { useRefWithInit as h } from "./als-react-ts-ui184.js";
+import { useDialogRoot as R } from "./als-react-ts-ui185.js";
+import { useDialogRootContext as D, DialogRootContext as I } from "./als-react-ts-ui186.js";
+import { DialogStore as P } from "./als-react-ts-ui187.js";
+import { jsx as O } from "react/jsx-runtime";
+function k(u) {
+  const {
+    children: o,
+    open: n,
+    defaultOpen: r = !1,
+    onOpenChange: d,
+    onOpenChangeComplete: g,
+    disablePointerDismissal: a = !1,
+    modal: l = !0,
+    actionsRef: c,
+    handle: f,
+    triggerId: t,
+    defaultTriggerId: i = null
+  } = u, s = D(!0), p = !!s, e = h(() => f?.store ?? new P({
+    open: n ?? r,
+    activeTriggerId: t !== void 0 ? t : i,
+    modal: l,
+    disablePointerDismissal: a,
+    nested: p
+  })).current;
+  e.useControlledProp("open", n, r), e.useControlledProp("activeTriggerId", t, i), e.useSyncedValues({
+    disablePointerDismissal: a,
+    nested: p,
+    modal: l
+  }), e.useContextCallback("onOpenChange", d), e.useContextCallback("onOpenChangeComplete", g);
+  const m = e.useState("payload");
+  R({
+    store: e,
+    actionsRef: c,
+    parentContext: s?.store.context
+  });
+  const C = x.useMemo(() => ({
+    store: e
+  }), [e]);
+  return /* @__PURE__ */ O(I.Provider, {
+    value: C,
+    children: typeof o == "function" ? o({
+      payload: m
+    }) : o
+  });
+}
+export {
+  k as DialogRoot
+};

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

@@ -0,0 +1,7 @@
+const o = "_root_1yzve_1", t = {
+  root: o
+};
+export {
+  t as default,
+  o as root
+};

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

@@ -0,0 +1,42 @@
+import { jsx as p } from "react/jsx-runtime";
+import { forwardRef as c } from "react";
+import t from "./als-react-ts-ui61.js";
+const b = c(
+  ({
+    variant: s = "primary",
+    buttonStyle: a = "full",
+    size: r = "md",
+    block: e = !1,
+    className: l = "",
+    children: m,
+    disabled: o = !1,
+    type: n = "button",
+    ...f
+  }, i) => {
+    const u = [
+      t.button,
+      t[`variant-${s}`],
+      t[`style-${a}`],
+      t[`size-${r}`],
+      e ? t.block : "",
+      o ? t.disabled : "",
+      l
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ p(
+      "button",
+      {
+        ref: i,
+        className: u,
+        disabled: o,
+        type: n,
+        ...f,
+        children: m
+      }
+    );
+  }
+);
+b.displayName = "ALSButton";
+export {
+  b as ALSButton,
+  b as default
+};

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

@@ -0,0 +1,7 @@
+const o = "_root_o7syy_1", t = {
+  root: o
+};
+export {
+  t as default,
+  o as root
+};

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

@@ -0,0 +1,7 @@
+const o = "_root_199mu_1", t = {
+  root: o
+};
+export {
+  t as default,
+  o as root
+};

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

@@ -0,0 +1,15 @@
+const p = "_input_1ph0q_5", n = {
+  input: p,
+  "input--outlined": "_input--outlined_1ph0q_25",
+  "input--filled": "_input--filled_1ph0q_40",
+  "input--sm": "_input--sm_1ph0q_59",
+  "input--md": "_input--md_1ph0q_64",
+  "input--lg": "_input--lg_1ph0q_69",
+  "input--success": "_input--success_1ph0q_78",
+  "input--warning": "_input--warning_1ph0q_87",
+  "input--error": "_input--error_1ph0q_96"
+};
+export {
+  n as default,
+  p as input
+};