@schandlergarcia/sf-web-components 1.0.0

package/dist/components/library/theme/AppThemeProvider.js

@@ -0,0 +1,55 @@
+import { jsx as i } from "react/jsx-runtime";
+import t from "react";
+import { tokens as d, getTokenCSSProperties as u } from "./tokens.js";
+const a = t.createContext({
+  mode: "light",
+  theme: d,
+  toggle: () => {
+  }
+}), c = "app-color-mode";
+function f(r) {
+  if (typeof document > "u") return;
+  const o = document.documentElement;
+  r === "dark" ? o.classList.add("dark") : o.classList.remove("dark");
+}
+function l() {
+  if (typeof document > "u") return;
+  const r = document.documentElement, o = u();
+  for (const [e, s] of Object.entries(o))
+    r.style.setProperty(e, s);
+}
+function k() {
+  return t.useContext(a);
+}
+function y({ initialMode: r = "light", children: o }) {
+  const [e, s] = t.useState(r);
+  t.useEffect(() => {
+    l();
+  }, []), t.useEffect(() => {
+    try {
+      const n = window.localStorage.getItem(c);
+      (n === "light" || n === "dark") && s(n);
+    } catch {
+    }
+  }, []), t.useEffect(() => {
+    f(e);
+    try {
+      window.localStorage.setItem(c, e);
+    } catch {
+    }
+  }, [e]);
+  const m = t.useMemo(
+    () => ({
+      mode: e,
+      theme: d,
+      toggle: () => s((n) => n === "dark" ? "light" : "dark")
+    }),
+    [e]
+  );
+  return /* @__PURE__ */ i(a.Provider, { value: m, children: o });
+}
+export {
+  y as default,
+  k as useThemeMode
+};
+//# sourceMappingURL=AppThemeProvider.js.map

package/dist/components/library/theme/AppThemeProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppThemeProvider.js","sources":["../../../../src/components/library/theme/AppThemeProvider.jsx"],"sourcesContent":["import React from \"react\";\nimport { tokens, getTokenCSSProperties } from \"./tokens\";\n\nconst ThemeModeContext = React.createContext({\n  mode: \"light\",\n  theme: tokens,\n  toggle: () => {}\n});\n\nconst STORAGE_KEY = \"app-color-mode\";\n\nfunction applyHtmlDarkClass(mode) {\n  if (typeof document === \"undefined\") return;\n  const root = document.documentElement;\n  if (mode === \"dark\") root.classList.add(\"dark\");\n  else root.classList.remove(\"dark\");\n}\n\nfunction applyTokenCSSProperties() {\n  if (typeof document === \"undefined\") return;\n  const root = document.documentElement;\n  const props = getTokenCSSProperties();\n  for (const [key, value] of Object.entries(props)) {\n    root.style.setProperty(key, value);\n  }\n}\n\nexport function useThemeMode() {\n  return React.useContext(ThemeModeContext);\n}\n\nexport default function AppThemeProvider({ initialMode = \"light\", children }) {\n  const [mode, setMode] = React.useState(initialMode);\n\n  React.useEffect(() => {\n    applyTokenCSSProperties();\n  }, []);\n\n  React.useEffect(() => {\n    try {\n      const stored = window.localStorage.getItem(STORAGE_KEY);\n      if (stored === \"light\" || stored === \"dark\") setMode(stored);\n    } catch {\n      // ignore\n    }\n  }, []);\n\n  React.useEffect(() => {\n    applyHtmlDarkClass(mode);\n    try {\n      window.localStorage.setItem(STORAGE_KEY, mode);\n    } catch {\n      // ignore\n    }\n  }, [mode]);\n\n  const value = React.useMemo(\n    () => ({\n      mode,\n      theme: tokens,\n      toggle: () => setMode((m) => (m === \"dark\" ? \"light\" : \"dark\"))\n    }),\n    [mode]\n  );\n\n  return <ThemeModeContext.Provider value={value}>{children}</ThemeModeContext.Provider>;\n}\n"],"names":["ThemeModeContext","React","tokens","STORAGE_KEY","applyHtmlDarkClass","mode","root","applyTokenCSSProperties","props","getTokenCSSProperties","key","value","useThemeMode","AppThemeProvider","initialMode","children","setMode","stored","m","jsx"],"mappings":";;;AAGA,MAAMA,IAAmBC,EAAM,cAAc;AAAA,EAC3C,MAAM;AAAA,EACN,OAAOC;AAAA,EACP,QAAQ,MAAM;AAAA,EAAC;AACjB,CAAC,GAEKC,IAAc;AAEpB,SAASC,EAAmBC,GAAM;AAChC,MAAI,OAAO,WAAa,IAAa;AACrC,QAAMC,IAAO,SAAS;AACtB,EAAID,MAAS,SAAQC,EAAK,UAAU,IAAI,MAAM,IACzCA,EAAK,UAAU,OAAO,MAAM;AACnC;AAEA,SAASC,IAA0B;AACjC,MAAI,OAAO,WAAa,IAAa;AACrC,QAAMD,IAAO,SAAS,iBAChBE,IAAQC,EAAA;AACd,aAAW,CAACC,GAAKC,CAAK,KAAK,OAAO,QAAQH,CAAK;AAC7C,IAAAF,EAAK,MAAM,YAAYI,GAAKC,CAAK;AAErC;AAEO,SAASC,IAAe;AAC7B,SAAOX,EAAM,WAAWD,CAAgB;AAC1C;AAEA,SAAwBa,EAAiB,EAAE,aAAAC,IAAc,SAAS,UAAAC,KAAY;AAC5E,QAAM,CAACV,GAAMW,CAAO,IAAIf,EAAM,SAASa,CAAW;AAElD,EAAAb,EAAM,UAAU,MAAM;AACpB,IAAAM,EAAA;AAAA,EACF,GAAG,CAAA,CAAE,GAELN,EAAM,UAAU,MAAM;AACpB,QAAI;AACF,YAAMgB,IAAS,OAAO,aAAa,QAAQd,CAAW;AACtD,OAAIc,MAAW,WAAWA,MAAW,aAAgBA,CAAM;AAAA,IAC7D,QAAQ;AAAA,IAER;AAAA,EACF,GAAG,CAAA,CAAE,GAELhB,EAAM,UAAU,MAAM;AACpB,IAAAG,EAAmBC,CAAI;AACvB,QAAI;AACF,aAAO,aAAa,QAAQF,GAAaE,CAAI;AAAA,IAC/C,QAAQ;AAAA,IAER;AAAA,EACF,GAAG,CAACA,CAAI,CAAC;AAET,QAAMM,IAAQV,EAAM;AAAA,IAClB,OAAO;AAAA,MACL,MAAAI;AAAA,MACA,OAAOH;AAAA,MACP,QAAQ,MAAMc,EAAQ,CAACE,MAAOA,MAAM,SAAS,UAAU,MAAO;AAAA,IAAA;AAAA,IAEhE,CAACb,CAAI;AAAA,EAAA;AAGP,SAAO,gBAAAc,EAACnB,EAAiB,UAAjB,EAA0B,OAAAW,GAAe,UAAAI,EAAA,CAAS;AAC5D;"}

