sander-ui 0.1.16 → 0.1.18

package/dist/Accordion-_Ot21_IX.js

@@ -0,0 +1,74 @@
+import { jsx as t, jsxs as O } from "react/jsx-runtime";
+import { c as _ } from "./index-p1eeF8LQ.js";
+import { useState as p, useCallback as h, useId as C, useContext as N, useRef as A, createContext as k } from "react";
+const y = "_accordion_7j7b7_1", R = "_item_7j7b7_6", D = "_disabled_7j7b7_14", P = "_trigger_7j7b7_19", S = "_content_7j7b7_64", T = "_contentOpen_7j7b7_70", U = "_contentInner_7j7b7_74", n = {
+  accordion: y,
+  item: R,
+  disabled: D,
+  trigger: P,
+  content: S,
+  contentOpen: T,
+  contentInner: U
+}, g = k({
+  openId: null,
+  toggle: () => {
+  },
+  exclusive: !1
+}), B = ({
+  exclusive: s = !1,
+  children: r,
+  className: l,
+  ...e
+}) => {
+  const [i, a] = p(null), o = h(
+    (c) => {
+      a((d) => d === c ? null : c);
+    },
+    []
+  );
+  return /* @__PURE__ */ t(g.Provider, { value: { openId: i, toggle: o, exclusive: s }, children: /* @__PURE__ */ t("div", { className: _(n.accordion, l), ...e, children: r }) });
+}, E = ({
+  title: s,
+  children: r,
+  defaultOpen: l,
+  disabled: e,
+  className: i,
+  ...a
+}) => {
+  const o = C(), { openId: c, toggle: d, exclusive: m } = N(g), f = A(null), [b, I] = p(
+    l ?? !1
+  ), u = m ? c === o : b, j = (v) => {
+    v.preventDefault(), !e && (m ? d(o) : I((x) => !x));
+  };
+  return /* @__PURE__ */ O(
+    "details",
+    {
+      open: u,
+      className: _(n.item, { [n.disabled]: e }, i),
+      ...a,
+      children: [
+        /* @__PURE__ */ t(
+          "summary",
+          {
+            className: n.trigger,
+            onClick: j,
+            "aria-disabled": e || void 0,
+            children: s
+          }
+        ),
+        /* @__PURE__ */ t(
+          "div",
+          {
+            ref: f,
+            className: _(n.content, { [n.contentOpen]: u }),
+            children: /* @__PURE__ */ t("div", { className: n.contentInner, children: r })
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  B as A,
+  E as a
+};

package/dist/Alert-Cbx2Hx3u.js

@@ -0,0 +1,57 @@
+import { jsxs as t, jsx as i } from "react/jsx-runtime";
+import { c as l } from "./index-p1eeF8LQ.js";
+import { I as m, T as u, C as d, a as f } from "./triangle-alert-CvNSSzY6.js";
+import { X as p } from "./x-B9bYxG31.js";
+const g = "_alert_16i4u_1", N = "_icon_16i4u_11", w = "_content_16i4u_18", C = "_title_16i4u_23", h = "_description_16i4u_27", A = "_dismiss_16i4u_35", x = "_success_16i4u_62", I = "_error_16i4u_68", b = "_warning_16i4u_74", j = "_info_16i4u_80", s = {
+  alert: g,
+  icon: N,
+  content: w,
+  title: C,
+  description: h,
+  dismiss: A,
+  success: x,
+  error: I,
+  warning: b,
+  info: j
+}, k = {
+  success: f,
+  error: d,
+  warning: u,
+  info: m
+}, B = ({
+  variant: r = "info",
+  title: n,
+  children: o,
+  onDismiss: c,
+  className: e,
+  ..._
+}) => {
+  const a = k[r];
+  return /* @__PURE__ */ t(
+    "div",
+    {
+      role: r === "error" || r === "warning" ? "alert" : "status",
+      className: l(s.alert, s[r], e),
+      ..._,
+      children: [
+        /* @__PURE__ */ i(a, { className: s.icon }),
+        /* @__PURE__ */ t("div", { className: s.content, children: [
+          n && /* @__PURE__ */ i("div", { className: s.title, children: n }),
+          o && /* @__PURE__ */ i("div", { className: s.description, children: o })
+        ] }),
+        c && /* @__PURE__ */ i(
+          "button",
+          {
+            onClick: c,
+            "aria-label": "Dismiss",
+            className: s.dismiss,
+            children: /* @__PURE__ */ i(p, { size: 16 })
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  B as A
+};

package/dist/Avatar-7zC49FAM.js

@@ -0,0 +1,101 @@
+import { jsxs as p, jsx as o } from "react/jsx-runtime";
+import { c as i } from "./index-p1eeF8LQ.js";
+import { useState as m, Children as d } from "react";
+const f = /* @__PURE__ */ new Set([
+  "van",
+  "von",
+  "de",
+  "del",
+  "den",
+  "der",
+  "di",
+  "du",
+  "el",
+  "la",
+  "le",
+  "los",
+  "het",
+  "ten",
+  "ter",
+  "op"
+]);
+function g(t, a = "?") {
+  if (!t?.trim()) return a;
+  const r = t.trim().split(/\s+/), s = r.filter((c) => !f.has(c.toLowerCase()));
+  if (s.length === 0) return r[0][0].toUpperCase();
+  if (s.length === 1) return s[0][0].toUpperCase();
+  const l = s[0][0], n = s[s.length - 1][0];
+  return (l + n).toUpperCase();
+}
+const h = "_wrapper_1p6ce_1", v = "_sm_1p6ce_8", w = "_md_1p6ce_14", b = "_lg_1p6ce_20", x = "_xl_1p6ce_26", N = "_image_1p6ce_38", y = "_fallback_1p6ce_45", A = "_status_1p6ce_59", E = "_group_1p6ce_88", e = {
+  wrapper: h,
+  sm: v,
+  md: w,
+  lg: b,
+  xl: x,
+  "2xl": "_2xl_1p6ce_32",
+  image: N,
+  fallback: y,
+  status: A,
+  "status-online": "_status-online_1p6ce_71",
+  "status-offline": "_status-offline_1p6ce_75",
+  "status-busy": "_status-busy_1p6ce_79",
+  "status-away": "_status-away_1p6ce_83",
+  group: E
+}, k = { sm: 24, md: 32, lg: 40, xl: 56, "2xl": 80 }, U = ({
+  src: t,
+  name: a,
+  size: r = "md",
+  status: s,
+  className: l,
+  ...n
+}) => {
+  const [c, u] = m(!1), _ = k[r];
+  return /* @__PURE__ */ p(
+    "div",
+    {
+      className: i(e.wrapper, e[r], l),
+      role: "img",
+      "aria-label": a || "Avatar",
+      ...n,
+      children: [
+        t && !c ? /* @__PURE__ */ o(
+          "img",
+          {
+            src: t,
+            alt: a || "Avatar",
+            width: _,
+            height: _,
+            className: e.image,
+            onError: () => u(!0)
+          }
+        ) : /* @__PURE__ */ o("div", { className: e.fallback, children: g(a) }),
+        s ? /* @__PURE__ */ o(
+          "span",
+          {
+            className: i(e.status, e[`status-${s}`]),
+            "aria-label": s
+          }
+        ) : null
+      ]
+    }
+  );
+}, j = ({
+  max: t,
+  children: a,
+  className: r,
+  ...s
+}) => {
+  const l = d.toArray(a), n = t ? l.slice(0, t) : l, c = t ? l.length - t : 0;
+  return /* @__PURE__ */ p("div", { className: i(e.group, r), ...s, children: [
+    n,
+    c > 0 ? /* @__PURE__ */ o("div", { className: i(e.wrapper, e.md), children: /* @__PURE__ */ p("div", { className: e.fallback, children: [
+      "+",
+      c
+    ] }) }) : null
+  ] });
+};
+export {
+  U as A,
+  j as a
+};

package/dist/Badge-D1SsfPgP.js

@@ -0,0 +1,54 @@
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { c as m } from "./index-p1eeF8LQ.js";
+import { X as i } from "./x-B9bYxG31.js";
+const f = "_badge_19d90_1", u = "_sm_19d90_10", g = "_md_19d90_15", b = "_dot_19d90_21", p = "_remove_19d90_30", v = "_filled_19d90_56", w = "_success_19d90_61", x = "_warning_19d90_66", N = "_error_19d90_71", h = "_info_19d90_76", j = "_outline_19d90_82", s = {
+  badge: f,
+  sm: u,
+  md: g,
+  dot: b,
+  remove: p,
+  filled: v,
+  default: "_default_19d90_56",
+  success: w,
+  warning: x,
+  error: N,
+  info: h,
+  outline: j
+}, C = ({
+  children: d,
+  variant: n = "default",
+  appearance: t = "filled",
+  size: o = "sm",
+  dot: r,
+  onRemove: _,
+  className: c,
+  ...a
+}) => /* @__PURE__ */ l(
+  "span",
+  {
+    className: m(
+      s.badge,
+      s[n],
+      s[t],
+      s[o],
+      c
+    ),
+    ...a,
+    children: [
+      r && /* @__PURE__ */ e("span", { className: s.dot }),
+      d,
+      _ && /* @__PURE__ */ e(
+        "button",
+        {
+          onClick: _,
+          "aria-label": "Remove",
+          className: s.remove,
+          children: /* @__PURE__ */ e(i, { size: o === "sm" ? 10 : 12 })
+        }
+      )
+    ]
+  }
+);
+export {
+  C as B
+};

package/dist/Breadcrumbs-u6K5JP-p.js

@@ -0,0 +1,55 @@
+import { jsx as s, jsxs as d, Fragment as f } from "react/jsx-runtime";
+import { c as v } from "./index-p1eeF8LQ.js";
+import { useState as x } from "react";
+import { c as z } from "./createLucideIcon-CP-mMPfa.js";
+import { C as N } from "./chevron-right-DvXGOiS_.js";
+const k = [
+  ["circle", { cx: "12", cy: "12", r: "1", key: "41hilf" }],
+  ["circle", { cx: "19", cy: "12", r: "1", key: "1wjl8i" }],
+  ["circle", { cx: "5", cy: "12", r: "1", key: "1pcz8c" }]
+], y = z("ellipsis", k), g = "_list_2tzve_1", C = "_item_2tzve_9", S = "_separator_2tzve_15", j = "_link_2tzve_22", B = "_current_2tzve_37", w = "_text_2tzve_42", E = "_ellipsis_2tzve_46", l = {
+  list: g,
+  item: C,
+  separator: S,
+  link: j,
+  current: B,
+  text: w,
+  ellipsis: E
+}, L = () => /* @__PURE__ */ s(N, { className: l.separator }), A = ({
+  items: r,
+  separator: i,
+  maxItems: c,
+  className: h,
+  ...u
+}) => {
+  const [m, b] = x(!1), a = c && c > 1 && r.length > c && !m, o = a ? [r[0], ...r.slice(-(c - 1))] : r, p = (e) => i ? /* @__PURE__ */ s("span", { className: l.separator, children: i }, e) : /* @__PURE__ */ s(L, {}, e);
+  return /* @__PURE__ */ s("nav", { "aria-label": "Breadcrumb", className: v(h), ...u, children: /* @__PURE__ */ s("ol", { className: l.list, children: o.map((e, t) => {
+    const n = a ? t === o.length - 1 : t === r.length - 1, _ = typeof e.label == "string" ? e.label : `crumb-${t}`;
+    return /* @__PURE__ */ d("li", { className: l.item, children: [
+      t > 0 && p(`sep-${_}`),
+      a && t === 1 && /* @__PURE__ */ d(f, { children: [
+        /* @__PURE__ */ s(
+          "button",
+          {
+            className: l.ellipsis,
+            onClick: () => b(!0),
+            "aria-label": "Show full breadcrumb trail",
+            children: /* @__PURE__ */ s(y, { size: 14 })
+          }
+        ),
+        p("sep-ellipsis")
+      ] }),
+      e.href && !n ? /* @__PURE__ */ s("a", { href: e.href, className: l.link, children: e.label }) : /* @__PURE__ */ s(
+        "span",
+        {
+          className: n ? l.current : l.text,
+          ...n && { "aria-current": "page" },
+          children: e.label
+        }
+      )
+    ] }, _);
+  }) }) });
+};
+export {
+  A as B
+};

package/dist/Button-CZyNozz2.js

@@ -0,0 +1,35 @@
+import { jsxs as b, jsx as s } from "react/jsx-runtime";
+import { c as o } from "./index-p1eeF8LQ.js";
+import { forwardRef as f } from "react";
+import { S as d } from "./Spinner-BBsu1HN3.js";
+import { b as t } from "./Button.module-Dm8IT-50.js";
+const l = f(
+  ({
+    variant: m = "primary",
+    size: n = "md",
+    type: a = "button",
+    loading: r,
+    disabled: e,
+    children: i,
+    className: p,
+    ...u
+  }, c) => /* @__PURE__ */ b(
+    "button",
+    {
+      ref: c,
+      type: a,
+      disabled: r || e,
+      "aria-busy": r || void 0,
+      className: o(t.button, t[m], t[n], p),
+      ...u,
+      children: [
+        r ? /* @__PURE__ */ s(d, { className: t.spinner }) : null,
+        /* @__PURE__ */ s("span", { className: o(t.content, { [t.hidden]: r }), children: i })
+      ]
+    }
+  )
+);
+l.displayName = "Button";
+export {
+  l as B
+};

package/dist/{index39.js → Button.module-Dm8IT-50.js}

@@ -1,7 +1,7 @@
-const n = "_button_dajne_1", t = "_primary_dajne_28", _ = "_secondary_dajne_37", e = "_outline_dajne_46", o = "_ghost_dajne_56", d = "_danger_dajne_65", s = "_sm_dajne_75", a = "_md_dajne_80", c = "_lg_dajne_85", r = "_content_dajne_91", i = "_hidden_dajne_97", j = "_spinner_dajne_101", g = {
+const n = "_button_dajne_1", _ = "_primary_dajne_28", t = "_secondary_dajne_37", e = "_outline_dajne_46", o = "_ghost_dajne_56", d = "_danger_dajne_65", s = "_sm_dajne_75", a = "_md_dajne_80", c = "_lg_dajne_85", r = "_content_dajne_91", i = "_hidden_dajne_97", j = "_spinner_dajne_101", g = {
   button: n,
-  primary: t,
-  secondary: _,
+  primary: _,
+  secondary: t,
   outline: e,
   ghost: o,
   danger: d,
@@ -13,17 +13,5 @@ const n = "_button_dajne_1", t = "_primary_dajne_28", _ = "_secondary_dajne_37",
   spinner: j
 };
 export {
-  n as button,
-  r as content,
-  d as danger,
-  g as default,
-  o as ghost,
-  i as hidden,
-  c as lg,
-  a as md,
-  e as outline,
-  t as primary,
-  _ as secondary,
-  s as sm,
-  j as spinner
+  g as b
 };

package/dist/Card-sDTrEkr0.js

@@ -0,0 +1,52 @@
+import { jsx as t } from "react/jsx-runtime";
+import { c as n } from "./index-p1eeF8LQ.js";
+const c = "_card_2a53z_1", i = "_elevated_2a53z_7", l = "_outlined_2a53z_12", m = "_flat_2a53z_16", p = "_header_2a53z_38", g = "_body_2a53z_44", z = "_footer_2a53z_48", o = {
+  card: c,
+  elevated: i,
+  outlined: l,
+  flat: m,
+  "padding-none": "_padding-none_2a53z_21",
+  "padding-sm": "_padding-sm_2a53z_25",
+  "padding-md": "_padding-md_2a53z_29",
+  "padding-lg": "_padding-lg_2a53z_33",
+  header: p,
+  body: g,
+  footer: z
+}, u = ({
+  as: a = "div",
+  variant: d = "elevated",
+  padding: e = "md",
+  children: _,
+  className: r,
+  ...s
+}) => /* @__PURE__ */ t(
+  a,
+  {
+    className: n(
+      o.card,
+      o[d],
+      o[`padding-${e}`],
+      r
+    ),
+    ...s,
+    children: _
+  }
+), y = ({
+  children: a,
+  className: d,
+  ...e
+}) => /* @__PURE__ */ t("div", { className: n(o.header, d), ...e, children: a }), b = ({
+  children: a,
+  className: d,
+  ...e
+}) => /* @__PURE__ */ t("div", { className: n(o.body, d), ...e, children: a }), C = ({
+  children: a,
+  className: d,
+  ...e
+}) => /* @__PURE__ */ t("div", { className: n(o.footer, d), ...e, children: a });
+export {
+  u as C,
+  b as a,
+  C as b,
+  y as c
+};

package/dist/Checkbox-D-5XA5nS.js

@@ -0,0 +1,46 @@
+import { jsxs as p, jsx as s } from "react/jsx-runtime";
+import { c as _ } from "./index-p1eeF8LQ.js";
+import { forwardRef as u, useId as k, useRef as j, useEffect as v } from "react";
+const N = "_wrapper_tjwht_1", y = "_row_tjwht_6", E = "_checkbox_tjwht_12", I = "_checkboxError_tjwht_54", C = "_label_tjwht_58", R = "_description_tjwht_65", B = "_error_tjwht_72", r = {
+  wrapper: N,
+  row: y,
+  checkbox: E,
+  checkboxError: I,
+  label: C,
+  description: R,
+  error: B
+}, $ = u(
+  ({ label: n, description: i, error: c, indeterminate: a, id: b, className: w, ...m }, o) => {
+    const x = k(), t = b ?? x, l = j(null);
+    v(() => {
+      const e = l.current;
+      e && (e.indeterminate = !!a);
+    }, [a]);
+    const d = c ? `${t}-error` : void 0, h = i ? `${t}-description` : void 0, f = [h, d].filter(Boolean).join(" ") || void 0;
+    return /* @__PURE__ */ p("div", { className: _(r.wrapper, w), children: [
+      /* @__PURE__ */ p("div", { className: r.row, children: [
+        /* @__PURE__ */ s(
+          "input",
+          {
+            id: t,
+            ref: (e) => {
+              l.current = e, typeof o == "function" ? o(e) : o && (o.current = e);
+            },
+            type: "checkbox",
+            "aria-invalid": c ? !0 : void 0,
+            "aria-describedby": f,
+            className: _(r.checkbox, c && r.checkboxError),
+            ...m
+          }
+        ),
+        n && /* @__PURE__ */ s("label", { htmlFor: t, className: r.label, children: n })
+      ] }),
+      i && /* @__PURE__ */ s("p", { id: h, className: r.description, children: i }),
+      c && /* @__PURE__ */ s("p", { id: d, className: r.error, role: "alert", children: c })
+    ] });
+  }
+);
+$.displayName = "Checkbox";
+export {
+  $ as C
+};

package/dist/ConfirmModal-CVz_ziw_.js

@@ -0,0 +1,112 @@
+import { jsx as t, jsxs as y } from "react/jsx-runtime";
+import { B as x } from "./Button-CZyNozz2.js";
+import { c as _ } from "./index-p1eeF8LQ.js";
+import { useRef as g, useState as h, useEffect as j } from "react";
+import { createPortal as b } from "react-dom";
+import { u as p } from "./useScrollLock-CCzIYwoC.js";
+import { X as z } from "./x-B9bYxG31.js";
+const B = "_dialog_1yxjo_33", C = "_closing_1yxjo_55", M = "_content_1yxjo_77", N = "_header_1yxjo_84", v = "_title_1yxjo_91", k = "_closeButton_1yxjo_97", A = "_body_1yxjo_118", E = "_footer_1yxjo_126", n = {
+  dialog: B,
+  "modal-scale-in": "_modal-scale-in_1yxjo_1",
+  "modal-fade-in": "_modal-fade-in_1yxjo_1",
+  "modal-scale-out": "_modal-scale-out_1yxjo_1",
+  "modal-fade-out": "_modal-fade-out_1yxjo_1",
+  closing: C,
+  "size-sm": "_size-sm_1yxjo_65",
+  "size-md": "_size-md_1yxjo_69",
+  "size-lg": "_size-lg_1yxjo_73",
+  content: M,
+  header: N,
+  title: v,
+  closeButton: k,
+  body: A,
+  footer: E
+}, R = ({
+  open: s,
+  onClose: o,
+  children: l,
+  size: r = "sm",
+  className: m,
+  ...f
+}) => {
+  const a = g(null), [c, i] = h(!1), [d, u] = h(!1);
+  return p(c && !d), j(() => {
+    s ? (i(!0), u(!1)) : i((e) => (e && u(!0), e));
+  }, [s]), j(() => {
+    const e = a.current;
+    c && !d && e && !e.open && (e.showModal(), e.focus());
+  }, [c, d]), c ? b(
+    /* @__PURE__ */ t(
+      "dialog",
+      {
+        ref: a,
+        className: _(
+          n.dialog,
+          n[`size-${r}`],
+          d && n.closing,
+          m
+        ),
+        onAnimationEnd: () => {
+          d && (a.current?.close(), i(!1), u(!1));
+        },
+        onCancel: (e) => {
+          e.preventDefault(), o();
+        },
+        onClick: (e) => {
+          e.target === a.current && o();
+        },
+        ...f,
+        children: /* @__PURE__ */ t("div", { className: n.content, children: l })
+      }
+    ),
+    document.body
+  ) : null;
+}, S = ({
+  children: s,
+  onClose: o,
+  className: l,
+  ...r
+}) => /* @__PURE__ */ y("div", { className: _(n.header, l), ...r, children: [
+  /* @__PURE__ */ t("h2", { className: n.title, children: s }),
+  o && /* @__PURE__ */ t(
+    "button",
+    {
+      onClick: o,
+      "aria-label": "Close",
+      className: n.closeButton,
+      children: /* @__PURE__ */ t(z, { size: 20 })
+    }
+  )
+] }), w = ({
+  children: s,
+  className: o,
+  ...l
+}) => /* @__PURE__ */ t("div", { className: _(n.body, o), ...l, children: s }), D = ({
+  children: s,
+  className: o,
+  ...l
+}) => /* @__PURE__ */ t("div", { className: _(n.footer, o), ...l, children: s }), $ = ({
+  open: s,
+  onClose: o,
+  onConfirm: l,
+  title: r = "Are you sure?",
+  description: m = "This action cannot be undone.",
+  confirmLabel: f = "Confirm",
+  cancelLabel: a = "Cancel",
+  variant: c = "danger",
+  loading: i = !1
+}) => /* @__PURE__ */ y(R, { open: s, onClose: o, children: [
+  /* @__PURE__ */ t(S, { onClose: o, children: r }),
+  /* @__PURE__ */ t(w, { children: m }),
+  /* @__PURE__ */ y(D, { children: [
+    /* @__PURE__ */ t(x, { variant: "ghost", onClick: o, disabled: i, children: a }),
+    /* @__PURE__ */ t(x, { variant: c, onClick: l, loading: i, children: f })
+  ] })
+] });
+export {
+  $ as C,
+  R as M,
+  w as a,
+  D as b,
+  S as c
+};

package/dist/Container-ahtH8Cdw.js

@@ -0,0 +1,29 @@
+import { jsx as o } from "react/jsx-runtime";
+import { c as _ } from "./index-p1eeF8LQ.js";
+const s = "_container_t6c9t_1", n = {
+  container: s,
+  "padding-none": "_padding-none_t6c9t_32",
+  "padding-sm": "_padding-sm_t6c9t_37",
+  "padding-md": "_padding-md_t6c9t_42",
+  "padding-lg": "_padding-lg_t6c9t_47"
+}, e = ({
+  children: t,
+  as: d = "div",
+  padding: a = "md",
+  className: i,
+  ...c
+}) => /* @__PURE__ */ o(
+  d,
+  {
+    className: _(
+      n.container,
+      n[`padding-${a}`],
+      i
+    ),
+    ...c,
+    children: t
+  }
+);
+export {
+  e as C
+};