impact-nova 1.5.14 → 1.6.0

package/dist/components/ui/date-picker/week-range-picker.js

@@ -1,16 +1,16 @@
-import { jsxs as g, jsx as s } from "react/jsx-runtime";
-import * as l from "react";
+import { jsxs as h, jsx as s } from "react/jsx-runtime";
+import * as r from "react";
 import { X as De } from "lucide-react";
 import { CalendarMonth as ye, Info as Re } from "../../../icons/index.js";
-import { format as r, isValid as S, parse as C } from "date-fns";
-import { cn as N, padValidDateString as K, maskDate as Q } from "../../../lib/utils.js";
-import { Popover as Se, PopoverTrigger as Ce, PopoverContent as Ne } from "../popover.js";
+import { format as l, isValid as S, parse as N } from "date-fns";
+import { cn as C, padValidDateString as K, maskDate as Q } from "../../../lib/utils.js";
+import { Popover as Se, PopoverTrigger as Ne, PopoverContent as Ce } from "../popover.js";
 import { Calendar as Ie } from "../calendar.js";
 import { Tooltip as U, TooltipTrigger as Z, TooltipContent as $ } from "../tooltip.js";
-import { resolveWeekSelection as We } from "../../../lib/fiscal-calendar.js";
-import { getDateFnsLocale as Pe } from "../../../i18n/getDateFnsLocale.js";
-import { useImpactNovaI18n as Ve } from "../../../i18n/ImpactNovaI18nContext.js";
-const c = (e) => e?.from ? e.to ? e.to.endDate : e.from.endDate : void 0, ve = l.forwardRef(
+import { resolveWeekSelection as ve } from "../../../lib/fiscal-calendar.js";
+import { getDateFnsLocale as We } from "../../../i18n/getDateFnsLocale.js";
+import { useImpactNovaI18n as Pe } from "../../../i18n/ImpactNovaI18nContext.js";
+const c = (e) => e?.from ? e.to ? e.to.endDate : e.from.endDate : void 0, Ve = r.forwardRef(
   ({
     value: e,
     onChange: x,
@@ -20,7 +20,7 @@ const c = (e) => e?.from ? e.to ? e.to.endDate : e.from.endDate : void 0, ve = l
     maxDate: F,
     startMonth: ee,
     endMonth: te,
-    showFooter: b = !0,
+    showFooter: k = !0,
     calendarType: E = "calendar",
     fiscalMode: T = "basic",
     selectionMode: A = "week",
@@ -36,25 +36,25 @@ const c = (e) => e?.from ? e.to ? e.to.endDate : e.from.endDate : void 0, ve = l
     required: oe,
     prefix: Ee,
     prefixClick: Te,
-    ...re
+    ...le
   }, se) => {
-    const { locale: H, t: V } = Ve(), o = l.useMemo(() => Pe(H), [H]), X = Y ?? V("datePicker.selectWeekRange"), q = l.useRef(null), le = l.useRef(null);
-    l.useRef(null), l.useRef(null), l.useImperativeHandle(se, () => q.current);
-    const [a, W] = l.useState(!1), [w, d] = l.useState(e), [y, f] = l.useState(e?.from ? r(e.from.startDate, t, { locale: o }) : ""), [R, p] = l.useState(c(e) ? r(c(e), t, { locale: o }) : ""), [ce, v] = l.useState(e?.from?.startDate || /* @__PURE__ */ new Date());
-    l.useEffect(() => {
-      a || (f(e?.from ? r(e.from.startDate, t, { locale: o }) : ""), p(c(e) ? r(c(e), t, { locale: o }) : ""), d(e));
-    }, [e, t, a, o]), l.useEffect(() => {
-      a && (d(e), f(e?.from ? r(e.from.startDate, t, { locale: o }) : ""), p(c(e) ? r(c(e), t, { locale: o }) : ""), v(e?.from?.startDate || /* @__PURE__ */ new Date()));
+    const { locale: H, t: P } = Pe(), o = r.useMemo(() => We(H), [H]), X = Y ?? P("datePicker.selectWeekRange"), q = r.useRef(null), re = r.useRef(null);
+    r.useRef(null), r.useRef(null), r.useImperativeHandle(se, () => q.current);
+    const [a, v] = r.useState(!1), [w, d] = r.useState(e), [y, f] = r.useState(e?.from ? l(e.from.startDate, t, { locale: o }) : ""), [R, p] = r.useState(c(e) ? l(c(e), t, { locale: o }) : ""), [ce, V] = r.useState(e?.from?.startDate || /* @__PURE__ */ new Date());
+    r.useEffect(() => {
+      a || (f(e?.from ? l(e.from.startDate, t, { locale: o }) : ""), p(c(e) ? l(c(e), t, { locale: o }) : ""), d(e));
+    }, [e, t, a, o]), r.useEffect(() => {
+      a && (d(e), f(e?.from ? l(e.from.startDate, t, { locale: o }) : ""), p(c(e) ? l(c(e), t, { locale: o }) : ""), V(e?.from?.startDate || /* @__PURE__ */ new Date()));
     }, [a, e, t, o]);
     const ie = (n) => {
-      d(n), n?.from ? (f(r(n.from.startDate, t, { locale: o })), p(r(c(n), t, { locale: o }))) : (f(""), p("")), !b && n?.from && n?.to && n.from.startDate.getTime() !== n.to.startDate.getTime() && (x?.(n), W(!1));
+      d(n), n?.from ? (f(l(n.from.startDate, t, { locale: o })), p(l(c(n), t, { locale: o }))) : (f(""), p("")), !k && n?.from && n?.to && n.from.startDate.getTime() !== n.to.startDate.getTime() && (x?.(n), v(!1));
     }, ae = (n) => {
-      x?.(n !== void 0 ? n : w), W(!1);
+      x?.(n !== void 0 ? n : w), v(!1);
     }, de = () => {
-      d(e), f(e?.from ? r(e.from.startDate, t, { locale: o }) : ""), p(c(e) ? r(c(e), t, { locale: o }) : ""), W(!1);
+      d(e), f(e?.from ? l(e.from.startDate, t, { locale: o }) : ""), p(c(e) ? l(c(e), t, { locale: o }) : ""), v(!1);
     }, G = () => {
-      d(void 0), f(""), p(""), x?.(void 0), b || W(!1);
-    }, P = (n) => We(n, {
+      d(void 0), f(""), p(""), x?.(void 0), k || v(!1);
+    }, W = (n) => ve(n, {
       calendarType: E,
       fiscalMode: T,
       selectionMode: A,
@@ -62,170 +62,172 @@ const c = (e) => e?.from ? e.to ? e.to.endDate : e.from.endDate : void 0, ve = l
       fiscalYearStartMonth: M,
       weekStartsOn: j
     }), fe = (n) => {
-      const h = n.target.value, i = Q(h, t, y);
+      const g = n.target.value, i = Q(g, t, y);
       if (f(i), i === "") {
         const u = { from: void 0, to: w?.to };
-        d(u), b || x?.(u);
+        d(u), k || x?.(u);
         return;
       }
-      const m = C(i, t, /* @__PURE__ */ new Date(), { locale: o });
+      const m = N(i, t, /* @__PURE__ */ new Date(), { locale: o });
       if (S(m) && i.length === t.length) {
-        const k = { from: P(m), to: w?.to };
-        d(k), p(r(c(k), t, { locale: o })), b || x?.(k);
+        const b = { from: W(m), to: w?.to };
+        d(b), p(l(c(b), t, { locale: o })), k || x?.(b);
       }
     }, pe = (n) => {
-      const h = n.target.value, i = Q(h, t, R);
+      const g = n.target.value, i = Q(g, t, R);
       if (p(i), i === "") {
         const u = { from: w?.from, to: void 0 };
-        d(u), b || x?.(u);
+        d(u), k || x?.(u);
         return;
       }
-      const m = C(i, t, /* @__PURE__ */ new Date(), { locale: o });
+      const m = N(i, t, /* @__PURE__ */ new Date(), { locale: o });
       if (S(m) && i.length === t.length) {
-        const u = P(m), k = { from: w?.from, to: u };
-        d(k), w?.from && f(r(w.from.startDate, t, { locale: o })), m && v(m), b || x?.(k);
+        const u = W(m), b = { from: w?.from, to: u };
+        d(b), w?.from && f(l(w.from.startDate, t, { locale: o })), m && V(m), k || x?.(b);
       }
     }, J = () => {
       if (a) return;
-      const n = K(y, t), h = K(R, t), i = C(n, t, /* @__PURE__ */ new Date(), { locale: o }), m = C(h, t, /* @__PURE__ */ new Date(), { locale: o }), u = S(i) && n.length === t.length, k = S(m) && h.length === t.length;
-      if (!u || !k)
-        f(e?.from ? r(e.from.startDate, t, { locale: o }) : ""), p(c(e) ? r(c(e), t, { locale: o }) : ""), d(e);
-      else if (f(n), p(h), !b) {
-        const we = P(i), ke = P(m);
-        x?.({ from: we, to: ke });
+      const n = K(y, t), g = K(R, t), i = N(n, t, /* @__PURE__ */ new Date(), { locale: o }), m = N(g, t, /* @__PURE__ */ new Date(), { locale: o }), u = S(i) && n.length === t.length, b = S(m) && g.length === t.length;
+      if (!u || !b)
+        f(e?.from ? l(e.from.startDate, t, { locale: o }) : ""), p(c(e) ? l(c(e), t, { locale: o }) : ""), d(e);
+      else if (f(n), p(g), !k) {
+        const we = W(i), be = W(m);
+        x?.({ from: we, to: be });
       }
-    }, me = e?.from ? r(e.from.startDate, t, { locale: o }) : "", ue = c(e) ? r(c(e), t, { locale: o }) : "", he = me !== y, ge = ue !== R, xe = y.length === t.length && !S(C(y, t, /* @__PURE__ */ new Date(), { locale: o })), be = R.length === t.length && !S(C(R, t, /* @__PURE__ */ new Date(), { locale: o }));
-    return /* @__PURE__ */ g("div", { className: "w-full space-y-1.5 min-w-[240px]", "data-component": "week-range-picker", "data-disabled": D || void 0, children: [
-      O && /* @__PURE__ */ g(
-        "label",
-        {
-          className: N(
-            "text-xs font-medium leading-[18px] text-[#60697d]",
-            D && "opacity-70",
-            I && "text-destructive"
-          ),
-          children: [
-            O,
-            " ",
-            oe && /* @__PURE__ */ s("span", { className: "text-destructive", children: "*" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ g(Se, { open: a, onOpenChange: W, children: [
-        /* @__PURE__ */ s(Ce, { asChild: !0, children: /* @__PURE__ */ g(
-          "div",
+    }, me = e?.from ? l(e.from.startDate, t, { locale: o }) : "", ue = c(e) ? l(c(e), t, { locale: o }) : "", he = me !== y, ge = ue !== R, xe = y.length === t.length && !S(N(y, t, /* @__PURE__ */ new Date(), { locale: o })), ke = R.length === t.length && !S(N(R, t, /* @__PURE__ */ new Date(), { locale: o }));
+    return /* @__PURE__ */ h("div", { className: "flex w-full min-w-[240px] flex-col gap-[6px]", "data-component": "week-range-picker", "data-disabled": D || void 0, children: [
+      /* @__PURE__ */ h("div", { className: "flex flex-col gap-[6px]", children: [
+        O && /* @__PURE__ */ h(
+          "label",
           {
-            "data-state": a ? "open" : "closed",
-            className: N(
-              "flex w-full items-center justify-between gap-2 rounded-md border bg-white px-3 text-sm shadow-sm transition-colors hover:border-primary disabled:cursor-not-allowed disabled:bg-disabled-secondary-bg disabled:text-disabled-text disabled:border-border",
-              I ? "border-destructive hover:border-destructive" : "border-input",
-              B === "sm" ? "h-6" : B === "md" ? "h-[28px]" : "h-8",
-              D && "pointer-events-none opacity-100 bg-disabled-secondary-bg border-border text-disabled-text hover:border-border",
-              "cursor-pointer",
-              ne
+            className: C(
+              "text-xs font-medium leading-[18px] text-content-tertiary",
+              D && "opacity-70",
+              I && "text-destructive"
             ),
             children: [
-              /* @__PURE__ */ g("div", { className: "flex items-center gap-4 flex-1 min-w-0", children: [
-                /* @__PURE__ */ s(
-                  "input",
-                  {
-                    ref: q,
-                    type: "text",
-                    value: y,
-                    onChange: fe,
-                    onBlur: J,
-                    onClick: (n) => a && n.stopPropagation(),
-                    placeholder: a ? t : X,
-                    disabled: !!D,
-                    "data-field": "start",
-                    className: N(
-                      "flex-1 min-w-0 bg-transparent p-0 text-sm font-medium outline-none placeholder:font-medium placeholder:text-[#dfe2e7] disabled:cursor-not-allowed disabled:opacity-50",
-                      xe ? "text-destructive" : he ? "text-muted-foreground" : ""
-                    ),
-                    ...re
-                  }
-                ),
-                /* @__PURE__ */ s(
-                  "input",
-                  {
-                    ref: le,
-                    type: "text",
-                    value: R,
-                    onChange: pe,
-                    onBlur: J,
-                    onClick: (n) => a && n.stopPropagation(),
-                    placeholder: a ? t : X,
-                    disabled: !!D,
-                    "data-field": "end",
-                    className: N(
-                      "flex-1 min-w-0 bg-transparent p-0 text-sm font-medium outline-none placeholder:font-medium placeholder:text-[#dfe2e7] disabled:cursor-not-allowed disabled:opacity-50",
-                      be ? "text-destructive" : ge ? "text-muted-foreground" : ""
-                    )
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ g("div", { className: "flex items-center gap-1 shrink-0", children: [
-                e?.from && !D && /* @__PURE__ */ g(U, { children: [
-                  /* @__PURE__ */ s(Z, { asChild: !0, children: /* @__PURE__ */ s(
-                    De,
+              O,
+              " ",
+              oe && /* @__PURE__ */ s("span", { className: "text-destructive", children: "*" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ h(Se, { open: a, onOpenChange: v, children: [
+          /* @__PURE__ */ s(Ne, { asChild: !0, children: /* @__PURE__ */ h(
+            "div",
+            {
+              "data-state": a ? "open" : "closed",
+              className: C(
+                "flex w-full items-center justify-between gap-2 rounded-md border bg-canvas-elevated px-3 text-sm shadow-sm transition-colors hover:border-brand disabled:cursor-not-allowed disabled:bg-disabled-surface disabled:text-disabled-foreground disabled:border-stroke",
+                I ? "border-destructive hover:border-destructive" : "border-field",
+                B === "sm" ? "h-6" : B === "md" ? "h-[28px]" : "h-8",
+                D && "pointer-events-none opacity-100 bg-disabled-surface border-stroke text-disabled-foreground hover:border-stroke",
+                "cursor-pointer",
+                ne
+              ),
+              children: [
+                /* @__PURE__ */ h("div", { className: "flex items-center gap-4 flex-1 min-w-0", children: [
+                  /* @__PURE__ */ s(
+                    "input",
                     {
-                      className: "h-4 w-4 cursor-pointer hover:text-foreground text-muted-foreground",
-                      onClick: (n) => {
-                        n.stopPropagation(), G();
-                      }
+                      ref: q,
+                      type: "text",
+                      value: y,
+                      onChange: fe,
+                      onBlur: J,
+                      onClick: (n) => a && n.stopPropagation(),
+                      placeholder: a ? t : X,
+                      disabled: !!D,
+                      "data-field": "start",
+                      className: C(
+                        "flex-1 min-w-0 bg-transparent p-0 text-sm font-medium outline-none placeholder:font-medium placeholder:text-content-empty disabled:cursor-not-allowed disabled:opacity-50",
+                        xe ? "text-destructive" : he ? "text-content-muted" : ""
+                      ),
+                      ...le
                     }
-                  ) }),
-                  /* @__PURE__ */ s($, { variant: "tertiary", side: "top", children: V("calendar.clear") })
+                  ),
+                  /* @__PURE__ */ s(
+                    "input",
+                    {
+                      ref: re,
+                      type: "text",
+                      value: R,
+                      onChange: pe,
+                      onBlur: J,
+                      onClick: (n) => a && n.stopPropagation(),
+                      placeholder: a ? t : X,
+                      disabled: !!D,
+                      "data-field": "end",
+                      className: C(
+                        "flex-1 min-w-0 bg-transparent p-0 text-sm font-medium outline-none placeholder:font-medium placeholder:text-content-empty disabled:cursor-not-allowed disabled:opacity-50",
+                        ke ? "text-destructive" : ge ? "text-content-muted" : ""
+                      )
+                    }
+                  )
                 ] }),
-                /* @__PURE__ */ g(U, { children: [
-                  /* @__PURE__ */ s(Z, { asChild: !0, children: /* @__PURE__ */ s(ye, { className: "h-4 w-4 text-secondary-foreground" }) }),
-                  /* @__PURE__ */ s($, { variant: "tertiary", side: "top", children: V("datePicker.selectWeekRange") })
+                /* @__PURE__ */ h("div", { className: "flex items-center gap-1 shrink-0", children: [
+                  e?.from && !D && /* @__PURE__ */ h(U, { children: [
+                    /* @__PURE__ */ s(Z, { asChild: !0, children: /* @__PURE__ */ s(
+                      De,
+                      {
+                        className: "h-4 w-4 cursor-pointer hover:text-content text-content-muted",
+                        onClick: (n) => {
+                          n.stopPropagation(), G();
+                        }
+                      }
+                    ) }),
+                    /* @__PURE__ */ s($, { variant: "tertiary", side: "top", children: P("calendar.clear") })
+                  ] }),
+                  /* @__PURE__ */ h(U, { children: [
+                    /* @__PURE__ */ s(Z, { asChild: !0, children: /* @__PURE__ */ s(ye, { className: "h-4 w-4 text-secondary-foreground" }) }),
+                    /* @__PURE__ */ s($, { variant: "tertiary", side: "top", children: P("datePicker.selectWeekRange") })
+                  ] })
                 ] })
-              ] })
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ s(
-          Ne,
-          {
-            className: "w-auto p-0",
-            align: "start",
-            onOpenAutoFocus: (n) => n.preventDefault(),
-            children: /* @__PURE__ */ s(
-              Ie,
-              {
-                pickerType: "week",
-                weekMode: "range",
-                selectedWeeks: w,
-                onWeekSelect: ie,
-                month: ce,
-                onMonthChange: v,
-                disabled: { before: _, after: F },
-                startMonth: ee,
-                endMonth: te,
-                showFooter: b,
-                calendarType: E,
-                fiscalMode: T,
-                selectionMode: A,
-                fiscalMonthPattern: L,
-                fiscalYearStartMonth: M,
-                weekStartsOn: j,
-                onApply: ae,
-                onCancel: de,
-                onClear: G,
-                captionLayout: "dropdown"
-              }
-            )
-          }
-        )
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ s(
+            Ce,
+            {
+              className: "w-auto p-0",
+              align: "start",
+              onOpenAutoFocus: (n) => n.preventDefault(),
+              children: /* @__PURE__ */ s(
+                Ie,
+                {
+                  pickerType: "week",
+                  weekMode: "range",
+                  selectedWeeks: w,
+                  onWeekSelect: ie,
+                  month: ce,
+                  onMonthChange: V,
+                  disabled: { before: _, after: F },
+                  startMonth: ee,
+                  endMonth: te,
+                  showFooter: k,
+                  calendarType: E,
+                  fiscalMode: T,
+                  selectionMode: A,
+                  fiscalMonthPattern: L,
+                  fiscalYearStartMonth: M,
+                  weekStartsOn: j,
+                  onApply: ae,
+                  onCancel: de,
+                  onClear: G,
+                  captionLayout: "dropdown"
+                }
+              )
+            }
+          )
+        ] })
       ] }),
-      z && /* @__PURE__ */ g("div", { className: N("flex items-center gap-1", I && "text-destructive"), children: [
-        !I && /* @__PURE__ */ s(Re, { size: 10, className: "shrink-0 text-muted-foreground" }),
+      z && /* @__PURE__ */ h("div", { className: C("flex items-center gap-[6px]", I && "text-destructive"), children: [
+        !I && /* @__PURE__ */ s(Re, { size: 10, className: "shrink-0 text-content-muted" }),
         /* @__PURE__ */ s(
           "p",
           {
-            className: N(
-              "text-[10px] text-[#7a8294]",
+            className: C(
+              "text-[10px] leading-4 text-navigation-muted",
               I && "text-destructive"
             ),
             children: z
@@ -235,7 +237,7 @@ const c = (e) => e?.from ? e.to ? e.to.endDate : e.from.endDate : void 0, ve = l
     ] });
   }
 );
-ve.displayName = "WeekRangePicker";
+Ve.displayName = "WeekRangePicker";
 export {
-  ve as WeekRangePicker
+  Ve as WeekRangePicker
 };

package/dist/components/ui/dialog.js

@@ -3,22 +3,22 @@ import * as n from "react";
 import * as t from "@radix-ui/react-dialog";
 import { X as f } from "lucide-react";
 import { cn as i } from "../../lib/utils.js";
-import { Tooltip as g, TooltipTrigger as u, TooltipContent as x } from "./tooltip.js";
-import { useImpactNovaI18n as y } from "../../i18n/ImpactNovaI18nContext.js";
-const O = t.Root, P = t.Trigger, N = t.Portal, B = t.Close, r = n.forwardRef(({ className: e, ...a }, s) => /* @__PURE__ */ o(
+import { Tooltip as g, TooltipTrigger as y, TooltipContent as x } from "./tooltip.js";
+import { useImpactNovaI18n as u } from "../../i18n/ImpactNovaI18nContext.js";
+const P = t.Root, B = t.Trigger, N = t.Portal, F = t.Close, r = n.forwardRef(({ className: e, ...a }, s) => /* @__PURE__ */ o(
   t.Overlay,
   {
     ref: s,
     className: i(
-      "fixed inset-0 z-50 bg-black/40  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      "fixed inset-0 z-50 bg-scrim  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
       e
     ),
     ...a
   }
 ));
 r.displayName = t.Overlay.displayName;
-const b = n.forwardRef(({ className: e, children: a, hideClose: s, ...c }, m) => {
-  const { t: p } = y(), d = p("aria.close");
+const v = n.forwardRef(({ className: e, children: a, hideClose: s, ...c }, m) => {
+  const { t: p } = u(), d = p("aria.close");
   return /* @__PURE__ */ l(N, { children: [
     /* @__PURE__ */ o(r, {}),
     /* @__PURE__ */ l(
@@ -28,18 +28,18 @@ const b = n.forwardRef(({ className: e, children: a, hideClose: s, ...c }, m) =>
         "aria-describedby": void 0,
         "data-component": "dialog-content",
         className: i(
-          "fixed left-[50%] top-[50%] z-50 flex flex-col w-full max-w-lg translate-x-[-50%] translate-y-[-50%] border bg-background shadow-xl duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] rounded-lg overflow-hidden",
+          "fixed left-[50%] top-[50%] z-50 flex flex-col w-full max-w-lg translate-x-[-50%] translate-y-[-50%] border bg-canvas shadow-xl duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] rounded-lg overflow-hidden",
           e
         ),
         ...c,
         children: [
           a,
           !s && /* @__PURE__ */ l(g, { children: [
-            /* @__PURE__ */ o(u, { asChild: !0, children: /* @__PURE__ */ l(
+            /* @__PURE__ */ o(y, { asChild: !0, children: /* @__PURE__ */ l(
               t.Close,
               {
                 "data-component": "dialog-close",
-                className: "absolute right-4 top-4 rounded-sm opacity-50 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground",
+                className: "absolute right-4 top-4 rounded-sm opacity-50 ring-offset-canvas transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-focus-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-content-muted",
                 "aria-label": d,
                 children: [
                   /* @__PURE__ */ o(f, { className: "h-4 w-4" }),
@@ -54,7 +54,7 @@ const b = n.forwardRef(({ className: e, children: a, hideClose: s, ...c }, m) =>
     )
   ] });
 });
-b.displayName = t.Content.displayName;
+v.displayName = t.Content.displayName;
 const D = ({
   className: e,
   ...a
@@ -62,48 +62,45 @@ const D = ({
   "div",
   {
     className: i(
-      "flex flex-col text-center sm:text-left bg-light-blue p-4 border-b",
+      "flex flex-col text-center sm:text-left bg-canvas-tint p-4 border-b",
       e
     ),
     ...a
   }
 );
 D.displayName = "DialogHeader";
-const h = ({
+const b = ({
   className: e,
   ...a
 }) => /* @__PURE__ */ o(
   "div",
   {
-    className: i(
-      "px-6 py-6 flex-1 overflow-y-auto min-h-0",
-      e
-    ),
+    className: i("px-6 py-6 flex-1 overflow-y-auto min-h-0", e),
     ...a
   }
 );
-h.displayName = "DialogBody";
-const v = ({
+b.displayName = "DialogBody";
+const h = ({
   className: e,
   ...a
 }) => /* @__PURE__ */ o(
   "div",
   {
     className: i(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:items-center sm:space-x-2 px-4 py-3 border-t bg-white",
+      "flex flex-col-reverse sm:flex-row sm:justify-end sm:items-center sm:space-x-2 px-4 py-3 bg-canvas-elevated",
       e
     ),
     ...a
   }
 );
-v.displayName = "DialogFooter";
+h.displayName = "DialogFooter";
 const w = n.forwardRef(({ className: e, ...a }, s) => /* @__PURE__ */ o(
   t.Title,
   {
     ref: s,
     "data-component": "dialog-title",
     className: i(
-      "text-md font-bold leading-none tracking-tight text-slate-900",
+      "text-md font-bold leading-none tracking-tight text-content",
       e
     ),
     ...a
@@ -114,21 +111,21 @@ const T = n.forwardRef(({ className: e, ...a }, s) => /* @__PURE__ */ o(
   t.Description,
   {
     ref: s,
-    className: i("text-sm text-slate-600 leading-relaxed", e),
+    className: i("text-sm text-content-secondary leading-relaxed", e),
     ...a
   }
 ));
 T.displayName = t.Description.displayName;
 export {
-  O as Dialog,
-  h as DialogBody,
-  B as DialogClose,
-  b as DialogContent,
+  P as Dialog,
+  b as DialogBody,
+  F as DialogClose,
+  v as DialogContent,
   T as DialogDescription,
-  v as DialogFooter,
+  h as DialogFooter,
   D as DialogHeader,
   r as DialogOverlay,
   N as DialogPortal,
   w as DialogTitle,
-  P as DialogTrigger
+  B as DialogTrigger
 };