package/dist/components/library/theme/tokens.js

@@ -0,0 +1,55 @@
+const t = {
+  colors: {
+    brand: {
+      50: "#EEF2FF",
+      100: "#E0E7FF",
+      200: "#C7D2FE",
+      300: "#A5B4FC",
+      400: "#818CF8",
+      500: "#6366F1",
+      600: "#4F46E5",
+      700: "#4338CA",
+      800: "#3730A3",
+      900: "#312E81",
+      950: "#1E1B4E"
+    },
+    accent: {
+      50: "#ECFEFF",
+      100: "#CFFAFE",
+      200: "#A5F3FC",
+      300: "#67E8F9",
+      400: "#22D3EE",
+      500: "#06B6D4",
+      600: "#0891B2",
+      700: "#0E7490",
+      800: "#155E75",
+      900: "#164E63",
+      950: "#083344"
+    }
+  },
+  fonts: {
+    sans: "Inter",
+    mono: "JetBrains Mono"
+  },
+  radius: {
+    sm: "0.5rem",
+    md: "0.75rem",
+    lg: "1rem"
+  },
+  spacing: {
+    pageX: "1.25rem",
+    pageY: "1.25rem"
+  }
+};
+function F() {
+  const e = {};
+  for (const [o, r] of Object.entries(t.colors))
+    for (const [s, n] of Object.entries(r))
+      e[`--color-${o}-${s}`] = n;
+  return e;
+}
+export {
+  F as getTokenCSSProperties,
+  t as tokens
+};
+//# sourceMappingURL=tokens.js.map

package/dist/components/library/theme/tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.js","sources":["../../../../src/components/library/theme/tokens.jsx"],"sourcesContent":["/**\n * Design tokens — single source of truth for branding.\n *\n * To rebrand a command center:\n *   1. Swap the `brand` palette (use any Tailwind-style color scale)\n *   2. Swap the `accent` palette\n *   3. Change `fonts.sans` in _app.js (next/font import)\n *\n * AppThemeProvider injects these as CSS custom properties on :root,\n * and tailwind.config.js references them via var(--color-brand-*).\n */\n\nexport const tokens = {\n  colors: {\n    brand: {\n      50: \"#EEF2FF\",\n      100: \"#E0E7FF\",\n      200: \"#C7D2FE\",\n      300: \"#A5B4FC\",\n      400: \"#818CF8\",\n      500: \"#6366F1\",\n      600: \"#4F46E5\",\n      700: \"#4338CA\",\n      800: \"#3730A3\",\n      900: \"#312E81\",\n      950: \"#1E1B4E\",\n    },\n    accent: {\n      50: \"#ECFEFF\",\n      100: \"#CFFAFE\",\n      200: \"#A5F3FC\",\n      300: \"#67E8F9\",\n      400: \"#22D3EE\",\n      500: \"#06B6D4\",\n      600: \"#0891B2\",\n      700: \"#0E7490\",\n      800: \"#155E75\",\n      900: \"#164E63\",\n      950: \"#083344\",\n    },\n  },\n\n  fonts: {\n    sans: \"Inter\",\n    mono: \"JetBrains Mono\",\n  },\n\n  radius: {\n    sm: \"0.5rem\",\n    md: \"0.75rem\",\n    lg: \"1rem\",\n  },\n\n  spacing: {\n    pageX: \"1.25rem\",\n    pageY: \"1.25rem\",\n  },\n};\n\n/**\n * Generates CSS custom property assignments from the token palettes.\n * Used by AppThemeProvider to inject on :root at runtime.\n */\nexport function getTokenCSSProperties() {\n  const props = {};\n  for (const [palette, shades] of Object.entries(tokens.colors)) {\n    for (const [shade, value] of Object.entries(shades)) {\n      props[`--color-${palette}-${shade}`] = value;\n    }\n  }\n  return props;\n}\n"],"names":["tokens","getTokenCSSProperties","props","palette","shades","shade","value"],"mappings":"AAYO,MAAMA,IAAS;AAAA,EACpB,QAAQ;AAAA,IACN,OAAO;AAAA,MACL,IAAI;AAAA,MACJ,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,IAAA;AAAA,IAEP,QAAQ;AAAA,MACN,IAAI;AAAA,MACJ,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,IAAA;AAAA,EACP;AAAA,EAGF,OAAO;AAAA,IACL,MAAM;AAAA,IACN,MAAM;AAAA,EAAA;AAAA,EAGR,QAAQ;AAAA,IACN,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA;AAAA,EAGN,SAAS;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,EAAA;AAEX;AAMO,SAASC,IAAwB;AACtC,QAAMC,IAAQ,CAAA;AACd,aAAW,CAACC,GAASC,CAAM,KAAK,OAAO,QAAQJ,EAAO,MAAM;AAC1D,eAAW,CAACK,GAAOC,CAAK,KAAK,OAAO,QAAQF,CAAM;AAChD,MAAAF,EAAM,WAAWC,CAAO,IAAIE,CAAK,EAAE,IAAIC;AAG3C,SAAOJ;AACT;"}

package/dist/components/library/ui/Avatar.js

@@ -0,0 +1,33 @@
+import { jsx as a } from "react/jsx-runtime";
+import m from "react";
+const o = {
+  xs: "h-6 w-6 text-[9px]",
+  sm: "h-8 w-8 text-[10px]",
+  md: "h-9 w-9 text-xs",
+  lg: "h-11 w-11 text-sm"
+}, t = {
+  slate: "bg-slate-800 text-white",
+  brand: "bg-brand-500 text-white",
+  neutral: "bg-slate-100 text-slate-700 dark:bg-slate-800 dark:text-slate-200"
+};
+function p({ src: i, name: e, initials: x, icon: n, size: c = "sm", tone: d = "slate", className: s = "", ...r }) {
+  const l = o[c] ?? o.sm;
+  if (i)
+    return /* @__PURE__ */ a(
+      "img",
+      {
+        src: i,
+        alt: e ?? "",
+        className: `${l} shrink-0 rounded-full border border-slate-200 object-cover dark:border-slate-800 ${s}`,
+        ...r
+      }
+    );
+  if (m.isValidElement(n))
+    return /* @__PURE__ */ a("div", { className: `${l} ${t[d] ?? t.slate} flex shrink-0 items-center justify-center rounded-full ${s}`, ...r, children: n });
+  const f = x ?? (e ? e.split(" ").map((u) => u[0]).join("").slice(0, 2).toUpperCase() : "?");
+  return /* @__PURE__ */ a("div", { className: `${l} ${t[d] ?? t.slate} flex shrink-0 items-center justify-center rounded-full font-bold ${s}`, ...r, children: f });
+}
+export {
+  p as default
+};
+//# sourceMappingURL=Avatar.js.map

package/dist/components/library/ui/Avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.js","sources":["../../../../src/components/library/ui/Avatar.jsx"],"sourcesContent":["import React from \"react\";\n\nconst SIZE_MAP = {\n  xs: \"h-6 w-6 text-[9px]\",\n  sm: \"h-8 w-8 text-[10px]\",\n  md: \"h-9 w-9 text-xs\",\n  lg: \"h-11 w-11 text-sm\",\n};\n\nconst TONE_MAP = {\n  slate:   \"bg-slate-800 text-white\",\n  brand:   \"bg-brand-500 text-white\",\n  neutral: \"bg-slate-100 text-slate-700 dark:bg-slate-800 dark:text-slate-200\",\n};\n\nexport default function Avatar({ src, name, initials, icon, size = \"sm\", tone = \"slate\", className = \"\", ...rest }) {\n  const sizeClass = SIZE_MAP[size] ?? SIZE_MAP.sm;\n\n  if (src) {\n    return (\n      <img\n        src={src}\n        alt={name ?? \"\"}\n        className={`${sizeClass} shrink-0 rounded-full border border-slate-200 object-cover dark:border-slate-800 ${className}`}\n        {...rest}\n      />\n    );\n  }\n\n  if (React.isValidElement(icon)) {\n    return (\n      <div className={`${sizeClass} ${TONE_MAP[tone] ?? TONE_MAP.slate} flex shrink-0 items-center justify-center rounded-full ${className}`} {...rest}>\n        {icon}\n      </div>\n    );\n  }\n\n  const label = initials ?? (name ? name.split(\" \").map(w => w[0]).join(\"\").slice(0, 2).toUpperCase() : \"?\");\n  return (\n    <div className={`${sizeClass} ${TONE_MAP[tone] ?? TONE_MAP.slate} flex shrink-0 items-center justify-center rounded-full font-bold ${className}`} {...rest}>\n      {label}\n    </div>\n  );\n}\n"],"names":["SIZE_MAP","TONE_MAP","Avatar","src","name","initials","icon","size","tone","className","rest","sizeClass","jsx","React","label","w"],"mappings":";;AAEA,MAAMA,IAAW;AAAA,EACf,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEMC,IAAW;AAAA,EACf,OAAS;AAAA,EACT,OAAS;AAAA,EACT,SAAS;AACX;AAEA,SAAwBC,EAAO,EAAE,KAAAC,GAAK,MAAAC,GAAM,UAAAC,GAAU,MAAAC,GAAM,MAAAC,IAAO,MAAM,MAAAC,IAAO,SAAS,WAAAC,IAAY,IAAI,GAAGC,KAAQ;AAClH,QAAMC,IAAYX,EAASO,CAAI,KAAKP,EAAS;AAE7C,MAAIG;AACF,WACE,gBAAAS;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAT;AAAA,QACA,KAAKC,KAAQ;AAAA,QACb,WAAW,GAAGO,CAAS,qFAAqFF,CAAS;AAAA,QACpH,GAAGC;AAAA,MAAA;AAAA,IAAA;AAKV,MAAIG,EAAM,eAAeP,CAAI;AAC3B,6BACG,OAAA,EAAI,WAAW,GAAGK,CAAS,IAAIV,EAASO,CAAI,KAAKP,EAAS,KAAK,2DAA2DQ,CAAS,IAAK,GAAGC,GACzI,UAAAJ,GACH;AAIJ,QAAMQ,IAAQT,MAAaD,IAAOA,EAAK,MAAM,GAAG,EAAE,IAAI,CAAAW,MAAKA,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,MAAM,GAAG,CAAC,EAAE,YAAA,IAAgB;AACtG,2BACG,OAAA,EAAI,WAAW,GAAGJ,CAAS,IAAIV,EAASO,CAAI,KAAKP,EAAS,KAAK,qEAAqEQ,CAAS,IAAK,GAAGC,GACnJ,UAAAI,GACH;AAEJ;"}

