@craftzbay/ui 0.3.0 → 0.4.0

package/dist-lib/index.d.ts

@@ -20,6 +20,7 @@ export * from './components/ui/CommandPalette';
 export * from './components/ui/ContextMenu';
 export * from './components/ui/DataGrid';
 export * from './components/ui/DatePicker';
+export * from './components/ui/DesignSystemProvider';
 export * from './components/ui/Dialog';
 export * from './components/ui/DropdownMenu';
 export * from './components/ui/EmptyState';

package/dist-lib/index.js

@@ -6,7 +6,7 @@ import { AlertCircle as Qa, AlertTriangle as pt, ArrowDown as Cr, ArrowLeft as T
 import { jsxs as c, jsx as e, Fragment as Ze } from "react/jsx-runtime";
 import * as Rt from "@radix-ui/react-accordion";
 import { cva as Me } from "class-variance-authority";
-import { cva as od } from "class-variance-authority";
+import { cva as sd } from "class-variance-authority";
 import * as Pn from "@radix-ui/react-avatar";
 import { Slot as Jr } from "@radix-ui/react-slot";
 import * as dr from "@radix-ui/react-checkbox";
@@ -1815,7 +1815,49 @@ const ci = y(function({ value: n, onChange: r, label: a, placeholder: o = "Pick
   ] }) });
 });
 ci.displayName = "DateRangePicker";
