@sandurtech/sandui 0.0.1

package/README.md

@@ -0,0 +1,64 @@
+# SandUI
+
+SandUI is the SandurTech React component library. This release resets the package for a clean-slate `0.0.1` publish using Vite library mode, TypeScript declaration output, and bundled SCSS.
+
+## Installation
+
+```bash
+npm install @sandurtech/sandui
+```
+
+Peer dependencies:
+
+- `react >=18`
+- `react-dom >=18`
+
+## Usage
+
+```tsx
+import { SandButton, SandCard, SandInputGroup } from '@sandurtech/sandui';
+import '@sandurtech/sandui/style.css';
+
+export function Example() {
+  return (
+    <SandCard header="Launch">
+      <SandInputGroup label="Project name" />
+      <SandButton>Deploy</SandButton>
+    </SandCard>
+  );
+}
+```
+
+## Development
+
+```bash
+npm ci
+npm run test
+npm run build
+```
+
+## Build Output
+
+The package publishes:
+
+- ESM bundle: `dist/sandui.js`
+- UMD bundle: `dist/sandui.umd.js`
+- Types: `dist/index.d.ts`
+- Styles: `dist/style.css`
+
+## V2 Migration
+
+The previous SandUI package line published `0.1.x` APIs before this reset. The new `0.0.1` line keeps the scoped package name but treats the component surface as a clean restart.
+
+Breaking changes discovered while comparing to the earlier package setup:
+
+- Unprefixed exports such as `Button`, `Card`, and `ButtonProps` were replaced by `SandButton`, `SandCard`, and `SandButtonProps`.
+- The public barrel is now explicit and only exposes `Sand*` components and `Sand*` types from the root package entry.
+- The build output changed from app/docs-oriented assets to library artifacts plus a single bundled stylesheet.
+- React and React DOM are now peer dependencies instead of bundled runtime dependencies.
+
+If you need to mark the old package line as deprecated, use:
+
+```bash
+npm deprecate @sandurtech/sandui@0.1.0 "This version is deprecated. Please use 0.0.1 or higher."
+```

package/dist/index.d.ts

@@ -0,0 +1,161 @@
+import { SandBadge } from './components/Badge/Badge';
+import { SandBadgeProps } from './components/Badge/Badge';
+import { SandBreadcrumbItem } from './components/Breadcrumbs/Breadcrumbs';
+import { SandBreadcrumbs } from './components/Breadcrumbs/Breadcrumbs';
+import { SandBreadcrumbsProps } from './components/Breadcrumbs/Breadcrumbs';
+import { SandButton } from './components/Button/Button';
+import { SandButtonProps } from './components/Button/Button';
+import { SandCard } from './components/Card/Card';
+import { SandCardProps } from './components/Card/Card';
+import { SandCheckbox } from './components/Selection/Selection';
+import { SandChoiceBaseProps } from './components/Selection/Selection';
+import { SandChoiceGroup } from './components/Selection/Selection';
+import { SandChoiceGroupProps } from './components/Selection/Selection';
+import { SandCodeBlock } from './components/CodeBlock/CodeBlock';
+import { SandCodeBlockProps } from './components/CodeBlock/CodeBlock';
+import { SandCodeTabs } from './components/CodeBlock/CodeBlock';
+import { SandCodeTabsProps } from './components/CodeBlock/CodeBlock';
+import { SandContainer } from './components/Layout/Layout';
+import { SandContainerProps } from './components/Layout/Layout';
+import { SandDivider } from './components/Divider/Divider';
+import { SandDividerProps } from './components/Divider/Divider';
+import { SandFeedbackProps } from './components/Feedback/Feedback';
+import { SandFormGroup } from './components/Input/Input';
+import { SandFormGroupProps } from './components/Input/Input';
+import { SandHeader } from './components/Layout/Layout';
+import { SandHeaderProps } from './components/Layout/Layout';
+import { SandInput } from './components/Input/Input';
+import { SandInputGroup } from './components/Input/Input';
+import { SandInputGroupProps } from './components/Input/Input';
+import { SandInputProps } from './components/Input/Input';
+import { SandKBD } from './components/Kbd/Kbd';
+import { SandKBDProps } from './components/Kbd/Kbd';
+import { SandMicroserviceLayout } from './components/Layout/Layout';
+import { SandMicroserviceLayoutProps } from './components/Layout/Layout';
+import { SandModal } from './components/Modal/Modal';
+import { SandModalBodyProps } from './components/Modal/Modal';
+import { SandModalDescriptionProps } from './components/Modal/Modal';
+import { SandModalFooterProps } from './components/Modal/Modal';
+import { SandModalHeaderProps } from './components/Modal/Modal';
+import { SandModalProps } from './components/Modal/Modal';
+import { SandModalTitleProps } from './components/Modal/Modal';
+import { SandPagination } from './components/Pagination/Pagination';
+import { SandPaginationProps } from './components/Pagination/Pagination';
+import { SandRadio } from './components/Selection/Selection';
+import { SandResultPanel } from './components/Layout/Layout';
+import { SandResultPanelProps } from './components/Layout/Layout';
+import { SandSnackbar } from './components/Feedback/Feedback';
+import { SandSwitch } from './components/Selection/Selection';
+import { SandToast } from './components/Feedback/Feedback';
+import { SandToolLayout } from './components/Layout/Layout';
+import { SandToolLayoutProps } from './components/Layout/Layout';
+import { SandToolPanel } from './components/Layout/Layout';
+import { SandToolPanelProps } from './components/Layout/Layout';
+
+export { SandBadge }
+
+export { SandBadgeProps }
+
+export { SandBreadcrumbItem }
+
+export { SandBreadcrumbs }
+
+export { SandBreadcrumbsProps }
+
+export { SandButton }
+
+export { SandButtonProps }
+
+export { SandCard }
+
+export { SandCardProps }
+
+export { SandCheckbox }
+
+export { SandChoiceBaseProps }
+
+export { SandChoiceGroup }
+
+export { SandChoiceGroupProps }
+
+export { SandCodeBlock }
+
+export { SandCodeBlockProps }
+
+export { SandCodeTabs }
+
+export { SandCodeTabsProps }
+
+export { SandContainer }
+
+export { SandContainerProps }
+
+export { SandDivider }
+
+export { SandDividerProps }
+
+export { SandFeedbackProps }
+
+export { SandFormGroup }
+
+export { SandFormGroupProps }
+
+export { SandHeader }
+
+export { SandHeaderProps }
+
+export { SandInput }
+
+export { SandInputGroup }
+
+export { SandInputGroupProps }
+
+export { SandInputProps }
+
+export { SandKBD }
+
+export { SandKBDProps }
+
+export { SandMicroserviceLayout }
+
+export { SandMicroserviceLayoutProps }
+
+export { SandModal }
+
+export { SandModalBodyProps }
+
+export { SandModalDescriptionProps }
+
+export { SandModalFooterProps }
+
+export { SandModalHeaderProps }
+
+export { SandModalProps }
+
+export { SandModalTitleProps }
+
+export { SandPagination }
+
+export { SandPaginationProps }
+
+export { SandRadio }
+
+export { SandResultPanel }
+
+export { SandResultPanelProps }
+
+export { SandSnackbar }
+
+export { SandSwitch }
+
+export { SandToast }
+
+export { SandToolLayout }
+
+export { SandToolLayoutProps }
+
+export { SandToolPanel }
+
+export { SandToolPanelProps }
+
+export { }

package/dist/sandui.js

