impact-nova 2.6.0-alpha.0 → 2.6.1

package/dist/components/data/ag-grid-react/headers/advanced-filter/column-filter-section.js

@@ -2,61 +2,61 @@ import { jsxs as d, jsx as a } from "react/jsx-runtime";
 import { useMemo as E } from "react";
 import { Button as v } from "../../../../primitives/button/button.js";
 import { Input as f } from "../../../../forms/input/input.js";
-import { DatePicker as I } from "../../../../forms/date-picker/date-picker.js";
-import { DateRangePicker as z } from "../../../../forms/date-picker/date-range-picker.js";
-import { Select as p } from "../../../../forms/select/select.js";
-import { Bin as F } from "impact-nova-icons";
-import { useImpactNovaI18n as W } from "../../../../../i18n/use-impact-nova-i18n.js";
+import { DatePicker as V } from "../../../../forms/date-picker/date-picker.js";
+import { DateRangePicker as I } from "../../../../forms/date-picker/date-range-picker.js";
+import { Select as h } from "../../../../forms/select/select.js";
+import { Bin as y } from "impact-nova-icons";
+import { useImpactNovaI18n as D } from "../../../../../i18n/use-impact-nova-i18n.js";
 import { createEmptyRule as R } from "../utils/filter-utils.js";