-const di = U.Root, lc = U.Trigger, ui = U.Portal, fi = U.Close, ia = y(function({ className: n, ...r }, a) {
+function lc({
+  tokens: t,
+  className: n,
+  children: r,
+  style: a,
+  ...o
+}) {
+  const i = { ...a };
+  if (t)
+    for (const [s, d] of Object.entries(t)) {
+      const u = s.startsWith("--") ? s : `--${s}`;
+      i[u] = d;
+    }
+  return /* @__PURE__ */ e("div", { "data-brand-scope": !0, className: m("contents", n), style: i, ...o, children: r });
+}
+const cc = {
+  default: {},
+  /** Cool indigo accent, slightly rounder corners. */
+  edgelog: {
+    "color-accent": "oklch(0.55 0.18 250)",
+    "color-accent-700": "oklch(0.46 0.16 250)",
+    "color-accent-800": "oklch(0.38 0.14 250)",
+    "color-accent-soft": "oklch(0.95 0.04 250)",
+    "radius-md": "8px",
+    "radius-lg": "12px"
+  },
+  /** Warm copper accent, tighter geometry. */
+  gerege: {
+    "color-accent": "oklch(0.62 0.16 45)",
+    "color-accent-700": "oklch(0.54 0.16 45)",
+    "color-accent-800": "oklch(0.46 0.14 45)",
+    "color-accent-soft": "oklch(0.95 0.04 45)",
+    "radius-md": "4px",
+    "radius-lg": "6px"
+  },
+  /** Forest green accent. */
+  forest: {
+    "color-accent": "oklch(0.55 0.14 155)",
+    "color-accent-700": "oklch(0.47 0.14 155)",
+    "color-accent-800": "oklch(0.39 0.12 155)",
+    "color-accent-soft": "oklch(0.95 0.04 155)"
+  }
+}, di = U.Root, dc = U.Trigger, ui = U.Portal, fi = U.Close, ia = y(function({ className: n, ...r }, a) {
   return /* @__PURE__ */ e(
     U.Overlay,
     {
@@ -1992,8 +2034,8 @@ const gi = {
   );
 });
 pi.displayName = "ErrorState";
-const cc = lo, fa = on(null);
-function dc(t) {
+const uc = lo, fa = on(null);
+function fc(t) {
   return /* @__PURE__ */ e(fa.Provider, { value: { name: t.name }, children: /* @__PURE__ */ e(co, { ...t }) });
 }
 const ma = on(null);
@@ -2270,7 +2312,7 @@ const yi = y(function({
   ] });
 });
 yi.displayName = "MultiSelect";
-const pa = fe.Root, uc = fe.Value, tr = y(function({ className: n, placeholder: r, size: a = "md", tone: o = "default", ...i }, s) {
+const pa = fe.Root, mc = fe.Value, tr = y(function({ className: n, placeholder: r, size: a = "md", tone: o = "default", ...i }, s) {
   return /* @__PURE__ */ c(
     fe.Trigger,
     {
@@ -2507,7 +2549,7 @@ const Kt = m(
   "hover:bg-background-muted hover:text-foreground",
   "disabled:opacity-50 disabled:pointer-events-none",
   "outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background"
-), fc = te.Root, mc = te.Trigger, gc = te.Anchor, pc = te.Close, Ci = y(function({ className: n, align: r = "center", sideOffset: a = 4, ...o }, i) {
+), gc = te.Root, pc = te.Trigger, hc = te.Anchor, bc = te.Close, Ci = y(function({ className: n, align: r = "center", sideOffset: a = 4, ...o }, i) {
   return /* @__PURE__ */ e(te.Portal, { children: /* @__PURE__ */ e(
     te.Content,
     {
@@ -2728,7 +2770,7 @@ const gt = y(function({ className: n, orientation: r = "horizontal", decorative:
   );
 });
 gt.displayName = "Separator";
-const Ei = U.Root, Ai = U.Trigger, hc = U.Close, Ri = U.Portal, ka = y(function({ className: n, ...r }, a) {
+const Ei = U.Root, Ai = U.Trigger, xc = U.Close, Ri = U.Portal, ka = y(function({ className: n, ...r }, a) {
   return /* @__PURE__ */ e(
     U.Overlay,
     {
@@ -2821,7 +2863,7 @@ const Bi = y(function({ className: n, ...r }, a) {
 });
 Bi.displayName = "SheetDescription";
 const jt = on({ collapsed: !1 });
-function bc() {
+function vc() {
   return lt(jt);
 }
 const Ca = y(function({
@@ -3323,7 +3365,7 @@ const Yi = y(function({
   ] });
 });
 Yi.displayName = "Textarea";
-const xc = dt.Provider, Xi = y(function({ className: n, ...r }, a) {
+const wc = dt.Provider, Xi = y(function({ className: n, ...r }, a) {
   return /* @__PURE__ */ e(
     dt.Viewport,
     {
@@ -3433,7 +3475,7 @@ const rs = y(function({ className: n, ...r }, a) {
   );
 });
 rs.displayName = "ToastClose";
-const vc = ({
+const yc = ({
   delayDuration: t = 500,
   skipDelayDuration: n = 200,
   ...r
@@ -4777,7 +4819,7 @@ function Sn() {
   if (!t) throw new Error("Carousel components must be used inside <Carousel>");
   return t;
 }
-const wc = y(function({ opts: n, orientation: r = "horizontal", setApi: a, className: o, children: i, ...s }, d) {
+const Nc = y(function({ opts: n, orientation: r = "horizontal", setApi: a, className: o, children: i, ...s }, d) {
   const [u, l] = sr({ ...n, axis: r === "horizontal" ? "x" : "y" }), [p, g] = B(!1), [f, b] = B(!1), h = Ie((x) => {
     x && (g(x.canScrollPrev()), b(x.canScrollNext()));
   }, []);
@@ -4801,7 +4843,7 @@ const wc = y(function({ opts: n, orientation: r = "horizontal", setApi: a, class
       children: /* @__PURE__ */ e("div", { ref: d, className: m("relative", o), role: "region", "aria-roledescription": "carousel", ...s, children: i })
     }
   );
-}), yc = y(
+}), kc = y(
   function({ className: n, ...r }, a) {
     const { carouselRef: o, orientation: i } = Sn();
     return /* @__PURE__ */ e("div", { ref: o, className: "overflow-hidden", children: /* @__PURE__ */ e(
@@ -4817,7 +4859,7 @@ const wc = y(function({ opts: n, orientation: r = "horizontal", setApi: a, class
       }
     ) });
   }
-), Nc = y(
+), Sc = y(
   function({ className: n, ...r }, a) {
     const { orientation: o } = Sn();
     return /* @__PURE__ */ e(
@@ -4836,7 +4878,7 @@ const wc = y(function({ opts: n, orientation: r = "horizontal", setApi: a, class
     );
   }
 );
-function kc({ className: t }) {
+function Cc({ className: t }) {
   const { canPrev: n, scrollPrev: r, orientation: a } = Sn();
   return /* @__PURE__ */ e(
     _t,
@@ -4854,7 +4896,7 @@ function kc({ className: t }) {
     }
   );
 }
-function Sc({ className: t }) {
+function Tc({ className: t }) {
   const { canNext: n, scrollNext: r, orientation: a } = Sn();
   return /* @__PURE__ */ e(
     _t,
@@ -4876,7 +4918,7 @@ function Aa(t, n, r, a = 8) {
   const o = t.map((f) => f.y), i = Math.min(0, ...o), s = Math.max(...o, 1), d = s - i || 1, u = n - a * 2, l = r - a * 2;
   return { sx: (f) => t.length <= 1 ? a + u / 2 : a + f / (t.length - 1) * u, sy: (f) => a + l - (f - i) / d * l, min: i, max: s };
 }
-function Cc({ data: t, height: n = 80, width: r = "100%", caption: a, className: o }) {
+function Dc({ data: t, height: n = 80, width: r = "100%", caption: a, className: o }) {
   const i = typeof r == "number" ? r : 320, { sx: s, sy: d } = Aa(t, i, n), u = t.map((l, p) => `${p === 0 ? "M" : "L"}${s(p).toFixed(1)},${d(l.y).toFixed(1)}`).join(" ");
   return /* @__PURE__ */ c("figure", { className: m("flex flex-col gap-1.5", o), children: [
     a && /* @__PURE__ */ e("figcaption", { className: "text-xs text-foreground-muted", children: a }),
@@ -4886,7 +4928,7 @@ function Cc({ data: t, height: n = 80, width: r = "100%", caption: a, className:
     ] })
   ] });
 }
-function Tc({ data: t, height: n = 80, width: r = "100%", caption: a, className: o }) {
+function Ic({ data: t, height: n = 80, width: r = "100%", caption: a, className: o }) {
   const i = typeof r == "number" ? r : 320, { sx: s, sy: d } = Aa(t, i, n), u = t.map((p, g) => `${g === 0 ? "M" : "L"}${s(g).toFixed(1)},${d(p.y).toFixed(1)}`).join(" "), l = `${u} L${s(t.length - 1).toFixed(1)},${n} L${s(0).toFixed(1)},${n} Z`;
   return /* @__PURE__ */ c("figure", { className: m("flex flex-col gap-1.5", o), children: [
     a && /* @__PURE__ */ e("figcaption", { className: "text-xs text-foreground-muted", children: a }),
@@ -4896,7 +4938,7 @@ function Tc({ data: t, height: n = 80, width: r = "100%", caption: a, className:
     ] })
   ] });
 }
-function Dc({ data: t, height: n = 100, width: r = "100%", caption: a, className: o }) {
+function zc({ data: t, height: n = 100, width: r = "100%", caption: a, className: o }) {
   const i = typeof r == "number" ? r : 320, s = 8, d = 2, u = i - s * 2, l = Math.max(2, u / t.length - d), p = t.map((f) => f.y), g = Math.max(...p, 1);
   return /* @__PURE__ */ c("figure", { className: m("flex flex-col gap-1.5", o), children: [
     a && /* @__PURE__ */ e("figcaption", { className: "text-xs text-foreground-muted", children: a }),
@@ -5953,7 +5995,7 @@ const et = {
   ...n
 }) => /* @__PURE__ */ e(et.Root, { shouldScaleBackground: t, ...n });
 bl.displayName = "Drawer";
-const Ic = et.Trigger, xl = et.Portal, zc = et.Close, vl = y(function({ className: n, ...r }, a) {
+const Mc = et.Trigger, xl = et.Portal, Pc = et.Close, vl = y(function({ className: n, ...r }, a) {
   return /* @__PURE__ */ e(
     et.Overlay,
     {
@@ -5972,7 +6014,7 @@ const Ic = et.Trigger, xl = et.Portal, zc = et.Close, vl = y(function({ classNam
   top: "mx-auto mb-3 h-1.5 w-12 rounded-full bg-border order-last",
   left: "mx-1.5 my-auto h-12 w-1.5 rounded-full bg-border order-last self-stretch shrink-0",
   right: "mx-1.5 my-auto h-12 w-1.5 rounded-full bg-border shrink-0 self-stretch"
-}, Mc = y(function({ className: n, direction: r = "bottom", hideHandle: a, children: o, ...i }, s) {
+}, Ec = y(function({ className: n, direction: r = "bottom", hideHandle: a, children: o, ...i }, s) {
   const d = r === "left" || r === "right";
   return /* @__PURE__ */ c(xl, { children: [
     /* @__PURE__ */ e(vl, {}),
@@ -5995,13 +6037,13 @@ const Ic = et.Trigger, xl = et.Portal, zc = et.Close, vl = y(function({ classNam
     )
   ] });
 });
-function Pc({ className: t, ...n }) {
+function Ac({ className: t, ...n }) {
   return /* @__PURE__ */ e("div", { className: m("grid gap-1 p-4 text-center sm:text-left", t), ...n });
 }
-function Ec({ className: t, ...n }) {
+function Rc({ className: t, ...n }) {
   return /* @__PURE__ */ e("div", { className: m("mt-auto flex flex-col gap-2 p-4", t), ...n });
 }
-const Ac = y(function({ className: n, ...r }, a) {
+const Oc = y(function({ className: n, ...r }, a) {
   return /* @__PURE__ */ e(
     et.Title,
     {
@@ -6010,7 +6052,7 @@ const Ac = y(function({ className: n, ...r }, a) {
       ...r
     }
   );
-}), Rc = y(function({ className: n, ...r }, a) {
+}), Lc = y(function({ className: n, ...r }, a) {
   return /* @__PURE__ */ e(
     et.Description,
     {
@@ -6023,7 +6065,7 @@ const Ac = y(function({ className: n, ...r }, a) {
 function Nl(t) {
   return t < 1024 ? `${t} B` : t < 1024 * 1024 ? `${(t / 1024).toFixed(1)} KB` : `${(t / 1024 / 1024).toFixed(1)} MB`;
 }
-const Oc = y(function({ accept: n, multiple: r, maxSize: a, value: o, onChange: i, hint: s, disabled: d, className: u }, l) {
+const $c = y(function({ accept: n, multiple: r, maxSize: a, value: o, onChange: i, hint: s, disabled: d, className: u }, l) {
   const p = Et(null), g = Le(), [f, b] = B([]), [h, x] = B(!1), w = o ?? f, v = Ie(
     (T) => {
       o === void 0 && b(T), i == null || i(T);
@@ -6129,7 +6171,7 @@ const Oc = y(function({ accept: n, multiple: r, maxSize: a, value: o, onChange:
   success: /* @__PURE__ */ e(bt, { className: "size-4 shrink-0 mt-0.5 text-success-text", "aria-hidden": !0 }),
   warning: /* @__PURE__ */ e(pt, { className: "size-4 shrink-0 mt-0.5 text-warning-text", "aria-hidden": !0 }),
   danger: /* @__PURE__ */ e(Bt, { className: "size-4 shrink-0 mt-0.5 text-danger-text", "aria-hidden": !0 })
-}, Lc = y(function({ className: n, variant: r = "default", title: a, action: o, onClose: i, icon: s, children: d, ...u }, l) {
+}, Fc = y(function({ className: n, variant: r = "default", title: a, action: o, onClose: i, icon: s, children: d, ...u }, l) {
   const p = s === !1 ? null : s ?? Sl[r ?? "default"];
   return /* @__PURE__ */ c("div", { ref: l, role: "status", className: m(kl({ variant: r }), n), ...u, children: [
     p,
@@ -6149,7 +6191,7 @@ const Oc = y(function({ accept: n, multiple: r, maxSize: a, value: o, onChange:
       }
     )
   ] });
-}), $c = y(function({
+}), Bc = y(function({
   value: n,
   defaultValue: r = [],
   onChange: a,
@@ -6220,9 +6262,9 @@ const Oc = y(function({ accept: n, multiple: r, maxSize: a, value: o, onChange:
       ]
     }
   );
-}), Fc = y(function({ className: n, children: r, ...a }, o) {
+}), _c = y(function({ className: n, children: r, ...a }, o) {
   return /* @__PURE__ */ e("ol", { ref: o, className: m("relative flex flex-col gap-6", n), ...a, children: r });
-}), Bc = y(function({ bullet: n, isLast: r, className: a, children: o, ...i }, s) {
+}), jc = y(function({ bullet: n, isLast: r, className: a, children: o, ...i }, s) {
   return /* @__PURE__ */ c("li", { ref: s, className: m("relative flex gap-4 pb-1", a), ...i, children: [
     /* @__PURE__ */ c("div", { className: "relative flex shrink-0 flex-col items-center", children: [
       /* @__PURE__ */ e("div", { className: "flex size-6 items-center justify-center rounded-full border border-border bg-card text-foreground-muted", children: n ?? /* @__PURE__ */ e("span", { className: "size-2 rounded-full bg-accent", "aria-hidden": !0 }) }),
@@ -6231,22 +6273,22 @@ const Oc = y(function({ accept: n, multiple: r, maxSize: a, value: o, onChange:
     /* @__PURE__ */ e("div", { className: "min-w-0 flex-1 pb-4", children: o })
   ] });
 });
-function _c({ className: t, children: n }) {
+function Hc({ className: t, children: n }) {
   return /* @__PURE__ */ e("p", { className: m("text-xs text-foreground-subtle", t), children: n });
 }
-function jc({
+function Vc({
   className: t,
   children: n
 }) {
   return /* @__PURE__ */ e("p", { className: m("text-sm font-medium", t), children: n });
 }
-function Hc({
+function Uc({
   className: t,
   children: n
 }) {
   return /* @__PURE__ */ e("p", { className: m("mt-0.5 text-sm text-foreground-muted", t), children: n });
 }
-function Vc({ data: t, defaultExpanded: n = [], selectedId: r, onSelect: a, className: o }) {
+function Gc({ data: t, defaultExpanded: n = [], selectedId: r, onSelect: a, className: o }) {
   const [i, s] = B(new Set(n)), d = (l) => s((p) => {
     const g = new Set(p);
     return g.has(l) ? g.delete(l) : g.add(l), g;
@@ -6289,7 +6331,7 @@ function Vc({ data: t, defaultExpanded: n = [], selectedId: r, onSelect: a, clas
   }
   return /* @__PURE__ */ e("ul", { role: "tree", className: m("flex flex-col gap-0.5", o), children: t.map((l) => u(l, 0)) });
 }
-function Uc({ brand: t, title: n, subtitle: r, children: a, footer: o }) {
+function Wc({ brand: t, title: n, subtitle: r, children: a, footer: o }) {
   return /* @__PURE__ */ e("main", { className: "grid min-h-screen place-items-center bg-background-subtle px-4 py-12", children: /* @__PURE__ */ c("div", { className: "w-full max-w-[400px] space-y-6", children: [
     t && /* @__PURE__ */ e("div", { className: "flex justify-center", children: t }),
     /* @__PURE__ */ c("div", { className: "space-y-2 text-center", children: [
@@ -6300,7 +6342,7 @@ function Uc({ brand: t, title: n, subtitle: r, children: a, footer: o }) {
     o && /* @__PURE__ */ e("p", { className: "text-center text-sm text-foreground-muted", children: o })
   ] }) });
 }
-function Gc({ onSubmit: t, loading: n, error: r, forgotHref: a = "/forgot" }) {
+function qc({ onSubmit: t, loading: n, error: r, forgotHref: a = "/forgot" }) {
   const [o, i] = B(""), [s, d] = B("");
   return /* @__PURE__ */ c("form", { onSubmit: (l) => {
     l.preventDefault(), t({ email: o, password: s });
@@ -6339,7 +6381,7 @@ function Gc({ onSubmit: t, loading: n, error: r, forgotHref: a = "/forgot" }) {
     /* @__PURE__ */ e(K, { type: "submit", loading: n, className: "w-full", trailingIcon: /* @__PURE__ */ e(At, {}), children: "Sign in" })
   ] });
 }
-function Wc({ onSubmit: t, loading: n, error: r }) {
+function Kc({ onSubmit: t, loading: n, error: r }) {
   const [a, o] = B(""), [i, s] = B(""), [d, u] = B("");
   return /* @__PURE__ */ c(
     "form",
@@ -6380,7 +6422,7 @@ function Wc({ onSubmit: t, loading: n, error: r }) {
     }
   );
 }
-function qc({ onSubmit: t, loading: n, error: r }) {
+function Yc({ onSubmit: t, loading: n, error: r }) {
   const [a, o] = B("");
   return /* @__PURE__ */ c(
     "form",
@@ -6408,7 +6450,7 @@ function qc({ onSubmit: t, loading: n, error: r }) {
     }
   );
 }
-function Kc({ email: t, onResend: n }) {
+function Xc({ email: t, onResend: n }) {
   return /* @__PURE__ */ c("div", { className: "space-y-4 text-center", children: [
     /* @__PURE__ */ e("div", { className: "mx-auto inline-flex size-12 items-center justify-center rounded-full bg-success-soft text-success-text", children: /* @__PURE__ */ e(bt, { className: "size-6", "aria-hidden": !0 }) }),
     /* @__PURE__ */ c("p", { className: "text-sm text-foreground-muted", children: [
@@ -6456,7 +6498,7 @@ function Ga({ active: t }) {
     ] })
   ] });
 }
-function Yc({ children: t, brand: n, active: r = "home" }) {
+function Qc({ children: t, brand: n, active: r = "home" }) {
   return /* @__PURE__ */ c("div", { className: "flex min-h-screen w-full bg-background", children: [
     /* @__PURE__ */ e(Ca, { defaultCollapsed: !1, header: n, footer: /* @__PURE__ */ e(Wa, {}), children: /* @__PURE__ */ e(Ga, { active: r }) }),
     /* @__PURE__ */ c("div", { className: "flex min-w-0 flex-1 flex-col", children: [
@@ -6647,7 +6689,7 @@ const Il = [
   { id: "3", who: { name: "Tuya G.", initials: "TG" }, action: "commented on", target: "Q2 OKRs", when: "1h ago" },
   { id: "4", who: { name: "Khulan O.", initials: "KO" }, action: "archived", target: "old-billing-spike", when: "3h ago" }
 ];
-function Xc() {
+function Jc() {
   return /* @__PURE__ */ c("div", { className: "space-y-8", children: [
     /* @__PURE__ */ c("header", { className: "flex items-end justify-between gap-4", children: [
       /* @__PURE__ */ c("div", { children: [
@@ -6712,7 +6754,7 @@ const Ml = [
   { id: "billing", label: "Billing", icon: /* @__PURE__ */ e(Ar, {}) },
   { id: "team", label: "Team", icon: /* @__PURE__ */ e(hn, {}) }
 ];
-function Qc() {
+function Zc() {
   const [t, n] = B("profile");
   return /* @__PURE__ */ c("div", { className: "mx-auto max-w-5xl space-y-8", children: [
     /* @__PURE__ */ c("header", { children: [
@@ -6846,7 +6888,7 @@ const Pl = [
   paused: { tone: "warning", label: "Paused" },
   archived: { tone: "neutral", label: "Archived" }
 };
-function Jc() {
+function ed() {
   const [t, n] = B(""), [r, a] = B("all"), [o, i] = B([]), [s, d] = B(1), [u, l] = B(10), p = ht(() => Pl.filter((b) => {
     const h = b.name.toLowerCase().includes(t.toLowerCase()), x = r === "all" || b.status === r;
     return h && x;
@@ -6961,7 +7003,7 @@ function Jc() {
     )
   ] });
 }
-function Zc() {
+function td() {
   return /* @__PURE__ */ c("div", { className: "space-y-6", children: [
     /* @__PURE__ */ e(
       ea,
@@ -7047,7 +7089,7 @@ const Jt = [
   { title: "Connect data" },
   { title: "Done" }
 ];
-function ed() {
+function nd() {
   const [t, n] = B(0), r = () => n((o) => Math.min(o + 1, Jt.length - 1)), a = () => n((o) => Math.max(o - 1, 0));
   return /* @__PURE__ */ c("div", { className: "mx-auto max-w-2xl space-y-8 py-12", children: [
     /* @__PURE__ */ e(Ta, { steps: Jt, current: t }),
@@ -7148,7 +7190,7 @@ const Sr = [
     cta: "Talk to sales"
   }
 ];
-function td() {
+function rd() {
   return /* @__PURE__ */ c("div", { className: "mx-auto max-w-5xl space-y-8 py-16", children: [
     /* @__PURE__ */ c("header", { className: "text-center space-y-3", children: [
       /* @__PURE__ */ e("h1", { className: "text-3xl font-semibold tracking-tight text-foreground", children: "Plans that scale with your team" }),
@@ -7211,7 +7253,7 @@ const Al = [
     cta: "Invite people"
   }
 ];
-function nd() {
+function ad() {
   return /* @__PURE__ */ c("div", { className: "mx-auto max-w-3xl space-y-8 py-12", children: [
     /* @__PURE__ */ e(
       er,
@@ -7238,13 +7280,13 @@ export {
   wo as AccordionItem,
   yo as AccordionTrigger,
   xn as Alert,
-  Yc as AppShell,
-  Tc as AreaChart,
-  Uc as AuthLayout,
+  Qc as AppShell,
+  Ic as AreaChart,
+  Wc as AuthLayout,
   Re as Avatar,
   Do as AvatarGroup,
   Ce as Badge,
-  Dc as BarChart,
+  zc as BarChart,
   ea as Breadcrumbs,
   K as Button,
   aa as Calendar,
@@ -7254,11 +7296,11 @@ export {
   Eo as CardFooter,
   ke as CardHeader,
   De as CardTitle,
-  wc as Carousel,
-  yc as CarouselContent,
-  Nc as CarouselItem,
-  Sc as CarouselNext,
-  kc as CarouselPrevious,
+  Nc as Carousel,
+  kc as CarouselContent,
+  Sc as CarouselItem,
+  Tc as CarouselNext,
+  Cc as CarouselPrevious,
   Zt as Checkbox,
   Ao as Combobox,
   Ro as Command,
@@ -7286,11 +7328,12 @@ export {
   Vo as ContextMenuSubContent,
   Ho as ContextMenuSubTrigger,
   tc as ContextMenuTrigger,
-  Xc as Dashboard,
+  Jc as Dashboard,
   si as DataGrid,
-  Jc as DataTablePage,
+  ed as DataTablePage,
   li as DatePicker,
   ci as DateRangePicker,
+  lc as DesignSystemProvider,
   di as Dialog,
   fi as DialogClose,
   sa as DialogContent,
@@ -7300,17 +7343,17 @@ export {
   ia as DialogOverlay,
   ui as DialogPortal,
   da as DialogTitle,
-  lc as DialogTrigger,
+  dc as DialogTrigger,
   bl as Drawer,
-  zc as DrawerClose,
-  Mc as DrawerContent,
-  Rc as DrawerDescription,
-  Ec as DrawerFooter,
-  Pc as DrawerHeader,
+  Pc as DrawerClose,
+  Ec as DrawerContent,
+  Lc as DrawerDescription,
+  Rc as DrawerFooter,
+  Ac as DrawerHeader,
   vl as DrawerOverlay,
   xl as DrawerPortal,
-  Ac as DrawerTitle,
-  Ic as DrawerTrigger,
+  Oc as DrawerTitle,
+  Mc as DrawerTrigger,
   Kn as DropdownMenu,
   ta as DropdownMenuCheckboxItem,
   yn as DropdownMenuContent,
@@ -7328,14 +7371,14 @@ export {
   Yn as DropdownMenuTrigger,
   er as EmptyState,
   pi as ErrorState,
-  Oc as FileUpload,
-  nd as FirstRunEmpty,
-  qc as ForgotPasswordForm,
-  cc as Form,
+  $c as FileUpload,
+  ad as FirstRunEmpty,
+  Yc as ForgotPasswordForm,
+  uc as Form,
   xi as FormControl,
   vi as FormDescription,
   wi as FormError,
-  dc as FormField,
+  fc as FormField,
   hi as FormItem,
   bi as FormLabel,
   _t as IconButton,
@@ -7343,22 +7386,22 @@ export {
   Yl as Illustrations,
   le as Input,
   ga as Kbd,
-  Cc as LineChart,
-  Kc as MagicLinkSent,
+  Dc as LineChart,
+  Xc as MagicLinkSent,
   yi as MultiSelect,
-  ed as Onboarding,
+  nd as Onboarding,
   wa as Pagination,
-  fc as Popover,
-  gc as PopoverAnchor,
-  pc as PopoverClose,
+  gc as Popover,
+  hc as PopoverAnchor,
+  bc as PopoverClose,
   Ci as PopoverContent,
-  mc as PopoverTrigger,
-  td as Pricing,
+  pc as PopoverTrigger,
+  rd as Pricing,
   Ii as Progress,
   Mi as ProgressCircle,
   ya as RadioGroup,
   tn as RadioItem,
-  Zc as RecordDetail,
+  td as RecordDetail,
   Pi as ScrollArea,
   Na as ScrollBar,
   pa as Select,
@@ -7370,11 +7413,11 @@ export {
   ba as SelectScrollUpButton,
   Ni as SelectSeparator,
   tr as SelectTrigger,
-  uc as SelectValue,
+  mc as SelectValue,
   gt as Separator,
-  Qc as SettingsPage,
+  Zc as SettingsPage,
   Ei as Sheet,
-  hc as SheetClose,
+  xc as SheetClose,
   Sa as SheetContent,
   Bi as SheetDescription,
   $i as SheetFooter,
@@ -7386,11 +7429,11 @@ export {
   _i as SidebarGroup,
   Ae as SidebarItem,
   nn as SidebarSection,
-  Gc as SignInForm,
-  Wc as SignUpForm,
+  qc as SignInForm,
+  Kc as SignUpForm,
   ra as Skeleton,
   ji as Slider,
-  Lc as Snackbar,
+  Fc as Snackbar,
   Ui as Spinner,
   Ta as Stepper,
   Ct as Switch,
@@ -7407,37 +7450,38 @@ export {
   Dt as TabsContent,
   Da as TabsList,
   Tt as TabsTrigger,
-  $c as TagInput,
+  Bc as TagInput,
   Yi as Textarea,
-  Fc as Timeline,
-  Hc as TimelineDescription,
-  Bc as TimelineItem,
-  _c as TimelineTime,
-  jc as TimelineTitle,
+  _c as Timeline,
+  Uc as TimelineDescription,
+  jc as TimelineItem,
+  Hc as TimelineTime,
+  Vc as TimelineTitle,
   Zi as Toast,
   ns as ToastAction,
   rs as ToastClose,
   ts as ToastDescription,
-  xc as ToastProvider,
+  wc as ToastProvider,
   es as ToastTitle,
   Xi as ToastViewport,
   is as Tooltip,
   Ia as TooltipContent,
-  vc as TooltipProvider,
+  yc as TooltipProvider,
   as as TooltipRoot,
   os as TooltipTrigger,
   ss as TopNav,
   ls as TopNavLink,
-  Vc as Tree,
+  Gc as Tree,
+  cc as brandPresets,
   m as cn,
-  od as cva,
+  sd as cva,
   ql as toast,
   Ul as uid,
   Zl as useCommandPaletteShortcut,
   Nn as useFormField,
   mo as useMediaQuery,
   Gl as usePrefersReducedMotion,
-  bc as useSidebar,
+  vc as useSidebar,
   Wl as useToast
 };
 //# sourceMappingURL=index.js.map