package/dist/components/library/ui/Button.js

@@ -0,0 +1,50 @@
+import { jsx as u } from "react/jsx-runtime";
+import "react";
+const t = {
+  primary: "bg-brand-600 text-white hover:bg-brand-500 dark:bg-brand-500 dark:hover:bg-brand-400 border-transparent",
+  secondary: "bg-slate-900 text-white hover:bg-slate-800 dark:bg-slate-100 dark:text-slate-900 dark:hover:bg-slate-200 border-transparent",
+  outline: "bg-transparent text-slate-900 hover:bg-slate-50 dark:text-slate-50 dark:hover:bg-slate-900 border-slate-200 dark:border-slate-800",
+  ghost: "bg-transparent text-slate-900 hover:bg-slate-100 dark:text-slate-50 dark:hover:bg-slate-900 border-transparent"
+}, e = {
+  sm: "h-8 px-3 text-sm",
+  md: "h-10 px-4 text-sm",
+  lg: "h-12 px-5 text-base"
+};
+function c({
+  variant: r = "primary",
+  size: a = "md",
+  fullWidth: s = !1,
+  disabled: o = !1,
+  onClick: n = () => {
+  },
+  children: l,
+  style: d = void 0,
+  className: i = "",
+  ...b
+}) {
+  const g = t[r] ?? t.primary, f = e[a] ?? e.md;
+  return /* @__PURE__ */ u(
+    "button",
+    {
+      type: "button",
+      onClick: n,
+      disabled: o,
+      style: d,
+      className: [
+        "inline-flex items-center justify-center gap-2 rounded-lg border font-medium shadow-sm transition",
+        "focus:outline-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-2 dark:focus-visible:ring-offset-slate-950",
+        "disabled:cursor-not-allowed disabled:opacity-60",
+        g,
+        f,
+        s ? "w-full" : "",
+        i
+      ].filter(Boolean).join(" "),
+      ...b,
+      children: l
+    }
+  );
+}
+export {
+  c as default
+};
+//# sourceMappingURL=Button.js.map

