impact-nova 2.1.0-alpha.4 → 2.1.0-alpha.6

package/dist/components/flows/command-palette/shortcut-settings.js

@@ -1,5 +1,5 @@
 import { jsx as r, jsxs as h, Fragment as j } from "react/jsx-runtime";
-import * as s from "react";
+import * as i from "react";
 import { Person as z, Monitor as G, PriorityAlert as U, Locked as T, Reset as q } from "impact-nova-icons";
 import { cn as p } from "../../../lib/utils.js";
 import { ModuleRegistry as B, AllCommunityModule as $ } from "ag-grid-community";
@@ -15,17 +15,17 @@ B.registerModules([$, H]);
 function te(a) {
   const t = a.data;
   return t ? /* @__PURE__ */ h("div", { className: "flex items-center gap-2 min-w-0 h-full", children: [
-    !t.customisable && /* @__PURE__ */ r(T, { className: "h-3 w-3 text-content-muted shrink-0" }),
+    !t.customisable && /* @__PURE__ */ r(T, { className: "h-3 w-3 text-secondary-foreground shrink-0" }),
     /* @__PURE__ */ h("div", { className: "flex flex-col min-w-0 gap-0", children: [
       /* @__PURE__ */ r("span", { className: "truncate font-medium text-content-charcoal text-xs leading-tight", children: t.command }),
-      t.description && /* @__PURE__ */ r("span", { className: "truncate text-[10px] text-content-muted leading-tight", children: t.description })
+      t.description && /* @__PURE__ */ r("span", { className: "truncate text-[10px] text-secondary-foreground leading-tight", children: t.description })
     ] })
   ] }) : null;
 }
 function re(a) {
   const t = a.data;
   if (!t) return null;
-  const u = a.recordingCommandId === t.id;
+  const d = a.recordingCommandId === t.id;
   return /* @__PURE__ */ r("div", { className: p(
     "w-full h-full flex items-center ag-cell-inner-padding",
     t.customisable ? "in-ag-editable-cell-highlight" : ""
@@ -35,9 +35,9 @@ function re(a) {
       className: p(
         "flex items-center justify-between w-full h-7 rounded-[8px] px-1.5 group/row relative",
         t.customisable ? "bg-canvas-elevated" : "bg-transparent",
-        u && "ring-1 ring-brand border border-brand"
+        d && "ring-1 ring-brand border border-brand"
       ),
-      children: u ? /* @__PURE__ */ r("span", { className: "text-xs text-brand font-medium animate-pulse motion-reduce:animate-none", children: a.recordingLabel ?? "Press desired shortcut..." }) : /* @__PURE__ */ h(j, { children: [
+      children: d ? /* @__PURE__ */ r("span", { className: "text-xs text-brand font-medium animate-pulse motion-reduce:animate-none", children: a.recordingLabel ?? "Press desired shortcut..." }) : /* @__PURE__ */ h(j, { children: [
         t.keybinding ? /* @__PURE__ */ r(
           "button",
           {
@@ -59,11 +59,11 @@ function re(a) {
             onClick: (o) => {
               o.stopPropagation(), a.onStartRecording(t.id);
             },
-            className: "flex items-center justify-end h-full w-full text-xs text-content-muted hover:text-brand transition-colors cursor-pointer text-end",
+            className: "flex items-center justify-end h-full w-full text-xs text-secondary-foreground hover:text-brand transition-colors cursor-pointer text-end",
             children: a.addShortcutLabel ?? "Add shortcut"
           }
         ) : /* @__PURE__ */ r("span", { className: "text-xs text-transparent", children: "--" }),
-        t.hasOverride && t.customisable && !u && /* @__PURE__ */ r(
+        t.hasOverride && t.customisable && !d && /* @__PURE__ */ r(
           "button",
           {
             type: "button",
@@ -81,15 +81,15 @@ function re(a) {
 }
 function ne(a) {
   const t = a.data;
-  return t ? /* @__PURE__ */ r("div", { className: "flex items-center h-full", children: /* @__PURE__ */ r("span", { className: "text-xs text-content-muted capitalize", children: t.scope }) }) : null;
+  return t ? /* @__PURE__ */ r("div", { className: "flex items-center h-full", children: /* @__PURE__ */ r("span", { className: "text-xs text-secondary-foreground capitalize", children: t.scope }) }) : null;
 }
 function ae({
   className: a,
   scopes: t,
-  sources: u,
+  sources: d,
   renderStatus: o,
   recordingLabel: le,
-  pressShortcutLabel: y,
+  pressShortcutLabel: x,
   addShortcutLabel: v,
   conflictWarnLabel: w = "Conflicts with other shortcuts",
   reservedWarnLabel: b = "This shortcut is reserved by the browser",
@@ -101,20 +101,20 @@ function ae({
     updateKeybinding: N,
     resetKeybinding: R,
     version: O
-  } = Y(), [c, f] = s.useState(null), [d, l] = s.useState(null), x = s.useMemo(() => {
+  } = Y(), [c, f] = i.useState(null), [u, l] = i.useState(null), y = i.useMemo(() => {
     let n = C();
     return n = n.filter((e) => {
-      const i = e.source ?? "user";
-      return i === "user" || i === "ag-grid";
-    }), t && (n = n.filter((e) => t.includes(e.scope))), u && (n = n.filter((e) => e.source && u.includes(e.source))), n.map((e) => {
-      const i = S(e.id), g = e.source ?? "user", D = m[g] ?? g ?? "User", A = D.toLowerCase() === "user";
+      const s = e.source ?? "user";
+      return s === "user" || s === "ag-grid";
+    }), t && (n = n.filter((e) => t.includes(e.scope))), d && (n = n.filter((e) => e.source && d.includes(e.source))), n.map((e) => {
+      const s = S(e.id), g = e.source ?? "user", D = m[g] ?? g ?? "User", A = D.toLowerCase() === "user";
       return {
         id: e.id,
         command: e.label,
         description: e.description || "",
         category: e.category || "General",
-        keybinding: i,
-        keybindingDisplay: i ? X(i) : "",
+        keybinding: s,
+        keybindingDisplay: s ? X(s) : "",
         scope: e.scope,
         source: D,
         sourceColor: A ? "primary" : "neutral",
@@ -125,25 +125,25 @@ function ae({
         _def: e
       };
     });
-  }, [O, t, u, C, S]), k = s.useCallback((n) => {
+  }, [O, t, d, C, S]), k = i.useCallback((n) => {
     f(n), l(null);
-  }, []), M = s.useCallback((n) => {
+  }, []), M = i.useCallback((n) => {
     R(n), l(null);
   }, [R]);
-  s.useEffect(() => {
+  i.useEffect(() => {
     if (!c) return;
     const n = (e) => {
       if (e.preventDefault(), e.stopPropagation(), e.key === "Escape") {
         f(null), l(null);
         return;
       }
-      const i = Z(e);
-      if (!i) return;
-      if (W(i)) {
+      const s = Z(e);
+      if (!s) return;
+      if (W(s)) {
         l({ type: "reserved", text: b }), f(null), setTimeout(() => l(null), 3e3);
         return;
       }
-      const g = N(c, i);
+      const g = N(c, s);
       g.success ? (f(null), l(null)) : g.conflict ? (l({
         type: "conflict",
         text: w
@@ -151,7 +151,7 @@ function ae({
     };
     return window.addEventListener("keydown", n, !0), () => window.removeEventListener("keydown", n, !0);
   }, [c, N, b, w]);
-  const P = s.useMemo(() => Array.from(new Set(x.map((e) => e.category))).sort().map((e) => ({ label: e, value: e })), [x]), _ = s.useMemo(() => [
+  const P = i.useMemo(() => Array.from(new Set(y.map((e) => e.category))).sort().map((e) => ({ label: e, value: e })), [y]), _ = i.useMemo(() => [
     {
       field: "command",
       headerName: "Command",
@@ -188,7 +188,7 @@ function ae({
         recordingCommandId: c,
         onStartRecording: k,
         onReset: M,
-        recordingLabel: y,
+        recordingLabel: x,
         addShortcutLabel: v
       },
       sortable: !0
@@ -235,7 +235,7 @@ function ae({
         isMultiSelect: !0
       }
     }
-  ], [c, k, M, y, v, P]), I = s.useMemo(() => ({
+  ], [c, k, M, x, v, P]), I = i.useMemo(() => ({
     filter: {
       filterModel: {
         source: {
@@ -244,7 +244,7 @@ function ae({
         }
       }
     }
-  }), []), K = s.useMemo(() => ({
+  }), []), K = i.useMemo(() => ({
     sortable: !0,
     resizable: !0,
     filter: !0,
@@ -252,19 +252,19 @@ function ae({
       isSearchable: !0,
       advanceSearchEnabled: !0
     }
-  }), []), E = d || c ? /* @__PURE__ */ h("div", { className: p(
+  }), []), E = u || c ? /* @__PURE__ */ h("div", { className: p(
     "px-3 py-1.5 text-[10px] md:text-sm font-medium rounded-md whitespace-nowrap flex items-center gap-2",
-    d?.type === "conflict" ? "bg-feedback-warning-surface text-content" : d?.type === "reserved" ? "bg-feedback-error-surface text-destructive" : c ? "bg-feedback-info-surface text-brand animate-[pulse_1.5s_ease-in-out_infinite] motion-reduce:animate-none" : ""
+    u?.type === "conflict" ? "bg-feedback-warning-surface text-content" : u?.type === "reserved" ? "bg-feedback-error-surface text-destructive" : c ? "bg-feedback-info-surface text-brand animate-[pulse_1.5s_ease-in-out_infinite] motion-reduce:animate-none" : ""
   ), children: [
-    d?.type === "conflict" ? /* @__PURE__ */ r(U, { className: "h-3.5 w-3.5 shrink-0" }) : d?.type === "reserved" ? /* @__PURE__ */ r(T, { className: "h-3.5 w-3.5 shrink-0" }) : c ? /* @__PURE__ */ r("span", { className: "shrink-0 text-base", children: "⌨️" }) : null,
-    /* @__PURE__ */ r("span", { children: d ? d.text : L })
+    u?.type === "conflict" ? /* @__PURE__ */ r(U, { className: "h-3.5 w-3.5 shrink-0" }) : u?.type === "reserved" ? /* @__PURE__ */ r(T, { className: "h-3.5 w-3.5 shrink-0" }) : c ? /* @__PURE__ */ r("span", { className: "shrink-0 text-base", children: "⌨️" }) : null,
+    /* @__PURE__ */ r("span", { children: u ? u.text : L })
   ] }) : null;
   return /* @__PURE__ */ h(V, { className: p("flex flex-col w-full h-full border-t-0", a), children: [
     o ? o(E) : E,
     /* @__PURE__ */ r(
       J,
       {
-        rowData: x,
+        rowData: y,
         columnDefs: _,
         defaultColDef: K,
         initialState: I,

package/dist/components/flows/filter-strip/filter-tag-list.js

@@ -4,7 +4,7 @@ import { HorizontalScroller as S } from "../../layout/horizontal-scroller/horizo
 import { TagGroup as z } from "../../primitives/tag-group/tag-group.js";
 import { Tag as k } from "../../primitives/tag/tag.js";
 import { Tooltip as b, TooltipTrigger as w, TooltipContent as y } from "../../feedback/tooltip/tooltip.js";
-import { Popover as $, PopoverTrigger as O, PopoverContent as j } from "../../feedback/popover/popover.js";
+import { PopoverContent as $, Popover as O, PopoverTrigger as j } from "../../feedback/popover/popover.js";
 import { Button as P } from "../../primitives/button/button.js";
 import { Checkmark as A, Copy as R, Cross as F } from "impact-nova-icons";
 const T = "whitespace-nowrap bg-accent text-accent-foreground hover:bg-accent/80 border-0 h-5 px-2 text-xs font-medium font-['Manrope'] cursor-pointer", I = ({
@@ -22,7 +22,7 @@ const T = "whitespace-nowrap bg-accent text-accent-foreground hover:bg-accent/80
     c === "custom" ? h?.() : g(!0);
   };
   return /* @__PURE__ */ e(
-    j,
+    $,
     {
       className: "w-[200px] p-0 rounded-[8px] bg-white shadow-[0_0_4px_0_rgba(0,0,0,0.12)] border-none",
       align: "start",
@@ -139,9 +139,9 @@ const T = "whitespace-nowrap bg-accent text-accent-foreground hover:bg-accent/80
                 r.overflow?.count || a.length,
                 " more filters"
               ] })
-            ] }) : /* @__PURE__ */ t($, { children: [
+            ] }) : /* @__PURE__ */ t(O, { children: [
               /* @__PURE__ */ t(b, { children: [
-                /* @__PURE__ */ e(w, { asChild: !0, children: /* @__PURE__ */ e(O, { asChild: !0, children: /* @__PURE__ */ e(
+                /* @__PURE__ */ e(w, { asChild: !0, children: /* @__PURE__ */ e(j, { asChild: !0, children: /* @__PURE__ */ e(
                   k,
                   {
                     asButton: !0,

package/dist/components/flows/notification-panel/notification-list.js

@@ -1,16 +1,16 @@
 import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import { useRef as d, useEffect as u } from "react";
+import { useRef as p, useEffect as u } from "react";
 import { cn as a } from "../../../lib/utils.js";
 import { LoadingSpinner as x } from "impact-nova-icons";
 import { MulticolorBell as v } from "../../ui/local-raster-icons/rasterIcons.js";
 import { useImpactNovaI18n as h } from "../../../i18n/use-impact-nova-i18n.js";
 const j = ({
-  title: i,
-  description: r,
+  title: r,
+  description: i,
   className: t,
   ...o
 }) => {
-  const { t: c } = h(), s = i ?? c("notificationPanel.everythingQuiet"), n = r ?? c("notificationPanel.everythingQuietSub");
+  const { t: c } = h(), s = r ?? c("notificationPanel.everythingQuiet"), n = i ?? c("notificationPanel.everythingQuietSub");
   return /* @__PURE__ */ l(
     "div",
     {
@@ -30,18 +30,18 @@ const j = ({
     }
   );
 }, I = ({
-  children: i,
-  className: r,
+  children: r,
+  className: i,
   onLoadMore: t,
   isLoading: o,
   hasMore: c,
   loader: s
 }) => {
-  const n = d(null);
+  const n = p(null);
   return u(() => {
     const f = new IntersectionObserver(
-      (p) => {
-        p[0].isIntersecting && c && !o && t && t();
+      (d) => {
+        d[0].isIntersecting && c && !o && t && t();
       },
       { threshold: 0.1 }
     );
@@ -50,14 +50,14 @@ const j = ({
     return () => {
       m && f.unobserve(m);
     };
-  }, [c, o, t]), /* @__PURE__ */ l("div", { className: a("flex flex-1 flex-col overflow-y-auto min-h-0", r), tabIndex: 0, children: [
-    /* @__PURE__ */ e("div", { className: "flex flex-col gap-2 p-2", children: i }),
+  }, [c, o, t]), /* @__PURE__ */ l("div", { className: a("flex flex-1 flex-col overflow-y-auto min-h-0", i), tabIndex: 0, children: [
+    /* @__PURE__ */ e("div", { className: "flex flex-col gap-2 p-2", children: r }),
     /* @__PURE__ */ e("div", { ref: n, className: "h-4 w-full flex-shrink-0" }),
-    o && /* @__PURE__ */ e("div", { className: "flex justify-center p-4", children: s || /* @__PURE__ */ e(x, { className: "h-6 w-6 animate-spin text-content-muted" }) })
+    o && /* @__PURE__ */ e("div", { className: "flex justify-center p-4", children: s || /* @__PURE__ */ e(x, { className: "h-6 w-6 animate-spin text-secondary-foreground" }) })
   ] });
 }, z = ({
-  label: i,
-  children: r,
+  label: r,
+  children: i,
   className: t
 }) => /* @__PURE__ */ l(
   "div",
@@ -69,11 +69,11 @@ const j = ({
         "div",
         {
           "data-component": "notification-group-label",
-          className: "sticky top-0 z-10 bg-canvas/95 backdrop-blur supports-[backdrop-filter]:bg-canvas/60 px-4 py-2 text-sm font-medium text-content-muted border-b border-stroke/50",
-          children: i
+          className: "sticky top-0 z-10 bg-canvas/95 backdrop-blur supports-[backdrop-filter]:bg-canvas/60 px-4 py-2 text-sm font-medium text-secondary-foreground border-b border-stroke/50",
+          children: r
         }
       ),
-      /* @__PURE__ */ e("div", { className: "flex flex-col gap-2 p-2", children: r })
+      /* @__PURE__ */ e("div", { className: "flex flex-col gap-2 p-2", children: i })
     ]
   }
 );

package/dist/components/flows/notification-panel/notification-panel.js

@@ -1,5 +1,5 @@
 import { jsx as e, jsxs as i } from "react/jsx-runtime";
-import { Sheet as m, SheetContent as f, SheetDescription as p, SheetTitle as h, SheetClose as v } from "../../feedback/sheet/sheet.js";
+import { Sheet as f, SheetContent as m, SheetDescription as p, SheetTitle as h, SheetClose as v } from "../../feedback/sheet/sheet.js";
 import { Button as x } from "../../primitives/button/button.js";
 import { Bell as u, Cross as N } from "impact-nova-icons";
 import { cn as l } from "../../../lib/utils.js";
@@ -14,8 +14,8 @@ const D = ({
 }) => {
   const { t: d } = s();
   return /* @__PURE__ */ e(b.Provider, { value: { setPreventClose: () => {
-  } }, children: /* @__PURE__ */ e(m, { open: t, onOpenChange: n, children: /* @__PURE__ */ i(
-    f,
+  } }, children: /* @__PURE__ */ e(f, { open: t, onOpenChange: n, children: /* @__PURE__ */ i(
+    m,
     {
       "data-component": "notification-panel",
       side: "right",
@@ -61,7 +61,7 @@ const D = ({
       ),
       children: [
         /* @__PURE__ */ i("div", { className: "flex items-center gap-3", children: [
-          /* @__PURE__ */ e("div", { className: "flex h-6 w-6 items-center justify-center", children: /* @__PURE__ */ e(u, { className: "h-5 w-5 text-content-muted" }) }),
+          /* @__PURE__ */ e("div", { className: "flex h-6 w-6 items-center justify-center", children: /* @__PURE__ */ e(u, { className: "h-5 w-5 text-secondary-foreground" }) }),
           typeof a == "string" ? /* @__PURE__ */ e(h, { className: "text-lg font-bold text-content", children: a }) : a
         ] }),
         /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [

package/dist/components/flows/notification-panel/notification-panel.types.d.ts

@@ -1,9 +1,12 @@
 import type * as React from "react";
 export interface NotificationPanelProps {
+    /** Controlled open state — pair with `onOpenChange`. */
     open: boolean;
     onOpenChange: (open: boolean) => void;
+    /** Panel subtree — `NotificationPanelContent` → Header / Body / Footer. */
     children: React.ReactNode;
     className?: string;
+    /** When `true`, blocks outside click and Escape from closing (e.g. bulk edit in progress). */
     preventClose?: boolean;
 }
 export interface NotificationPanelHeaderProps {

package/dist/components/flows/wizard/wizard.js

@@ -17,9 +17,9 @@ const k = ({
     defaultProp: e,
     onChange: o
   }), [u, l] = a.useState([]), m = a.useCallback((b) => {
-    l((v) => v.includes(b) ? v : [...v, b].sort((g, w) => g - w));
+    l((g) => g.includes(b) ? g : [...g, b].sort((v, w) => v - w));
   }, []), c = a.useCallback((b) => {
-    l((v) => v.filter((g) => g !== b));
+    l((g) => g.filter((v) => v !== b));
   }, []), f = t ?? (u.length > 0 ? Math.max(...u) : s.length), h = a.useMemo(
     () => ({
       value: d ?? e,
@@ -84,7 +84,7 @@ const D = a.forwardRef(
     "p",
     {
       ref: t,
-      className: p("font-manrope text-[12px] font-[500] leading-[16px] text-content-muted px-6 lg:px-10 xl:px-[64px]", r),
+      className: p("font-manrope text-[12px] font-[500] leading-[16px] text-secondary-foreground px-6 lg:px-10 xl:px-[64px]", r),
       ...o,
       children: e
     }
@@ -145,12 +145,12 @@ const F = a.forwardRef(
         role: "list",
         ...t,
         children: Array.from({ length: d }, (m, c) => {
-          const f = c + 1, h = c === i - 1, b = c < i - 1, g = x[c]?.label ?? `Step ${f} of ${d}`, w = e && (!o || f <= i);
+          const f = c + 1, h = c === i - 1, b = c < i - 1, v = x[c]?.label ?? `Step ${f} of ${d}`, w = e && (!o || f <= i);
           return /* @__PURE__ */ n(
             "div",
             {
               role: "listitem",
-              "aria-label": g,
+              "aria-label": v,
               "aria-current": h ? "step" : void 0,
               tabIndex: w ? 0 : void 0,
               onClick: () => l(f),
@@ -188,7 +188,7 @@ const T = a.forwardRef(
     "p",
     {
       ref: t,
-      className: p("text-[14px] font-normal leading-relaxed text-content-muted", r),
+      className: p("text-[14px] font-normal leading-relaxed text-secondary-foreground", r),
       ...o,
       children: e
     }
@@ -205,8 +205,8 @@ const j = a.forwardRef(
     ), u = a.useCallback(() => {
       const l = d.current;
       if (!l) return;
-      const { scrollTop: m, scrollHeight: c, clientHeight: f } = l, h = 1, b = m > h, v = m + f < c - h;
-      i((g) => g.top === b && g.bottom === v ? g : { top: b, bottom: v });
+      const { scrollTop: m, scrollHeight: c, clientHeight: f } = l, h = 1, b = m > h, g = m + f < c - h;
+      i((v) => v.top === b && v.bottom === g ? v : { top: b, bottom: g });
     }, [i]);
     return a.useEffect(() => {
       const l = d.current;

package/dist/components/forms/combobox/combobox.js

@@ -46,7 +46,7 @@ const De = ve.forwardRef(
     required: z,
     labelOrientation: re
   }, x) => {
-    const ie = Q(), A = Q(), H = typeof D == "string" ? D : F ?? "Options", V = ye({
+    const se = Q(), A = Q(), H = typeof D == "string" ? D : F ?? "Options", V = ye({
       label: D,
       helperText: X,
       helperTextPosition: Y,
@@ -54,12 +54,12 @@ const De = ve.forwardRef(
       error: Z ?? ee,
       required: z,
       disabled: p,
-      id: ie,
+      id: se,
       className: oe
     }), B = T(
       () => Ie({ options: c, min: l, max: d, step: f }),
       [c, l, d, f]
-    ), M = b !== void 0, [se, ae] = C(I), S = M ? b : se, [ce, K] = C(""), [o, v] = C(!1), n = o ? ce : S, [O, m] = C(-1), U = R(-1), [le, w] = C("keyboard"), W = R(null), P = R(null), ue = u(
+    ), M = b !== void 0, [ie, ae] = C(I), S = M ? b : ie, [ce, K] = C(""), [o, v] = C(!1), n = o ? ce : S, [O, m] = C(-1), U = R(-1), [le, w] = C("keyboard"), W = R(null), P = R(null), ue = u(
       (e) => {
         W.current = e, typeof x == "function" ? x(e) : x && (x.current = e);
       },
@@ -77,7 +77,7 @@ const De = ve.forwardRef(
     we(() => {
       U.current = h, q.current = r, o && h >= 0 && P.current && P.current.querySelectorAll("[data-combobox-item]")[h]?.scrollIntoView({ block: "nearest" });
     }, [h, o, r]);
-    const s = u(
+    const i = u(
       (e) => {
         M || ae(e), k?.(e), v(!1), m(-1);
       },
@@ -97,15 +97,15 @@ const De = ve.forwardRef(
         const t = e.relatedTarget;
         if (!P.current?.contains(t)) {
           if (o) {
-            const i = r.find(
+            const s = r.find(
               (g) => g.toLowerCase() === n.toLowerCase()
             );
-            i ? s(i) : r.length === 1 ? s(r[0]) : L && n ? s(n) : y();
+            s ? i(s) : r.length === 1 ? i(r[0]) : L && n ? i(n) : y();
           }
           $?.(e);
         }
       },
-      [o, r, n, s, y, L, $]
+      [o, r, n, i, y, L, $]
     ), ge = u(
       (e) => {
         if (!o) {
@@ -130,24 +130,24 @@ const De = ve.forwardRef(
         }
         if (e.key === "Enter" || e.key === "Tab") {
           e.preventDefault();
-          const t = U.current, i = q.current;
-          if (t >= 0 && t < i.length)
-            s(i[t]);
+          const t = U.current, s = q.current;
+          if (t >= 0 && t < s.length)
+            i(s[t]);
           else {
-            const g = i.find(
+            const g = s.find(
               (j) => j.toLowerCase() === n.toLowerCase()
             );
-            g ? s(g) : i.length === 1 ? s(i[0]) : L && n ? s(n) : y();
+            g ? i(g) : s.length === 1 ? i(s[0]) : L && n ? i(n) : y();
           }
           return;
         }
       },
-      [o, r, n, s, y, L]
+      [o, r, n, i, y, L]
     ), J = u(
       (e) => {
-        s(e), setTimeout(() => W.current?.focus(), 0);
+        i(e), setTimeout(() => W.current?.focus(), 0);
       },
-      [s]
+      [i]
     ), be = u(
       (e) => {
         const t = e.target.closest(
@@ -156,8 +156,8 @@ const De = ve.forwardRef(
         if (t) {
           if (e.button !== 0) return;
           e.preventDefault();
-          const i = t.getAttribute("data-combobox-value");
-          i != null && J(i);
+          const s = t.getAttribute("data-combobox-value");
+          s != null && J(s);
           return;
         }
         e.preventDefault();
@@ -247,8 +247,8 @@ const De = ve.forwardRef(
                 onMouseLeave: () => {
                   w("mouse"), m(-1);
                 },
-                children: r.length === 0 ? /* @__PURE__ */ a("div", { className: "flex items-center justify-center py-6 text-sm text-content-muted", children: ne }) : r.map((e, t) => {
-                  const i = t === h, g = e.toLowerCase() === S.toLowerCase(), j = `${A}-option-${t}`;
+                children: r.length === 0 ? /* @__PURE__ */ a("div", { className: "flex items-center justify-center py-6 text-sm text-secondary-foreground", children: ne }) : r.map((e, t) => {
+                  const s = t === h, g = e.toLowerCase() === S.toLowerCase(), j = `${A}-option-${t}`;
                   return /* @__PURE__ */ a("div", { className: "w-full pb-[2px]", children: /* @__PURE__ */ a(
                     "div",
                     {
@@ -260,7 +260,7 @@ const De = ve.forwardRef(
                       className: _(
                         "cursor-default select-none py-[6px] px-3 flex items-center transition-colors rounded-md",
                         E ? "justify-end text-right" : "justify-between",
-                        i && G === "keyboard" ? "ring-2 ring-inset ring-primary bg-accent text-content-primary" : i && G === "mouse" ? "bg-muted text-content-primary" : g ? "bg-accent text-content-primary" : "text-content-primary hover:bg-canvas-muted cursor-pointer"
+                        s && G === "keyboard" ? "ring-2 ring-inset ring-primary bg-accent text-content" : s && G === "mouse" ? "bg-canvas-muted text-content" : g ? "bg-accent text-content" : "text-content hover:bg-canvas-muted cursor-pointer"
                       ),
                       onMouseEnter: () => {
                         w("mouse"), m(t);

package/dist/components/forms/date-picker/date-picker.js

@@ -4,7 +4,7 @@ import { Cross as F, CalendarMonth as ee } from "impact-nova-icons";
 import { format as x, isValid as b, parse as P } from "date-fns";
 import { cn as ne, padValidDateString as te, maskDate as re } from "../../../lib/utils.js";
 import { Input as oe } from "../input/input.js";
-import { Popover as ie, PopoverAnchor as le, PopoverContent as ae } from "../../feedback/popover/popover.js";
+import { Popover as le, PopoverAnchor as ie, PopoverContent as ae } from "../../feedback/popover/popover.js";
 import { Calendar as ce } from "../../data-display/calendar/calendar.js";
 import { Tooltip as E, TooltipTrigger as T, TooltipContent as j } from "../../feedback/tooltip/tooltip.js";
 import { useImpactNovaI18n as se } from "../../../i18n/use-impact-nova-i18n.js";
@@ -29,8 +29,8 @@ const he = s.forwardRef(
   }, G) => {
     const { locale: N, t: m } = se(), g = s.useMemo(() => pe(N), [N]), J = L ?? m("datePicker.selectDate"), D = s.useRef(null), y = s.useRef(null);
     s.useImperativeHandle(G, () => D.current);
-    const [i, Q] = s.useState(!1), v = s.useRef(!1), [k, l] = s.useState(null), C = t ? x(t, o, { locale: g }) : "", u = k?.input ?? C, R = i ? k?.pending ?? t : t, U = k?.viewMonth ?? t ?? /* @__PURE__ */ new Date(), a = (e) => {
-      p || (l(e ? {
+    const [l, Q] = s.useState(!1), v = s.useRef(!1), [k, i] = s.useState(null), C = t ? x(t, o, { locale: g }) : "", u = k?.input ?? C, R = l ? k?.pending ?? t : t, U = k?.viewMonth ?? t ?? /* @__PURE__ */ new Date(), a = (e) => {
+      p || (i(e ? {
         input: C,
         pending: t,
         viewMonth: t ?? /* @__PURE__ */ new Date()
@@ -41,7 +41,7 @@ const he = s.forwardRef(
     }, [u]);
     const W = (e) => {
       const n = de(e), d = n ? x(n, o, { locale: g }) : "";
-      l(
+      i(
         (c) => c ? { ...c, pending: n, input: d, viewMonth: n ?? c.viewMonth } : null
       ), n && !h && (f?.(n), a(!1));
     }, X = (e) => {
@@ -50,12 +50,12 @@ const he = s.forwardRef(
     }, S = () => {
       a(!1);
     }, A = () => {
-      f?.(void 0), h ? l(
+      f?.(void 0), h ? i(
         (e) => e ? { ...e, pending: void 0, input: "" } : null
       ) : a(!1);
     }, Y = (e) => {
       const n = e.target.value, d = re(n, o, u);
-      if (l((M) => ({ ...M ?? {
+      if (i((M) => ({ ...M ?? {
         input: C,
         pending: t,
         viewMonth: t ?? /* @__PURE__ */ new Date()
@@ -64,18 +64,18 @@ const he = s.forwardRef(
         return;
       }
       const c = P(d, o, /* @__PURE__ */ new Date(), { locale: g });
-      b(c) && d.length === o.length && (l((M) => ({ ...M ?? {
+      b(c) && d.length === o.length && (i((M) => ({ ...M ?? {
         input: d,
         pending: t,
         viewMonth: c
       }, pending: c, viewMonth: c })), h || f?.(c));
     }, Z = () => {
-      if (i) return;
+      if (l) return;
       const e = te(u, o), n = P(e, o, /* @__PURE__ */ new Date(), { locale: g });
-      !b(n) || e.length !== o.length ? l(null) : h || (f?.(n), l(null));
+      !b(n) || e.length !== o.length ? i(null) : h || (f?.(n), i(null));
     }, V = (t ? x(t, o, { locale: g }) : "") !== u, _ = u.length === o.length && !b(P(u, o, /* @__PURE__ */ new Date(), { locale: g }));
-    return /* @__PURE__ */ w(ie, { open: p ? !1 : i, onOpenChange: a, children: [
-      /* @__PURE__ */ r(le, { asChild: !0, children: /* @__PURE__ */ r("div", { "data-component": "date-picker", "data-state": i ? "open" : "closed", "data-pending": V || void 0, children: /* @__PURE__ */ r(
+    return /* @__PURE__ */ w(le, { open: p ? !1 : l, onOpenChange: a, children: [
+      /* @__PURE__ */ r(ie, { asChild: !0, children: /* @__PURE__ */ r("div", { "data-component": "date-picker", "data-state": l ? "open" : "closed", "data-pending": V || void 0, children: /* @__PURE__ */ r(
         oe,
         {
           ref: D,
@@ -84,14 +84,14 @@ const he = s.forwardRef(
           onBlur: Z,
           onClick: () => !p && a(!0),
           onKeyDown: (e) => {
-            (e.key === "Enter" || e.key === "ArrowDown") && !i && !p && (e.preventDefault(), v.current = !0, a(!0)), e.key === "Escape" && i && (e.preventDefault(), S());
+            (e.key === "Enter" || e.key === "ArrowDown") && !l && !p && (e.preventDefault(), v.current = !0, a(!0)), e.key === "Escape" && l && (e.preventDefault(), S());
           },
-          placeholder: i ? o : J,
+          placeholder: l ? o : J,
           disabled: p,
           "data-form-control": "input",
           className: ne(
             "cursor-pointer",
-            _ ? "text-destructive" : V ? "text-content-muted" : "",
+            _ ? "text-destructive" : V ? "text-content-placeholder" : "",
             H
           ),
           suffix: /* @__PURE__ */ w("div", { className: "flex items-center gap-1", children: [
@@ -113,9 +113,9 @@ const he = s.forwardRef(
             ] }),
             /* @__PURE__ */ w(E, { children: [
               /* @__PURE__ */ r(T, { asChild: !0, children: /* @__PURE__ */ r("button", { type: "button", tabIndex: 0, "aria-label": m("datePicker.selectDate"), onClick: (e) => {
-                e.stopPropagation(), p || a(!i);
+                e.stopPropagation(), p || a(!l);
               }, onKeyDown: (e) => {
-                (e.key === "Enter" || e.key === " ") && (e.preventDefault(), e.stopPropagation(), p || (v.current = !0, a(!i)));
+                (e.key === "Enter" || e.key === " ") && (e.preventDefault(), e.stopPropagation(), p || (v.current = !0, a(!l)));
               }, className: "inline-flex items-center justify-center bg-transparent border-none p-0 cursor-pointer", children: /* @__PURE__ */ r(ee, { className: "h-4 w-4 text-secondary-foreground" }) }) }),
               /* @__PURE__ */ r(j, { variant: "tertiary", side: "top", children: m("datePicker.selectDate") })
             ] })
@@ -139,7 +139,7 @@ const he = s.forwardRef(
               selected: R,
               onSelect: W,
               month: U,
-              onMonthChange: (e) => l(
+              onMonthChange: (e) => i(
                 (n) => n ? { ...n, viewMonth: e } : null
               ),
               disabled: fe(B, K),