@@ -0,0 +1,875 @@
+import Oe, { forwardRef as b, useMemo as T, useState as ke, useCallback as I, useId as C, useRef as K, useEffect as Ie, createContext as Me, useContext as De } from "react";
+var U = { exports: {} }, D = {};
+var me;
+function Pe() {
+  if (me) return D;
+  me = 1;
+  var d = /* @__PURE__ */ Symbol.for("react.transitional.element"), a = /* @__PURE__ */ Symbol.for("react.fragment");
+  function n(r, t, c) {
+    var o = null;
+    if (c !== void 0 && (o = "" + c), t.key !== void 0 && (o = "" + t.key), "key" in t) {
+      c = {};
+      for (var u in t)
+        u !== "key" && (c[u] = t[u]);
+    } else c = t;
+    return t = c.ref, {
+      $$typeof: d,
+      type: r,
+      key: o,
+      ref: t !== void 0 ? t : null,
+      props: c
+    };
+  }
+  return D.Fragment = a, D.jsx = n, D.jsxs = n, D;
+}
+var P = {};
+var pe;
+function Fe() {
+  return pe || (pe = 1, process.env.NODE_ENV !== "production" && (function() {
+    function d(e) {
+      if (e == null) return null;
+      if (typeof e == "function")
+        return e.$$typeof === Ce ? null : e.displayName || e.name || null;
+      if (typeof e == "string") return e;
+      switch (e) {
+        case A:
+          return "Fragment";
+        case J:
+          return "Profiler";
+        case V:
+          return "StrictMode";
+        case L:
+          return "Suspense";
+        case Y:
+          return "SuspenseList";
+        case Re:
+          return "Activity";
+      }
+      if (typeof e == "object")
+        switch (typeof e.tag == "number" && console.error(
+          "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
+        ), e.$$typeof) {
+          case g:
+            return "Portal";
+          case j:
+            return e.displayName || "Context";
+          case M:
+            return (e._context.displayName || "Context") + ".Consumer";
+          case R:
+            var l = e.render;
+            return e = e.displayName, e || (e = l.displayName || l.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
+          case G:
+            return l = e.displayName || null, l !== null ? l : d(e.type) || "Memo";
+          case X:
+            l = e._payload, e = e._init;
+            try {
+              return d(e(l));
+            } catch {
+            }
+        }
+      return null;
+    }
+    function a(e) {
+      return "" + e;
+    }
+    function n(e) {
+      try {
+        a(e);
+        var l = !1;
+      } catch {
+        l = !0;
+      }
+      if (l) {
+        l = console;
+        var p = l.error, k = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
+        return p.call(
+          l,
+          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
+          k
+        ), a(e);
+      }
+    }
+    function r(e) {
+      if (e === A) return "<>";
+      if (typeof e == "object" && e !== null && e.$$typeof === X)
+        return "<...>";
+      try {
+        var l = d(e);
+        return l ? "<" + l + ">" : "<...>";
+      } catch {
+        return "<...>";
+      }
+    }
+    function t() {
+      var e = Z.A;
+      return e === null ? null : e.getOwner();
+    }
+    function c() {
+      return Error("react-stack-top-frame");
+    }
+    function o(e) {
+      if (le.call(e, "key")) {
+        var l = Object.getOwnPropertyDescriptor(e, "key").get;
+        if (l && l.isReactWarning) return !1;
+      }
+      return e.key !== void 0;
+    }
+    function u(e, l) {
+      function p() {
+        ie || (ie = !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)",
+          l
+        ));
+      }
+      p.isReactWarning = !0, Object.defineProperty(e, "key", {
+        get: p,
+        configurable: !0
+      });
+    }
+    function f() {
+      var e = d(this.type);
+      return ue[e] || (ue[e] = !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."
+      )), e = this.props.ref, e !== void 0 ? e : null;
+    }
+    function h(e, l, p, k, H, ee) {
+      var v = p.ref;
+      return e = {
+        $$typeof: N,
+        type: e,
+        key: l,
+        props: p,
+        _owner: k
+      }, (v !== void 0 ? v : null) !== null ? Object.defineProperty(e, "ref", {
+        enumerable: !1,
+        get: f
+      }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: 0
+      }), Object.defineProperty(e, "_debugInfo", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: null
+      }), Object.defineProperty(e, "_debugStack", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: H
+      }), Object.defineProperty(e, "_debugTask", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: ee
+      }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
+    }
+    function _(e, l, p, k, H, ee) {
+      var v = l.children;
+      if (v !== void 0)
+        if (k)
+          if (Ae(v)) {
+            for (k = 0; k < v.length; k++)
+              m(v[k]);
+            Object.freeze && Object.freeze(v);
+          } 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 m(v);
+      if (le.call(l, "key")) {
+        v = d(e);
+        var $ = Object.keys(l).filter(function($e) {
+          return $e !== "key";
+        });
+        k = 0 < $.length ? "{key: someKey, " + $.join(": ..., ") + ": ...}" : "{key: someKey}", fe[v + k] || ($ = 0 < $.length ? "{" + $.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,
+          v,
+          $,
+          v
+        ), fe[v + k] = !0);
+      }
+      if (v = null, p !== void 0 && (n(p), v = "" + p), o(l) && (n(l.key), v = "" + l.key), "key" in l) {
+        p = {};
+        for (var ae in l)
+          ae !== "key" && (p[ae] = l[ae]);
+      } else p = l;
+      return v && u(
+        p,
+        typeof e == "function" ? e.displayName || e.name || "Unknown" : e
+      ), h(
+        e,
+        v,
+        p,
+        t(),
+        H,
+        ee
+      );
+    }
+    function m(e) {
+      S(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === X && (e._payload.status === "fulfilled" ? S(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
+    }
+    function S(e) {
+      return typeof e == "object" && e !== null && e.$$typeof === N;
+    }
+    var y = Oe, N = /* @__PURE__ */ Symbol.for("react.transitional.element"), g = /* @__PURE__ */ Symbol.for("react.portal"), A = /* @__PURE__ */ Symbol.for("react.fragment"), V = /* @__PURE__ */ Symbol.for("react.strict_mode"), J = /* @__PURE__ */ Symbol.for("react.profiler"), M = /* @__PURE__ */ Symbol.for("react.consumer"), j = /* @__PURE__ */ Symbol.for("react.context"), R = /* @__PURE__ */ Symbol.for("react.forward_ref"), L = /* @__PURE__ */ Symbol.for("react.suspense"), Y = /* @__PURE__ */ Symbol.for("react.suspense_list"), G = /* @__PURE__ */ Symbol.for("react.memo"), X = /* @__PURE__ */ Symbol.for("react.lazy"), Re = /* @__PURE__ */ Symbol.for("react.activity"), Ce = /* @__PURE__ */ Symbol.for("react.client.reference"), Z = y.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, le = Object.prototype.hasOwnProperty, Ae = Array.isArray, Q = console.createTask ? console.createTask : function() {
+      return null;
+    };
+    y = {
+      react_stack_bottom_frame: function(e) {
+        return e();
+      }
+    };
+    var ie, ue = {}, be = y.react_stack_bottom_frame.bind(
+      y,
+      c
+    )(), _e = Q(r(c)), fe = {};
+    P.Fragment = A, P.jsx = function(e, l, p) {
+      var k = 1e4 > Z.recentlyCreatedOwnerStacks++;
+      return _(
+        e,
+        l,
+        p,
+        !1,
+        k ? Error("react-stack-top-frame") : be,
+        k ? Q(r(e)) : _e
+      );
+    }, P.jsxs = function(e, l, p) {
+      var k = 1e4 > Z.recentlyCreatedOwnerStacks++;
+      return _(
+        e,
+        l,
+        p,
+        !0,
+        k ? Error("react-stack-top-frame") : be,
+        k ? Q(r(e)) : _e
+      );
+    };
+  })()), P;
+}
+var he;
+function Be() {
+  return he || (he = 1, process.env.NODE_ENV === "production" ? U.exports = Pe() : U.exports = Fe()), U.exports;
+}
+var s = Be();
+const ye = {
+  "sand-badge": "_sand-badge_uye3i_1",
+  "sand-badge-primary": "_sand-badge-primary_uye3i_14",
+  "sand-badge-secondary": "_sand-badge-secondary_uye3i_19",
+  "sand-badge-success": "_sand-badge-success_uye3i_24",
+  "sand-badge-failed": "_sand-badge-failed_uye3i_30"
+};
+function i(...d) {
+  return d.filter(Boolean).join(" ");
+}
+function ze(d) {
+  return Array.from(
+    d.querySelectorAll(
+      [
+        "a[href]",
+        "button:not([disabled])",
+        "textarea:not([disabled])",
+        "input:not([disabled])",
+        "select:not([disabled])",
+        '[tabindex]:not([tabindex="-1"])'
+      ].join(",")
+    )
+  ).filter((a) => !a.hasAttribute("disabled") && !a.getAttribute("aria-hidden"));
+}
+function ne(d, a, n, r) {
+  if (n !== 0)
+    switch (d.key) {
+      case "ArrowRight":
+      case "ArrowDown":
+        d.preventDefault(), r((a + 1) % n);
+        break;
+      case "ArrowLeft":
+      case "ArrowUp":
+        d.preventDefault(), r((a - 1 + n) % n);
+        break;
+      case "Home":
+        d.preventDefault(), r(0);
+        break;
+      case "End":
+        d.preventDefault(), r(n - 1);
+        break;
+    }
+}
+const qe = b(function({ variant: a = "primary", className: n = "", ...r }, t) {
+  const c = T(() => ye[`sand-badge-${a}`], [a]);
+  return /* @__PURE__ */ s.jsx(
+    "span",
+    {
+      ref: t,
+      className: i(ye["sand-badge"], c, n),
+      ...r
+    }
+  );
+});
+qe.displayName = "SandBadge";
+const F = {
+  "sand-breadcrumbs": "_sand-breadcrumbs_1uxir_1",
+  "sand-breadcrumb-item": "_sand-breadcrumb-item_1uxir_10",
+  "sand-breadcrumb-link": "_sand-breadcrumb-link_1uxir_17",
+  "sand-breadcrumb-current": "_sand-breadcrumb-current_1uxir_32",
+  "sand-breadcrumb-separator": "_sand-breadcrumb-separator_1uxir_37"
+}, Le = b(function({ items: a, className: n = "", "aria-label": r = "Breadcrumb", ...t }, c) {
+  const o = T(
+    () => a.map((u, f) => {
+      const h = f === a.length - 1;
+      return /* @__PURE__ */ s.jsxs("li", { className: F["sand-breadcrumb-item"], children: [
+        u.href && !h ? /* @__PURE__ */ s.jsx("a", { href: u.href, className: F["sand-breadcrumb-link"], children: u.label }) : /* @__PURE__ */ s.jsx(
+          "span",
+          {
+            "aria-current": h ? "page" : void 0,
+            className: h ? F["sand-breadcrumb-current"] : void 0,
+            children: u.label
+          }
+        ),
+        !h && /* @__PURE__ */ s.jsx("span", { className: i(F["sand-breadcrumb-separator"], "material-symbols-rounded"), "aria-hidden": "true", children: "chevron_right" })
+      ] }, `${String(u.label)}-${f}`);
+    }),
+    [a]
+  );
+  return /* @__PURE__ */ s.jsx("nav", { ref: c, "aria-label": r, className: i(F["sand-breadcrumbs"], n), ...t, children: /* @__PURE__ */ s.jsx("ol", { children: o }) });
+});
+Le.displayName = "SandBreadcrumbs";
+const Se = {
+  "sand-btn": "_sand-btn_9grrt_1",
+  "sand-btn-primary": "_sand-btn-primary_9grrt_42",
+  "sand-btn-secondary": "_sand-btn-secondary_9grrt_54",
+  "sand-btn-outline": "_sand-btn-outline_9grrt_63",
+  "sand-btn-success": "_sand-btn-success_9grrt_74",
+  "sand-btn-failed": "_sand-btn-failed_9grrt_85"
+}, Ye = b(function({ variant: a = "primary", className: n = "", type: r = "button", ...t }, c) {
+  const o = T(() => Se[`sand-btn-${a}`], [a]);
+  return /* @__PURE__ */ s.jsx(
+    "button",
+    {
+      ref: c,
+      className: i(Se["sand-btn"], o, n),
+      type: r,
+      ...t
+    }
+  );
+});
+Ye.displayName = "SandButton";
+const W = {
+  "sand-card": "_sand-card_i3njl_1",
+  "sand-card-header": "_sand-card-header_i3njl_15",
+  "sand-card-body": "_sand-card-body_i3njl_22",
+  "sand-card-footer": "_sand-card-footer_i3njl_26"
+}, Ge = b(function({ header: a, footer: n, children: r, className: t = "", ...c }, o) {
+  return /* @__PURE__ */ s.jsxs("article", { ref: o, className: i(W["sand-card"], t), ...c, children: [
+    a && /* @__PURE__ */ s.jsx("header", { className: W["sand-card-header"], children: a }),
+    /* @__PURE__ */ s.jsx("div", { className: W["sand-card-body"], children: r }),
+    n && /* @__PURE__ */ s.jsx("footer", { className: W["sand-card-footer"], children: n })
+  ] });
+});
+Ge.displayName = "SandCard";
+const He = "_active_197ic_77", O = {
+  "sand-code-block": "_sand-code-block_197ic_1",
+  "sand-copy-btn": "_sand-copy-btn_197ic_15",
+  "sand-code-tabs": "_sand-code-tabs_197ic_41",
+  "sand-tab-headers": "_sand-tab-headers_197ic_53",
+  "sand-tab-btn": "_sand-tab-btn_197ic_60",
+  active: He
+}, ve = b(function({ code: a, className: n = "", ...r }, t) {
+  const [c, o] = ke(!1), u = I(() => {
+    navigator.clipboard.writeText(a).then(() => {
+      o(!0), setTimeout(() => o(!1), 2e3);
+    });
+  }, [a]);
+  return /* @__PURE__ */ s.jsxs("pre", { ref: t, className: i(O["sand-code-block"], n), ...r, children: [
+    /* @__PURE__ */ s.jsx(
+      "button",
+      {
+        className: O["sand-copy-btn"],
+        onClick: u,
+        type: "button",
+        "aria-label": c ? "Code copied to clipboard" : "Copy code to clipboard",
+        children: c ? "Copied" : "Copy"
+      }
+    ),
+    /* @__PURE__ */ s.jsx("code", { children: a })
+  ] });
+});
+ve.displayName = "SandCodeBlock";
+const Ue = b(function({ tabs: a, defaultTab: n = 0, className: r = "", onTabChange: t }, c) {
+  const [o, u] = ke(n), f = C(), h = K([]), _ = I(
+    (S) => {
+      u(S), t?.(S), h.current[S]?.focus();
+    },
+    [t]
+  ), m = T(() => a[o]?.code ?? "", [o, a]);
+  return /* @__PURE__ */ s.jsxs("div", { ref: c, className: i(O["sand-code-tabs"], r), children: [
+    /* @__PURE__ */ s.jsx("div", { className: O["sand-tab-headers"], role: "tablist", "aria-label": "Code examples", children: a.map((S, y) => /* @__PURE__ */ s.jsx(
+      "button",
+      {
+        ref: (N) => {
+          h.current[y] = N;
+        },
+        className: i(O["sand-tab-btn"], o === y && O.active),
+        type: "button",
+        role: "tab",
+        "aria-selected": o === y,
+        "aria-controls": `${f}-code-panel-${y}`,
+        id: `${f}-code-tab-${y}`,
+        tabIndex: o === y ? 0 : -1,
+        onClick: () => _(y),
+        onKeyDown: (N) => ne(N, y, a.length, (g) => _(g)),
+        children: S.name
+      },
+      y
+    )) }),
+    /* @__PURE__ */ s.jsx(
+      "div",
+      {
+        role: "tabpanel",
+        id: `${f}-code-panel-${o}`,
+        "aria-labelledby": `${f}-code-tab-${o}`,
+        children: /* @__PURE__ */ s.jsx(ve, { code: m })
+      }
+    )
+  ] });
+});
+Ue.displayName = "SandCodeTabs";
+const We = {
+  "sand-divider": "_sand-divider_svs0p_1"
+}, Ke = b(function({ className: a = "", ...n }, r) {
+  return /* @__PURE__ */ s.jsx("hr", { ref: r, className: i(We["sand-divider"], a), ...n });
+});
+Ke.displayName = "SandDivider";
+const E = {
+  "sand-feedback": "_sand-feedback_1pp8i_1",
+  "sand-feedback-toast": "_sand-feedback-toast_1pp8i_11",
+  "sand-feedback-snackbar": "_sand-feedback-snackbar_1pp8i_24",
+  "sand-feedback-row": "_sand-feedback-row_1pp8i_33",
+  "sand-feedback-icon": "_sand-feedback-icon_1pp8i_39",
+  "sand-feedback-content": "_sand-feedback-content_1pp8i_45",
+  "sand-feedback-title": "_sand-feedback-title_1pp8i_52",
+  "sand-feedback-message": "_sand-feedback-message_1pp8i_57",
+  "sand-feedback-action": "_sand-feedback-action_1pp8i_64",
+  "sand-feedback-success": "_sand-feedback-success_1pp8i_69",
+  "sand-feedback-failed": "_sand-feedback-failed_1pp8i_81",
+  "sand-feedback-info": "_sand-feedback-info_1pp8i_93"
+}, Ve = {
+  info: "info",
+  success: "check_circle",
+  failed: "error"
+}, xe = b(function({ heading: a, message: n, action: r, variant: t = "info", className: c = "", mode: o, ...u }, f) {
+  const h = T(() => Ve[t], [t]), _ = t === "failed" ? "alert" : "status";
+  return /* @__PURE__ */ s.jsx(
+    "div",
+    {
+      ref: f,
+      role: _,
+      "aria-live": t === "failed" ? "assertive" : "polite",
+      className: i(
+        E["sand-feedback"],
+        E[`sand-feedback-${o}`],
+        E[`sand-feedback-${t}`],
+        c
+      ),
+      ...u,
+      children: /* @__PURE__ */ s.jsxs("div", { className: E["sand-feedback-row"], children: [
+        /* @__PURE__ */ s.jsx("span", { className: i(E["sand-feedback-icon"], "material-symbols-rounded"), "aria-hidden": "true", children: h }),
+        /* @__PURE__ */ s.jsxs("div", { className: E["sand-feedback-content"], children: [
+          a && /* @__PURE__ */ s.jsx("span", { className: E["sand-feedback-title"], children: a }),
+          /* @__PURE__ */ s.jsx("span", { className: E["sand-feedback-message"], children: n })
+        ] }),
+        r && /* @__PURE__ */ s.jsx("div", { className: E["sand-feedback-action"], children: r })
+      ] })
+    }
+  );
+}), Je = b(function(a, n) {
+  return /* @__PURE__ */ s.jsx(xe, { ref: n, mode: "toast", ...a });
+});
+Je.displayName = "SandToast";
+const Xe = b(function(a, n) {
+  return /* @__PURE__ */ s.jsx(xe, { ref: n, mode: "snackbar", ...a });
+});
+Xe.displayName = "SandSnackbar";
+const z = {
+  "sand-form-group": "_sand-form-group_fyw0t_1",
+  "sand-label": "_sand-label_fyw0t_8",
+  "sand-input": "_sand-input_fyw0t_17",
+  "sand-input-error": "_sand-input-error_fyw0t_38",
+  "sand-helper-text-error": "_sand-helper-text-error_fyw0t_47"
+}, je = b(function({ label: a, children: n, className: r = "", htmlFor: t, ...c }, o) {
+  return /* @__PURE__ */ s.jsxs("div", { ref: o, className: i(z["sand-form-group"], r), ...c, children: [
+    a && /* @__PURE__ */ s.jsx("label", { className: z["sand-label"], htmlFor: t, children: a }),
+    n
+  ] });
+});
+je.displayName = "SandFormGroup";
+const Ne = b(function({ error: a, className: n = "", ...r }, t) {
+  return /* @__PURE__ */ s.jsx(
+    "input",
+    {
+      ref: t,
+      className: i(z["sand-input"], a && z["sand-input-error"], n),
+      "aria-invalid": a || r["aria-invalid"],
+      ...r
+    }
+  );
+});
+Ne.displayName = "SandInput";
+const Ze = b(function({ label: a, helperText: n, error: r, groupClassName: t, className: c = "", "aria-describedby": o, ...u }, f) {
+  const h = C(), _ = u.id ?? h, m = n ? `${_}-help` : void 0, S = T(
+    () => [o, m].filter(Boolean).join(" ") || void 0,
+    [o, m]
+  );
+  return /* @__PURE__ */ s.jsxs(je, { label: a, className: t, htmlFor: _, children: [
+    /* @__PURE__ */ s.jsx(
+      Ne,
+      {
+        ref: f,
+        id: _,
+        error: r,
+        className: c,
+        "aria-describedby": S,
+        ...u
+      }
+    ),
+    n && /* @__PURE__ */ s.jsx("span", { id: m, className: r ? z["sand-helper-text-error"] : "", children: n })
+  ] });
+});
+Ze.displayName = "SandInputGroup";
+const Qe = {
+  "sand-kbd": "_sand-kbd_mo78g_1"
+}, ea = b(function({ className: a = "", ...n }, r) {
+  return /* @__PURE__ */ s.jsx("kbd", { ref: r, className: i(Qe["sand-kbd"], a), ...n });
+});
+ea.displayName = "SandKBD";
+const q = {
+  "sand-container": "_sand-container_174rd_1",
+  "sand-header": "_sand-header_174rd_7",
+  "sand-tool-layout": "_sand-tool-layout_174rd_17",
+  "sand-tool-panel": "_sand-tool-panel_174rd_24",
+  "sand-result-panel": "_sand-result-panel_174rd_34"
+}, aa = b(function({ className: a = "", ...n }, r) {
+  return /* @__PURE__ */ s.jsx("div", { ref: r, className: i(q["sand-container"], a), ...n });
+});
+aa.displayName = "SandContainer";
+const na = b(function({ className: a = "", ...n }, r) {
+  return /* @__PURE__ */ s.jsx("header", { ref: r, className: i(q["sand-header"], a), ...n });
+});
+na.displayName = "SandHeader";
+const ge = b(function({ className: a = "", ...n }, r) {
+  return /* @__PURE__ */ s.jsx("div", { ref: r, className: i(q["sand-tool-layout"], a), ...n });
+});
+ge.displayName = "SandToolLayout";
+const sa = b(function({ className: a = "", ...n }, r) {
+  return /* @__PURE__ */ s.jsx("aside", { ref: r, className: i(q["sand-tool-panel"], a), ...n });
+});
+sa.displayName = "SandToolPanel";
+const ra = b(function({ className: a = "", ...n }, r) {
+  return /* @__PURE__ */ s.jsx("main", { ref: r, className: i(q["sand-result-panel"], a), ...n });
+});
+ra.displayName = "SandResultPanel";
+const ta = b(
+  function({ header: a, panel: n, result: r }, t) {
+    return /* @__PURE__ */ s.jsxs(s.Fragment, { children: [
+      a,
+      /* @__PURE__ */ s.jsxs(ge, { ref: t, children: [
+        n,
+        r
+      ] })
+    ] });
+  }
+);
+ta.displayName = "SandMicroserviceLayout";
+const w = {
+  "sand-modal-root": "_sand-modal-root_uryk1_1",
+  "sand-modal-backdrop": "_sand-modal-backdrop_uryk1_11",
+  "sand-modal-panel": "_sand-modal-panel_uryk1_18",
+  "sand-modal-header": "_sand-modal-header_uryk1_29",
+  "sand-modal-title": "_sand-modal-title_uryk1_38",
+  "sand-modal-description": "_sand-modal-description_uryk1_44",
+  "sand-modal-close": "_sand-modal-close_uryk1_51",
+  "sand-modal-body": "_sand-modal-body_uryk1_73",
+  "sand-modal-footer": "_sand-modal-footer_uryk1_77"
+}, Ee = Me(null);
+function we() {
+  const d = De(Ee);
+  if (!d)
+    throw new Error("SandModal sub-components must be used within SandModal.");
+  return d;
+}
+const se = b(function({ className: a = "", ...n }, r) {
+  return /* @__PURE__ */ s.jsx("div", { ref: r, className: i(w["sand-modal-header"], a), ...n });
+});
+se.displayName = "SandModal.Header";
+const re = b(function({ className: a = "", ...n }, r) {
+  return /* @__PURE__ */ s.jsx("div", { ref: r, className: i(w["sand-modal-body"], a), ...n });
+});
+re.displayName = "SandModal.Body";
+const te = b(function({ className: a = "", ...n }, r) {
+  return /* @__PURE__ */ s.jsx("div", { ref: r, className: i(w["sand-modal-footer"], a), ...n });
+});
+te.displayName = "SandModal.Footer";
+const de = b(function({ className: a = "", ...n }, r) {
+  const { titleId: t } = we();
+  return /* @__PURE__ */ s.jsx("div", { ref: r, id: t, className: i(w["sand-modal-title"], a), ...n });
+});
+de.displayName = "SandModal.Title";
+const oe = b(function({ className: a = "", ...n }, r) {
+  const { descriptionId: t } = we();
+  return /* @__PURE__ */ s.jsx("div", { ref: r, id: t, className: i(w["sand-modal-description"], a), ...n });
+});
+oe.displayName = "SandModal.Description";
+const Te = b(function({
+  open: a,
+  onClose: n,
+  title: r,
+  description: t,
+  footer: c,
+  closeOnOverlay: o = !0,
+  initialFocusRef: u,
+  children: f,
+  className: h = "",
+  ..._
+}, m) {
+  const S = C(), y = C(), N = K(null), g = K(null), A = K(null), V = T(
+    () => ({ titleId: S, descriptionId: y }),
+    [y, S]
+  ), J = I(
+    (j) => {
+      g.current = j, typeof m == "function" ? m(j) : m && (m.current = j);
+    },
+    [m]
+  ), M = I(
+    (j) => {
+      if (j.key === "Escape") {
+        j.preventDefault(), n();
+        return;
+      }
+      if (j.key !== "Tab" || !g.current)
+        return;
+      const R = ze(g.current);
+      if (R.length === 0) {
+        j.preventDefault(), g.current.focus();
+        return;
+      }
+      const L = R[0], Y = R[R.length - 1], G = document.activeElement;
+      j.shiftKey && G === L ? (j.preventDefault(), Y.focus()) : !j.shiftKey && G === Y && (j.preventDefault(), L.focus());
+    },
+    [n]
+  );
+  return Ie(() => {
+    if (!a) {
+      A.current?.focus();
+      return;
+    }
+    A.current = document.activeElement instanceof HTMLElement ? document.activeElement : null;
+    const j = document.body.style.overflow;
+    return document.body.style.overflow = "hidden", (u?.current ?? N.current ?? g.current)?.focus(), window.addEventListener("keydown", M), () => {
+      document.body.style.overflow = j, window.removeEventListener("keydown", M);
+    };
+  }, [M, u, a]), a ? /* @__PURE__ */ s.jsxs("div", { className: w["sand-modal-root"], children: [
+    /* @__PURE__ */ s.jsx(
+      "button",
+      {
+        type: "button",
+        className: w["sand-modal-backdrop"],
+        "aria-label": "Close dialog",
+        onClick: o ? n : void 0
+      }
+    ),
+    /* @__PURE__ */ s.jsx(
+      "div",
+      {
+        ref: J,
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-labelledby": r ? S : void 0,
+        "aria-describedby": t ? y : void 0,
+        className: i(w["sand-modal-panel"], h),
+        tabIndex: -1,
+        ..._,
+        children: /* @__PURE__ */ s.jsxs(Ee.Provider, { value: V, children: [
+          (r || t) && /* @__PURE__ */ s.jsxs(se, { children: [
+            /* @__PURE__ */ s.jsxs("div", { children: [
+              r && /* @__PURE__ */ s.jsx(de, { children: r }),
+              t && /* @__PURE__ */ s.jsx(oe, { children: t })
+            ] }),
+            /* @__PURE__ */ s.jsx(
+              "button",
+              {
+                ref: N,
+                type: "button",
+                className: w["sand-modal-close"],
+                onClick: n,
+                "aria-label": "Close dialog",
+                children: /* @__PURE__ */ s.jsx("span", { className: "material-symbols-rounded", "aria-hidden": "true", children: "close" })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ s.jsx(re, { children: f }),
+          c && /* @__PURE__ */ s.jsx(te, { children: c })
+        ] })
+      }
+    )
+  ] }) : null;
+});
+Te.displayName = "SandModal";
+const ba = Object.assign(Te, {
+  Header: se,
+  Body: re,
+  Footer: te,
+  Title: de,
+  Description: oe
+}), B = {
+  "sand-pagination": "_sand-pagination_cizv5_1",
+  "sand-page-btn": "_sand-page-btn_cizv5_8",
+  "sand-page-btn-active": "_sand-page-btn-active_cizv5_36"
+}, da = b(function({ currentPage: a, totalPages: n, onPageChange: r, className: t = "", ...c }, o) {
+  const u = T(() => Array.from({ length: n }, (_, m) => m + 1), [n]), f = I(
+    (_) => {
+      _ < 1 || _ > n || _ === a || r?.(_);
+    },
+    [a, r, n]
+  ), h = I(
+    (_) => {
+      ne(_, a - 1, n, (m) => f(m + 1));
+    },
+    [a, f, n]
+  );
+  return /* @__PURE__ */ s.jsxs(
+    "nav",
+    {
+      ref: o,
+      "aria-label": "Pagination",
+      className: i(B["sand-pagination"], t),
+      onKeyDown: h,
+      ...c,
+      children: [
+        /* @__PURE__ */ s.jsx(
+          "button",
+          {
+            type: "button",
+            className: B["sand-page-btn"],
+            disabled: a === 1,
+            "aria-label": "Previous page",
+            onClick: () => f(a - 1),
+            children: /* @__PURE__ */ s.jsx("span", { className: "material-symbols-rounded", "aria-hidden": "true", children: "chevron_left" })
+          }
+        ),
+        u.map((_) => /* @__PURE__ */ s.jsx(
+          "button",
+          {
+            type: "button",
+            "aria-current": _ === a ? "page" : void 0,
+            "aria-label": `Page ${_}`,
+            className: i(B["sand-page-btn"], _ === a && B["sand-page-btn-active"]),
+            onClick: () => f(_),
+            children: _
+          },
+          _
+        )),
+        /* @__PURE__ */ s.jsx(
+          "button",
+          {
+            type: "button",
+            className: B["sand-page-btn"],
+            disabled: a === n,
+            "aria-label": "Next page",
+            onClick: () => f(a + 1),
+            children: /* @__PURE__ */ s.jsx("span", { className: "material-symbols-rounded", "aria-hidden": "true", children: "chevron_right" })
+          }
+        )
+      ]
+    }
+  );
+});
+da.displayName = "SandPagination";
+const x = {
+  "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"
+}, ce = ({ label: d, description: a }) => /* @__PURE__ */ s.jsxs("span", { className: x["sand-choice-content"], children: [
+  /* @__PURE__ */ s.jsx("span", { className: x["sand-choice-label"], children: d }),
+  a && /* @__PURE__ */ s.jsx("span", { className: x["sand-choice-description"], children: a })
+] }), oa = b(function({ label: a, description: n, id: r, className: t = "", ...c }, o) {
+  const u = C(), f = r ?? u;
+  return /* @__PURE__ */ s.jsxs("label", { className: i(x["sand-choice-row"], t), htmlFor: f, children: [
+    /* @__PURE__ */ s.jsx("input", { ref: o, id: f, type: "checkbox", className: x["sand-choice-input"], ...c }),
+    /* @__PURE__ */ s.jsx("span", { className: i(x["sand-choice-control"], x["sand-checkbox"]), "aria-hidden": "true", children: /* @__PURE__ */ s.jsx("span", { className: i(x["sand-checkbox-icon"], "material-symbols-rounded"), children: "check" }) }),
+    /* @__PURE__ */ s.jsx(ce, { label: a, description: n })
+  ] });
+});
+oa.displayName = "SandCheckbox";
+const ca = b(function({ label: a, description: n, id: r, className: t = "", onKeyDown: c, ...o }, u) {
+  const f = C(), h = r ?? f, _ = (m) => {
+    if (c?.(m), m.defaultPrevented || !o.name)
+      return;
+    const S = Array.from(
+      document.querySelectorAll(`input[type="radio"][name="${o.name}"]`)
+    ), y = S.findIndex((N) => N.id === h);
+    ne(m, y, S.length, (N) => {
+      S[N]?.focus(), S[N]?.click();
+    });
+  };
+  return /* @__PURE__ */ s.jsxs("label", { className: i(x["sand-choice-row"], t), htmlFor: h, children: [
+    /* @__PURE__ */ s.jsx("input", { ref: u, id: h, type: "radio", className: x["sand-choice-input"], onKeyDown: _, ...o }),
+    /* @__PURE__ */ s.jsx("span", { className: i(x["sand-choice-control"], x["sand-radio"]), "aria-hidden": "true" }),
+    /* @__PURE__ */ s.jsx(ce, { label: a, description: n })
+  ] });
+});
+ca.displayName = "SandRadio";
+const la = b(function({ label: a, description: n, id: r, className: t = "", ...c }, o) {
+  const u = C(), f = r ?? u;
+  return /* @__PURE__ */ s.jsxs("label", { className: i(x["sand-choice-row"], t), htmlFor: f, children: [
+    /* @__PURE__ */ s.jsx("input", { ref: o, id: f, type: "checkbox", role: "switch", className: x["sand-choice-input"], ...c }),
+    /* @__PURE__ */ s.jsx("span", { className: i(x["sand-choice-control"], x["sand-switch"]), "aria-hidden": "true" }),
+    /* @__PURE__ */ s.jsx(ce, { label: a, description: n })
+  ] });
+});
+la.displayName = "SandSwitch";
+const ia = b(function({ className: a = "", label: n, ...r }, t) {
+  return /* @__PURE__ */ s.jsx("div", { ref: t, role: "group", "aria-label": typeof n == "string" ? n : void 0, className: i(x["sand-choice-group"], a), ...r });
+});
+ia.displayName = "SandChoiceGroup";
+export {
+  qe as SandBadge,
+  Le as SandBreadcrumbs,
+  Ye as SandButton,
+  Ge as SandCard,
+  oa as SandCheckbox,
+  ia as SandChoiceGroup,
+  ve as SandCodeBlock,
+  Ue as SandCodeTabs,
+  aa as SandContainer,
+  Ke as SandDivider,
+  je as SandFormGroup,
+  na as SandHeader,
+  Ne as SandInput,
+  Ze as SandInputGroup,
+  ea as SandKBD,
+  ta as SandMicroserviceLayout,
+  ba as SandModal,
+  da as SandPagination,
+  ca as SandRadio,
+  ra as SandResultPanel,
+  Xe as SandSnackbar,
+  la as SandSwitch,
+  Je as SandToast,
+  ge as SandToolLayout,
+  sa as SandToolPanel
+};

package/dist/sandui.umd.js

@@ -0,0 +1,6 @@
+(function(f,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],t):(f=typeof globalThis<"u"?globalThis:f||self,t(f.SandUI={},f.React))})(this,(function(f,t){"use strict";var z={exports:{}},I={};var ia;function Wa(){if(ia)return I;ia=1;var r=Symbol.for("react.transitional.element"),e=Symbol.for("react.fragment");function n(d,o,l){var c=null;if(l!==void 0&&(c=""+l),o.key!==void 0&&(c=""+o.key),"key"in o){l={};for(var b in o)b!=="key"&&(l[b]=o[b])}else l=o;return o=l.ref,{$$typeof:r,type:d,key:c,ref:o!==void 0?o:null,props:l}}return I.Fragment=e,I.jsx=n,I.jsxs=n,I}var O={};var ua;function Ka(){return ua||(ua=1,process.env.NODE_ENV!=="production"&&(function(){function r(a){if(a==null)return null;if(typeof a=="function")return a.$$typeof===ae?null:a.displayName||a.name||null;if(typeof a=="string")return a;switch(a){case A:return"Fragment";case da:return"Profiler";case sa:return"StrictMode";case G:return"Suspense";case H:return"SuspenseList";case $a:return"Activity"}if(typeof a=="object")switch(typeof a.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),a.$$typeof){case E:return"Portal";case x:return a.displayName||"Context";case L:return(a._context.displayName||"Context")+".Consumer";case T:var i=a.render;return a=a.displayName,a||(a=i.displayName||i.name||"",a=a!==""?"ForwardRef("+a+")":"ForwardRef"),a;case U:return i=a.displayName||null,i!==null?i:r(a.type)||"Memo";case ta:i=a._payload,a=a._init;try{return r(a(i))}catch{}}return null}function e(a){return""+a}function n(a){try{e(a);var i=!1}catch{i=!0}if(i){i=console;var h=i.error,v=typeof Symbol=="function"&&Symbol.toStringTag&&a[Symbol.toStringTag]||a.constructor.name||"Object";return h.call(i,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",v),e(a)}}function d(a){if(a===A)return"<>";if(typeof a=="object"&&a!==null&&a.$$typeof===ta)return"<...>";try{var i=r(a);return i?"<"+i+">":"<...>"}catch{return"<...>"}}function o(){var a=oa.A;return a===null?null:a.getOwner()}function l(){return Error("react-stack-top-frame")}function c(a){if(La.call(a,"key")){var i=Object.getOwnPropertyDescriptor(a,"key").get;if(i&&i.isReactWarning)return!1}return a.key!==void 0}function b(a,i){function h(){za||(za=!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)",i))}h.isReactWarning=!0,Object.defineProperty(a,"key",{get:h,configurable:!0})}function m(){var a=r(this.type);return Ya[a]||(Ya[a]=!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.")),a=this.props.ref,a!==void 0?a:null}function y(a,i,h,v,W,ca){var j=h.ref;return a={$$typeof:R,type:a,key:i,props:h,_owner:v},(j!==void 0?j:null)!==null?Object.defineProperty(a,"ref",{enumerable:!1,get:m}):Object.defineProperty(a,"ref",{enumerable:!1,value:null}),a._store={},Object.defineProperty(a._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(a,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(a,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:W}),Object.defineProperty(a,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:ca}),Object.freeze&&(Object.freeze(a.props),Object.freeze(a)),a}function _(a,i,h,v,W,ca){var j=i.children;if(j!==void 0)if(v)if(ee(j)){for(v=0;v<j.length;v++)p(j[v]);Object.freeze&&Object.freeze(j)}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(j);if(La.call(i,"key")){j=r(a);var M=Object.keys(i).filter(function(ne){return ne!=="key"});v=0<M.length?"{key: someKey, "+M.join(": ..., ")+": ...}":"{key: someKey}",Ua[j+v]||(M=0<M.length?"{"+M.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} />`,v,j,M,j),Ua[j+v]=!0)}if(j=null,h!==void 0&&(n(h),j=""+h),c(i)&&(n(i.key),j=""+i.key),"key"in i){h={};for(var la in i)la!=="key"&&(h[la]=i[la])}else h=i;return j&&b(h,typeof a=="function"?a.displayName||a.name||"Unknown":a),y(a,j,h,o(),W,ca)}function p(a){k(a)?a._store&&(a._store.validated=1):typeof a=="object"&&a!==null&&a.$$typeof===ta&&(a._payload.status==="fulfilled"?k(a._payload.value)&&a._payload.value._store&&(a._payload.value._store.validated=1):a._store&&(a._store.validated=1))}function k(a){return typeof a=="object"&&a!==null&&a.$$typeof===R}var S=t,R=Symbol.for("react.transitional.element"),E=Symbol.for("react.portal"),A=Symbol.for("react.fragment"),sa=Symbol.for("react.strict_mode"),da=Symbol.for("react.profiler"),L=Symbol.for("react.consumer"),x=Symbol.for("react.context"),T=Symbol.for("react.forward_ref"),G=Symbol.for("react.suspense"),H=Symbol.for("react.suspense_list"),U=Symbol.for("react.memo"),ta=Symbol.for("react.lazy"),$a=Symbol.for("react.activity"),ae=Symbol.for("react.client.reference"),oa=S.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,La=Object.prototype.hasOwnProperty,ee=Array.isArray,ra=console.createTask?console.createTask:function(){return null};S={react_stack_bottom_frame:function(a){return a()}};var za,Ya={},Ga=S.react_stack_bottom_frame.bind(S,l)(),Ha=ra(d(l)),Ua={};O.Fragment=A,O.jsx=function(a,i,h){var v=1e4>oa.recentlyCreatedOwnerStacks++;return _(a,i,h,!1,v?Error("react-stack-top-frame"):Ga,v?ra(d(a)):Ha)},O.jsxs=function(a,i,h){var v=1e4>oa.recentlyCreatedOwnerStacks++;return _(a,i,h,!0,v?Error("react-stack-top-frame"):Ga,v?ra(d(a)):Ha)}})()),O}var fa;function Va(){return fa||(fa=1,process.env.NODE_ENV==="production"?z.exports=Wa():z.exports=Ka()),z.exports}var s=Va();const ba={"sand-badge":"_sand-badge_uye3i_1","sand-badge-primary":"_sand-badge-primary_uye3i_14","sand-badge-secondary":"_sand-badge-secondary_uye3i_19","sand-badge-success":"_sand-badge-success_uye3i_24","sand-badge-failed":"_sand-badge-failed_uye3i_30"};function u(...r){return r.filter(Boolean).join(" ")}function Ja(r){return Array.from(r.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 K(r,e,n,d){if(n!==0)switch(r.key){case"ArrowRight":case"ArrowDown":r.preventDefault(),d((e+1)%n);break;case"ArrowLeft":case"ArrowUp":r.preventDefault(),d((e-1+n)%n);break;case"Home":r.preventDefault(),d(0);break;case"End":r.preventDefault(),d(n-1);break}}const _a=t.forwardRef(function({variant:e="primary",className:n="",...d},o){const l=t.useMemo(()=>ba[`sand-badge-${e}`],[e]);return s.jsx("span",{ref:o,className:u(ba["sand-badge"],l,n),...d})});_a.displayName="SandBadge";const P={"sand-breadcrumbs":"_sand-breadcrumbs_1uxir_1","sand-breadcrumb-item":"_sand-breadcrumb-item_1uxir_10","sand-breadcrumb-link":"_sand-breadcrumb-link_1uxir_17","sand-breadcrumb-current":"_sand-breadcrumb-current_1uxir_32","sand-breadcrumb-separator":"_sand-breadcrumb-separator_1uxir_37"},ma=t.forwardRef(function({items:e,className:n="","aria-label":d="Breadcrumb",...o},l){const c=t.useMemo(()=>e.map((b,m)=>{const y=m===e.length-1;return s.jsxs("li",{className:P["sand-breadcrumb-item"],children:[b.href&&!y?s.jsx("a",{href:b.href,className:P["sand-breadcrumb-link"],children:b.label}):s.jsx("span",{"aria-current":y?"page":void 0,className:y?P["sand-breadcrumb-current"]:void 0,children:b.label}),!y&&s.jsx("span",{className:u(P["sand-breadcrumb-separator"],"material-symbols-rounded"),"aria-hidden":"true",children:"chevron_right"})]},`${String(b.label)}-${m}`)}),[e]);return s.jsx("nav",{ref:l,"aria-label":d,className:u(P["sand-breadcrumbs"],n),...o,children:s.jsx("ol",{children:c})})});ma.displayName="SandBreadcrumbs";const pa={"sand-btn":"_sand-btn_9grrt_1","sand-btn-primary":"_sand-btn-primary_9grrt_42","sand-btn-secondary":"_sand-btn-secondary_9grrt_54","sand-btn-outline":"_sand-btn-outline_9grrt_63","sand-btn-success":"_sand-btn-success_9grrt_74","sand-btn-failed":"_sand-btn-failed_9grrt_85"},ha=t.forwardRef(function({variant:e="primary",className:n="",type:d="button",...o},l){const c=t.useMemo(()=>pa[`sand-btn-${e}`],[e]);return s.jsx("button",{ref:l,className:u(pa["sand-btn"],c,n),type:d,...o})});ha.displayName="SandButton";const Y={"sand-card":"_sand-card_i3njl_1","sand-card-header":"_sand-card-header_i3njl_15","sand-card-body":"_sand-card-body_i3njl_22","sand-card-footer":"_sand-card-footer_i3njl_26"},ya=t.forwardRef(function({header:e,footer:n,children:d,className:o="",...l},c){return s.jsxs("article",{ref:c,className:u(Y["sand-card"],o),...l,children:[e&&s.jsx("header",{className:Y["sand-card-header"],children:e}),s.jsx("div",{className:Y["sand-card-body"],children:d}),n&&s.jsx("footer",{className:Y["sand-card-footer"],children:n})]})});ya.displayName="SandCard";const C={"sand-code-block":"_sand-code-block_197ic_1","sand-copy-btn":"_sand-copy-btn_197ic_15","sand-code-tabs":"_sand-code-tabs_197ic_41","sand-tab-headers":"_sand-tab-headers_197ic_53","sand-tab-btn":"_sand-tab-btn_197ic_60",active:"_active_197ic_77"},V=t.forwardRef(function({code:e,className:n="",...d},o){const[l,c]=t.useState(!1),b=t.useCallback(()=>{navigator.clipboard.writeText(e).then(()=>{c(!0),setTimeout(()=>c(!1),2e3)})},[e]);return s.jsxs("pre",{ref:o,className:u(C["sand-code-block"],n),...d,children:[s.jsx("button",{className:C["sand-copy-btn"],onClick:b,type:"button","aria-label":l?"Code copied to clipboard":"Copy code to clipboard",children:l?"Copied":"Copy"}),s.jsx("code",{children:e})]})});V.displayName="SandCodeBlock";const Sa=t.forwardRef(function({tabs:e,defaultTab:n=0,className:d="",onTabChange:o},l){const[c,b]=t.useState(n),m=t.useId(),y=t.useRef([]),_=t.useCallback(k=>{b(k),o?.(k),y.current[k]?.focus()},[o]),p=t.useMemo(()=>e[c]?.code??"",[c,e]);return s.jsxs("div",{ref:l,className:u(C["sand-code-tabs"],d),children:[s.jsx("div",{className:C["sand-tab-headers"],role:"tablist","aria-label":"Code examples",children:e.map((k,S)=>s.jsx("button",{ref:R=>{y.current[S]=R},className:u(C["sand-tab-btn"],c===S&&C.active),type:"button",role:"tab","aria-selected":c===S,"aria-controls":`${m}-code-panel-${S}`,id:`${m}-code-tab-${S}`,tabIndex:c===S?0:-1,onClick:()=>_(S),onKeyDown:R=>K(R,S,e.length,E=>_(E)),children:k.name},S))}),s.jsx("div",{role:"tabpanel",id:`${m}-code-panel-${c}`,"aria-labelledby":`${m}-code-tab-${c}`,children:s.jsx(V,{code:p})})]})});Sa.displayName="SandCodeTabs";const Xa={"sand-divider":"_sand-divider_svs0p_1"},ka=t.forwardRef(function({className:e="",...n},d){return s.jsx("hr",{ref:d,className:u(Xa["sand-divider"],e),...n})});ka.displayName="SandDivider";const w={"sand-feedback":"_sand-feedback_1pp8i_1","sand-feedback-toast":"_sand-feedback-toast_1pp8i_11","sand-feedback-snackbar":"_sand-feedback-snackbar_1pp8i_24","sand-feedback-row":"_sand-feedback-row_1pp8i_33","sand-feedback-icon":"_sand-feedback-icon_1pp8i_39","sand-feedback-content":"_sand-feedback-content_1pp8i_45","sand-feedback-title":"_sand-feedback-title_1pp8i_52","sand-feedback-message":"_sand-feedback-message_1pp8i_57","sand-feedback-action":"_sand-feedback-action_1pp8i_64","sand-feedback-success":"_sand-feedback-success_1pp8i_69","sand-feedback-failed":"_sand-feedback-failed_1pp8i_81","sand-feedback-info":"_sand-feedback-info_1pp8i_93"},Za={info:"info",success:"check_circle",failed:"error"},va=t.forwardRef(function({heading:e,message:n,action:d,variant:o="info",className:l="",mode:c,...b},m){const y=t.useMemo(()=>Za[o],[o]),_=o==="failed"?"alert":"status";return s.jsx("div",{ref:m,role:_,"aria-live":o==="failed"?"assertive":"polite",className:u(w["sand-feedback"],w[`sand-feedback-${c}`],w[`sand-feedback-${o}`],l),...b,children:s.jsxs("div",{className:w["sand-feedback-row"],children:[s.jsx("span",{className:u(w["sand-feedback-icon"],"material-symbols-rounded"),"aria-hidden":"true",children:y}),s.jsxs("div",{className:w["sand-feedback-content"],children:[e&&s.jsx("span",{className:w["sand-feedback-title"],children:e}),s.jsx("span",{className:w["sand-feedback-message"],children:n})]}),d&&s.jsx("div",{className:w["sand-feedback-action"],children:d})]})})}),ja=t.forwardRef(function(e,n){return s.jsx(va,{ref:n,mode:"toast",...e})});ja.displayName="SandToast";const Na=t.forwardRef(function(e,n){return s.jsx(va,{ref:n,mode:"snackbar",...e})});Na.displayName="SandSnackbar";const D={"sand-form-group":"_sand-form-group_fyw0t_1","sand-label":"_sand-label_fyw0t_8","sand-input":"_sand-input_fyw0t_17","sand-input-error":"_sand-input-error_fyw0t_38","sand-helper-text-error":"_sand-helper-text-error_fyw0t_47"},J=t.forwardRef(function({label:e,children:n,className:d="",htmlFor:o,...l},c){return s.jsxs("div",{ref:c,className:u(D["sand-form-group"],d),...l,children:[e&&s.jsx("label",{className:D["sand-label"],htmlFor:o,children:e}),n]})});J.displayName="SandFormGroup";const X=t.forwardRef(function({error:e,className:n="",...d},o){return s.jsx("input",{ref:o,className:u(D["sand-input"],e&&D["sand-input-error"],n),"aria-invalid":e||d["aria-invalid"],...d})});X.displayName="SandInput";const xa=t.forwardRef(function({label:e,helperText:n,error:d,groupClassName:o,className:l="","aria-describedby":c,...b},m){const y=t.useId(),_=b.id??y,p=n?`${_}-help`:void 0,k=t.useMemo(()=>[c,p].filter(Boolean).join(" ")||void 0,[c,p]);return s.jsxs(J,{label:e,className:o,htmlFor:_,children:[s.jsx(X,{ref:m,id:_,error:d,className:l,"aria-describedby":k,...b}),n&&s.jsx("span",{id:p,className:d?D["sand-helper-text-error"]:"",children:n})]})});xa.displayName="SandInputGroup";const Qa={"sand-kbd":"_sand-kbd_mo78g_1"},Ra=t.forwardRef(function({className:e="",...n},d){return s.jsx("kbd",{ref:d,className:u(Qa["sand-kbd"],e),...n})});Ra.displayName="SandKBD";const B={"sand-container":"_sand-container_174rd_1","sand-header":"_sand-header_174rd_7","sand-tool-layout":"_sand-tool-layout_174rd_17","sand-tool-panel":"_sand-tool-panel_174rd_24","sand-result-panel":"_sand-result-panel_174rd_34"},wa=t.forwardRef(function({className:e="",...n},d){return s.jsx("div",{ref:d,className:u(B["sand-container"],e),...n})});wa.displayName="SandContainer";const ga=t.forwardRef(function({className:e="",...n},d){return s.jsx("header",{ref:d,className:u(B["sand-header"],e),...n})});ga.displayName="SandHeader";const Z=t.forwardRef(function({className:e="",...n},d){return s.jsx("div",{ref:d,className:u(B["sand-tool-layout"],e),...n})});Z.displayName="SandToolLayout";const Ea=t.forwardRef(function({className:e="",...n},d){return s.jsx("aside",{ref:d,className:u(B["sand-tool-panel"],e),...n})});Ea.displayName="SandToolPanel";const Ta=t.forwardRef(function({className:e="",...n},d){return s.jsx("main",{ref:d,className:u(B["sand-result-panel"],e),...n})});Ta.displayName="SandResultPanel";const Ca=t.forwardRef(function({header:e,panel:n,result:d},o){return s.jsxs(s.Fragment,{children:[e,s.jsxs(Z,{ref:o,children:[n,d]})]})});Ca.displayName="SandMicroserviceLayout";const g={"sand-modal-root":"_sand-modal-root_uryk1_1","sand-modal-backdrop":"_sand-modal-backdrop_uryk1_11","sand-modal-panel":"_sand-modal-panel_uryk1_18","sand-modal-header":"_sand-modal-header_uryk1_29","sand-modal-title":"_sand-modal-title_uryk1_38","sand-modal-description":"_sand-modal-description_uryk1_44","sand-modal-close":"_sand-modal-close_uryk1_51","sand-modal-body":"_sand-modal-body_uryk1_73","sand-modal-footer":"_sand-modal-footer_uryk1_77"},Aa=t.createContext(null);function Ma(){const r=t.useContext(Aa);if(!r)throw new Error("SandModal sub-components must be used within SandModal.");return r}const Q=t.forwardRef(function({className:e="",...n},d){return s.jsx("div",{ref:d,className:u(g["sand-modal-header"],e),...n})});Q.displayName="SandModal.Header";const q=t.forwardRef(function({className:e="",...n},d){return s.jsx("div",{ref:d,className:u(g["sand-modal-body"],e),...n})});q.displayName="SandModal.Body";const $=t.forwardRef(function({className:e="",...n},d){return s.jsx("div",{ref:d,className:u(g["sand-modal-footer"],e),...n})});$.displayName="SandModal.Footer";const aa=t.forwardRef(function({className:e="",...n},d){const{titleId:o}=Ma();return s.jsx("div",{ref:d,id:o,className:u(g["sand-modal-title"],e),...n})});aa.displayName="SandModal.Title";const ea=t.forwardRef(function({className:e="",...n},d){const{descriptionId:o}=Ma();return s.jsx("div",{ref:d,id:o,className:u(g["sand-modal-description"],e),...n})});ea.displayName="SandModal.Description";const Ia=t.forwardRef(function({open:e,onClose:n,title:d,description:o,footer:l,closeOnOverlay:c=!0,initialFocusRef:b,children:m,className:y="",..._},p){const k=t.useId(),S=t.useId(),R=t.useRef(null),E=t.useRef(null),A=t.useRef(null),sa=t.useMemo(()=>({titleId:k,descriptionId:S}),[S,k]),da=t.useCallback(x=>{E.current=x,typeof p=="function"?p(x):p&&(p.current=x)},[p]),L=t.useCallback(x=>{if(x.key==="Escape"){x.preventDefault(),n();return}if(x.key!=="Tab"||!E.current)return;const T=Ja(E.current);if(T.length===0){x.preventDefault(),E.current.focus();return}const G=T[0],H=T[T.length-1],U=document.activeElement;x.shiftKey&&U===G?(x.preventDefault(),H.focus()):!x.shiftKey&&U===H&&(x.preventDefault(),G.focus())},[n]);return t.useEffect(()=>{if(!e){A.current?.focus();return}A.current=document.activeElement instanceof HTMLElement?document.activeElement:null;const x=document.body.style.overflow;return document.body.style.overflow="hidden",(b?.current??R.current??E.current)?.focus(),window.addEventListener("keydown",L),()=>{document.body.style.overflow=x,window.removeEventListener("keydown",L)}},[L,b,e]),e?s.jsxs("div",{className:g["sand-modal-root"],children:[s.jsx("button",{type:"button",className:g["sand-modal-backdrop"],"aria-label":"Close dialog",onClick:c?n:void 0}),s.jsx("div",{ref:da,role:"dialog","aria-modal":"true","aria-labelledby":d?k:void 0,"aria-describedby":o?S:void 0,className:u(g["sand-modal-panel"],y),tabIndex:-1,..._,children:s.jsxs(Aa.Provider,{value:sa,children:[(d||o)&&s.jsxs(Q,{children:[s.jsxs("div",{children:[d&&s.jsx(aa,{children:d}),o&&s.jsx(ea,{children:o})]}),s.jsx("button",{ref:R,type:"button",className:g["sand-modal-close"],onClick:n,"aria-label":"Close dialog",children:s.jsx("span",{className:"material-symbols-rounded","aria-hidden":"true",children:"close"})})]}),s.jsx(q,{children:m}),l&&s.jsx($,{children:l})]})})]}):null});Ia.displayName="SandModal";const qa=Object.assign(Ia,{Header:Q,Body:q,Footer:$,Title:aa,Description:ea}),F={"sand-pagination":"_sand-pagination_cizv5_1","sand-page-btn":"_sand-page-btn_cizv5_8","sand-page-btn-active":"_sand-page-btn-active_cizv5_36"},Oa=t.forwardRef(function({currentPage:e,totalPages:n,onPageChange:d,className:o="",...l},c){const b=t.useMemo(()=>Array.from({length:n},(_,p)=>p+1),[n]),m=t.useCallback(_=>{_<1||_>n||_===e||d?.(_)},[e,d,n]),y=t.useCallback(_=>{K(_,e-1,n,p=>m(p+1))},[e,m,n]);return s.jsxs("nav",{ref:c,"aria-label":"Pagination",className:u(F["sand-pagination"],o),onKeyDown:y,...l,children:[s.jsx("button",{type:"button",className:F["sand-page-btn"],disabled:e===1,"aria-label":"Previous page",onClick:()=>m(e-1),children:s.jsx("span",{className:"material-symbols-rounded","aria-hidden":"true",children:"chevron_left"})}),b.map(_=>s.jsx("button",{type:"button","aria-current":_===e?"page":void 0,"aria-label":`Page ${_}`,className:u(F["sand-page-btn"],_===e&&F["sand-page-btn-active"]),onClick:()=>m(_),children:_},_)),s.jsx("button",{type:"button",className:F["sand-page-btn"],disabled:e===n,"aria-label":"Next page",onClick:()=>m(e+1),children:s.jsx("span",{className:"material-symbols-rounded","aria-hidden":"true",children:"chevron_right"})})]})});Oa.displayName="SandPagination";const N={"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"},na=({label:r,description:e})=>s.jsxs("span",{className:N["sand-choice-content"],children:[s.jsx("span",{className:N["sand-choice-label"],children:r}),e&&s.jsx("span",{className:N["sand-choice-description"],children:e})]}),Pa=t.forwardRef(function({label:e,description:n,id:d,className:o="",...l},c){const b=t.useId(),m=d??b;return s.jsxs("label",{className:u(N["sand-choice-row"],o),htmlFor:m,children:[s.jsx("input",{ref:c,id:m,type:"checkbox",className:N["sand-choice-input"],...l}),s.jsx("span",{className:u(N["sand-choice-control"],N["sand-checkbox"]),"aria-hidden":"true",children:s.jsx("span",{className:u(N["sand-checkbox-icon"],"material-symbols-rounded"),children:"check"})}),s.jsx(na,{label:e,description:n})]})});Pa.displayName="SandCheckbox";const Da=t.forwardRef(function({label:e,description:n,id:d,className:o="",onKeyDown:l,...c},b){const m=t.useId(),y=d??m,_=p=>{if(l?.(p),p.defaultPrevented||!c.name)return;const k=Array.from(document.querySelectorAll(`input[type="radio"][name="${c.name}"]`)),S=k.findIndex(R=>R.id===y);K(p,S,k.length,R=>{k[R]?.focus(),k[R]?.click()})};return s.jsxs("label",{className:u(N["sand-choice-row"],o),htmlFor:y,children:[s.jsx("input",{ref:b,id:y,type:"radio",className:N["sand-choice-input"],onKeyDown:_,...c}),s.jsx("span",{className:u(N["sand-choice-control"],N["sand-radio"]),"aria-hidden":"true"}),s.jsx(na,{label:e,description:n})]})});Da.displayName="SandRadio";const Ba=t.forwardRef(function({label:e,description:n,id:d,className:o="",...l},c){const b=t.useId(),m=d??b;return s.jsxs("label",{className:u(N["sand-choice-row"],o),htmlFor:m,children:[s.jsx("input",{ref:c,id:m,type:"checkbox",role:"switch",className:N["sand-choice-input"],...l}),s.jsx("span",{className:u(N["sand-choice-control"],N["sand-switch"]),"aria-hidden":"true"}),s.jsx(na,{label:e,description:n})]})});Ba.displayName="SandSwitch";const Fa=t.forwardRef(function({className:e="",label:n,...d},o){return s.jsx("div",{ref:o,role:"group","aria-label":typeof n=="string"?n:void 0,className:u(N["sand-choice-group"],e),...d})});Fa.displayName="SandChoiceGroup",f.SandBadge=_a,f.SandBreadcrumbs=ma,f.SandButton=ha,f.SandCard=ya,f.SandCheckbox=Pa,f.SandChoiceGroup=Fa,f.SandCodeBlock=V,f.SandCodeTabs=Sa,f.SandContainer=wa,f.SandDivider=ka,f.SandFormGroup=J,f.SandHeader=ga,f.SandInput=X,f.SandInputGroup=xa,f.SandKBD=Ra,f.SandMicroserviceLayout=Ca,f.SandModal=qa,f.SandPagination=Oa,f.SandRadio=Da,f.SandResultPanel=Ta,f.SandSnackbar=Na,f.SandSwitch=Ba,f.SandToast=ja,f.SandToolLayout=Z,f.SandToolPanel=Ea,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})}));

package/dist/style.css

@@ -0,0 +1 @@
+:root{--theme-bg: #F2F2F2;--theme-surface: #FFFFFF;--theme-surface-variant: rgb(229.25, 229.25, 229.25);--theme-text: #262626;--theme-text-muted: rgba(38, 38, 38, .6);--theme-border: rgb(229.25, 229.25, 229.25);--theme-footer-bg: #262626;--theme-footer-text: #F2F2F2;--sand-accent: orange;--sand-accent-dark: #cc8400;--sand-accent-soft: rgba(255, 165, 0, .1);--sand-accent-glow: rgba(255, 165, 0, .3);--sand-accent-muted: rgba(255, 165, 0, .18);--sand-primary: #262626;--sand-primary-light: rgb(76.25, 76.25, 76.25);--sand-primary-muted: rgba(38, 38, 38, .6);--sand-secondary: #F2F2F2;--sand-secondary-dark: rgb(229.25, 229.25, 229.25);--sand-secondary-light: #FFFFFF;--color-success: #1f9d55;--color-success-soft: rgba(31, 157, 85, .12);--color-error: #e53935;--color-error-soft: rgba(229, 57, 53, .1);--font-main: Outfit, Inter, system-ui, -apple-system, sans-serif;--font-mono: Fira Code, ui-monospace, monospace;--radius-sm: 6px;--radius-md: 12px;--radius-lg: 20px;--radius-full: 9999px;--shadow-sm: 0 4px 12px rgba(0, 0, 0, .05);--shadow-md: 0 8px 24px rgba(0, 0, 0, .08);--glow: 0 0 20px rgba(255, 165, 0, .3);--transition: all .4s cubic-bezier(.165, .84, .44, 1);--container-max: 1100px}[data-theme=dark]{--theme-bg: #101112;--theme-surface: #17191c;--theme-surface-variant: #20242a;--theme-text: #F2F2F2;--theme-text-muted: rgba(242, 242, 242, .68);--theme-border: rgba(255, 255, 255, .12);--theme-footer-bg: #0a0b0c;--theme-footer-text: #F2F2F2;--sand-accent-soft: rgba(255, 165, 0, .14);--sand-accent-muted: rgba(255, 165, 0, .22);--sand-accent-glow: rgba(255, 165, 0, .18);--shadow-sm: 0 10px 24px rgba(0, 0, 0, .28);--shadow-md: 0 22px 60px rgba(0, 0, 0, .38)}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-main);background-color:var(--theme-bg);color:var(--theme-text);line-height:1.6;display:flex;transition:background-color .4s ease}.u-mt-4{margin-top:1rem}.u-mb-4{margin-bottom:1rem}._sand-badge_uye3i_1{display:inline-flex;align-items:center;gap:.35rem;padding:.4rem 1rem;border-radius:var(--radius-full);font-size:.65rem;font-weight:900;letter-spacing:1px;text-transform:uppercase;border:1px solid transparent}._sand-badge-primary_uye3i_14{background:var(--sand-accent-soft);color:var(--sand-accent)}._sand-badge-secondary_uye3i_19{background:var(--theme-surface-variant);color:var(--theme-text-muted)}._sand-badge-success_uye3i_24{background:var(--color-success-soft);color:var(--color-success);border-color:color-mix(in srgb,var(--color-success) 24%,transparent)}._sand-badge-failed_uye3i_30{background:var(--color-error-soft);color:var(--color-error);border-color:color-mix(in srgb,var(--color-error) 24%,transparent)}._sand-breadcrumbs_1uxir_1{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;color:var(--theme-text-muted);font-size:.88rem}._sand-breadcrumb-item_1uxir_10{display:inline-flex;align-items:center;gap:.45rem;min-width:0}._sand-breadcrumb-link_1uxir_17{color:inherit;text-decoration:none;padding:.2rem .35rem;border-radius:.35rem}._sand-breadcrumb-link_1uxir_17:hover{color:var(--sand-accent);background:var(--sand-accent-soft)}._sand-breadcrumb-link_1uxir_17:focus-visible{outline:3px solid color-mix(in srgb,var(--sand-accent) 55%,white);outline-offset:2px}._sand-breadcrumb-current_1uxir_32{color:var(--theme-text);font-weight:700}._sand-breadcrumb-separator_1uxir_37{font-size:1rem;opacity:.7}._sand-btn_9grrt_1{display:inline-flex;align-items:center;justify-content:center;gap:.75rem;padding:.9rem 2rem;border-radius:var(--radius-md);font-weight:700;font-size:.95rem;cursor:pointer;transition:var(--transition);border:2px solid transparent;font-family:var(--font-main);text-decoration:none;line-height:1.2;min-height:3rem;min-width:0}._sand-btn_9grrt_1:disabled{opacity:.4;cursor:not-allowed;transform:none!important;box-shadow:none!important}._sand-btn_9grrt_1:focus-visible{outline:3px solid color-mix(in srgb,var(--sand-accent) 55%,white);outline-offset:3px}._sand-btn_9grrt_1 .material-symbols-rounded{font-size:1.1rem;flex-shrink:0}@media(max-width:640px){._sand-btn_9grrt_1{width:100%;padding:.85rem 1rem;white-space:normal}}._sand-btn-primary_9grrt_42{background:var(--sand-accent);color:#fff;box-shadow:var(--glow);border-color:var(--sand-accent)}._sand-btn-primary_9grrt_42:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 12px 28px var(--sand-accent-glow);background:var(--sand-accent-dark)}._sand-btn-secondary_9grrt_54{background-color:var(--sand-primary);color:var(--sand-secondary)}._sand-btn-secondary_9grrt_54:hover:not(:disabled){background-color:var(--sand-primary-light);transform:translateY(-2px)}._sand-btn-outline_9grrt_63{background:transparent;border-color:var(--theme-border);color:var(--theme-text)}._sand-btn-outline_9grrt_63:hover:not(:disabled){border-color:var(--sand-accent);color:var(--sand-accent);background:var(--sand-accent-soft)}._sand-btn-success_9grrt_74{background:var(--color-success);color:#fff;border-color:var(--color-success)}._sand-btn-success_9grrt_74:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 12px 28px color-mix(in srgb,var(--color-success) 30%,transparent);filter:brightness(1.04)}._sand-btn-failed_9grrt_85{background:var(--color-error);color:#fff;border-color:var(--color-error)}._sand-btn-failed_9grrt_85:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 12px 28px color-mix(in srgb,var(--color-error) 28%,transparent);filter:brightness(.98)}._sand-card_i3njl_1{background-color:var(--theme-surface);border:1px solid var(--theme-border);border-radius:var(--radius-lg);overflow:hidden;transition:var(--transition);width:100%}._sand-card_i3njl_1:hover{transform:translateY(-8px);box-shadow:var(--shadow-md);border-color:var(--sand-accent)}._sand-card-header_i3njl_15{padding:1.25rem 1.5rem;border-bottom:1px solid var(--theme-border);font-weight:800;font-size:1.2rem}._sand-card-body_i3njl_22{padding:1.5rem}._sand-card-footer_i3njl_26{padding:1rem 1.5rem;background-color:var(--theme-surface-variant);border-top:1px solid var(--theme-border);display:flex;gap:1rem}@media(max-width:640px){._sand-card-header_i3njl_15,._sand-card-body_i3njl_22,._sand-card-footer_i3njl_26{padding-inline:1rem}._sand-card-footer_i3njl_26{flex-direction:column}}._sand-code-block_197ic_1{margin:0;padding:1.5rem;font-family:var(--font-mono);font-size:.85rem;line-height:1.7;color:#d1d5db;overflow-x:auto;background:var(--sand-primary);border-radius:var(--radius-lg);border:1px solid var(--theme-border);position:relative}._sand-copy-btn_197ic_15{position:absolute;top:1rem;right:1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:var(--sand-secondary-dark);padding:.5rem .75rem;border-radius:8px;cursor:pointer;font-size:.7rem;font-weight:700;display:flex;align-items:center;gap:6px;transition:var(--transition)}._sand-copy-btn_197ic_15:hover{border-color:var(--sand-accent);color:#fff}._sand-copy-btn_197ic_15:focus-visible{outline:3px solid color-mix(in srgb,var(--sand-accent) 55%,white);outline-offset:2px}._sand-code-tabs_197ic_41{background:var(--sand-primary);border-radius:var(--radius-lg);overflow:hidden;margin-top:1rem;border:1px solid var(--theme-border)}._sand-code-tabs_197ic_41 ._sand-code-block_197ic_1{border:none;border-radius:0}._sand-tab-headers_197ic_53{display:flex;background:var(--sand-primary-light);padding:0 .75rem;overflow-x:auto}._sand-tab-btn_197ic_60{padding:.9rem 1rem;background:none;border:none;color:#f2f2f280;font-family:var(--font-main);font-weight:700;font-size:.8rem;cursor:pointer;position:relative;transition:var(--transition);white-space:nowrap}._sand-tab-btn_197ic_60:focus-visible{outline:3px solid color-mix(in srgb,var(--sand-accent) 55%,white);outline-offset:-3px}._sand-tab-btn_197ic_60._active_197ic_77{color:#fff}._sand-tab-btn_197ic_60._active_197ic_77:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:3px;background:var(--sand-accent)}@media(max-width:640px){._sand-code-block_197ic_1{padding:1.1rem;font-size:.8rem}._sand-copy-btn_197ic_15{top:.75rem;right:.75rem}}._sand-divider_svs0p_1{height:1px;background:var(--theme-border);width:100%;margin:1rem 0}._sand-feedback_1pp8i_1{width:min(100%,26rem);border-radius:var(--radius-lg);border:1px solid var(--theme-border);background:linear-gradient(180deg,color-mix(in srgb,var(--theme-surface) 95%,white) 0%,var(--theme-surface) 100%);box-shadow:var(--shadow-md);color:var(--theme-text);overflow:hidden}._sand-feedback-toast_1pp8i_11{padding:1rem 1.1rem;position:relative}._sand-feedback-toast_1pp8i_11:before{content:"";position:absolute;inset:0 auto 0 0;width:.26rem;background:var(--sand-accent)}._sand-feedback-snackbar_1pp8i_24{width:min(100%,34rem);padding:.95rem 1rem;border-radius:1rem;background:linear-gradient(180deg,color-mix(in srgb,var(--sand-primary) 88%,black),color-mix(in srgb,var(--sand-primary-light) 86%,black));color:var(--sand-secondary);border-color:#ffffff14}._sand-feedback-row_1pp8i_33{display:flex;align-items:flex-start;gap:.85rem}._sand-feedback-icon_1pp8i_39{font-size:1.2rem;margin-top:.05rem;flex-shrink:0}._sand-feedback-content_1pp8i_45{display:flex;flex-direction:column;gap:.2rem;min-width:0}._sand-feedback-title_1pp8i_52{font-size:.95rem;font-weight:800}._sand-feedback-message_1pp8i_57{font-size:.84rem;line-height:1.5;color:inherit;opacity:.86}._sand-feedback-action_1pp8i_64{margin-left:auto;flex-shrink:0}._sand-feedback-success_1pp8i_69{border-color:color-mix(in srgb,var(--color-success) 22%,var(--theme-border))}._sand-feedback-success_1pp8i_69._sand-feedback-toast_1pp8i_11:before{background:var(--color-success)}._sand-feedback-success_1pp8i_69 ._sand-feedback-icon_1pp8i_39{color:var(--color-success)}._sand-feedback-failed_1pp8i_81{border-color:color-mix(in srgb,var(--color-error) 22%,var(--theme-border))}._sand-feedback-failed_1pp8i_81._sand-feedback-toast_1pp8i_11:before{background:var(--color-error)}._sand-feedback-failed_1pp8i_81 ._sand-feedback-icon_1pp8i_39{color:var(--color-error)}._sand-feedback-info_1pp8i_93._sand-feedback-toast_1pp8i_11:before{background:var(--sand-accent)}._sand-feedback-info_1pp8i_93 ._sand-feedback-icon_1pp8i_39{color:var(--sand-accent)}[data-theme=dark] ._sand-feedback_1pp8i_1{background:linear-gradient(180deg,color-mix(in srgb,var(--theme-surface) 96%,white 4%),color-mix(in srgb,var(--theme-surface-variant) 82%,black))}[data-theme=dark] ._sand-feedback-snackbar_1pp8i_24{background:linear-gradient(180deg,#1b1f24,#242a31);border-color:#ffffff1a}@media(max-width:640px){._sand-feedback-row_1pp8i_33{flex-wrap:wrap}._sand-feedback-action_1pp8i_64{margin-left:0;width:100%}}._sand-form-group_fyw0t_1{display:flex;flex-direction:column;gap:.6rem;width:100%}._sand-label_fyw0t_8{font-size:.75rem;font-weight:800;color:var(--theme-text-muted);text-transform:uppercase;letter-spacing:1.5px;cursor:pointer}._sand-input_fyw0t_17{width:100%;background-color:var(--theme-surface);border:2px solid var(--theme-border);border-radius:var(--radius-md);padding:1rem 1.25rem;font-family:inherit;color:var(--theme-text);transition:var(--transition);font-size:1rem}._sand-input_fyw0t_17:focus{outline:none;border-color:var(--sand-accent);box-shadow:0 0 0 5px var(--sand-accent-soft)}._sand-input_fyw0t_17:focus-visible{outline:3px solid color-mix(in srgb,var(--sand-accent) 40%,white);outline-offset:2px}._sand-input-error_fyw0t_38{border-color:var(--color-error);background:var(--color-error-soft)}._sand-input-error_fyw0t_38:focus{border-color:var(--color-error);box-shadow:0 0 0 5px var(--color-error-soft)}._sand-helper-text-error_fyw0t_47{color:var(--color-error);font-size:.75rem;font-weight:700}@media(max-width:640px){._sand-input_fyw0t_17{padding:.9rem 1rem;font-size:.95rem}}._sand-kbd_mo78g_1{display:inline-flex;align-items:center;justify-content:center;min-width:2.1rem;min-height:2rem;padding:.34rem .68rem;border-radius:.5rem;border:1px solid rgba(15,23,42,.08);background:linear-gradient(180deg,#fff,#f3f4f6);box-shadow:inset 0 1px #fffffff2,inset 0 -1px #94a3b82e,0 0 0 1px #ffffffb3,0 2px #cbd5e1e6,0 6px 14px #0f172a1a;color:#1f2937;font-family:var(--font-mono);font-size:.78rem;font-weight:600;line-height:1;letter-spacing:0;text-transform:uppercase;-webkit-user-select:none;user-select:none;white-space:nowrap}[data-theme=dark] ._sand-kbd_mo78g_1{border-color:#ffffff0f;background:linear-gradient(180deg,#434a54,#2a3038);box-shadow:inset 0 1px #ffffff24,inset 0 -1px #0000006b,0 0 0 1px #ffffff08,0 2px #161a20,0 8px 18px #00000057;color:#f8fafc}._sand-container_174rd_1{max-width:var(--container-max);margin:0 auto;width:100%}._sand-header_174rd_7{background:var(--theme-surface);border-bottom:1px solid var(--theme-border);padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}._sand-tool-layout_174rd_17{display:grid;grid-template-columns:320px 1fr;gap:1.5rem;align-items:stretch}._sand-tool-panel_174rd_24{background:var(--theme-surface);border:1px solid var(--theme-border);border-radius:var(--radius-lg);padding:2rem;display:flex;flex-direction:column;gap:1.5rem}._sand-result-panel_174rd_34{background:var(--theme-surface-variant);border-radius:var(--radius-lg);padding:3rem;min-height:400px;border:2px dashed var(--theme-border);display:flex;align-items:center;justify-content:center;color:var(--theme-text-muted)}@media(max-width:900px){._sand-tool-layout_174rd_17{grid-template-columns:1fr}._sand-result-panel_174rd_34{min-height:240px}}@media(max-width:640px){._sand-header_174rd_7{padding:.9rem 1rem;flex-wrap:wrap}._sand-tool-panel_174rd_24,._sand-result-panel_174rd_34{padding:1rem}}._sand-modal-root_uryk1_1{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:1.25rem}._sand-modal-backdrop_uryk1_11{position:absolute;inset:0;background:#00000085;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}._sand-modal-panel_uryk1_18{position:relative;width:min(100%,38rem);max-height:min(88vh,48rem);overflow:auto;border-radius:var(--radius-lg);border:1px solid var(--theme-border);background:var(--theme-surface);box-shadow:0 24px 80px #00000047}._sand-modal-header_uryk1_29{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1.25rem 1.25rem 1rem;border-bottom:1px solid var(--theme-border)}._sand-modal-title_uryk1_38{font-size:1.15rem;font-weight:800;line-height:1.2}._sand-modal-description_uryk1_44{margin-top:.35rem;font-size:.9rem;color:var(--theme-text-muted);line-height:1.5}._sand-modal-close_uryk1_51{display:inline-flex;align-items:center;justify-content:center;width:2.4rem;height:2.4rem;border-radius:999px;border:1px solid var(--theme-border);background:var(--theme-surface-variant);color:var(--theme-text);cursor:pointer;transition:var(--transition)}._sand-modal-close_uryk1_51:hover{color:var(--sand-accent);border-color:var(--sand-accent)}._sand-modal-close_uryk1_51:focus-visible{outline:3px solid color-mix(in srgb,var(--sand-accent) 55%,white);outline-offset:2px}._sand-modal-body_uryk1_73{padding:1.25rem}._sand-modal-footer_uryk1_77{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.75rem;padding:0 1.25rem 1.25rem}@media(max-width:640px){._sand-modal-root_uryk1_1{padding:.85rem;align-items:flex-end}._sand-modal-panel_uryk1_18{width:100%;max-height:92vh}._sand-modal-header_uryk1_29,._sand-modal-body_uryk1_73,._sand-modal-footer_uryk1_77{padding-inline:1rem}._sand-modal-footer_uryk1_77>*{width:100%}}._sand-pagination_cizv5_1{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}._sand-page-btn_cizv5_8{min-width:2.5rem;height:2.5rem;padding:0 .85rem;display:inline-flex;align-items:center;justify-content:center;border-radius:.8rem;border:1px solid var(--theme-border);background:var(--theme-surface);color:var(--theme-text);cursor:pointer;transition:var(--transition);font-weight:700}._sand-page-btn_cizv5_8:hover:not(:disabled){border-color:var(--sand-accent);color:var(--sand-accent)}._sand-page-btn_cizv5_8:focus-visible{outline:3px solid color-mix(in srgb,var(--sand-accent) 55%,white);outline-offset:2px}._sand-page-btn_cizv5_8:disabled{opacity:.45;cursor:not-allowed}._sand-page-btn-active_cizv5_36{background:var(--sand-accent);border-color:var(--sand-accent);color:#fff}._sand-choice-group_viqgz_1{display:flex;flex-direction:column;gap:.85rem}._sand-choice-row_viqgz_7{display:inline-flex;align-items:center;gap:.75rem;width:fit-content;cursor:pointer;color:var(--theme-text)}._sand-choice-input_viqgz_16{position:absolute;opacity:0;pointer-events:none}._sand-choice-control_viqgz_22{width:1.2rem;height:1.2rem;flex-shrink:0;border:2px solid var(--theme-border);background:var(--theme-surface);transition:var(--transition);position:relative}._sand-choice-input_viqgz_16:focus-visible+._sand-choice-control_viqgz_22{outline:3px solid color-mix(in srgb,var(--sand-accent) 55%,white);outline-offset:3px}._sand-choice-row_viqgz_7:hover ._sand-choice-control_viqgz_22{border-color:var(--sand-accent)}._sand-checkbox_viqgz_41{border-radius:.35rem}._sand-checkbox_viqgz_41:after{content:"";position:absolute;inset:.12rem;border-radius:.2rem;background:var(--sand-accent);transform:scale(0);transition:var(--transition)}._sand-choice-input_viqgz_16:checked+._sand-checkbox_viqgz_41:after{transform:scale(1)}._sand-checkbox-icon_viqgz_59{position:absolute;inset:0;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:.9rem;z-index:1;opacity:0;transition:var(--transition)}._sand-choice-input_viqgz_16:checked+._sand-checkbox_viqgz_41 ._sand-checkbox-icon_viqgz_59{opacity:1}._sand-radio_viqgz_76{border-radius:999px}._sand-radio_viqgz_76:after{content:"";position:absolute;inset:.22rem;border-radius:999px;background:var(--sand-accent);transform:scale(0);transition:var(--transition)}._sand-choice-input_viqgz_16:checked+._sand-radio_viqgz_76:after{transform:scale(1)}._sand-switch_viqgz_94{width:2.7rem;height:1.55rem;border-radius:999px;background:var(--theme-surface-variant)}._sand-switch_viqgz_94:after{content:"";position:absolute;top:.12rem;left:.14rem;width:1rem;height:1rem;border-radius:999px;background:var(--sand-secondary-light);box-shadow:var(--shadow-sm);transition:var(--transition)}._sand-choice-input_viqgz_16:checked+._sand-switch_viqgz_94{background:var(--sand-accent);border-color:var(--sand-accent)}._sand-choice-input_viqgz_16:checked+._sand-switch_viqgz_94:after{transform:translate(1.05rem)}._sand-choice-content_viqgz_123{display:flex;flex-direction:column;gap:.1rem}._sand-choice-label_viqgz_129{font-weight:700;font-size:.92rem}._sand-choice-description_viqgz_134{color:var(--theme-text-muted);font-size:.8rem;line-height:1.45}@media(max-width:640px){._sand-choice-row_viqgz_7{width:100%;align-items:flex-start}}

package/package.json

@@ -0,0 +1,57 @@
+{
+  "name": "@sandurtech/sandui",
+  "version": "0.0.1",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "lint": "eslint .",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "preview": "vite preview"
+  },
+  "files": [
+    "dist"
+  ],
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "main": "./dist/sandui.umd.js",
+  "module": "./dist/sandui.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/sandui.js",
+      "require": "./dist/sandui.umd.js"
+    },
+    "./style.css": "./dist/style.css"
+  },
+  "peerDependencies": {
+    "react": ">=18",
+    "react-dom": ">=18"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.39.1",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.2",
+    "@testing-library/user-event": "^14.6.1",
+    "@types/node": "^24.12.0",
+    "@types/react": "^19.2.7",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^5.1.1",
+    "eslint": "^9.39.1",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-react-refresh": "^0.4.24",
+    "globals": "^16.5.0",
+    "jsdom": "^28.1.0",
+    "sass": "^1.98.0",
+    "typescript": "~5.9.3",
+    "typescript-eslint": "^8.48.0",
+    "vite": "^7.3.1",
+    "vite-plugin-dts": "^4.5.4",
+    "vitest": "^4.0.18"
+  },
+  "dependencies": {}
+}