package/dist/components/library/ui/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sources":["../../../../src/components/library/ui/Button.jsx"],"sourcesContent":["import React from \"react\";\n\nconst VARIANT_CLASSES = {\n  primary:\n    \"bg-brand-600 text-white hover:bg-brand-500 dark:bg-brand-500 dark:hover:bg-brand-400 border-transparent\",\n  secondary:\n    \"bg-slate-900 text-white hover:bg-slate-800 dark:bg-slate-100 dark:text-slate-900 dark:hover:bg-slate-200 border-transparent\",\n  outline:\n    \"bg-transparent text-slate-900 hover:bg-slate-50 dark:text-slate-50 dark:hover:bg-slate-900 border-slate-200 dark:border-slate-800\",\n  ghost:\n    \"bg-transparent text-slate-900 hover:bg-slate-100 dark:text-slate-50 dark:hover:bg-slate-900 border-transparent\"\n};\n\nconst SIZE_CLASSES = {\n  sm: \"h-8 px-3 text-sm\",\n  md: \"h-10 px-4 text-sm\",\n  lg: \"h-12 px-5 text-base\"\n};\n\nexport default function UIButton({\n  variant = \"primary\",\n  size = \"md\",\n  fullWidth = false,\n  disabled = false,\n  onClick = () => {},\n  children,\n  style = undefined,\n  className = \"\",\n  ...rest\n}) {\n  const variantClass = VARIANT_CLASSES[variant] ?? VARIANT_CLASSES.primary;\n  const sizeClass = SIZE_CLASSES[size] ?? SIZE_CLASSES.md;\n\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      disabled={disabled}\n      style={style}\n      className={[\n        \"inline-flex items-center justify-center gap-2 rounded-lg border font-medium shadow-sm transition\",\n        \"focus:outline-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-2 dark:focus-visible:ring-offset-slate-950\",\n        \"disabled:cursor-not-allowed disabled:opacity-60\",\n        variantClass,\n        sizeClass,\n        fullWidth ? \"w-full\" : \"\",\n        className\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      {...rest}\n    >\n      {children}\n    </button>\n  );\n}\n\n\n"],"names":["VARIANT_CLASSES","SIZE_CLASSES","UIButton","variant","size","fullWidth","disabled","onClick","children","style","className","rest","variantClass","sizeClass","jsx"],"mappings":";;AAEA,MAAMA,IAAkB;AAAA,EACtB,SACE;AAAA,EACF,WACE;AAAA,EACF,SACE;AAAA,EACF,OACE;AACJ,GAEMC,IAAe;AAAA,EACnB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,SAAwBC,EAAS;AAAA,EAC/B,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,WAAAC,IAAY;AAAA,EACZ,UAAAC,IAAW;AAAA,EACX,SAAAC,IAAU,MAAM;AAAA,EAAC;AAAA,EACjB,UAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,GAAG;AACD,QAAMC,IAAeZ,EAAgBG,CAAO,KAAKH,EAAgB,SAC3Da,IAAYZ,EAAaG,CAAI,KAAKH,EAAa;AAErD,SACE,gBAAAa;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,SAAAP;AAAA,MACA,UAAAD;AAAA,MACA,OAAAG;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACAG;AAAA,QACAC;AAAA,QACAR,IAAY,WAAW;AAAA,QACvBK;AAAA,MAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MACV,GAAGC;AAAA,MAEH,UAAAH;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/components/library/ui/Card.js

@@ -0,0 +1,21 @@
+import { jsx as t } from "react/jsx-runtime";
+import "react";
+function i({ children: r, padding: e = "p-5", style: o, className: a = "", ...d }) {
+  return /* @__PURE__ */ t(
+    "div",
+    {
+      style: o,
+      className: [
+        "rounded-2xl border border-slate-200 bg-white shadow-sm dark:border-slate-800 dark:bg-slate-900",
+        e,
+        a
+      ].filter(Boolean).join(" "),
+      ...d,
+      children: r
+    }
+  );
+}
+export {
+  i as default
+};
+//# sourceMappingURL=Card.js.map

package/dist/components/library/ui/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.js","sources":["../../../../src/components/library/ui/Card.jsx"],"sourcesContent":["import React from \"react\";\n\nexport default function UICard({ children, padding = \"p-5\", style, className = \"\", ...rest }) {\n  return (\n    <div\n      style={style}\n      className={[\n        \"rounded-2xl border border-slate-200 bg-white shadow-sm dark:border-slate-800 dark:bg-slate-900\",\n        padding,\n        className\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n}\n\n\n"],"names":["UICard","children","padding","style","className","rest","jsx"],"mappings":";;AAEA,SAAwBA,EAAO,EAAE,UAAAC,GAAU,SAAAC,IAAU,OAAO,OAAAC,GAAO,WAAAC,IAAY,IAAI,GAAGC,KAAQ;AAC5F,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAAH;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACAD;AAAA,QACAE;AAAA,MAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MACV,GAAGC;AAAA,MAEH,UAAAJ;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/components/library/ui/Chip.js

@@ -0,0 +1,31 @@
+import { jsx as n } from "react/jsx-runtime";
+import "react";
+const r = {
+  neutral: "border-slate-200/80 bg-white/60 text-slate-700 ring-black/5 hover:bg-white/80 dark:border-slate-800/80 dark:bg-slate-950/30 dark:text-slate-200 dark:ring-white/10 dark:hover:bg-slate-900/50",
+  primary: "border-brand-200/80 bg-brand-50/70 text-brand-800 ring-brand-900/5 hover:bg-brand-50 dark:border-brand-900/40 dark:bg-brand-950/25 dark:text-brand-200 dark:ring-brand-300/10 dark:hover:bg-brand-950/35",
+  success: "border-emerald-200/80 bg-emerald-50/70 text-emerald-800 ring-emerald-900/5 hover:bg-emerald-50 dark:border-emerald-900/40 dark:bg-emerald-950/20 dark:text-emerald-200 dark:ring-emerald-300/10 dark:hover:bg-emerald-950/30",
+  warning: "border-amber-200/80 bg-amber-50/70 text-amber-900 ring-amber-900/5 hover:bg-amber-50 dark:border-amber-900/40 dark:bg-amber-950/20 dark:text-amber-200 dark:ring-amber-300/10 dark:hover:bg-amber-950/30",
+  danger: "border-rose-200/80 bg-rose-50/70 text-rose-900 ring-rose-900/5 hover:bg-rose-50 dark:border-rose-900/40 dark:bg-rose-950/20 dark:text-rose-200 dark:ring-rose-300/10 dark:hover:bg-rose-950/30"
+}, e = {
+  xs: "px-2 py-0.5 text-[11px]",
+  sm: "px-2.5 py-1 text-xs"
+};
+function l({ tone: a = "neutral", size: d = "xs", className: b = "", children: t, ...o }) {
+  return /* @__PURE__ */ n(
+    "span",
+    {
+      className: [
+        "inline-flex items-center gap-1 rounded-full border font-semibold shadow-sm ring-1 transition",
+        e[d] ?? e.xs,
+        r[a] ?? r.neutral,
+        b
+      ].filter(Boolean).join(" "),
+      ...o,
+      children: t
+    }
+  );
+}
+export {
+  l as default
+};
+//# sourceMappingURL=Chip.js.map