-import { resolveDateDisplayFormat as j } from "../utils/date-utils.js";
-const q = {
+import { DEFAULT_DATE_DISPLAY_FORMAT as _ } from "../utils/date-utils.js";
+const T = {
   text: ["contains", "notContains", "equals", "notEqual", "startsWith", "endsWith", "empty", "notEmpty"],
   number: ["equals", "notEqual", "greaterThan", "greaterThanOrEqual", "lessThan", "lessThanOrEqual", "inRange", "empty", "notEmpty"],
   date: ["equals", "notEqual", "greaterThan", "lessThan", "inRange"],
   select: ["equals"],
   multi: ["contains", "notContains", "startsWith", "endsWith", "equals", "notEqual", "empty", "notEmpty"]
-}, Z = ({
-  columnId: h,
-  columnLabel: A,
-  columnType: o,
+}, M = ({
+  columnId: p,
+  columnLabel: q,
+  columnType: l,
   selectOptions: g,
   isMultiSelect: c,
   rules: s,
   logic: C,
-  onLogicChange: O,
+  onLogicChange: F,
   onRulesChange: m,
   canDeleteLastRule: u = !1,
   onDeleteColumnFilter: x,
-  dateDisplayFormat: T
+  dateDisplayFormat: b = _
 }) => {
-  const { t: r, dateLocale: S } = W(), b = j(T, S), N = E(() => (q[o] ?? q.text).map((l) => ({ label: r(`filter.operators.${o === "date" && l === "greaterThan" ? "after" : o === "date" && l === "lessThan" ? "before" : o === "date" && l === "inRange" ? "between" : l}`), value: l })), [o, r]), y = E(
+  const { t: r } = D(), N = E(() => (T[l] ?? T.text).map((n) => ({ label: r(`filter.operators.${l === "date" && n === "greaterThan" ? "after" : l === "date" && n === "lessThan" ? "before" : l === "date" && n === "inRange" ? "between" : n}`), value: n })), [l, r]), w = E(
     () => [
       { label: r("filter.logicAll"), value: "AND" },
       { label: r("filter.logicAny"), value: "OR" }
     ],
     [r]
-  ), k = () => {
-    m([...s, R(h, o)]);
-  }, D = (e) => {
+  ), O = () => {
+    m([...s, R(p, l)]);
+  }, S = (e) => {
     if (s.length > 1 || u) {
-      const l = s.filter((t) => t.id !== e);
-      l.length === 0 && u ? m([]) : m(l.length > 0 ? l : [R(h, o)]);
+      const n = s.filter((t) => t.id !== e);
+      n.length === 0 && u ? m([]) : m(n.length > 0 ? n : [R(p, l)]);
     }
-  }, n = (e, l) => {
-    m(s.map((t) => t.id === e ? { ...t, ...l } : t));
-  }, V = (e) => {
+  }, o = (e, n) => {
+    m(s.map((t) => t.id === e ? { ...t, ...n } : t));
+  }, k = (e) => {
     if (e.operator === "empty" || e.operator === "notEmpty")
       return /* @__PURE__ */ a("span", { className: "text-content-placeholder italic text-sm", children: r("advancedFilter.noValueNeeded") });
-    if (o === "date")
+    if (l === "date")
       return e.operator === "inRange" ? /* @__PURE__ */ a(
-        z,
+        I,
         {
           value: {
             from: e.value ? new Date(e.value) : void 0,
             to: e.valueTo ? new Date(e.valueTo) : void 0
           },
           onChange: (t) => {
-            n(e.id, {
+            o(e.id, {
               value: t?.from?.toISOString() || "",
               valueTo: t?.to?.toISOString() || ""
             });
@@ -65,18 +65,18 @@ const q = {
           showFooter: !0
         }
       ) : /* @__PURE__ */ a(
-        I,
+        V,
         {
           value: e.value ? new Date(e.value) : void 0,
-          onChange: (t) => n(e.id, { value: t?.toISOString() || "" }),
+          onChange: (t) => o(e.id, { value: t?.toISOString() || "" }),
           placeholder: r("filter.selectDate"),
           format: b,
           showFooter: !0
         }
       );
-    const l = e.operator === "equals" || e.operator === "notEqual";
-    return o === "select" || o === "multi" && l ? /* @__PURE__ */ a(
-      p,
+    const n = e.operator === "equals" || e.operator === "notEqual";
+    return l === "select" || l === "multi" && n ? /* @__PURE__ */ a(
+      h,
       {
         options: g || [],
         value: (() => {
@@ -84,7 +84,7 @@ const q = {
           return t.length === 0 ? null : c !== !1 ? t : t[0];
         })(),
         onChange: (t) => {
-          Array.isArray(t) ? n(e.id, { value: t.map((i) => i.value) }) : n(e.id, { value: t?.value || "" });
+          Array.isArray(t) ? o(e.id, { value: t.map((i) => i.value) }) : o(e.id, { value: t?.value || "" });
         },
         isMulti: c !== void 0 ? c : !0,
         placeholder: r(c === !1 ? "filter.selectValue" : "filter.selectValues"),
@@ -96,9 +96,9 @@ const q = {
         f,
         {
           value: e.value,
-          onChange: (t) => n(e.id, { value: t.target.value }),
+          onChange: (t) => o(e.id, { value: t.target.value }),
           placeholder: r("filter.from"),
-          type: o === "number" ? "number" : "text",
+          type: l === "number" ? "number" : "text",
           className: "flex-1"
         }
       ),
@@ -107,9 +107,9 @@ const q = {
         f,
         {
           value: e.valueTo || "",
-          onChange: (t) => n(e.id, { valueTo: t.target.value }),
+          onChange: (t) => o(e.id, { valueTo: t.target.value }),
           placeholder: r("filter.to"),
-          type: o === "number" ? "number" : "text",
+          type: l === "number" ? "number" : "text",
           className: "flex-1"
         }
       )
@@ -117,41 +117,41 @@ const q = {
       f,
       {
         value: e.value,
-        onChange: (t) => n(e.id, { value: t.target.value }),
+        onChange: (t) => o(e.id, { value: t.target.value }),
         placeholder: r("filter.enterValue"),
-        type: o === "number" ? "number" : "text",
+        type: l === "number" ? "number" : "text",
         className: "w-full"
       }
     );
   }, P = (e) => {
-    const l = N.find((t) => t.value === e.operator);
+    const n = N.find((t) => t.value === e.operator);
     return /* @__PURE__ */ d("div", { className: "flex items-center gap-2", children: [
       /* @__PURE__ */ a("div", { className: "w-[120px] shrink-0", children: /* @__PURE__ */ a(
-        p,
+        h,
         {
           options: N,
-          value: l || null,
+          value: n || null,
           onChange: (t) => {
             const i = t;
             if (!i) return;
-            const w = i.value === "inRange" && e.value && !e.valueTo ? Array.isArray(e.value) ? e.value[0] : e.value : void 0;
-            n(e.id, { operator: i.value, ...w != null && { valueTo: w } });
+            const A = i.value === "inRange" && e.value && !e.valueTo ? Array.isArray(e.value) ? e.value[0] : e.value : void 0;
+            o(e.id, { operator: i.value, ...A != null && { valueTo: A } });
           },
           placeholder: r("filter.operator"),
           className: "w-full",
           menuPortalTarget: document.body
         }
       ) }),
-      /* @__PURE__ */ a("div", { className: "flex-1 min-w-0", children: V(e) }),
+      /* @__PURE__ */ a("div", { className: "flex-1 min-w-0", children: k(e) }),
       /* @__PURE__ */ a(
         v,
         {
-          onClick: () => D(e.id),
+          onClick: () => S(e.id),
           variant: "tertiary",
           size: "icon",
           "aria-label": r("aria.removeRule"),
           disabled: s.length === 1 && !u,
-          children: /* @__PURE__ */ a(F, { size: "xs" })
+          children: /* @__PURE__ */ a(y, { size: "xs" })
         }
       )
     ] }, e.id);
@@ -160,13 +160,13 @@ const q = {
     /* @__PURE__ */ d("div", { className: "text-secondary-foreground text-sm flex items-center gap-2 flex-wrap", children: [
       /* @__PURE__ */ a("span", { children: r("advancedFilter.match") }),
       /* @__PURE__ */ a("div", { className: "w-[80px]", children: /* @__PURE__ */ a(
-        p,
+        h,
         {
-          options: y,
-          value: y.find((e) => e.value === C),
+          options: w,
+          value: w.find((e) => e.value === C),
           onChange: (e) => {
-            const l = e;
-            l && O(l.value);
+            const n = e;
+            n && F(n.value);
           },
           className: "h-8",
           menuPortalTarget: document.body,
@@ -174,11 +174,11 @@ const q = {
         }
       ) }),
       /* @__PURE__ */ a("span", { children: r("advancedFilter.ofTheFollowingRulesForColumn") }),
-      /* @__PURE__ */ a("span", { className: "font-semibold text-content-tertiary", children: A })
+      /* @__PURE__ */ a("span", { className: "font-semibold text-content-tertiary", children: q })
     ] }),
     /* @__PURE__ */ a("div", { className: "flex flex-col gap-3", children: s.map((e) => P(e)) }),
     /* @__PURE__ */ d("div", { className: "flex items-center justify-between mt-1", children: [
-      /* @__PURE__ */ a(v, { onClick: k, variant: "outline", size: "sm", children: r("advancedFilter.addRule") }),
+      /* @__PURE__ */ a(v, { onClick: O, variant: "outline", size: "sm", children: r("advancedFilter.addRule") }),
       x && /* @__PURE__ */ d(
         v,
         {
@@ -187,7 +187,7 @@ const q = {
           onClick: x,
           className: "text-validation hover:text-destructive hover:bg-feedback-error-surface border-destructive",
           children: [
-            /* @__PURE__ */ a(F, { size: "xs" }),
+            /* @__PURE__ */ a(y, { size: "xs" }),
             r("advancedFilter.deleteColumn")
           ]
         }
@@ -196,5 +196,5 @@ const q = {
   ] });
 };
 export {
-  Z as ColumnFilterSection
+  M as ColumnFilterSection
 };

package/dist/components/data/ag-grid-react/headers/components/date-filter-picker.d.ts

@@ -30,7 +30,7 @@ export interface DateFilterPickerProps {
     disabled?: boolean;
     onFocus?: () => void;
     onBlur?: () => void;
-    /** Display format for dates (date-fns token string). Omitted → locale-derived pattern. */
+    /** Display format for dates (date-fns token string). Default: "MM/dd/yyyy" */
     dateDisplayFormat?: string;
 }
 /**

package/dist/components/data/ag-grid-react/headers/components/header-info.d.ts

@@ -4,30 +4,36 @@ import { ExtendedHeaderComponentParams, InfoContent } from '../../ag-grid.types'
 /**
  * Info Icon Trigger - native button for grid header info actions.
  */
-export declare const InfoIconTrigger: ({ onClick, className, label, }: {
+export declare const InfoIconTrigger: ({ onClick, className, label, guidanceTargetId, }: {
     onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
     className?: string;
     label: string;
+    /** Guidance target ID for guided tours (renders as data-guidance-target) */
+    guidanceTargetId?: string;
 }) => import("react/jsx-runtime").JSX.Element;
 /**
  * Tooltip-only Info Trigger
  */
-export declare const TooltipInfoTrigger: ({ content, className, onInfoClick, label, }: {
+export declare const TooltipInfoTrigger: ({ content, className, onInfoClick, label, guidanceTargetId, }: {
     content: string;
     className?: string;
     onInfoClick?: (e: React.MouseEvent) => void;
     label: string;
+    /** Guidance target ID for guided tours */
+    guidanceTargetId?: string;
 }) => import("react/jsx-runtime").JSX.Element;
 /**
  * Modal-enabled Info Trigger
  * Only this component allocates a useState hook.
  */
-export declare const ModalInfoTrigger: ({ infoData, displayName, className, onInfoClick, label, }: {
+export declare const ModalInfoTrigger: ({ infoData, displayName, className, onInfoClick, label, guidanceTargetId, }: {
     infoData?: InfoContent;
     displayName?: string;
     className?: string;
     onInfoClick?: (e: React.MouseEvent) => void;
     label: string;
+    /** Guidance target ID for guided tours */
+    guidanceTargetId?: string;
 }) => import("react/jsx-runtime").JSX.Element;
 type HeaderInfoProps = (CustomHeaderProps | IHeaderGroupParams) & ExtendedHeaderComponentParams & {
     className?: string;

package/dist/components/data/ag-grid-react/headers/components/header-info.js

@@ -1,112 +1,120 @@
-import { jsx as r, jsxs as I, Fragment as g } from "react/jsx-runtime";
-import { useState as v } from "react";
-import { cn as m } from "../../../../../lib/utils.js";
-import { Info as k } from "impact-nova-icons";
-import { useImpactNovaI18n as u } from "../../../../../i18n/use-impact-nova-i18n.js";
-import { LazyTooltip as p } from "./lazy-tooltip.js";
-import { InfoModal as b } from "./info-modal.js";
-import { resolveHeaderInfoParams as C } from "../resolve-header-info-params.js";
-const h = ({
+import { jsx as r, jsxs as h, Fragment as v } from "react/jsx-runtime";
+import { useState as k } from "react";
+import { cn as u } from "../../../../../lib/utils.js";
+import { Info as b } from "impact-nova-icons";
+import { useImpactNovaI18n as p } from "../../../../../i18n/use-impact-nova-i18n.js";
+import { LazyTooltip as I } from "./lazy-tooltip.js";
+import { InfoModal as C } from "./info-modal.js";
+import { resolveHeaderInfoParams as y } from "../resolve-header-info-params.js";
+const g = ({
   onClick: o,
-  className: n,
-  label: t
+  className: e,
+  label: t,
+  guidanceTargetId: n
 }) => {
-  const e = (a) => {
-    a.stopPropagation(), o?.(a);
+  const a = (i) => {
+    i.stopPropagation(), o?.(i);
   };
   return /* @__PURE__ */ r(
     "button",
     {
       type: "button",
       "aria-label": t,
-      className: m(
+      className: u(
         "cursor-pointer flex items-center justify-center shrink-0 w-6 h-6 rounded-md transition-all duration-200 text-content-tertiary hover:bg-canvas-muted active:bg-stroke-hairline",
-        n
+        e
       ),
-      onClick: e,
-      children: /* @__PURE__ */ r(k, { size: 16, "aria-hidden": !0 })
+      onClick: a,
+      ...n && { "data-guidance-target": n },
+      children: /* @__PURE__ */ r(b, { size: 16, "aria-hidden": !0 })
     }
   );
-}, y = ({
+}, T = ({
   content: o,
-  className: n,
+  className: e,
   onInfoClick: t,
-  label: e
-}) => /* @__PURE__ */ r(p, { content: o, children: /* @__PURE__ */ r(h, { onClick: t, className: n, label: e }) }), x = ({
+  label: n,
+  guidanceTargetId: a
+}) => /* @__PURE__ */ r(I, { content: o, children: /* @__PURE__ */ r(g, { onClick: t, className: e, label: n, guidanceTargetId: a }) }), x = ({
   infoData: o,
-  displayName: n,
+  displayName: e,
   className: t,
-  onInfoClick: e,
-  label: a
+  onInfoClick: n,
+  label: a,
+  guidanceTargetId: i
 }) => {
-  const { t: f } = u(), [s, c] = v(!1), i = o ?? (n ? { title: n, sections: [] } : void 0), d = (l) => {
-    l.stopPropagation(), i && c(!0);
+  const { t: f } = p(), [s, d] = k(!1), c = o ?? (e ? { title: e, sections: [] } : void 0), m = (l) => {
+    l.stopPropagation(), c && d(!0);
   };
-  return /* @__PURE__ */ I(g, { children: [
-    /* @__PURE__ */ r(p, { content: f("gridHeader.clickForDetails"), children: /* @__PURE__ */ r(
-      h,
+  return /* @__PURE__ */ h(v, { children: [
+    /* @__PURE__ */ r(I, { content: f("gridHeader.clickForDetails"), children: /* @__PURE__ */ r(
+      g,
       {
         label: a,
         onClick: (l) => {
-          d(l), e && e(l);
+          m(l), n && n(l);
         },
-        className: m(
+        className: u(
           "hover:bg-canvas-muted hover:shadow-sm hover:text-brand-variant-hover hover:-translate-y-0.5 active:scale-95",
           t
-        )
+        ),
+        guidanceTargetId: i
       }
     ) }),
-    s && i && // Stop propagation to prevent the click from bubbling to the header group
+    s && c && // Stop propagation to prevent the click from bubbling to the header group
     // regardless of whether the modal is portaled or not.
     /* @__PURE__ */ r("div", { onClick: (l) => l.stopPropagation(), children: /* @__PURE__ */ r(
-      b,
+      C,
       {
         open: s,
-        onClose: () => c(!1),
-        data: i
+        onClose: () => d(!1),
+        data: c
       }
     ) })
   ] });
-}, z = (o) => {
-  const n = C(o, o.displayName), {
+}, F = (o) => {
+  const e = y(o, o.displayName), {
     showInfoIcon: t,
-    displayName: e
-  } = n;
-  return !t || !e || e.trim() === "" ? null : /* @__PURE__ */ r(N, { ...o, ...n });
+    displayName: n
+  } = e;
+  return !t || !n || n.trim() === "" ? null : /* @__PURE__ */ r(N, { ...o, ...e });
 };
 function N(o) {
-  const { t: n } = u(), {
+  const { t: e } = p(), {
     displayName: t,
-    displayMode: e = "tooltip",
+    displayMode: n = "tooltip",
     infoTooltip: a,
-    infoData: f,
-    className: s,
-    onInfoClick: c
-  } = o, i = () => {
-    c && c(o);
-  }, d = a ? `${t}: ${a}` : `${t} ${n("gridHeader.information")}`;
-  return e === "modal" ? /* @__PURE__ */ r(
+    infoData: i,
+    className: f,
+    onInfoClick: s,
+    infoIconGuidanceTargetId: d
+  } = o, c = () => {
+    s && s(o);
+  }, m = a ? `${t}: ${a}` : `${t} ${e("gridHeader.information")}`;
+  return n === "modal" ? /* @__PURE__ */ r(
     x,
     {
-      infoData: f,
+      infoData: i,
       displayName: t,
-      className: s,
-      onInfoClick: i,
-      label: d
+      className: f,
+      onInfoClick: c,
+      label: m,
+      guidanceTargetId: d
     }
   ) : /* @__PURE__ */ r(
-    y,
+    T,
     {
       content: a || `Info about ${t}`,
-      className: s,
-      onInfoClick: i,
-      label: d
+      className: f,
+      onInfoClick: c,
+      label: m,
+      guidanceTargetId: d
     }
   );
 }
 export {
-  z as HeaderInfo,
-  h as InfoIconTrigger,
+  F as HeaderInfo,
+  g as InfoIconTrigger,
   x as ModalInfoTrigger,
-  y as TooltipInfoTrigger
+  T as TooltipInfoTrigger
 };

package/dist/components/data/ag-grid-react/headers/components/info-modal.js

@@ -1,16 +1,16 @@
-import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
 import "react";
-import { Dialog as s, DialogContent as d, DialogHeader as p, DialogTitle as g, DialogBody as f } from "../../../../feedback/dialog/dialog.js";
+import { Dialog as m, DialogContent as s, DialogHeader as p, DialogTitle as g, DialogBody as f } from "../../../../feedback/dialog/dialog.js";
 import { useImpactNovaI18n as h } from "../../../../../i18n/use-impact-nova-i18n.js";
 import { SectionRenderer as x } from "./section-renderers.js";
-const H = ({ open: a, onClose: l, data: r }) => {
+const H = ({ open: i, onClose: l, data: r }) => {
   const { t: n } = h();
   if (!r) return null;
-  const { title: m, sections: t = [] } = r;
-  return /* @__PURE__ */ e(s, { open: a, onOpenChange: (o) => !o && l(), children: /* @__PURE__ */ i(d, { className: "max-w-2xl", children: [
-    /* @__PURE__ */ e(p, { children: /* @__PURE__ */ e(g, { children: m || n("gridHeader.information") }) }),
-    /* @__PURE__ */ i(f, { className: "space-y-6 py-8", children: [
-      t.map((o, c) => /* @__PURE__ */ e(x, { section: o }, `${o.type}-${c}`)),
+  const { title: c, sections: t = [] } = r;
+  return /* @__PURE__ */ e(m, { open: i, onOpenChange: (o) => !o && l(), children: /* @__PURE__ */ a(s, { className: "max-w-2xl", "data-guidance-target": "guidance.info-modal", children: [
+    /* @__PURE__ */ e(p, { children: /* @__PURE__ */ e(g, { children: c || n("gridHeader.information") }) }),
+    /* @__PURE__ */ a(f, { className: "space-y-6 py-8", children: [
+      t.map((o, d) => /* @__PURE__ */ e(x, { section: o }, `${o.type}-${d}`)),
       t.length === 0 && /* @__PURE__ */ e("p", { className: "text-sm text-secondary-foreground text-center py-4", children: n("gridHeader.noInformationAvailable") })
     ] })
   ] }) });