@sandurtech/sandui 0.1.0 → 0.1.1

package/dist/sandui.js

@@ -0,0 +1,2208 @@
+import Wn, { forwardRef as f, useContext as ve, createContext as ye, useState as F, useId as O, Children as be, isValidElement as X, useMemo as E, useCallback as A, useRef as z, useEffect as K, cloneElement as sn } from "react";
+import { createPortal as rn } from "react-dom";
+var Se = { exports: {} }, ce = {};
+var Xe;
+function Un() {
+  if (Xe) return ce;
+  Xe = 1;
+  var s = /* @__PURE__ */ Symbol.for("react.transitional.element"), e = /* @__PURE__ */ Symbol.for("react.fragment");
+  function n(t, r, o) {
+    var c = null;
+    if (o !== void 0 && (c = "" + o), r.key !== void 0 && (c = "" + r.key), "key" in r) {
+      o = {};
+      for (var d in r)
+        d !== "key" && (o[d] = r[d]);
+    } else o = r;
+    return r = o.ref, {
+      $$typeof: s,
+      type: t,
+      key: c,
+      ref: r !== void 0 ? r : null,
+      props: o
+    };
+  }
+  return ce.Fragment = e, ce.jsx = n, ce.jsxs = n, ce;
+}
+var ie = {};
+var Ze;
+function Jn() {
+  return Ze || (Ze = 1, process.env.NODE_ENV !== "production" && (function() {
+    function s(u) {
+      if (u == null) return null;
+      if (typeof u == "function")
+        return u.$$typeof === S ? null : u.displayName || u.name || null;
+      if (typeof u == "string") return u;
+      switch (u) {
+        case j:
+          return "Fragment";
+        case D:
+          return "Profiler";
+        case y:
+          return "StrictMode";
+        case Z:
+          return "Suspense";
+        case W:
+          return "SuspenseList";
+        case Ce:
+          return "Activity";
+      }
+      if (typeof u == "object")
+        switch (typeof u.tag == "number" && console.error(
+          "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
+        ), u.$$typeof) {
+          case g:
+            return "Portal";
+          case Y:
+            return u.displayName || "Context";
+          case P:
+            return (u._context.displayName || "Context") + ".Consumer";
+          case I:
+            var x = u.render;
+            return u = u.displayName, u || (u = x.displayName || x.name || "", u = u !== "" ? "ForwardRef(" + u + ")" : "ForwardRef"), u;
+          case oe:
+            return x = u.displayName || null, x !== null ? x : s(u.type) || "Memo";
+          case U:
+            x = u._payload, u = u._init;
+            try {
+              return s(u(x));
+            } catch {
+            }
+        }
+      return null;
+    }
+    function e(u) {
+      return "" + u;
+    }
+    function n(u) {
+      try {
+        e(u);
+        var x = !1;
+      } catch {
+        x = !0;
+      }
+      if (x) {
+        x = console;
+        var N = x.error, k = typeof Symbol == "function" && Symbol.toStringTag && u[Symbol.toStringTag] || u.constructor.name || "Object";
+        return N.call(
+          x,
+          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
+          k
+        ), e(u);
+      }
+    }
+    function t(u) {
+      if (u === j) return "<>";
+      if (typeof u == "object" && u !== null && u.$$typeof === U)
+        return "<...>";
+      try {
+        var x = s(u);
+        return x ? "<" + x + ">" : "<...>";
+      } catch {
+        return "<...>";
+      }
+    }
+    function r() {
+      var u = q.A;
+      return u === null ? null : u.getOwner();
+    }
+    function o() {
+      return Error("react-stack-top-frame");
+    }
+    function c(u) {
+      if (Q.call(u, "key")) {
+        var x = Object.getOwnPropertyDescriptor(u, "key").get;
+        if (x && x.isReactWarning) return !1;
+      }
+      return u.key !== void 0;
+    }
+    function d(u, x) {
+      function N() {
+        Ke || (Ke = !0, console.error(
+          "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
+          x
+        ));
+      }
+      N.isReactWarning = !0, Object.defineProperty(u, "key", {
+        get: N,
+        configurable: !0
+      });
+    }
+    function l() {
+      var u = s(this.type);
+      return Ye[u] || (Ye[u] = !0, console.error(
+        "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
+      )), u = this.props.ref, u !== void 0 ? u : null;
+    }
+    function i(u, x, N, k, ge, Ee) {
+      var w = N.ref;
+      return u = {
+        $$typeof: b,
+        type: u,
+        key: x,
+        props: N,
+        _owner: k
+      }, (w !== void 0 ? w : null) !== null ? Object.defineProperty(u, "ref", {
+        enumerable: !1,
+        get: l
+      }) : Object.defineProperty(u, "ref", { enumerable: !1, value: null }), u._store = {}, Object.defineProperty(u._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: 0
+      }), Object.defineProperty(u, "_debugInfo", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: null
+      }), Object.defineProperty(u, "_debugStack", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: ge
+      }), Object.defineProperty(u, "_debugTask", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: Ee
+      }), Object.freeze && (Object.freeze(u.props), Object.freeze(u)), u;
+    }
+    function _(u, x, N, k, ge, Ee) {
+      var w = x.children;
+      if (w !== void 0)
+        if (k)
+          if (Kn(w)) {
+            for (k = 0; k < w.length; k++)
+              p(w[k]);
+            Object.freeze && Object.freeze(w);
+          } else
+            console.error(
+              "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
+            );
+        else p(w);
+      if (Q.call(x, "key")) {
+        w = s(u);
+        var ee = Object.keys(x).filter(function(Yn) {
+          return Yn !== "key";
+        });
+        k = 0 < ee.length ? "{key: someKey, " + ee.join(": ..., ") + ": ...}" : "{key: someKey}", Je[w + k] || (ee = 0 < ee.length ? "{" + ee.join(": ..., ") + ": ...}" : "{}", console.error(
+          `A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,
+          k,
+          w,
+          ee,
+          w
+        ), Je[w + k] = !0);
+      }
+      if (w = null, N !== void 0 && (n(N), w = "" + N), c(x) && (n(x.key), w = "" + x.key), "key" in x) {
+        N = {};
+        for (var Re in x)
+          Re !== "key" && (N[Re] = x[Re]);
+      } else N = x;
+      return w && d(
+        N,
+        typeof u == "function" ? u.displayName || u.name || "Unknown" : u
+      ), i(
+        u,
+        w,
+        N,
+        r(),
+        ge,
+        Ee
+      );
+    }
+    function p(u) {
+      h(u) ? u._store && (u._store.validated = 1) : typeof u == "object" && u !== null && u.$$typeof === U && (u._payload.status === "fulfilled" ? h(u._payload.value) && u._payload.value._store && (u._payload.value._store.validated = 1) : u._store && (u._store.validated = 1));
+    }
+    function h(u) {
+      return typeof u == "object" && u !== null && u.$$typeof === b;
+    }
+    var v = Wn, b = /* @__PURE__ */ Symbol.for("react.transitional.element"), g = /* @__PURE__ */ Symbol.for("react.portal"), j = /* @__PURE__ */ Symbol.for("react.fragment"), y = /* @__PURE__ */ Symbol.for("react.strict_mode"), D = /* @__PURE__ */ Symbol.for("react.profiler"), P = /* @__PURE__ */ Symbol.for("react.consumer"), Y = /* @__PURE__ */ Symbol.for("react.context"), I = /* @__PURE__ */ Symbol.for("react.forward_ref"), Z = /* @__PURE__ */ Symbol.for("react.suspense"), W = /* @__PURE__ */ Symbol.for("react.suspense_list"), oe = /* @__PURE__ */ Symbol.for("react.memo"), U = /* @__PURE__ */ Symbol.for("react.lazy"), Ce = /* @__PURE__ */ Symbol.for("react.activity"), S = /* @__PURE__ */ Symbol.for("react.client.reference"), q = v.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, Q = Object.prototype.hasOwnProperty, Kn = Array.isArray, $e = console.createTask ? console.createTask : function() {
+      return null;
+    };
+    v = {
+      react_stack_bottom_frame: function(u) {
+        return u();
+      }
+    };
+    var Ke, Ye = {}, We = v.react_stack_bottom_frame.bind(
+      v,
+      o
+    )(), Ue = $e(t(o)), Je = {};
+    ie.Fragment = j, ie.jsx = function(u, x, N) {
+      var k = 1e4 > q.recentlyCreatedOwnerStacks++;
+      return _(
+        u,
+        x,
+        N,
+        !1,
+        k ? Error("react-stack-top-frame") : We,
+        k ? $e(t(u)) : Ue
+      );
+    }, ie.jsxs = function(u, x, N) {
+      var k = 1e4 > q.recentlyCreatedOwnerStacks++;
+      return _(
+        u,
+        x,
+        N,
+        !0,
+        k ? Error("react-stack-top-frame") : We,
+        k ? $e(t(u)) : Ue
+      );
+    };
+  })()), ie;
+}
+var Qe;
+function Xn() {
+  return Qe || (Qe = 1, process.env.NODE_ENV === "production" ? Se.exports = Un() : Se.exports = Jn()), Se.exports;
+}
+var a = Xn();
+function m(...s) {
+  return s.filter(Boolean).join(" ");
+}
+const Zn = {
+  none: "0",
+  "2xs": "var(--sand-space-1)",
+  xs: "var(--sand-space-2)",
+  sm: "var(--sand-space-3)",
+  md: "var(--sand-space-4)",
+  lg: "var(--sand-space-5)",
+  xl: "var(--sand-space-6)",
+  "2xl": "var(--sand-space-7)",
+  "3xl": "var(--sand-space-8)"
+}, Qn = {
+  sm: "var(--radius-sm)",
+  md: "var(--radius-md)",
+  lg: "var(--radius-lg)",
+  xl: "var(--radius-xl)",
+  full: "var(--radius-full)"
+};
+function me(s) {
+  if (s !== void 0)
+    return typeof s == "number" ? `${s}px` : Zn[s] ?? s;
+}
+function on(s) {
+  if (s !== void 0)
+    return typeof s == "number" ? `${s}px` : Qn[s] ?? s;
+}
+function C(s, e, n) {
+  return n === void 0 ? s : {
+    ...s,
+    [e]: n
+  };
+}
+function cn(s, e, n) {
+  if (n === void 0)
+    return s;
+  let t = s;
+  if (typeof n != "object" || n === null || Array.isArray(n))
+    return C(t, `--${e}`, String(n));
+  for (const [r, o] of Object.entries(n))
+    if (o !== void 0) {
+      const c = r === "base" ? `--${e}` : `--${e}-${r}`;
+      t = C(t, c, String(o));
+    }
+  return t;
+}
+function ea(s) {
+  return Array.from(
+    s.querySelectorAll(
+      [
+        "a[href]",
+        "button:not([disabled])",
+        "textarea:not([disabled])",
+        "input:not([disabled])",
+        "select:not([disabled])",
+        '[tabindex]:not([tabindex="-1"])'
+      ].join(",")
+    )
+  ).filter((e) => !e.hasAttribute("disabled") && !e.getAttribute("aria-hidden"));
+}
+function ke(s, e, n, t) {
+  if (n !== 0)
+    switch (s.key) {
+      case "ArrowRight":
+      case "ArrowDown":
+        s.preventDefault(), t((e + 1) % n);
+        break;
+      case "ArrowLeft":
+      case "ArrowUp":
+        s.preventDefault(), t((e - 1 + n) % n);
+        break;
+      case "Home":
+        s.preventDefault(), t(0);
+        break;
+      case "End":
+        s.preventDefault(), t(n - 1);
+        break;
+    }
+}
+const dn = ye({}), na = () => ve(dn);
+function Ps({ children: s, icons: e, renderIcon: n }) {
+  return /* @__PURE__ */ a.jsx(dn.Provider, { value: { map: e, renderIcon: n }, children: s });
+}
+const B = f(function({ icon: e, size: n, fill: t, className: r, style: o, ...c }, d) {
+  const { map: l, renderIcon: i } = na(), _ = typeof e == "string" ? l?.[e] ?? e : e;
+  if (typeof _ == "function") {
+    const p = _;
+    return /* @__PURE__ */ a.jsx(
+      p,
+      {
+        ref: d,
+        width: n ?? 18,
+        height: n ?? 18,
+        className: m(r),
+        ...c
+      }
+    );
+  }
+  return typeof _ == "string" && i ? /* @__PURE__ */ a.jsx(a.Fragment, { children: i(_, { size: n, fill: t, className: r, style: o, ...c }) }) : /* @__PURE__ */ a.jsx(
+    "span",
+    {
+      ref: d,
+      className: m("material-symbols-rounded", r),
+      style: {
+        fontSize: n,
+        fontVariationSettings: t ? "'FILL' 1" : void 0,
+        display: "inline-flex",
+        alignItems: "center",
+        justifyContent: "center",
+        ...o
+      },
+      "aria-hidden": c["aria-label"] ? void 0 : !0,
+      ...c,
+      children: _
+    }
+  );
+});
+B.displayName = "SandIcon";
+const aa = "_alert_f8qp0_1", ta = "_icon_f8qp0_13", sa = "_content_f8qp0_25", ra = "_title_f8qp0_30", oa = "_description_f8qp0_35", de = {
+  alert: aa,
+  icon: ta,
+  content: sa,
+  title: ra,
+  description: oa
+}, ca = {
+  info: {
+    icon: "info",
+    color: "var(--color-info)",
+    soft: "var(--color-info-soft)"
+  },
+  success: {
+    icon: "check_circle",
+    color: "var(--color-success)",
+    soft: "var(--color-success-soft)"
+  },
+  warning: {
+    icon: "warning",
+    color: "var(--color-warning)",
+    soft: "var(--color-warning-soft)"
+  },
+  error: {
+    icon: "error",
+    color: "var(--color-error)",
+    soft: "var(--color-error-soft)"
+  }
+}, ia = f(function({ status: e = "info", title: n, description: t, className: r, style: o, children: c, ...d }, l) {
+  const i = ca[e];
+  return /* @__PURE__ */ a.jsxs(
+    "div",
+    {
+      ref: l,
+      role: "status",
+      className: m(de.alert, r),
+      style: {
+        "--sand-alert-border": i.color,
+        "--sand-alert-bg": `color-mix(in srgb, ${i.soft} 74%, var(--theme-surface))`,
+        "--sand-alert-soft": i.soft,
+        "--sand-alert-color": i.color,
+        ...o
+      },
+      ...d,
+      children: [
+        /* @__PURE__ */ a.jsx("span", { className: de.icon, children: /* @__PURE__ */ a.jsx(B, { icon: i.icon, size: 20 }) }),
+        /* @__PURE__ */ a.jsxs("div", { className: de.content, children: [
+          n && /* @__PURE__ */ a.jsx("div", { className: de.title, children: n }),
+          t && /* @__PURE__ */ a.jsx("div", { className: de.description, children: t }),
+          c
+        ] })
+      ]
+    }
+  );
+});
+ia.displayName = "SandAlert";
+const da = "_accordion_hg6cu_1", la = "_item_hg6cu_7", ua = "_trigger_hg6cu_23", _a = "_triggerMain_hg6cu_37", pa = "_itemIcon_hg6cu_45", ma = "_triggerText_hg6cu_64", fa = "_title_hg6cu_71", ba = "_descriptionFull_hg6cu_79", ha = "_content_hg6cu_88", va = "_contentOpen_hg6cu_94", ya = "_contentInner_hg6cu_98", xa = "_chevron_hg6cu_106", ga = "_chevronOpen_hg6cu_112", M = {
+  accordion: da,
+  item: la,
+  trigger: ua,
+  triggerMain: _a,
+  itemIcon: pa,
+  triggerText: ma,
+  title: fa,
+  descriptionFull: ba,
+  content: ha,
+  contentOpen: va,
+  contentInner: ya,
+  chevron: xa,
+  chevronOpen: ga
+}, ln = () => null;
+ln.displayName = "SandAccordionItem";
+const Sa = f(function({ items: e = [], defaultOpen: n, className: t, children: r, ...o }, c) {
+  const [d, l] = F(n), i = O(), _ = [...e];
+  return be.forEach(r, (p) => {
+    X(p) && p.type === ln && _.push(p.props);
+  }), /* @__PURE__ */ a.jsx("div", { ref: c, className: m(M.accordion, t), ...o, children: _.map((p) => {
+    const h = d === p.id, v = `${i}-trigger-${p.id}`, b = `${i}-content-${p.id}`;
+    return /* @__PURE__ */ a.jsxs("div", { className: m(M.item, h && M.itemOpen), "data-state": h ? "open" : "closed", children: [
+      /* @__PURE__ */ a.jsxs(
+        "button",
+        {
+          id: v,
+          type: "button",
+          className: M.trigger,
+          "aria-expanded": h,
+          "aria-controls": b,
+          onClick: () => l((g) => g === p.id ? void 0 : p.id),
+          children: [
+            /* @__PURE__ */ a.jsxs("div", { className: M.triggerMain, children: [
+              p.icon && /* @__PURE__ */ a.jsx(B, { icon: p.icon, className: M.itemIcon, size: 24, "aria-hidden": "true" }),
+              /* @__PURE__ */ a.jsx("div", { className: M.triggerText, children: /* @__PURE__ */ a.jsx("span", { className: M.title, children: p.title }) })
+            ] }),
+            /* @__PURE__ */ a.jsx(
+              B,
+              {
+                icon: "expand_more",
+                className: m(M.chevron, h && M.chevronOpen),
+                size: 20,
+                "aria-hidden": "true"
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ a.jsx(
+        "div",
+        {
+          id: b,
+          "aria-labelledby": v,
+          className: m(M.content, h && M.contentOpen),
+          role: "region",
+          children: /* @__PURE__ */ a.jsxs("div", { className: M.contentInner, children: [
+            p.description && /* @__PURE__ */ a.jsx("p", { className: M.descriptionFull, children: p.description }),
+            p.content
+          ] })
+        }
+      )
+    ] }, p.id);
+  }) });
+});
+Sa.displayName = "SandAccordion";
+const ja = "_avatar_tjyvl_1", Na = "_image_tjyvl_57", ka = "_initials_tjyvl_63", wa = "_group_tjyvl_67", se = {
+  avatar: ja,
+  "variant-circle": "_variant-circle_tjyvl_15",
+  "variant-rounded": "_variant-rounded_tjyvl_19",
+  "variant-square": "_variant-square_tjyvl_23",
+  "size-xs": "_size-xs_tjyvl_27",
+  "size-sm": "_size-sm_tjyvl_33",
+  "size-md": "_size-md_tjyvl_39",
+  "size-lg": "_size-lg_tjyvl_45",
+  "size-xl": "_size-xl_tjyvl_51",
+  image: Na,
+  initials: ka,
+  group: wa
+}, Ta = f(function({ src: e, initials: n, name: t, size: r = "md", variant: o = "circle", className: c = "", style: d, ...l }, i) {
+  const _ = typeof r == "number" ? {
+    width: r,
+    height: r,
+    fontSize: r * 0.4
+  } : void 0, p = n ?? t?.split(" ").map((h) => h[0]).join("").toUpperCase().slice(0, 2);
+  return /* @__PURE__ */ a.jsx(
+    "div",
+    {
+      ref: i,
+      className: m(
+        se.avatar,
+        typeof r == "string" && se[`size-${r}`],
+        se[`variant-${o}`],
+        c
+      ),
+      style: { ..._, ...d },
+      ...l,
+      children: e ? /* @__PURE__ */ a.jsx("img", { src: e, alt: t, className: se.image }) : /* @__PURE__ */ a.jsx("span", { className: se.initials, children: p })
+    }
+  );
+});
+Ta.displayName = "SandAvatar";
+const Ia = f(function({ children: e, max: n, size: t = "md", className: r = "", ...o }, c) {
+  return /* @__PURE__ */ a.jsx("div", { ref: c, className: m(se.group, r), ...o, children: e });
+});
+Ia.displayName = "SandAvatarGroup";
+const en = {
+  "sand-badge": "_sand-badge_ezp2k_1",
+  "sand-badge-primary": "_sand-badge-primary_ezp2k_15",
+  "sand-badge-secondary": "_sand-badge-secondary_ezp2k_21",
+  "sand-badge-success": "_sand-badge-success_ezp2k_27",
+  "sand-badge-failed": "_sand-badge-failed_ezp2k_33"
+}, Ca = f(function({ variant: e = "primary", className: n = "", ...t }, r) {
+  const o = E(() => en[`sand-badge-${e}`], [e]);
+  return /* @__PURE__ */ a.jsx(
+    "span",
+    {
+      ref: r,
+      className: m(en["sand-badge"], o, n),
+      ...t
+    }
+  );
+});
+Ca.displayName = "SandBadge";
+const le = {
+  "sand-breadcrumbs": "_sand-breadcrumbs_cngwf_1",
+  "sand-breadcrumb-item": "_sand-breadcrumb-item_cngwf_10",
+  "sand-breadcrumb-link": "_sand-breadcrumb-link_cngwf_17",
+  "sand-breadcrumb-current": "_sand-breadcrumb-current_cngwf_32",
+  "sand-breadcrumb-separator": "_sand-breadcrumb-separator_cngwf_37"
+}, un = () => null;
+un.displayName = "SandBreadcrumbItem";
+const $a = f(function({ items: e = [], className: n = "", "aria-label": t = "Breadcrumb", children: r, ...o }, c) {
+  const d = E(() => {
+    const i = [...e];
+    return be.forEach(r, (_) => {
+      X(_) && _.type === un && i.push(_.props);
+    }), i;
+  }, [e, r]), l = E(
+    () => d.map((i, _) => {
+      const p = _ === d.length - 1;
+      return /* @__PURE__ */ a.jsxs("li", { className: le["sand-breadcrumb-item"], children: [
+        i.href && !p ? /* @__PURE__ */ a.jsx("a", { href: i.href, className: le["sand-breadcrumb-link"], children: i.label }) : /* @__PURE__ */ a.jsx(
+          "span",
+          {
+            "aria-current": p ? "page" : void 0,
+            className: p ? le["sand-breadcrumb-current"] : void 0,
+            children: i.label
+          }
+        ),
+        !p && /* @__PURE__ */ a.jsx("span", { className: m(le["sand-breadcrumb-separator"], "material-symbols-rounded"), "aria-hidden": "true", children: "chevron_right" })
+      ] }, `${String(i.label)}-${_}`);
+    }),
+    [d]
+  );
+  return /* @__PURE__ */ a.jsx("nav", { ref: c, "aria-label": t, className: m(le["sand-breadcrumbs"], n), ...o, children: /* @__PURE__ */ a.jsx("ol", { children: l }) });
+});
+$a.displayName = "SandBreadcrumbs";
+const Ea = "_box_t20vf_1", Ra = "_surface_t20vf_19", Aa = "_inline_t20vf_27", fe = {
+  box: Ea,
+  surface: Ra,
+  inline: Aa
+}, Oa = {
+  stretch: "stretch",
+  start: "flex-start",
+  center: "center",
+  end: "flex-end",
+  baseline: "baseline"
+}, Ma = {
+  start: "flex-start",
+  center: "center",
+  end: "flex-end",
+  between: "space-between",
+  around: "space-around",
+  evenly: "space-evenly"
+}, za = f(function({
+  as: e,
+  padding: n,
+  margin: t,
+  gap: r,
+  align: o,
+  justify: c,
+  surface: d,
+  inline: l,
+  width: i,
+  radius: _,
+  shadow: p = "none",
+  className: h,
+  style: v,
+  ...b
+}, g) {
+  const j = e ?? "div";
+  let y = v;
+  return y = C(y, "--sand-padding", me(n)), y = C(y, "--sand-margin", me(t)), y = C(y, "--sand-gap", me(r)), y = C(y, "--sand-align", o ? Oa[o] : void 0), y = C(y, "--sand-justify", c ? Ma[c] : void 0), y = C(y, "--sand-width", typeof i == "number" ? `${i}px` : i), y = C(y, "--sand-box-radius", on(_)), y = C(
+    y,
+    "--sand-box-shadow",
+    p === "none" ? "none" : `var(--shadow-${p})`
+  ), /* @__PURE__ */ a.jsx(
+    j,
+    {
+      ref: g,
+      className: m(fe.box, d && fe.surface, l && fe.inline, h),
+      style: y,
+      ...b
+    }
+  );
+});
+za.displayName = "SandBox";
+const Da = "_chip_1o3za_1", Pa = "_clickable_1o3za_16", La = "_startIcon_1o3za_61", Ba = "_label_1o3za_66", Fa = "_closeButton_1o3za_70", ne = {
+  chip: Da,
+  clickable: Pa,
+  "variant-primary": "_variant-primary_1o3za_26",
+  "variant-secondary": "_variant-secondary_1o3za_31",
+  "variant-success": "_variant-success_1o3za_36",
+  "variant-warning": "_variant-warning_1o3za_41",
+  "variant-error": "_variant-error_1o3za_46",
+  "variant-outline": "_variant-outline_1o3za_51",
+  startIcon: La,
+  label: Ba,
+  closeButton: Fa
+}, _n = f(function({ variant: e = "primary", icon: n, onClose: t, clickable: r, children: o, className: c = "", ...d }, l) {
+  return /* @__PURE__ */ a.jsxs(
+    "span",
+    {
+      ref: l,
+      className: m(
+        ne.chip,
+        ne[`variant-${e}`],
+        r && ne.clickable,
+        c
+      ),
+      role: r ? "button" : void 0,
+      tabIndex: r ? 0 : void 0,
+      ...d,
+      children: [
+        n && /* @__PURE__ */ a.jsx(B, { icon: n, size: 16, className: ne.startIcon }),
+        /* @__PURE__ */ a.jsx("span", { className: ne.label, children: o }),
+        t && /* @__PURE__ */ a.jsx(
+          "button",
+          {
+            type: "button",
+            className: ne.closeButton,
+            onClick: (i) => {
+              i.stopPropagation(), t();
+            },
+            "aria-label": "Remove",
+            children: /* @__PURE__ */ a.jsx(B, { icon: "close", size: 14 })
+          }
+        )
+      ]
+    }
+  );
+});
+_n.displayName = "SandChip";
+const Ls = _n, nn = {
+  "sand-btn": "_sand-btn_9p0tq_1",
+  "sand-btn-primary": "_sand-btn-primary_9p0tq_28",
+  "sand-btn-secondary": "_sand-btn-secondary_9p0tq_39",
+  "sand-btn-outline": "_sand-btn-outline_9p0tq_49",
+  "sand-btn-success": "_sand-btn-success_9p0tq_59",
+  "sand-btn-failed": "_sand-btn-failed_9p0tq_69"
+}, Ae = f(function({ variant: e = "primary", className: n = "", type: t = "button", ...r }, o) {
+  const c = E(() => nn[`sand-btn-${e}`], [e]);
+  return /* @__PURE__ */ a.jsx(
+    "button",
+    {
+      ref: o,
+      className: m(nn["sand-btn"], c, n),
+      type: t,
+      ...r
+    }
+  );
+});
+Ae.displayName = "SandButton";
+const je = {
+  "sand-card": "_sand-card_hf89l_1",
+  "sand-card-header": "_sand-card-header_hf89l_14",
+  "sand-card-body": "_sand-card-body_hf89l_22",
+  "sand-card-footer": "_sand-card-footer_hf89l_29"
+}, qa = f(function({ header: e, footer: n, children: t, className: r = "", ...o }, c) {
+  return /* @__PURE__ */ a.jsxs("article", { ref: c, className: m(je["sand-card"], r), ...o, children: [
+    e && /* @__PURE__ */ a.jsx("header", { className: je["sand-card-header"], children: e }),
+    /* @__PURE__ */ a.jsx("div", { className: je["sand-card-body"], children: t }),
+    n && /* @__PURE__ */ a.jsx("footer", { className: je["sand-card-footer"], children: n })
+  ] });
+});
+qa.displayName = "SandCard";
+const Va = "_active_1i66s_73", re = {
+  "sand-code-block": "_sand-code-block_1i66s_1",
+  "sand-copy-btn": "_sand-copy-btn_1i66s_20",
+  "sand-code-tabs": "_sand-code-tabs_1i66s_40",
+  "sand-tab-headers": "_sand-tab-headers_1i66s_51",
+  "sand-tab-btn": "_sand-tab-btn_1i66s_58",
+  active: Va
+};
+function Ha(s) {
+  if (!s) return "";
+  let e = s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+  const n = [], t = (r, o) => {
+    const c = `___TOKEN_${n.length}___`;
+    return n.push(`<span class="token-${o}">${r}</span>`), c;
+  };
+  return e = e.replace(/\/\/.*/g, (r) => t(r, "comment")), e = e.replace(/\/\*[\s\S]*?\*\//g, (r) => t(r, "comment")), e = e.replace(/(["'`])(?:\\.|[^\\])*?\1/g, (r) => t(r, "string")), e = e.replace(/\b(true|false|null|undefined)\b/g, (r) => t(r, "boolean")), e = e.replace(
+    /\b(const|let|var|function|return|if|else|for|while|import|export|from|default|class|extends|type|interface|enum|async|await|try|catch|finally|throw|new|this|super|public|private|protected|readonly|static|get|set|as|in|of|void|any|number|string|boolean|symbol|bigint)\b/g,
+    (r) => t(r, "keyword")
+  ), e = e.replace(
+    /\b(React|useState|useEffect|useMemo|useCallback|useId|useRef|forwardRef|ComponentPropsWithoutRef|ReactNode|FC|HTMLAttributes)\b/g,
+    (r) => t(r, "class")
+  ), e = e.replace(/\b([a-z_][a-z0-9_]*)(?=\s*\()/gi, (r) => t(r, "function")), e = e.replace(/&lt;[A-Z][a-zA-Z0-9]*/g, (r) => t(r, "component")), e = e.replace(/&lt;\/?[a-z][a-z0-9]*/g, (r) => t(r, "tag")), e = e.replace(/&lt;\/[a-zA-Z0-9]+&gt;/gi, (r) => t(r, "tag")), e = e.replace(/\b([a-z][a-zA-Z0-9]*)(?=\s*=\s*[{"])/g, (r) => t(r, "attr")), e = e.replace(/\b(\d+)\b/g, (r) => t(r, "number")), e = e.replace(/(=&gt;|===|==|=|\+|-|\*|\/|&amp;&amp;|\|\||!)/g, (r) => t(r, "operator")), n.forEach((r, o) => {
+    e = e.replace(`___TOKEN_${o}___`, r);
+  }), e;
+}
+const pn = f(function({ code: e, className: n = "", ...t }, r) {
+  const [o, c] = F(!1), d = A(() => {
+    navigator.clipboard.writeText(e).then(() => {
+      c(!0), setTimeout(() => c(!1), 2e3);
+    });
+  }, [e]), l = E(() => Ha(e), [e]);
+  return /* @__PURE__ */ a.jsxs("pre", { ref: r, className: m(re["sand-code-block"], n), ...t, children: [
+    /* @__PURE__ */ a.jsx(
+      "button",
+      {
+        className: re["sand-copy-btn"],
+        onClick: d,
+        type: "button",
+        "aria-label": o ? "Code copied to clipboard" : "Copy code to clipboard",
+        children: o ? "Copied" : "Copy"
+      }
+    ),
+    /* @__PURE__ */ a.jsx("code", { dangerouslySetInnerHTML: { __html: l } })
+  ] });
+});
+pn.displayName = "SandCodeBlock";
+const Ga = f(function({ items: e, tabs: n, defaultTab: t = 0, className: r = "", onTabChange: o }, c) {
+  const d = E(() => e ?? n ?? [], [e, n]), [l, i] = F(t), _ = O(), p = z([]), h = A(
+    (b) => {
+      i(b), o?.(b), p.current[b]?.focus();
+    },
+    [o]
+  ), v = E(() => d[l]?.code ?? "", [l, d]);
+  return /* @__PURE__ */ a.jsxs("div", { ref: c, className: m(re["sand-code-tabs"], r), children: [
+    /* @__PURE__ */ a.jsx("div", { className: re["sand-tab-headers"], role: "tablist", "aria-label": "Code examples", children: d.map((b, g) => /* @__PURE__ */ a.jsx(
+      "button",
+      {
+        ref: (j) => {
+          p.current[g] = j;
+        },
+        className: m(re["sand-tab-btn"], l === g && re.active),
+        type: "button",
+        role: "tab",
+        "aria-selected": l === g,
+        "aria-controls": `${_}-code-panel-${g}`,
+        id: `${_}-code-tab-${g}`,
+        tabIndex: l === g ? 0 : -1,
+        onClick: () => h(g),
+        onKeyDown: (j) => ke(j, g, d.length, (y) => h(y)),
+        children: b.name
+      },
+      g
+    )) }),
+    /* @__PURE__ */ a.jsx(
+      "div",
+      {
+        role: "tabpanel",
+        id: `${_}-code-panel-${l}`,
+        "aria-labelledby": `${_}-code-tab-${l}`,
+        children: /* @__PURE__ */ a.jsx(pn, { code: v })
+      }
+    )
+  ] });
+});
+Ga.displayName = "SandCodeTabs";
+const Ka = {
+  "sand-divider": "_sand-divider_svs0p_1"
+}, Ya = f(function({ className: e = "", ...n }, t) {
+  return /* @__PURE__ */ a.jsx("hr", { ref: t, className: m(Ka["sand-divider"], e), ...n });
+});
+Ya.displayName = "SandDivider";
+const V = {
+  "sand-feedback": "_sand-feedback_1fyl0_1",
+  "sand-feedback-toast": "_sand-feedback-toast_1fyl0_12",
+  "sand-feedback-snackbar": "_sand-feedback-snackbar_1fyl0_18",
+  "sand-feedback-row": "_sand-feedback-row_1fyl0_28",
+  "sand-feedback-icon": "_sand-feedback-icon_1fyl0_34",
+  "sand-feedback-content": "_sand-feedback-content_1fyl0_41",
+  "sand-feedback-title": "_sand-feedback-title_1fyl0_49",
+  "sand-feedback-message": "_sand-feedback-message_1fyl0_55",
+  "sand-feedback-action": "_sand-feedback-action_1fyl0_61",
+  "sand-feedback-success": "_sand-feedback-success_1fyl0_65",
+  "sand-feedback-failed": "_sand-feedback-failed_1fyl0_72",
+  "sand-feedback-info": "_sand-feedback-info_1fyl0_79"
+}, Wa = {
+  info: "info",
+  success: "check_circle",
+  failed: "error"
+}, mn = f(function({ heading: e, message: n, action: t, variant: r = "info", className: o = "", mode: c, ...d }, l) {
+  const i = E(() => Wa[r], [r]), _ = r === "failed" ? "alert" : "status";
+  return /* @__PURE__ */ a.jsx(
+    "div",
+    {
+      ref: l,
+      role: _,
+      "aria-live": r === "failed" ? "assertive" : "polite",
+      className: m(
+        V["sand-feedback"],
+        V[`sand-feedback-${c}`],
+        V[`sand-feedback-${r}`],
+        o
+      ),
+      ...d,
+      children: /* @__PURE__ */ a.jsxs("div", { className: V["sand-feedback-row"], children: [
+        /* @__PURE__ */ a.jsx("span", { className: m(V["sand-feedback-icon"], "material-symbols-rounded"), "aria-hidden": "true", children: i }),
+        /* @__PURE__ */ a.jsxs("div", { className: V["sand-feedback-content"], children: [
+          e && /* @__PURE__ */ a.jsx("span", { className: V["sand-feedback-title"], children: e }),
+          /* @__PURE__ */ a.jsx("span", { className: V["sand-feedback-message"], children: n })
+        ] }),
+        t && /* @__PURE__ */ a.jsx("div", { className: V["sand-feedback-action"], children: t })
+      ] })
+    }
+  );
+}), Ua = f(function(e, n) {
+  return /* @__PURE__ */ a.jsx(mn, { ref: n, mode: "toast", ...e });
+});
+Ua.displayName = "SandToast";
+const Ja = f(function(e, n) {
+  return /* @__PURE__ */ a.jsx(mn, { ref: n, mode: "snackbar", ...e });
+});
+Ja.displayName = "SandSnackbar";
+const Xa = "_grid_g8kr4_1", Za = "_item_g8kr4_7", fn = {
+  grid: Xa,
+  item: Za
+}, bn = f(function({ columns: e = 12, gap: n = "md", className: t, style: r, ...o }, c) {
+  let d = r;
+  return d = cn(d, "sand-grid-columns", e), d = C(d, "--sand-grid-gap", me(n)), /* @__PURE__ */ a.jsx("div", { ref: c, className: m(fn.grid, t), style: d, ...o });
+});
+bn.displayName = "SandGrid";
+const hn = f(function({ span: e = 1, className: n, style: t, ...r }, o) {
+  let c = t;
+  return c = cn(c, "sand-grid-span", e), /* @__PURE__ */ a.jsx("div", { ref: o, className: m(fn.item, n), style: c, ...r });
+});
+hn.displayName = "SandGrid.Item";
+const Bs = Object.assign(bn, {
+  Item: hn
+}), he = {
+  "sand-form-group": "_sand-form-group_6kvlc_1",
+  "sand-label": "_sand-label_6kvlc_8",
+  "sand-input": "_sand-input_6kvlc_17",
+  "sand-input-error": "_sand-input-error_6kvlc_37",
+  "sand-helper-text-error": "_sand-helper-text-error_6kvlc_45"
+}, xe = f(function({ label: e, children: n, className: t = "", htmlFor: r, ...o }, c) {
+  return /* @__PURE__ */ a.jsxs("div", { ref: c, className: m(he["sand-form-group"], t), ...o, children: [
+    e && /* @__PURE__ */ a.jsx("label", { className: he["sand-label"], htmlFor: r, children: e }),
+    n
+  ] });
+});
+xe.displayName = "SandFormGroup";
+const vn = f(function({ error: e, className: n = "", ...t }, r) {
+  return /* @__PURE__ */ a.jsx(
+    "input",
+    {
+      ref: r,
+      className: m(he["sand-input"], e && he["sand-input-error"], n),
+      "aria-invalid": e || t["aria-invalid"],
+      ...t
+    }
+  );
+});
+vn.displayName = "SandInput";
+const Qa = f(function({ label: e, helperText: n, error: t, groupClassName: r, className: o = "", "aria-describedby": c, ...d }, l) {
+  const i = O(), _ = d.id ?? i, p = n ? `${_}-help` : void 0, h = E(
+    () => [c, p].filter(Boolean).join(" ") || void 0,
+    [c, p]
+  );
+  return /* @__PURE__ */ a.jsxs(xe, { label: e, className: r, htmlFor: _, children: [
+    /* @__PURE__ */ a.jsx(
+      vn,
+      {
+        ref: l,
+        id: _,
+        error: t,
+        className: o,
+        "aria-describedby": h,
+        ...d
+      }
+    ),
+    n && /* @__PURE__ */ a.jsx("span", { id: p, className: t ? he["sand-helper-text-error"] : "", children: n })
+  ] });
+});
+Qa.displayName = "SandInputGroup";
+const et = {
+  "sand-kbd": "_sand-kbd_mo78g_1"
+}, nt = f(function({ className: e = "", ...n }, t) {
+  return /* @__PURE__ */ a.jsx("kbd", { ref: t, className: m(et["sand-kbd"], e), ...n });
+});
+nt.displayName = "SandKBD";
+const at = "_loader_1onos_1", tt = "_skeleton_1onos_10", yn = {
+  loader: at,
+  skeleton: tt
+}, st = f(function({ size: e = 40, className: n, style: t, ...r }, o) {
+  return /* @__PURE__ */ a.jsx(
+    "span",
+    {
+      ref: o,
+      className: m(yn.loader, n),
+      style: { "--sand-loader-size": `${e}px`, ...t },
+      ...r
+    }
+  );
+});
+st.displayName = "SandLoader";
+const rt = f(function({ width: e = "100%", height: n = 16, radius: t = "md", className: r, style: o, ...c }, d) {
+  return /* @__PURE__ */ a.jsx(
+    "div",
+    {
+      ref: d,
+      "aria-hidden": "true",
+      className: m(yn.skeleton, r),
+      style: {
+        width: e,
+        height: n,
+        "--sand-skeleton-radius": on(t),
+        ...o
+      },
+      ...c
+    }
+  );
+});
+rt.displayName = "SandSkeleton";
+const ot = "_container_x9f0c_1", ct = "_slider_x9f0c_8", it = "_error_x9f0c_43", dt = "_valueDisplay_x9f0c_50", lt = "_helper_x9f0c_58", ae = {
+  container: ot,
+  slider: ct,
+  error: it,
+  valueDisplay: dt,
+  helper: lt,
+  "helper-error": "_helper-error_x9f0c_64"
+}, ut = f(function({ label: e, helperText: n, error: t, className: r = "", ...o }, c) {
+  const d = O(), l = o.id ?? d, i = n ? `${l}-help` : void 0;
+  return /* @__PURE__ */ a.jsxs(xe, { label: e, htmlFor: l, children: [
+    /* @__PURE__ */ a.jsxs("div", { className: ae.container, children: [
+      /* @__PURE__ */ a.jsx(
+        "input",
+        {
+          ref: c,
+          id: l,
+          type: "range",
+          className: m(ae.slider, t && ae.error, r),
+          "aria-invalid": t || void 0,
+          "aria-describedby": i,
+          ...o
+        }
+      ),
+      o.value !== void 0 && /* @__PURE__ */ a.jsx("span", { className: ae.valueDisplay, children: o.value })
+    ] }),
+    n && /* @__PURE__ */ a.jsx("span", { id: i, className: m(ae.helper, t && ae["helper-error"]), children: n })
+  ] });
+});
+ut.displayName = "SandSlider";
+const G = {
+  "sand-container": "_sand-container_plvlx_1",
+  "sand-header": "_sand-header_plvlx_7",
+  "sand-tool-layout": "_sand-tool-layout_plvlx_17",
+  "sand-tool-panel": "_sand-tool-panel_plvlx_24",
+  "sand-result-panel": "_sand-result-panel_plvlx_34",
+  "sand-microservice-layout": "_sand-microservice-layout_plvlx_47",
+  "sand-microservice-sidebar": "_sand-microservice-sidebar_plvlx_54",
+  "sand-microservice-content": "_sand-microservice-content_plvlx_67",
+  "sand-microservice-main": "_sand-microservice-main_plvlx_74"
+}, _t = f(function({ className: e = "", ...n }, t) {
+  return /* @__PURE__ */ a.jsx("div", { ref: t, className: m(G["sand-container"], e), ...n });
+});
+_t.displayName = "SandContainer";
+const pt = f(function({ className: e = "", ...n }, t) {
+  return /* @__PURE__ */ a.jsx("header", { ref: t, className: m(G["sand-header"], e), ...n });
+});
+pt.displayName = "SandHeader";
+const Me = f(
+  function({ className: e = "", ...n }, t) {
+    return /* @__PURE__ */ a.jsx("aside", { ref: t, className: m(G["sand-tool-panel"], e), ...n });
+  }
+);
+Me.displayName = "SandAppLayout.Sidebar";
+const ze = f(
+  function({ className: e = "", ...n }, t) {
+    return /* @__PURE__ */ a.jsx("main", { ref: t, className: m(G["sand-result-panel"], e), ...n });
+  }
+);
+ze.displayName = "SandAppLayout.Main";
+const mt = f(
+  function({ className: e = "", ...n }, t) {
+    return /* @__PURE__ */ a.jsx("div", { ref: t, className: m(G["sand-tool-layout"], e), ...n });
+  }
+), xn = Object.assign(mt, {
+  Sidebar: Me,
+  Main: ze
+});
+xn.displayName = "SandAppLayout";
+const Fs = xn, qs = Me, Vs = ze, gn = f(
+  function({ children: e, className: n = "", ...t }, r) {
+    return /* @__PURE__ */ a.jsx("aside", { ref: r, className: m(G["sand-microservice-sidebar"], n), ...t, children: e });
+  }
+);
+gn.displayName = "SandMicroserviceLayout.Sidebar";
+const Sn = f(
+  function({ children: e, className: n = "", ...t }, r) {
+    return /* @__PURE__ */ a.jsx("div", { ref: r, className: m(G["sand-microservice-content"], n), ...t, children: e });
+  }
+);
+Sn.displayName = "SandMicroserviceLayout.Content";
+const jn = f(
+  function({ children: e, className: n = "", ...t }, r) {
+    return /* @__PURE__ */ a.jsx("main", { ref: r, className: m(G["sand-microservice-main"], n), ...t, children: e });
+  }
+);
+jn.displayName = "SandMicroserviceLayout.Main";
+const we = f(
+  function({ children: e, className: n = "", ...t }, r) {
+    return /* @__PURE__ */ a.jsx("div", { ref: r, className: m(G["sand-microservice-layout"], n), ...t, children: e });
+  }
+);
+we.displayName = "SandMicroserviceLayout";
+we.Sidebar = gn;
+we.Content = Sn;
+we.Main = jn;
+const H = {
+  "sand-modal-root": "_sand-modal-root_1e60v_1",
+  "sand-modal-backdrop": "_sand-modal-backdrop_1e60v_11",
+  "sand-modal-panel": "_sand-modal-panel_1e60v_22",
+  "sand-modal-header": "_sand-modal-header_1e60v_36",
+  "sand-modal-title": "_sand-modal-title_1e60v_45",
+  "sand-modal-description": "_sand-modal-description_1e60v_52",
+  "sand-modal-close": "_sand-modal-close_1e60v_59",
+  "sand-modal-body": "_sand-modal-body_1e60v_78",
+  "sand-modal-footer": "_sand-modal-footer_1e60v_86"
+};
+function Te(s, e) {
+  const { enabled: n, initialFocusRef: t } = e, r = z(null), o = A(
+    (c) => {
+      if (!n || !s.current || c.key !== "Tab")
+        return;
+      const d = ea(s.current);
+      if (d.length === 0) {
+        c.preventDefault(), s.current.focus();
+        return;
+      }
+      const l = d[0], i = d[d.length - 1], _ = document.activeElement;
+      c.shiftKey && _ === l ? (c.preventDefault(), i.focus()) : !c.shiftKey && _ === i && (c.preventDefault(), l.focus());
+    },
+    [n, s]
+  );
+  K(() => {
+    if (!n) {
+      r.current && (r.current.focus(), r.current = null);
+      return;
+    }
+    r.current = document.activeElement instanceof HTMLElement ? document.activeElement : null;
+    const d = setTimeout(() => {
+      const l = t?.current || s.current;
+      l && l.focus();
+    }, 16);
+    return window.addEventListener("keydown", o), () => {
+      window.removeEventListener("keydown", o), clearTimeout(d);
+    };
+  }, [n, o, t, s]);
+}
+const Nn = f(function({ as: e, direction: n = "column", gap: t = "md", align: r, justify: o, wrap: c, surface: d, className: l, style: i, ..._ }, p) {
+  const h = e ?? "div";
+  let v = i;
+  return v = C(v, "--sand-display", "flex"), v = C(v, "--sand-gap", me(t)), v = C(v, "--sand-align", r), v = C(v, "--sand-justify", o), v = C(v, "--sand-stack-direction", n), v = C(v, "--sand-stack-wrap", c ? "wrap" : "nowrap"), /* @__PURE__ */ a.jsx(
+    h,
+    {
+      ref: p,
+      className: m(fe.box, d && fe.surface, l),
+      style: {
+        flexDirection: "var(--sand-stack-direction)",
+        flexWrap: "var(--sand-stack-wrap)",
+        ...v
+      },
+      ..._
+    }
+  );
+});
+Nn.displayName = "SandStack";
+const kn = ye(null);
+function wn() {
+  const s = ve(kn);
+  if (!s)
+    throw new Error("SandModal sub-components must be used within SandModal.");
+  return s;
+}
+const De = f(function({ className: e = "", ...n }, t) {
+  return /* @__PURE__ */ a.jsx("div", { ref: t, className: m(H["sand-modal-header"], e), ...n });
+});
+De.displayName = "SandModal.Header";
+const Pe = f(function({ className: e = "", ...n }, t) {
+  return /* @__PURE__ */ a.jsx("div", { ref: t, className: m(H["sand-modal-body"], e), ...n });
+});
+Pe.displayName = "SandModal.Body";
+const Le = f(function({ className: e = "", ...n }, t) {
+  return /* @__PURE__ */ a.jsx("div", { ref: t, className: m(H["sand-modal-footer"], e), ...n });
+});
+Le.displayName = "SandModal.Footer";
+const Be = f(function({ className: e = "", ...n }, t) {
+  const { titleId: r } = wn();
+  return /* @__PURE__ */ a.jsx("div", { ref: t, id: r, className: m(H["sand-modal-title"], e), ...n });
+});
+Be.displayName = "SandModal.Title";
+const Fe = f(function({ className: e = "", ...n }, t) {
+  const { descriptionId: r } = wn();
+  return /* @__PURE__ */ a.jsx("div", { ref: t, id: r, className: m(H["sand-modal-description"], e), ...n });
+});
+Fe.displayName = "SandModal.Description";
+const Tn = f(function({
+  open: e,
+  isOpen: n,
+  onClose: t,
+  title: r,
+  description: o,
+  footer: c,
+  closeOnOverlay: d = !0,
+  initialFocusRef: l,
+  children: i,
+  className: _ = "",
+  ...p
+}, h) {
+  const v = e ?? n ?? !1, b = O(), g = O(), j = z(null), y = z(null), D = E(
+    () => ({ titleId: b, descriptionId: g }),
+    [g, b]
+  ), P = A(
+    (I) => {
+      y.current = I, typeof h == "function" ? h(I) : h && (h.current = I);
+    },
+    [h]
+  );
+  Te(y, {
+    enabled: v,
+    initialFocusRef: l || j
+  });
+  const Y = A(
+    (I) => {
+      I.key === "Escape" && (I.preventDefault(), t());
+    },
+    [t]
+  );
+  return K(() => {
+    if (!v) return;
+    const I = document.body.style.overflow;
+    return document.body.style.overflow = "hidden", () => {
+      document.body.style.overflow = I;
+    };
+  }, [v]), v ? /* @__PURE__ */ a.jsxs("div", { className: H["sand-modal-root"], onKeyDown: Y, children: [
+    /* @__PURE__ */ a.jsx(
+      "button",
+      {
+        type: "button",
+        className: H["sand-modal-backdrop"],
+        "aria-label": "Close dialog",
+        onClick: d ? t : void 0
+      }
+    ),
+    /* @__PURE__ */ a.jsx(
+      "div",
+      {
+        ref: P,
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-labelledby": r ? b : void 0,
+        "aria-describedby": o ? g : void 0,
+        className: m(H["sand-modal-panel"], _),
+        tabIndex: -1,
+        ...p,
+        children: /* @__PURE__ */ a.jsxs(kn.Provider, { value: D, children: [
+          (r || o) && /* @__PURE__ */ a.jsxs(De, { children: [
+            /* @__PURE__ */ a.jsxs("div", { children: [
+              r && /* @__PURE__ */ a.jsx(Be, { children: r }),
+              o && /* @__PURE__ */ a.jsx(Fe, { children: o })
+            ] }),
+            /* @__PURE__ */ a.jsx(
+              "button",
+              {
+                ref: j,
+                type: "button",
+                className: H["sand-modal-close"],
+                onClick: t,
+                "aria-label": "Close dialog",
+                children: /* @__PURE__ */ a.jsx("span", { className: "material-symbols-rounded", "aria-hidden": "true", children: "close" })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ a.jsx(Pe, { children: i }),
+          c && /* @__PURE__ */ a.jsx(Le, { children: c })
+        ] })
+      }
+    )
+  ] }) : null;
+});
+Tn.displayName = "SandModal";
+const ft = Object.assign(Tn, {
+  Header: De,
+  Body: Pe,
+  Footer: Le,
+  Title: Be,
+  Description: Fe
+});
+function Hs({
+  onConfirm: s,
+  onClose: e,
+  confirmLabel: n = "Confirm",
+  cancelLabel: t = "Cancel",
+  confirmVariant: r = "primary",
+  footer: o,
+  children: c,
+  ...d
+}) {
+  const l = o || /* @__PURE__ */ a.jsxs(Nn, { direction: "row", gap: "sm", justify: "flex-end", children: [
+    /* @__PURE__ */ a.jsx(Ae, { variant: "outline", onClick: e, children: t }),
+    /* @__PURE__ */ a.jsx(Ae, { variant: r, onClick: s, children: n })
+  ] });
+  return /* @__PURE__ */ a.jsx(ft, { onClose: e, footer: l, ...d, children: c });
+}
+const bt = "_navbar_ce3ap_1", ht = "_container_ce3ap_11", vt = "_brand_ce3ap_20", yt = "_links_ce3ap_30", xt = "_link_ce3ap_30", gt = "_linkActive_ce3ap_55", St = "_mobileToggle_ce3ap_64", jt = "_overlay_ce3ap_86", Nt = "_overlayVisible_ce3ap_97", kt = "_drawer_ce3ap_102", wt = "_drawerOpen_ce3ap_118", Tt = "_drawerHeader_ce3ap_122", It = "_drawerTitle_ce3ap_130", Ct = "_drawerClose_ce3ap_136", $t = "_drawerContent_ce3ap_150", R = {
+  navbar: bt,
+  container: ht,
+  brand: vt,
+  links: yt,
+  link: xt,
+  linkActive: gt,
+  mobileToggle: St,
+  overlay: jt,
+  overlayVisible: Nt,
+  drawer: kt,
+  drawerOpen: wt,
+  drawerHeader: Tt,
+  drawerTitle: It,
+  drawerClose: Ct,
+  drawerContent: $t
+}, Oe = () => null;
+Oe.displayName = "SandNavbarItem";
+const Gs = f(function({ brand: e, items: n = [], onMenuClick: t, className: r, children: o, ...c }, d) {
+  const l = [...n];
+  return be.forEach(o, (i) => {
+    X(i) && i.type === Oe && l.push(i.props);
+  }), /* @__PURE__ */ a.jsx("nav", { ref: d, className: m(R.navbar, r), ...c, children: /* @__PURE__ */ a.jsxs("div", { className: R.container, children: [
+    /* @__PURE__ */ a.jsx("div", { className: R.brand, children: e }),
+    /* @__PURE__ */ a.jsxs("div", { className: R.links, children: [
+      l.map((i) => /* @__PURE__ */ a.jsx(
+        "a",
+        {
+          href: i.href,
+          className: m(R.link, i.active && R.linkActive),
+          children: i.label
+        },
+        i.href
+      )),
+      be.map(o, (i) => X(i) && i.type === Oe ? null : i)
+    ] }),
+    /* @__PURE__ */ a.jsx(
+      "button",
+      {
+        type: "button",
+        className: R.mobileToggle,
+        onClick: t,
+        "aria-label": "Toggle menu",
+        children: /* @__PURE__ */ a.jsx(B, { icon: "menu", size: 24 })
+      }
+    )
+  ] }) });
+}), Et = f(function({ open: e, isOpen: n, onClose: t, title: r, children: o, className: c, ...d }, l) {
+  const i = e ?? n ?? !1, _ = z(null), p = z(null), h = A(
+    (b) => {
+      _.current = b, typeof l == "function" ? l(b) : l && (l.current = b);
+    },
+    [l]
+  );
+  Te(_, {
+    enabled: i,
+    initialFocusRef: p
+  });
+  const v = A(
+    (b) => {
+      b.key === "Escape" && (b.preventDefault(), t());
+    },
+    [t]
+  );
+  return K(() => {
+    if (!i) return;
+    const b = document.body.style.overflow;
+    return document.body.style.overflow = "hidden", () => {
+      document.body.style.overflow = b;
+    };
+  }, [i]), /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+    /* @__PURE__ */ a.jsx(
+      "div",
+      {
+        className: m(R.overlay, i && R.overlayVisible),
+        onClick: t,
+        "aria-hidden": "true"
+      }
+    ),
+    /* @__PURE__ */ a.jsxs(
+      "div",
+      {
+        ref: h,
+        className: m(R.drawer, i && R.drawerOpen, c),
+        role: "dialog",
+        "aria-modal": "true",
+        onKeyDown: v,
+        ...d,
+        children: [
+          /* @__PURE__ */ a.jsxs("div", { className: R.drawerHeader, children: [
+            /* @__PURE__ */ a.jsx("div", { className: R.drawerTitle, children: r }),
+            /* @__PURE__ */ a.jsx(
+              "button",
+              {
+                ref: p,
+                type: "button",
+                className: R.drawerClose,
+                onClick: t,
+                "aria-label": "Close menu",
+                children: /* @__PURE__ */ a.jsx(B, { icon: "close", size: 24 })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ a.jsx("div", { className: R.drawerContent, children: o })
+        ]
+      }
+    )
+  ] });
+});
+Et.displayName = "SandDrawer";
+const ue = {
+  "sand-pagination": "_sand-pagination_cizv5_1",
+  "sand-page-btn": "_sand-page-btn_cizv5_8",
+  "sand-page-btn-active": "_sand-page-btn-active_cizv5_36"
+}, Rt = f(function({ currentPage: e, totalPages: n, onPageChange: t, className: r = "", ...o }, c) {
+  const d = E(() => Array.from({ length: n }, (_, p) => p + 1), [n]), l = A(
+    (_) => {
+      _ < 1 || _ > n || _ === e || t?.(_);
+    },
+    [e, t, n]
+  ), i = A(
+    (_) => {
+      ke(_, e - 1, n, (p) => l(p + 1));
+    },
+    [e, l, n]
+  );
+  return /* @__PURE__ */ a.jsxs(
+    "nav",
+    {
+      ref: c,
+      "aria-label": "Pagination",
+      className: m(ue["sand-pagination"], r),
+      onKeyDown: i,
+      ...o,
+      children: [
+        /* @__PURE__ */ a.jsx(
+          "button",
+          {
+            type: "button",
+            className: ue["sand-page-btn"],
+            disabled: e === 1,
+            "aria-label": "Previous page",
+            onClick: () => l(e - 1),
+            children: /* @__PURE__ */ a.jsx("span", { className: "material-symbols-rounded", "aria-hidden": "true", children: "chevron_left" })
+          }
+        ),
+        d.map((_) => /* @__PURE__ */ a.jsx(
+          "button",
+          {
+            type: "button",
+            "aria-current": _ === e ? "page" : void 0,
+            "aria-label": `Page ${_}`,
+            className: m(ue["sand-page-btn"], _ === e && ue["sand-page-btn-active"]),
+            onClick: () => l(_),
+            children: _
+          },
+          _
+        )),
+        /* @__PURE__ */ a.jsx(
+          "button",
+          {
+            type: "button",
+            className: ue["sand-page-btn"],
+            disabled: e === n,
+            "aria-label": "Next page",
+            onClick: () => l(e + 1),
+            children: /* @__PURE__ */ a.jsx("span", { className: "material-symbols-rounded", "aria-hidden": "true", children: "chevron_right" })
+          }
+        )
+      ]
+    }
+  );
+});
+Rt.displayName = "SandPagination";
+function In(s = {}) {
+  const { isOpen: e, defaultIsOpen: n, onClose: t, onOpen: r } = s, [o, c] = F(n || !1), d = e !== void 0, l = d ? e : o, i = A(() => {
+    d || c(!0), r?.();
+  }, [d, r]), _ = A(() => {
+    d || c(!1), t?.();
+  }, [d, t]), p = A(() => {
+    l ? _() : i();
+  }, [l, i, _]);
+  return {
+    isOpen: l,
+    onOpen: i,
+    onClose: _,
+    onToggle: p,
+    setIsOpen: c
+  };
+}
+const At = "_content_1b598_1", Ot = {
+  content: At
+}, Cn = ye(null), $n = () => {
+  const s = ve(Cn);
+  if (!s) throw new Error("Popover components must be used within SandPopover");
+  return s;
+};
+function qe({ children: s, defaultOpen: e, open: n, onOpenChange: t }) {
+  const r = O(), o = z(null), { isOpen: c, onClose: d, onToggle: l } = In({
+    isOpen: n,
+    defaultIsOpen: e,
+    onClose: () => t?.(!1),
+    onOpen: () => t?.(!0)
+  }), i = E(() => ({
+    isOpen: c,
+    onClose: d,
+    onToggle: l,
+    triggerRef: o,
+    popoverId: r
+  }), [c, d, l, r]);
+  return /* @__PURE__ */ a.jsx(Cn.Provider, { value: i, children: s });
+}
+function Mt({ children: s }) {
+  const { onToggle: e, isOpen: n, triggerRef: t, popoverId: r } = $n();
+  return X(s) ? sn(s, {
+    ref: t,
+    onClick: (o) => {
+      s.props.onClick?.(o), e();
+    },
+    "aria-haspopup": "dialog",
+    "aria-expanded": n,
+    "aria-controls": r
+  }) : s;
+}
+const zt = f(function({ children: e, width: n, className: t = "", style: r, ...o }, c) {
+  const { isOpen: d, onClose: l, triggerRef: i, popoverId: _ } = $n(), p = z(null);
+  return Te(p, { enabled: d }), K(() => {
+    if (!d) return;
+    const h = (v) => {
+      v instanceof KeyboardEvent && v.key === "Escape" && (l(), i.current?.focus()), v instanceof MouseEvent && p.current && !p.current.contains(v.target) && i.current && !i.current.contains(v.target) && l();
+    };
+    return document.addEventListener("mousedown", h), document.addEventListener("keydown", h), () => {
+      document.removeEventListener("mousedown", h), document.removeEventListener("keydown", h);
+    };
+  }, [d, l, i]), d ? rn(
+    /* @__PURE__ */ a.jsx(
+      "div",
+      {
+        ref: (h) => {
+          p.current = h, typeof c == "function" ? c(h) : c && (c.current = h);
+        },
+        id: _,
+        role: "dialog",
+        className: m(Ot.content, t),
+        style: {
+          width: n,
+          ...r
+        },
+        ...o,
+        children: e
+      }
+    ),
+    document.body
+  ) : null;
+});
+qe.Trigger = Mt;
+qe.Content = zt;
+qe.displayName = "SandPopover";
+const Dt = "_track_1b1ni_1", Pt = "_bar_1b1ni_8", Lt = "_ring_1b1ni_15", Bt = "_ringTrack_1b1ni_19", Ft = "_ringValue_1b1ni_24", qt = "_label_1b1ni_32", te = {
+  track: Dt,
+  bar: Pt,
+  ring: Lt,
+  ringTrack: Bt,
+  ringValue: Ft,
+  label: qt
+};
+function Vt(s, e) {
+  return Math.min(Math.max(s, 0), e);
+}
+const Ht = f(function({ value: e, max: n = 100, size: t = 96, thickness: r = 8, variant: o = "linear", showValue: c, className: d, style: l, ...i }, _) {
+  const p = Vt(e, n), h = p / n * 100;
+  if (o === "circular") {
+    const v = (t - r) / 2, b = 2 * Math.PI * v, g = b - h / 100 * b;
+    return /* @__PURE__ */ a.jsxs(
+      "div",
+      {
+        ref: _,
+        role: "progressbar",
+        "aria-valuemin": 0,
+        "aria-valuemax": n,
+        "aria-valuenow": p,
+        className: m(d),
+        style: { position: "relative", width: t, height: t, ...l },
+        ...i,
+        children: [
+          /* @__PURE__ */ a.jsxs("svg", { className: te.ring, width: t, height: t, viewBox: `0 0 ${t} ${t}`, children: [
+            /* @__PURE__ */ a.jsx("circle", { className: te.ringTrack, cx: t / 2, cy: t / 2, r: v, strokeWidth: r }),
+            /* @__PURE__ */ a.jsx(
+              "circle",
+              {
+                className: te.ringValue,
+                cx: t / 2,
+                cy: t / 2,
+                r: v,
+                strokeWidth: r,
+                strokeDasharray: b,
+                strokeDashoffset: g
+              }
+            )
+          ] }),
+          c && /* @__PURE__ */ a.jsxs("span", { className: te.label, children: [
+            Math.round(h),
+            "%"
+          ] })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ a.jsx(
+    "div",
+    {
+      ref: _,
+      role: "progressbar",
+      "aria-valuemin": 0,
+      "aria-valuemax": n,
+      "aria-valuenow": p,
+      className: m(te.track, d),
+      style: { height: r, ...l },
+      ...i,
+      children: /* @__PURE__ */ a.jsx("div", { className: te.bar, style: { width: `${h}%` } })
+    }
+  );
+});
+Ht.displayName = "SandProgress";
+const Gt = "_container_15onh_1", Kt = "_nativeSelect_15onh_6", Yt = "_trigger_15onh_18", Wt = "_triggerActive_15onh_43", Ut = "_error_15onh_47", Jt = "_value_15onh_55", Xt = "_placeholder_15onh_62", Zt = "_chevron_15onh_66", Qt = "_chevronOpen_15onh_72", es = "_listbox_15onh_76", ns = "_option_15onh_93", as = "_optionSelected_15onh_109", ts = "_optionDisabled_15onh_118", ss = "_checkIcon_15onh_124", rs = "_helper_15onh_128", $ = {
+  container: Gt,
+  nativeSelect: Kt,
+  trigger: Yt,
+  triggerActive: Wt,
+  error: Ut,
+  value: Jt,
+  placeholder: Xt,
+  chevron: Zt,
+  chevronOpen: Qt,
+  listbox: es,
+  option: ns,
+  optionSelected: as,
+  optionDisabled: ts,
+  checkIcon: ss,
+  helper: rs,
+  "helper-error": "_helper-error_15onh_134"
+}, os = f(function({ label: e, helperText: n, error: t, options: r = [], placeholder: o = "Select an option...", value: c, defaultValue: d, onChange: l, className: i = "", ..._ }, p) {
+  const h = O(), v = _.id ?? h, b = n ? `${v}-help` : void 0, [g, j] = F(d ?? c ?? ""), { isOpen: y, onOpen: D, onClose: P, onToggle: Y } = In(), I = z(null), Z = z(null), W = z(null), oe = r.find((S) => S.value === (c ?? g)), U = A((S) => {
+    j(S), l?.(S), P(), W.current?.focus();
+  }, [l, P]);
+  Te(Z, { enabled: y }), K(() => {
+    if (!y) return;
+    const S = (q) => {
+      I.current && !I.current.contains(q.target) && P();
+    };
+    return document.addEventListener("mousedown", S), () => document.removeEventListener("mousedown", S);
+  }, [y, P]);
+  const Ce = (S) => {
+    S.key === "Escape" && (P(), W.current?.focus()), S.key === "ArrowDown" && !y && D();
+  };
+  return /* @__PURE__ */ a.jsxs(xe, { label: e, htmlFor: v, children: [
+    /* @__PURE__ */ a.jsxs("div", { ref: I, className: $.container, onKeyDown: Ce, children: [
+      /* @__PURE__ */ a.jsxs(
+        "select",
+        {
+          ref: p,
+          id: v,
+          value: c ?? g,
+          onChange: (S) => U(S.target.value),
+          className: $.nativeSelect,
+          tabIndex: -1,
+          "aria-hidden": "true",
+          ..._,
+          children: [
+            /* @__PURE__ */ a.jsx("option", { value: "", disabled: !0, children: o }),
+            r.map((S) => /* @__PURE__ */ a.jsx("option", { value: S.value, disabled: S.disabled, children: S.label }, S.value))
+          ]
+        }
+      ),
+      /* @__PURE__ */ a.jsxs(
+        "button",
+        {
+          ref: W,
+          type: "button",
+          "aria-haspopup": "listbox",
+          "aria-expanded": y,
+          "aria-labelledby": `${v}-label`,
+          className: m(
+            $.trigger,
+            t && $.error,
+            y && $.triggerActive,
+            i
+          ),
+          onClick: Y,
+          children: [
+            /* @__PURE__ */ a.jsx("span", { className: m($.value, !oe && $.placeholder), children: oe ? oe.label : o }),
+            /* @__PURE__ */ a.jsx(B, { icon: "expand_more", size: 20, className: m($.chevron, y && $.chevronOpen) })
+          ]
+        }
+      ),
+      y && /* @__PURE__ */ a.jsx(
+        "ul",
+        {
+          ref: Z,
+          role: "listbox",
+          className: $.listbox,
+          "aria-labelledby": `${v}-label`,
+          children: r.map((S) => {
+            const q = S.value === (c ?? g);
+            return /* @__PURE__ */ a.jsxs(
+              "li",
+              {
+                role: "option",
+                "aria-selected": q,
+                className: m(
+                  $.option,
+                  q && $.optionSelected,
+                  S.disabled && $.optionDisabled
+                ),
+                onClick: () => !S.disabled && U(S.value),
+                tabIndex: S.disabled ? void 0 : 0,
+                onKeyDown: (Q) => {
+                  (Q.key === "Enter" || Q.key === " ") && (Q.preventDefault(), !S.disabled && U(S.value));
+                },
+                children: [
+                  S.label,
+                  q && /* @__PURE__ */ a.jsx(B, { icon: "check", size: 18, className: $.checkIcon })
+                ]
+              },
+              S.value
+            );
+          })
+        }
+      )
+    ] }),
+    n && /* @__PURE__ */ a.jsx("span", { id: b, className: m($.helper, t && $["helper-error"]), children: n })
+  ] });
+});
+os.displayName = "SandSelect";
+const T = {
+  "sand-choice-group": "_sand-choice-group_viqgz_1",
+  "sand-choice-row": "_sand-choice-row_viqgz_7",
+  "sand-choice-input": "_sand-choice-input_viqgz_16",
+  "sand-choice-control": "_sand-choice-control_viqgz_22",
+  "sand-checkbox": "_sand-checkbox_viqgz_41",
+  "sand-checkbox-icon": "_sand-checkbox-icon_viqgz_59",
+  "sand-radio": "_sand-radio_viqgz_76",
+  "sand-switch": "_sand-switch_viqgz_94",
+  "sand-choice-content": "_sand-choice-content_viqgz_123",
+  "sand-choice-label": "_sand-choice-label_viqgz_129",
+  "sand-choice-description": "_sand-choice-description_viqgz_134"
+}, Ve = ({ label: s, description: e }) => /* @__PURE__ */ a.jsxs("span", { className: T["sand-choice-content"], children: [
+  /* @__PURE__ */ a.jsx("span", { className: T["sand-choice-label"], children: s }),
+  e && /* @__PURE__ */ a.jsx("span", { className: T["sand-choice-description"], children: e })
+] }), En = f(function({ label: e, description: n, id: t, className: r = "", ...o }, c) {
+  const d = O(), l = t ?? d;
+  return /* @__PURE__ */ a.jsxs("label", { className: m(T["sand-choice-row"], r), htmlFor: l, children: [
+    /* @__PURE__ */ a.jsx("input", { ref: c, id: l, type: "checkbox", className: T["sand-choice-input"], ...o }),
+    /* @__PURE__ */ a.jsx("span", { className: m(T["sand-choice-control"], T["sand-checkbox"]), "aria-hidden": "true", children: /* @__PURE__ */ a.jsx("span", { className: m(T["sand-checkbox-icon"], "material-symbols-rounded"), children: "check" }) }),
+    /* @__PURE__ */ a.jsx(Ve, { label: e, description: n })
+  ] });
+});
+En.displayName = "SandCheckbox";
+const Rn = f(function({ label: e, description: n, id: t, className: r = "", onKeyDown: o, ...c }, d) {
+  const l = O(), i = t ?? l, _ = (p) => {
+    if (o?.(p), p.defaultPrevented || !c.name)
+      return;
+    const h = Array.from(
+      document.querySelectorAll(`input[type="radio"][name="${c.name}"]`)
+    ), v = h.findIndex((b) => b.id === i);
+    ke(p, v, h.length, (b) => {
+      h[b]?.focus(), h[b]?.click();
+    });
+  };
+  return /* @__PURE__ */ a.jsxs("label", { className: m(T["sand-choice-row"], r), htmlFor: i, children: [
+    /* @__PURE__ */ a.jsx("input", { ref: d, id: i, type: "radio", className: T["sand-choice-input"], onKeyDown: _, ...c }),
+    /* @__PURE__ */ a.jsx("span", { className: m(T["sand-choice-control"], T["sand-radio"]), "aria-hidden": "true" }),
+    /* @__PURE__ */ a.jsx(Ve, { label: e, description: n })
+  ] });
+});
+Rn.displayName = "SandRadio";
+const An = f(function({ label: e, description: n, id: t, className: r = "", ...o }, c) {
+  const d = O(), l = t ?? d;
+  return /* @__PURE__ */ a.jsxs("label", { className: m(T["sand-choice-row"], r), htmlFor: l, children: [
+    /* @__PURE__ */ a.jsx("input", { ref: c, id: l, type: "checkbox", role: "switch", className: T["sand-choice-input"], ...o }),
+    /* @__PURE__ */ a.jsx("span", { className: m(T["sand-choice-control"], T["sand-switch"]), "aria-hidden": "true" }),
+    /* @__PURE__ */ a.jsx(Ve, { label: e, description: n })
+  ] });
+});
+An.displayName = "SandSwitch";
+const cs = f(function({ className: e = "", label: n, options: t = [], type: r = "radio", name: o, value: c, onChange: d, children: l, ...i }, _) {
+  const p = O(), h = o ?? p, v = (b) => {
+    if (r === "checkbox" || r === "switch") {
+      const g = Array.isArray(c) ? c : [], j = g.includes(b) ? g.filter((y) => y !== b) : [...g, b];
+      d?.(j);
+    } else
+      d?.(b);
+  };
+  return /* @__PURE__ */ a.jsxs("div", { ref: _, role: "group", "aria-label": typeof n == "string" ? n : void 0, className: m(T["sand-choice-group"], e), ...i, children: [
+    n && /* @__PURE__ */ a.jsx("div", { className: T["sand-choice-group-label"], children: n }),
+    /* @__PURE__ */ a.jsxs("div", { className: T["sand-choice-group-content"], children: [
+      t.map((b) => {
+        const g = Array.isArray(c) ? c.includes(b.value) : c === b.value, j = {
+          key: b.value,
+          name: h,
+          label: b.label,
+          description: b.description,
+          disabled: b.disabled,
+          checked: g,
+          onChange: () => v(b.value)
+        };
+        return r === "checkbox" ? /* @__PURE__ */ a.jsx(En, { ...j }) : r === "switch" ? /* @__PURE__ */ a.jsx(An, { ...j }) : /* @__PURE__ */ a.jsx(Rn, { ...j });
+      }),
+      l
+    ] })
+  ] });
+});
+cs.displayName = "SandChoiceGroup";
+const is = "_wrapper_1142m_1", ds = "_table_1142m_9", ls = "_stickyHeader_1142m_36", us = "_striped_1142m_42", _s = "_hoverable_1142m_50", _e = {
+  wrapper: is,
+  table: ds,
+  stickyHeader: ls,
+  striped: us,
+  hoverable: _s
+}, ps = f(function({ striped: e, hoverable: n = !0, stickyHeader: t, className: r, wrapperProps: o, items: c, data: d, children: l, ...i }, _) {
+  const p = c ?? d;
+  return /* @__PURE__ */ a.jsx("div", { ...o, className: m(_e.wrapper, o?.className), children: /* @__PURE__ */ a.jsxs(
+    "table",
+    {
+      ref: _,
+      className: m(_e.table, e && _e.striped, n && _e.hoverable, t && _e.stickyHeader, r),
+      ...i,
+      children: [
+        l,
+        p && !l && /* @__PURE__ */ a.jsx("tbody", { children: p.map((h, v) => /* @__PURE__ */ a.jsx("tr", { children: Object.values(h).map((b, g) => /* @__PURE__ */ a.jsx("td", { children: b }, g)) }, v)) })
+      ]
+    }
+  ) });
+}), On = f(
+  ({ children: s, ...e }, n) => /* @__PURE__ */ a.jsx("thead", { ref: n, ...e, children: s })
+);
+On.displayName = "SandTable.Header";
+const Mn = f(
+  ({ children: s, ...e }, n) => /* @__PURE__ */ a.jsx("tbody", { ref: n, ...e, children: s })
+);
+Mn.displayName = "SandTable.Body";
+const zn = f(
+  ({ children: s, ...e }, n) => /* @__PURE__ */ a.jsx("tr", { ref: n, ...e, children: s })
+);
+zn.displayName = "SandTable.Row";
+const Dn = f(
+  ({ children: s, ...e }, n) => /* @__PURE__ */ a.jsx("td", { ref: n, ...e, children: s })
+);
+Dn.displayName = "SandTable.Cell";
+const Pn = f(
+  ({ children: s, ...e }, n) => /* @__PURE__ */ a.jsx("th", { ref: n, ...e, children: s })
+);
+Pn.displayName = "SandTable.HeaderCell";
+const Ks = Object.assign(ps, {
+  Header: On,
+  Body: Mn,
+  Row: zn,
+  Cell: Dn,
+  HeaderCell: Pn
+}), ms = "_textarea_14lbs_1", fs = "_error_14lbs_23", bs = "_helper_14lbs_31", pe = {
+  textarea: ms,
+  error: fs,
+  helper: bs,
+  "helper-error": "_helper-error_14lbs_37",
+  "resize-none": "_resize-none_14lbs_42",
+  "resize-both": "_resize-both_14lbs_46",
+  "resize-horizontal": "_resize-horizontal_14lbs_50",
+  "resize-vertical": "_resize-vertical_14lbs_54"
+}, hs = f(function({ label: e, helperText: n, error: t, resize: r = "vertical", className: o = "", ...c }, d) {
+  const l = O(), i = c.id ?? l, _ = n ? `${i}-help` : void 0;
+  return /* @__PURE__ */ a.jsxs(xe, { label: e, htmlFor: i, children: [
+    /* @__PURE__ */ a.jsx(
+      "textarea",
+      {
+        ref: d,
+        id: i,
+        className: m(
+          pe.textarea,
+          t && pe.error,
+          pe[`resize-${r}`],
+          o
+        ),
+        "aria-invalid": t || void 0,
+        "aria-describedby": _,
+        ...c
+      }
+    ),
+    n && /* @__PURE__ */ a.jsx("span", { id: _, className: m(pe.helper, t && pe["helper-error"]), children: n })
+  ] });
+});
+hs.displayName = "SandTextarea";
+const vs = "_root_yi163_1", ys = "_list_yi163_6", xs = "_trigger_yi163_18", gs = "_active_yi163_41", Ss = "_indicator_yi163_45", js = "_panel_yi163_57", L = {
+  root: vs,
+  list: ys,
+  trigger: xs,
+  active: gs,
+  indicator: Ss,
+  panel: js
+}, He = () => null;
+He.displayName = "SandTabItem";
+const Ln = ye(void 0);
+function Bn() {
+  const s = ve(Ln);
+  if (!s)
+    throw new Error("Tabs components must be used within a SandTabs component");
+  return s;
+}
+function Ie({ items: s = [], defaultValue: e, value: n, onChange: t, className: r, children: o, ...c }) {
+  const d = O(), l = E(() => {
+    const y = [...s];
+    return be.forEach(o, (D) => {
+      X(D) && D.type === He && y.push(D.props);
+    }), y;
+  }, [s, o]), [i, _] = F(e ?? l[0]?.id), p = n ?? i, h = A((y) => {
+    _(y), t?.(y);
+  }, [t]), v = E(() => ({
+    activeId: p,
+    setActiveId: h,
+    baseId: d
+  }), [p, h, d]), b = Math.max(l.findIndex((y) => y.id === p), 0), g = E(
+    () => ({
+      "--sand-tabs-left": `calc(4px + ${b} * (100% - 8px) / ${Math.max(l.length, 1)})`,
+      "--sand-tabs-width": `calc((100% - 8px) / ${Math.max(l.length, 1)})`
+    }),
+    [b, l.length]
+  ), j = l.length > 0;
+  return /* @__PURE__ */ a.jsx(Ln.Provider, { value: v, children: /* @__PURE__ */ a.jsx("div", { className: m(L.root, r), ...c, children: j ? /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+    /* @__PURE__ */ a.jsxs("div", { role: "tablist", "aria-label": "Tabs", className: L.list, style: g, children: [
+      /* @__PURE__ */ a.jsx("span", { "aria-hidden": "true", className: L.indicator }),
+      l.map((y, D) => {
+        const P = `${d}-tab-${y.id}`, Y = `${d}-panel-${y.id}`, I = y.id === p;
+        return /* @__PURE__ */ a.jsx(
+          "button",
+          {
+            id: P,
+            role: "tab",
+            type: "button",
+            tabIndex: I ? 0 : -1,
+            "aria-selected": I,
+            "aria-controls": Y,
+            className: m(L.trigger, I && L.active),
+            onClick: () => h(y.id),
+            onKeyDown: (Z) => ke(Z, D, l.length, (W) => h(l[W].id)),
+            children: y.label
+          },
+          y.id
+        );
+      })
+    ] }),
+    l[b] && /* @__PURE__ */ a.jsx(
+      "div",
+      {
+        id: `${d}-panel-${l[b].id}`,
+        role: "tabpanel",
+        "aria-labelledby": `${d}-tab-${l[b].id}`,
+        className: L.panel,
+        children: l[b].content
+      }
+    )
+  ] }) : o }) });
+}
+const Fn = ({ children: s, className: e, style: n, ...t }) => /* @__PURE__ */ a.jsx("div", { role: "tablist", className: m(L.list, e), style: n, ...t, children: s });
+Fn.displayName = "SandTabs.List";
+const qn = ({ value: s, children: e, className: n, ...t }) => {
+  const { activeId: r, setActiveId: o, baseId: c } = Bn(), d = r === s;
+  return /* @__PURE__ */ a.jsx(
+    "button",
+    {
+      role: "tab",
+      type: "button",
+      id: `${c}-tab-${s}`,
+      "aria-selected": d,
+      "aria-controls": `${c}-panel-${s}`,
+      tabIndex: d ? 0 : -1,
+      className: m(L.trigger, d && L.active, n),
+      onClick: () => o(s),
+      ...t,
+      children: e
+    }
+  );
+};
+qn.displayName = "SandTabs.Trigger";
+const Vn = ({ value: s, children: e, className: n, ...t }) => {
+  const { activeId: r, baseId: o } = Bn();
+  return r === s ? /* @__PURE__ */ a.jsx(
+    "div",
+    {
+      role: "tabpanel",
+      id: `${o}-panel-${s}`,
+      "aria-labelledby": `${o}-tab-${s}`,
+      className: m(L.panel, n),
+      ...t,
+      children: e
+    }
+  ) : null;
+};
+Vn.displayName = "SandTabs.Panel";
+Ie.List = Fn;
+Ie.Trigger = qn;
+Ie.Panel = Vn;
+Ie.Item = He;
+const Hn = ye(null);
+function an(s) {
+  return s !== "system" ? s : typeof window > "u" || typeof window.matchMedia != "function" ? "light" : window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+}
+function Ns(s) {
+  if (!s)
+    return;
+  const e = {};
+  return s.accent && (e["--sand-accent"] = s.accent), s.accentDark && (e["--sand-accent-dark"] = s.accentDark), s.surface && (e["--theme-surface"] = s.surface), s.surfaceVariant && (e["--theme-surface-variant"] = s.surfaceVariant), s.text && (e["--theme-text"] = s.text), s.textMuted && (e["--theme-text-muted"] = s.textMuted), s.border && (e["--theme-border"] = s.border), s.shadowSm && (e["--shadow-sm"] = s.shadowSm), s.shadowMd && (e["--shadow-md"] = s.shadowMd), s.shadowLg && (e["--shadow-lg"] = s.shadowLg), e;
+}
+function Ys({
+  children: s,
+  defaultTheme: e = "system",
+  theme: n,
+  tokens: t,
+  className: r,
+  root: o = !1
+}) {
+  const [c, d] = F(e), l = n ?? c, i = an(l);
+  K(() => {
+    !o || typeof document > "u" || (document.documentElement.dataset.theme = i);
+  }, [i, o]);
+  const _ = E(
+    () => ({
+      theme: l,
+      resolvedTheme: i,
+      setTheme: d,
+      toggleTheme: () => d((p) => an(p) === "dark" ? "light" : "dark")
+    }),
+    [i, l]
+  );
+  return /* @__PURE__ */ a.jsx(Hn.Provider, { value: _, children: /* @__PURE__ */ a.jsx("div", { className: r, "data-theme": i, style: Ns(t), children: s }) });
+}
+function Ws() {
+  const s = ve(Hn);
+  if (!s)
+    throw new Error("useSandTheme must be used within SandThemeProvider.");
+  return s;
+}
+const ks = "_title_huapx_1", ws = "_text_huapx_8", Ts = "_code_huapx_14", Is = "_gradient_huapx_25", Cs = "_muted_huapx_31", J = {
+  title: ks,
+  text: ws,
+  code: Ts,
+  gradient: Is,
+  muted: Cs
+}, Ge = {
+  regular: 400,
+  medium: 500,
+  semibold: 600,
+  bold: 700
+}, $s = {
+  xs: "1rem",
+  sm: "1.25rem",
+  md: "1.5rem",
+  lg: "2rem",
+  xl: "2.75rem",
+  display: "clamp(3rem, 6vw, 4.75rem)"
+}, Gn = {
+  xs: "0.75rem",
+  sm: "0.875rem",
+  md: "1rem",
+  lg: "1.125rem",
+  xl: "1.25rem"
+}, Es = f(function({ as: e, level: n = 2, size: t = "lg", weight: r = "semibold", gradient: o, muted: c, className: d, style: l, ...i }, _) {
+  const p = e ?? `h${n}`;
+  return /* @__PURE__ */ a.jsx(
+    p,
+    {
+      ref: _,
+      className: m(J.title, o && J.gradient, c && J.muted, d),
+      style: { fontSize: $s[t], fontWeight: Ge[r], ...l },
+      ...i
+    }
+  );
+});
+Es.displayName = "SandTitle";
+const Rs = f(function({ as: e, size: n = "md", weight: t = "regular", gradient: r, muted: o, className: c, style: d, ...l }, i) {
+  const _ = e ?? "p";
+  return /* @__PURE__ */ a.jsx(
+    _,
+    {
+      ref: i,
+      className: m(J.text, r && J.gradient, o && J.muted, c),
+      style: { fontSize: Gn[n], fontWeight: Ge[t], ...d },
+      ...l
+    }
+  );
+});
+Rs.displayName = "SandText";
+const As = f(function({ as: e, block: n, size: t = "sm", weight: r = "medium", className: o, style: c, ...d }, l) {
+  const i = e ?? (n ? "pre" : "code");
+  return /* @__PURE__ */ a.jsx(
+    i,
+    {
+      ref: l,
+      className: m(J.code, o),
+      style: {
+        fontSize: Gn[t],
+        fontWeight: Ge[r],
+        display: n ? "block" : void 0,
+        whiteSpace: n ? "pre-wrap" : void 0,
+        ...c
+      },
+      ...d
+    }
+  );
+});
+As.displayName = "SandCode";
+const Os = "_trigger_ehjfy_1", Ms = "_content_ehjfy_5", tn = {
+  trigger: Os,
+  content: Ms
+};
+function Us({ content: s, title: e, children: n }) {
+  const t = O(), [r, o] = F(null), c = s ?? e;
+  if (!X(n))
+    return null;
+  const d = (i) => {
+    const _ = i.getBoundingClientRect();
+    o({
+      top: _.bottom + 10,
+      left: _.left + _.width / 2
+    });
+  }, l = sn(n, {
+    "aria-describedby": t,
+    onMouseEnter: (i) => {
+      d(i.currentTarget), n.props.onMouseEnter?.(i);
+    },
+    onMouseLeave: (i) => {
+      o(null), n.props.onMouseLeave?.(i);
+    },
+    onFocus: (i) => {
+      d(i.currentTarget), n.props.onFocus?.(i);
+    },
+    onBlur: (i) => {
+      o(null), n.props.onBlur?.(i);
+    }
+  });
+  return /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+    /* @__PURE__ */ a.jsx("span", { className: tn.trigger, children: l }),
+    r && typeof document < "u" ? rn(
+      /* @__PURE__ */ a.jsx(
+        "div",
+        {
+          id: t,
+          role: "tooltip",
+          className: tn.content,
+          style: { top: r.top, left: r.left, transform: "translateX(-50%)" },
+          children: c
+        }
+      ),
+      document.body
+    ) : null
+  ] });
+}
+function Js(s) {
+  const { value: e, defaultValue: n, onChange: t } = s, [r, o] = F(n), c = e !== void 0, d = c ? e : r, l = z(t);
+  K(() => {
+    l.current = t;
+  });
+  const i = A(
+    (_) => {
+      const p = typeof _ == "function" ? _(d) : _;
+      c || o(p), l.current?.(p);
+    },
+    [c, d]
+  );
+  return [d, i];
+}
+const Ne = {
+  sm: 640,
+  md: 768,
+  lg: 1024,
+  xl: 1280
+};
+function Xs() {
+  const [s, e] = F("base");
+  return K(() => {
+    const n = () => {
+      const t = window.innerWidth;
+      t >= Ne.xl ? e("xl") : t >= Ne.lg ? e("lg") : t >= Ne.md ? e("md") : t >= Ne.sm ? e("sm") : e("base");
+    };
+    return n(), window.addEventListener("resize", n), () => window.removeEventListener("resize", n);
+  }, []), s;
+}
+export {
+  Sa as SandAccordion,
+  ln as SandAccordionItem,
+  ia as SandAlert,
+  xn as SandAppLayout,
+  Ta as SandAvatar,
+  Ia as SandAvatarGroup,
+  Ca as SandBadge,
+  za as SandBox,
+  un as SandBreadcrumbItem,
+  $a as SandBreadcrumbs,
+  Ae as SandButton,
+  qa as SandCard,
+  En as SandCheckbox,
+  _n as SandChip,
+  cs as SandChoiceGroup,
+  As as SandCode,
+  pn as SandCodeBlock,
+  Ga as SandCodeTabs,
+  _t as SandContainer,
+  Hs as SandDialog,
+  Ya as SandDivider,
+  Et as SandDrawer,
+  xe as SandFormGroup,
+  Bs as SandGrid,
+  pt as SandHeader,
+  B as SandIcon,
+  Ps as SandIconProvider,
+  vn as SandInput,
+  Qa as SandInputGroup,
+  nt as SandKBD,
+  st as SandLoader,
+  we as SandMicroserviceLayout,
+  ft as SandModal,
+  Gs as SandNavbar,
+  Oe as SandNavbarItem,
+  Rt as SandPagination,
+  qe as SandPopover,
+  zt as SandPopoverContent,
+  Mt as SandPopoverTrigger,
+  Ht as SandProgress,
+  Rn as SandRadio,
+  Vs as SandResultPanel,
+  os as SandSelect,
+  rt as SandSkeleton,
+  ut as SandSlider,
+  Ja as SandSnackbar,
+  Nn as SandStack,
+  An as SandSwitch,
+  He as SandTabItem,
+  Ks as SandTable,
+  Ie as SandTabs,
+  Ls as SandTag,
+  Rs as SandText,
+  hs as SandTextarea,
+  Ys as SandThemeProvider,
+  Es as SandTitle,
+  Ua as SandToast,
+  Fs as SandToolLayout,
+  qs as SandToolPanel,
+  Us as SandTooltip,
+  Xs as useBreakpoint,
+  Js as useControllableState,
+  In as useDisclosure,
+  Te as useFocusTrap,
+  na as useSandIcon,
+  Ws as useSandTheme
+};