package/dist/components/library/ui/Chip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip.js","sources":["../../../../src/components/library/ui/Chip.jsx"],"sourcesContent":["import React from \"react\";\n\nconst TONE_STYLES = {\n  neutral:\n    \"border-slate-200/80 bg-white/60 text-slate-700 ring-black/5 hover:bg-white/80 dark:border-slate-800/80 dark:bg-slate-950/30 dark:text-slate-200 dark:ring-white/10 dark:hover:bg-slate-900/50\",\n  primary:\n    \"border-brand-200/80 bg-brand-50/70 text-brand-800 ring-brand-900/5 hover:bg-brand-50 dark:border-brand-900/40 dark:bg-brand-950/25 dark:text-brand-200 dark:ring-brand-300/10 dark:hover:bg-brand-950/35\",\n  success:\n    \"border-emerald-200/80 bg-emerald-50/70 text-emerald-800 ring-emerald-900/5 hover:bg-emerald-50 dark:border-emerald-900/40 dark:bg-emerald-950/20 dark:text-emerald-200 dark:ring-emerald-300/10 dark:hover:bg-emerald-950/30\",\n  warning:\n    \"border-amber-200/80 bg-amber-50/70 text-amber-900 ring-amber-900/5 hover:bg-amber-50 dark:border-amber-900/40 dark:bg-amber-950/20 dark:text-amber-200 dark:ring-amber-300/10 dark:hover:bg-amber-950/30\",\n  danger:\n    \"border-rose-200/80 bg-rose-50/70 text-rose-900 ring-rose-900/5 hover:bg-rose-50 dark:border-rose-900/40 dark:bg-rose-950/20 dark:text-rose-200 dark:ring-rose-300/10 dark:hover:bg-rose-950/30\"\n};\n\nconst SIZE_STYLES = {\n  xs: \"px-2 py-0.5 text-[11px]\",\n  sm: \"px-2.5 py-1 text-xs\"\n};\n\nexport default function UIChip({ tone = \"neutral\", size = \"xs\", className = \"\", children, ...rest }) {\n  return (\n    <span\n      className={[\n        \"inline-flex items-center gap-1 rounded-full border font-semibold shadow-sm ring-1 transition\",\n        SIZE_STYLES[size] ?? SIZE_STYLES.xs,\n        TONE_STYLES[tone] ?? TONE_STYLES.neutral,\n        className\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      {...rest}\n    >\n      {children}\n    </span>\n  );\n}\n\n"],"names":["TONE_STYLES","SIZE_STYLES","UIChip","tone","size","className","children","rest","jsx"],"mappings":";;AAEA,MAAMA,IAAc;AAAA,EAClB,SACE;AAAA,EACF,SACE;AAAA,EACF,SACE;AAAA,EACF,SACE;AAAA,EACF,QACE;AACJ,GAEMC,IAAc;AAAA,EAClB,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,SAAwBC,EAAO,EAAE,MAAAC,IAAO,WAAW,MAAAC,IAAO,MAAM,WAAAC,IAAY,IAAI,UAAAC,GAAU,GAAGC,KAAQ;AACnG,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACAP,EAAYG,CAAI,KAAKH,EAAY;AAAA,QACjCD,EAAYG,CAAI,KAAKH,EAAY;AAAA,QACjCK;AAAA,MAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MACV,GAAGE;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/components/library/ui/Container.js

@@ -0,0 +1,42 @@
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import "react";
+import i from "./Text.js";
+function N({
+  title: r,
+  subtitle: a,
+  description: m,
+  actions: l,
+  empty: n = !1,
+  emptyText: c = "Nothing here yet.",
+  emptyIcon: d,
+  emptyHeight: o = 160,
+  className: h = "",
+  style: f,
+  children: u
+}) {
+  const t = a ?? m;
+  return /* @__PURE__ */ s("section", { className: h, style: f, children: [
+    (r || t || l) && /* @__PURE__ */ s("div", { className: "mb-4 flex flex-col gap-2 sm:flex-row sm:items-end sm:justify-between", children: [
+      /* @__PURE__ */ s("div", { className: "min-w-0", children: [
+        r && /* @__PURE__ */ e(i, { as: "h2", size: "lg", weight: "bold", className: "truncate", children: r }),
+        t && /* @__PURE__ */ e(i, { as: "p", size: "sm", muted: !0, className: "mt-1", children: t })
+      ] }),
+      l && /* @__PURE__ */ e("div", { className: "flex shrink-0 items-center gap-2", children: l })
+    ] }),
+    n ? /* @__PURE__ */ s(
+      "div",
+      {
+        className: "flex w-full flex-col items-center justify-center rounded-2xl border border-dashed border-slate-300 bg-slate-50 px-6 text-center dark:border-slate-700 dark:bg-slate-900/40",
+        style: { minHeight: o },
+        children: [
+          d ? /* @__PURE__ */ e("div", { className: "mb-2", children: d }) : null,
+          /* @__PURE__ */ e(i, { size: "sm", muted: !0, children: c })
+        ]
+      }
+    ) : u
+  ] });
+}
+export {
+  N as default
+};
+//# sourceMappingURL=Container.js.map

package/dist/components/library/ui/Container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.js","sources":["../../../../src/components/library/ui/Container.jsx"],"sourcesContent":["import React from \"react\";\nimport UIText from \"./Text\";\n\nexport default function UIContainer({\n  title,\n  subtitle,\n  description,\n  actions,\n  empty = false,\n  emptyText = \"Nothing here yet.\",\n  emptyIcon,\n  emptyHeight = 160,\n  className = \"\",\n  style,\n  children\n}) {\n  const sub = subtitle ?? description;\n\n  return (\n    <section className={className} style={style}>\n      {(title || sub || actions) && (\n        <div className=\"mb-4 flex flex-col gap-2 sm:flex-row sm:items-end sm:justify-between\">\n          <div className=\"min-w-0\">\n            {title && (\n              <UIText as=\"h2\" size=\"lg\" weight=\"bold\" className=\"truncate\">\n                {title}\n              </UIText>\n            )}\n            {sub && (\n              <UIText as=\"p\" size=\"sm\" muted className=\"mt-1\">\n                {sub}\n              </UIText>\n            )}\n          </div>\n          {actions && <div className=\"flex shrink-0 items-center gap-2\">{actions}</div>}\n        </div>\n      )}\n\n      {empty ? (\n        <div\n          className=\"flex w-full flex-col items-center justify-center rounded-2xl border border-dashed border-slate-300 bg-slate-50 px-6 text-center dark:border-slate-700 dark:bg-slate-900/40\"\n          style={{ minHeight: emptyHeight }}\n        >\n          {emptyIcon ? <div className=\"mb-2\">{emptyIcon}</div> : null}\n          <UIText size=\"sm\" muted>\n            {emptyText}\n          </UIText>\n        </div>\n      ) : (\n        children\n      )}\n    </section>\n  );\n}\n\n\n"],"names":["UIContainer","title","subtitle","description","actions","empty","emptyText","emptyIcon","emptyHeight","className","style","children","sub","jsxs","jsx","UIText"],"mappings":";;;AAGA,SAAwBA,EAAY;AAAA,EAClC,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,SAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,WAAAC,IAAY;AAAA,EACZ,WAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AACF,GAAG;AACD,QAAMC,IAAMV,KAAYC;AAExB,SACE,gBAAAU,EAAC,WAAA,EAAQ,WAAAJ,GAAsB,OAAAC,GAC3B,UAAA;AAAA,KAAAT,KAASW,KAAOR,MAChB,gBAAAS,EAAC,OAAA,EAAI,WAAU,wEACb,UAAA;AAAA,MAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,WACZ,UAAA;AAAA,QAAAZ,KACC,gBAAAa,EAACC,GAAA,EAAO,IAAG,MAAK,MAAK,MAAK,QAAO,QAAO,WAAU,YAC/C,UAAAd,EAAA,CACH;AAAA,QAEDW,KACC,gBAAAE,EAACC,GAAA,EAAO,IAAG,KAAI,MAAK,MAAK,OAAK,IAAC,WAAU,QACtC,UAAAH,EAAA,CACH;AAAA,MAAA,GAEJ;AAAA,MACCR,KAAW,gBAAAU,EAAC,OAAA,EAAI,WAAU,oCAAoC,UAAAV,EAAA,CAAQ;AAAA,IAAA,GACzE;AAAA,IAGDC,IACC,gBAAAQ;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,WAAWL,EAAA;AAAA,QAEnB,UAAA;AAAA,UAAAD,IAAY,gBAAAO,EAAC,OAAA,EAAI,WAAU,QAAQ,aAAU,IAAS;AAAA,4BACtDC,GAAA,EAAO,MAAK,MAAK,OAAK,IACpB,UAAAT,EAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,IAGFK;AAAA,EAAA,GAEJ;AAEJ;"}

package/dist/components/library/ui/EmptyState.js

@@ -0,0 +1,27 @@
+import { jsxs as x, jsx as t } from "react/jsx-runtime";
+import "react";
+const i = {
+  sm: { icon: "h-8 w-8", heading: "text-sm", body: "text-xs", gap: "gap-2", pad: "py-6" },
+  md: { icon: "h-10 w-10", heading: "text-base", body: "text-sm", gap: "gap-3", pad: "py-10" },
+  lg: { icon: "h-14 w-14", heading: "text-lg", body: "text-sm", gap: "gap-4", pad: "py-16" }
+};
+function r({
+  icon: a,
+  heading: l = "Nothing here yet",
+  body: s,
+  action: d,
+  size: m = "md",
+  className: n = ""
+}) {
+  const e = i[m] ?? i.md;
+  return /* @__PURE__ */ x("div", { className: `flex flex-col items-center justify-center text-center ${e.pad} ${e.gap} ${n}`, children: [
+    a && /* @__PURE__ */ t("div", { className: `${e.icon} text-slate-300 dark:text-slate-600`, children: a }),
+    /* @__PURE__ */ t("div", { className: `${e.heading} font-semibold text-slate-700 dark:text-slate-200`, children: l }),
+    s && /* @__PURE__ */ t("div", { className: `${e.body} max-w-sm text-slate-500 dark:text-slate-400`, children: s }),
+    d && /* @__PURE__ */ t("div", { className: "mt-1", children: d })
+  ] });
+}
+export {
+  r as default
+};
+//# sourceMappingURL=EmptyState.js.map

package/dist/components/library/ui/EmptyState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.js","sources":["../../../../src/components/library/ui/EmptyState.jsx"],"sourcesContent":["import React from \"react\";\n\nconst SIZES = {\n  sm: { icon: \"h-8 w-8\", heading: \"text-sm\", body: \"text-xs\", gap: \"gap-2\", pad: \"py-6\" },\n  md: { icon: \"h-10 w-10\", heading: \"text-base\", body: \"text-sm\", gap: \"gap-3\", pad: \"py-10\" },\n  lg: { icon: \"h-14 w-14\", heading: \"text-lg\", body: \"text-sm\", gap: \"gap-4\", pad: \"py-16\" },\n};\n\n/**\n * Empty state placeholder — shows when a list, table, or section has no content.\n *\n * @param {ReactNode}  icon      Optional icon element\n * @param {string}     heading   Primary message\n * @param {string}     body      Secondary description\n * @param {ReactNode}  action    Optional CTA (button, link, etc.)\n * @param {\"sm\"|\"md\"|\"lg\"} size  Visual density\n */\nexport default function EmptyState({\n  icon,\n  heading = \"Nothing here yet\",\n  body,\n  action,\n  size = \"md\",\n  className = \"\",\n}) {\n  const s = SIZES[size] ?? SIZES.md;\n\n  return (\n    <div className={`flex flex-col items-center justify-center text-center ${s.pad} ${s.gap} ${className}`}>\n      {icon && (\n        <div className={`${s.icon} text-slate-300 dark:text-slate-600`}>\n          {icon}\n        </div>\n      )}\n      <div className={`${s.heading} font-semibold text-slate-700 dark:text-slate-200`}>\n        {heading}\n      </div>\n      {body && (\n        <div className={`${s.body} max-w-sm text-slate-500 dark:text-slate-400`}>\n          {body}\n        </div>\n      )}\n      {action && <div className=\"mt-1\">{action}</div>}\n    </div>\n  );\n}\n"],"names":["SIZES","EmptyState","icon","heading","body","action","size","className","s","jsxs","jsx"],"mappings":";;AAEA,MAAMA,IAAQ;AAAA,EACZ,IAAI,EAAE,MAAM,WAAW,SAAS,WAAW,MAAM,WAAW,KAAK,SAAS,KAAK,OAAA;AAAA,EAC/E,IAAI,EAAE,MAAM,aAAa,SAAS,aAAa,MAAM,WAAW,KAAK,SAAS,KAAK,QAAA;AAAA,EACnF,IAAI,EAAE,MAAM,aAAa,SAAS,WAAW,MAAM,WAAW,KAAK,SAAS,KAAK,QAAA;AACnF;AAWA,SAAwBC,EAAW;AAAA,EACjC,MAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,WAAAC,IAAY;AACd,GAAG;AACD,QAAMC,IAAIR,EAAMM,CAAI,KAAKN,EAAM;AAE/B,SACE,gBAAAS,EAAC,OAAA,EAAI,WAAW,yDAAyDD,EAAE,GAAG,IAAIA,EAAE,GAAG,IAAID,CAAS,IACjG,UAAA;AAAA,IAAAL,uBACE,OAAA,EAAI,WAAW,GAAGM,EAAE,IAAI,uCACtB,UAAAN,EAAA,CACH;AAAA,sBAED,OAAA,EAAI,WAAW,GAAGM,EAAE,OAAO,qDACzB,UAAAL,GACH;AAAA,IACCC,uBACE,OAAA,EAAI,WAAW,GAAGI,EAAE,IAAI,gDACtB,UAAAJ,EAAA,CACH;AAAA,IAEDC,KAAU,gBAAAK,EAAC,OAAA,EAAI,WAAU,QAAQ,UAAAL,EAAA,CAAO;AAAA,EAAA,GAC3C;AAEJ;"}

package/dist/components/library/ui/Input.js

@@ -0,0 +1,22 @@
+import { jsx as o } from "react/jsx-runtime";
+import "react";
+function l({ style: e = void 0, className: t = "", ...r }) {
+  return /* @__PURE__ */ o(
+    "input",
+    {
+      style: e,
+      className: [
+        "h-10 w-full rounded-lg border border-slate-200 bg-white px-3 text-sm text-slate-900 shadow-sm",
+        "placeholder:text-slate-400",
+        "focus:outline-none focus:ring-2 focus:ring-brand-500 focus:ring-offset-2 dark:focus:ring-offset-slate-950",
+        "dark:border-slate-800 dark:bg-slate-900 dark:text-slate-50 dark:placeholder:text-slate-500",
+        t
+      ].filter(Boolean).join(" "),
+      ...r
+    }
+  );
+}
+export {
+  l as default
+};
+//# sourceMappingURL=Input.js.map

package/dist/components/library/ui/Input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.js","sources":["../../../../src/components/library/ui/Input.jsx"],"sourcesContent":["import React from \"react\";\n\nexport default function UIInput({ style = undefined, className = \"\", ...rest }) {\n  return (\n    <input\n      style={style}\n      className={[\n        \"h-10 w-full rounded-lg border border-slate-200 bg-white px-3 text-sm text-slate-900 shadow-sm\",\n        \"placeholder:text-slate-400\",\n        \"focus:outline-none focus:ring-2 focus:ring-brand-500 focus:ring-offset-2 dark:focus:ring-offset-slate-950\",\n        \"dark:border-slate-800 dark:bg-slate-900 dark:text-slate-50 dark:placeholder:text-slate-500\",\n        className\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      {...rest}\n    />\n  );\n}\n\n\n"],"names":["UIInput","style","className","rest","jsx"],"mappings":";;AAEA,SAAwBA,EAAQ,EAAE,OAAAC,IAAQ,QAAW,WAAAC,IAAY,IAAI,GAAGC,KAAQ;AAC9E,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAAH;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACAC;AAAA,MAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MACV,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/components/library/ui/Spinner.js

@@ -0,0 +1,64 @@
+import { jsxs as i, jsx as t } from "react/jsx-runtime";
+import "react";
+const e = {
+  xs: "h-3 w-3",
+  sm: "h-4 w-4",
+  md: "h-5 w-5",
+  lg: "h-6 w-6",
+  xl: "h-8 w-8"
+}, r = {
+  brand: "text-brand-500",
+  white: "text-white",
+  muted: "text-slate-400 dark:text-slate-500",
+  current: "text-current"
+};
+function m({
+  size: a = "md",
+  tone: n = "brand",
+  label: s = "Loading",
+  className: l = "",
+  ...o
+}) {
+  return /* @__PURE__ */ i(
+    "svg",
+    {
+      ...o,
+      className: [
+        "animate-spin",
+        e[a] ?? e.md,
+        r[n] ?? r.brand,
+        l
+      ].filter(Boolean).join(" "),
+      xmlns: "http://www.w3.org/2000/svg",
+      fill: "none",
+      viewBox: "0 0 24 24",
+      role: "status",
+      "aria-label": s,
+      children: [
+        /* @__PURE__ */ t(
+          "circle",
+          {
+            className: "opacity-25",
+            cx: "12",
+            cy: "12",
+            r: "10",
+            stroke: "currentColor",
+            strokeWidth: "4"
+          }
+        ),
+        /* @__PURE__ */ t(
+          "path",
+          {
+            className: "opacity-75",
+            fill: "currentColor",
+            d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  m as default
+};
+//# sourceMappingURL=Spinner.js.map

package/dist/components/library/ui/Spinner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.js","sources":["../../../../src/components/library/ui/Spinner.jsx"],"sourcesContent":["import React from \"react\";\n\nconst SIZE_CLASSES = {\n  xs: \"h-3 w-3\",\n  sm: \"h-4 w-4\",\n  md: \"h-5 w-5\",\n  lg: \"h-6 w-6\",\n  xl: \"h-8 w-8\",\n};\n\nconst TONE_CLASSES = {\n  brand: \"text-brand-500\",\n  white: \"text-white\",\n  muted: \"text-slate-400 dark:text-slate-500\",\n  current: \"text-current\",\n};\n\n/**\n * Animated spinner.\n *\n * @param {\"xs\"|\"sm\"|\"md\"|\"lg\"|\"xl\"} size\n * @param {\"brand\"|\"white\"|\"muted\"|\"current\"} tone\n * @param {string} label — screen-reader label\n */\nexport default function Spinner({\n  size = \"md\",\n  tone = \"brand\",\n  label = \"Loading\",\n  className = \"\",\n  ...rest\n}) {\n  return (\n    <svg\n      {...rest}\n      className={[\n        \"animate-spin\",\n        SIZE_CLASSES[size] ?? SIZE_CLASSES.md,\n        TONE_CLASSES[tone] ?? TONE_CLASSES.brand,\n        className,\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      fill=\"none\"\n      viewBox=\"0 0 24 24\"\n      role=\"status\"\n      aria-label={label}\n    >\n      <circle\n        className=\"opacity-25\"\n        cx=\"12\"\n        cy=\"12\"\n        r=\"10\"\n        stroke=\"currentColor\"\n        strokeWidth=\"4\"\n      />\n      <path\n        className=\"opacity-75\"\n        fill=\"currentColor\"\n        d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n      />\n    </svg>\n  );\n}\n"],"names":["SIZE_CLASSES","TONE_CLASSES","Spinner","size","tone","label","className","rest","jsxs","jsx"],"mappings":";;AAEA,MAAMA,IAAe;AAAA,EACnB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEMC,IAAe;AAAA,EACnB,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AAAA,EACP,SAAS;AACX;AASA,SAAwBC,EAAQ;AAAA,EAC9B,MAAAC,IAAO;AAAA,EACP,MAAAC,IAAO;AAAA,EACP,OAAAC,IAAQ;AAAA,EACR,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,GAAG;AACD,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGD;AAAA,MACJ,WAAW;AAAA,QACT;AAAA,QACAP,EAAaG,CAAI,KAAKH,EAAa;AAAA,QACnCC,EAAaG,CAAI,KAAKH,EAAa;AAAA,QACnCK;AAAA,MAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MACX,OAAM;AAAA,MACN,MAAK;AAAA,MACL,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,cAAYD;AAAA,MAEZ,UAAA;AAAA,QAAA,gBAAAI;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,IAAG;AAAA,YACH,IAAG;AAAA,YACH,GAAE;AAAA,YACF,QAAO;AAAA,YACP,aAAY;AAAA,UAAA;AAAA,QAAA;AAAA,QAEd,gBAAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/library/ui/Text.js

@@ -0,0 +1,43 @@
+import { jsx as d } from "react/jsx-runtime";
+import "react";
+const t = {
+  xs: "text-xs",
+  sm: "text-sm",
+  md: "text-base",
+  lg: "text-lg",
+  xl: "text-xl",
+  xxl: "text-2xl"
+}, e = {
+  regular: "font-normal",
+  medium: "font-medium",
+  bold: "font-semibold"
+};
+function u({
+  as: l = "span",
+  size: x = "md",
+  weight: a = "regular",
+  muted: s = !1,
+  style: o,
+  className: r = "",
+  children: m,
+  ...n
+}) {
+  return /* @__PURE__ */ d(
+    l,
+    {
+      style: o,
+      className: [
+        t[x] ?? t.md,
+        e[a] ?? e.regular,
+        s ? "text-slate-600 dark:text-slate-300" : "text-slate-900 dark:text-slate-50",
+        r
+      ].filter(Boolean).join(" "),
+      ...n,
+      children: m
+    }
+  );
+}
+export {
+  u as default
+};
+//# sourceMappingURL=Text.js.map

package/dist/components/library/ui/Text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.js","sources":["../../../../src/components/library/ui/Text.jsx"],"sourcesContent":["import React from \"react\";\n\nconst SIZE_CLASSES = {\n  xs: \"text-xs\",\n  sm: \"text-sm\",\n  md: \"text-base\",\n  lg: \"text-lg\",\n  xl: \"text-xl\",\n  xxl: \"text-2xl\"\n};\n\nconst WEIGHT_CLASSES = {\n  regular: \"font-normal\",\n  medium: \"font-medium\",\n  bold: \"font-semibold\"\n};\n\nexport default function UIText({\n  as: Comp = \"span\",\n  size = \"md\",\n  weight = \"regular\",\n  muted = false,\n  style,\n  className = \"\",\n  children,\n  ...rest\n}) {\n  return (\n    <Comp\n      style={style}\n      className={[\n        SIZE_CLASSES[size] ?? SIZE_CLASSES.md,\n        WEIGHT_CLASSES[weight] ?? WEIGHT_CLASSES.regular,\n        muted ? \"text-slate-600 dark:text-slate-300\" : \"text-slate-900 dark:text-slate-50\",\n        className\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      {...rest}\n    >\n      {children}\n    </Comp>\n  );\n}\n\n\n"],"names":["SIZE_CLASSES","WEIGHT_CLASSES","UIText","Comp","size","weight","muted","style","className","children","rest","jsx"],"mappings":";;AAEA,MAAMA,IAAe;AAAA,EACnB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,KAAK;AACP,GAEMC,IAAiB;AAAA,EACrB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AACR;AAEA,SAAwBC,EAAO;AAAA,EAC7B,IAAIC,IAAO;AAAA,EACX,MAAAC,IAAO;AAAA,EACP,QAAAC,IAAS;AAAA,EACT,OAAAC,IAAQ;AAAA,EACR,OAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,UAAAC;AAAA,EACA,GAAGC;AACL,GAAG;AACD,SACE,gBAAAC;AAAA,IAACR;AAAA,IAAA;AAAA,MACC,OAAAI;AAAA,MACA,WAAW;AAAA,QACTP,EAAaI,CAAI,KAAKJ,EAAa;AAAA,QACnCC,EAAeI,CAAM,KAAKJ,EAAe;AAAA,QACzCK,IAAQ,uCAAuC;AAAA,QAC/CE;AAAA,MAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MACV,GAAGE;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/components/library/ui/Toggle.js

@@ -0,0 +1,47 @@
+import { jsxs as i, jsx as s } from "react/jsx-runtime";
+import "react";
+import { useThemeMode as l } from "../theme/AppThemeProvider.js";
+function f({ label: r = "Dark mode", style: t, className: a = "" }) {
+  const { mode: n, toggle: o } = l(), e = n === "dark";
+  return /* @__PURE__ */ i(
+    "button",
+    {
+      type: "button",
+      onClick: o,
+      style: t,
+      className: [
+        "inline-flex items-center gap-2 rounded-lg border border-slate-200 bg-white px-3 py-2 text-sm font-medium text-slate-900 shadow-sm",
+        "hover:bg-slate-50 focus:outline-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-2 dark:focus-visible:ring-offset-slate-950",
+        "dark:border-slate-800 dark:bg-slate-900 dark:text-slate-50 dark:hover:bg-slate-800",
+        a
+      ].filter(Boolean).join(" "),
+      "aria-pressed": e,
+      "aria-label": r,
+      children: [
+        /* @__PURE__ */ s(
+          "span",
+          {
+            className: [
+              "inline-flex h-5 w-9 items-center rounded-full border transition",
+              e ? "border-brand-400 bg-brand-500" : "border-slate-300 bg-slate-200"
+            ].join(" "),
+            children: /* @__PURE__ */ s(
+              "span",
+              {
+                className: [
+                  "h-4 w-4 rounded-full bg-white shadow-sm transition",
+                  e ? "translate-x-4" : "translate-x-1"
+                ].join(" ")
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ s("span", { className: "hidden sm:inline", children: r })
+      ]
+    }
+  );
+}
+export {
+  f as default
+};
+//# sourceMappingURL=Toggle.js.map

package/dist/components/library/ui/Toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.js","sources":["../../../../src/components/library/ui/Toggle.jsx"],"sourcesContent":["import React from \"react\";\nimport { useThemeMode } from \"../theme/AppThemeProvider\";\n\nexport default function UIToggle({ label = \"Dark mode\", style, className = \"\" }) {\n  const { mode, toggle } = useThemeMode();\n  const isDark = mode === \"dark\";\n\n  return (\n    <button\n      type=\"button\"\n      onClick={toggle}\n      style={style}\n      className={[\n        \"inline-flex items-center gap-2 rounded-lg border border-slate-200 bg-white px-3 py-2 text-sm font-medium text-slate-900 shadow-sm\",\n        \"hover:bg-slate-50 focus:outline-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-2 dark:focus-visible:ring-offset-slate-950\",\n        \"dark:border-slate-800 dark:bg-slate-900 dark:text-slate-50 dark:hover:bg-slate-800\",\n        className\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      aria-pressed={isDark}\n      aria-label={label}\n    >\n      <span\n        className={[\n          \"inline-flex h-5 w-9 items-center rounded-full border transition\",\n          isDark ? \"border-brand-400 bg-brand-500\" : \"border-slate-300 bg-slate-200\"\n        ].join(\" \")}\n      >\n        <span\n          className={[\n            \"h-4 w-4 rounded-full bg-white shadow-sm transition\",\n            isDark ? \"translate-x-4\" : \"translate-x-1\"\n          ].join(\" \")}\n        />\n      </span>\n      <span className=\"hidden sm:inline\">{label}</span>\n    </button>\n  );\n}\n\n\n"],"names":["UIToggle","label","style","className","mode","toggle","useThemeMode","isDark","jsxs","jsx"],"mappings":";;;AAGA,SAAwBA,EAAS,EAAE,OAAAC,IAAQ,aAAa,OAAAC,GAAO,WAAAC,IAAY,MAAM;AAC/E,QAAM,EAAE,MAAAC,GAAM,QAAAC,EAAA,IAAWC,EAAA,GACnBC,IAASH,MAAS;AAExB,SACE,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,SAASH;AAAA,MACT,OAAAH;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACAC;AAAA,MAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MACX,gBAAcI;AAAA,MACd,cAAYN;AAAA,MAEZ,UAAA;AAAA,QAAA,gBAAAQ;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW;AAAA,cACT;AAAA,cACAF,IAAS,kCAAkC;AAAA,YAAA,EAC3C,KAAK,GAAG;AAAA,YAEV,UAAA,gBAAAE;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAW;AAAA,kBACT;AAAA,kBACAF,IAAS,kBAAkB;AAAA,gBAAA,EAC3B,KAAK,GAAG;AAAA,cAAA;AAAA,YAAA;AAAA,UACZ;AAAA,QAAA;AAAA,QAEF,gBAAAE,EAAC,QAAA,EAAK,WAAU,oBAAoB,UAAAR,EAAA,CAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGhD;"}