impact-nova 1.3.0 → 1.5.2

package/README.md

@@ -150,6 +150,55 @@ export const CustomAction = ({ analyticsId, ...props }: CustomActionProps) => {
 };
 ```
 
+### Internationalization (i18n)
+
+Impact Nova supports multiple languages via a provider and message overrides. Wrap your app (or subtree) with `ImpactNovaI18nProvider` and set `locale` and optionally `messages`.
+
+**Locale packs** (German, Spanish, Hindi, Kannada) are exported so you can use them as-is or override only the strings you need:
+
+```tsx
+import { ImpactNovaI18nProvider, de, defaultMessages } from 'impact-nova';
+
+// Use a full locale pack as-is
+function App() {
+  return (
+    <ImpactNovaI18nProvider locale="de" messages={de}>
+      <MyApp />
+    </ImpactNovaI18nProvider>
+  );
+}
+```
+
+**Override only a few keys** by spreading a locale pack and then overriding specific sections or keys. The provider merges your `messages` over the built-in English defaults (or over the pack you pass), so you only need to provide the keys you want to change:
+
+```tsx
+import { ImpactNovaI18nProvider, de } from 'impact-nova';
+
+// German with custom labels for calendar only
+const messages = {
+  ...de,
+  calendar: { ...de.calendar, apply: 'Übernehmen', cancel: 'Schließen' },
+};
+
+<ImpactNovaI18nProvider locale="de" messages={messages}>
+  <MyApp />
+</ImpactNovaI18nProvider>
+```
+
+**Tree-shakeable locale imports** (if you only need one language and want to avoid pulling others into your bundle):
+
+```tsx
+import { de } from 'impact-nova/locale/de';
+// or
+import { de, es, hi, kn } from 'impact-nova/locale';
+```
+
+- **`locale`**: BCP 47 code (e.g. `'en'`, `'de'`) used for date/number formatting. Supported: `en`, `en-US`, `en-GB`, `de`, `es`, `hi`, `kn`.
+- **`messages`**: Optional `Partial<ImpactNovaMessages>`. Merged over the built-in English defaults; only provided keys are overridden. Use a locale pack (`de`, `es`, `hi`, `kn`) or spread one and override specific keys.
+- **Per-component overrides**: Components that accept props like `placeholder`, `submitButtonLabel`, or `cancelLabel` use those when provided; otherwise they use values from the provider.
+
+Calendar, date pickers, Select, NestedList, DataTableColumnList, and aria labels (e.g. Alert close, Breadcrumb, Chips remove) use the context. See `docs/I18N_PLAN.md` for the full list of message keys and components.
+
 ---
 
 ## 🏗️ Architecture

package/dist/components/layout/dashboard-layout.d.ts

@@ -31,10 +31,24 @@ interface DashboardLayoutProps extends React.ComponentProps<"div"> {
      * When true, the filter strip is shown by default. Defaults to `true`.
      */
     defaultFiltersVisible?: boolean;
+    /**
+     * Controlled sidebar open state. When provided, the sidebar becomes fully controlled.
+     * Use together with `onSidebarOpenChange` for two-way binding.
+     */
+    sidebarOpen?: boolean;
+    /**
+     * Callback fired when the sidebar open state changes.
+     * Use together with `sidebarOpen` for controlled mode, or standalone for listening.
+     */
+    onSidebarOpenChange?: (open: boolean) => void;
+    /**
+     * Default open state for the sidebar (uncontrolled mode). Defaults to `false`.
+     */
+    sidebarDefaultOpen?: boolean;
     /**
      * Main content (e.g. <Outlet /> or page-level content).
      */
     children: React.ReactNode;
 }
-export declare function DashboardLayout({ sidebar, header, breadcrumb, breadcrumbRightContent, filterStrip, defaultFiltersVisible, children, className, ...props }: DashboardLayoutProps): import("react/jsx-runtime").JSX.Element;
+export declare function DashboardLayout({ sidebar, header, breadcrumb, breadcrumbRightContent, filterStrip, defaultFiltersVisible, sidebarOpen, onSidebarOpenChange, sidebarDefaultOpen, children, className, ...props }: DashboardLayoutProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/ui/accordion-nested-list/accordion-nested-list.js

@@ -1,97 +1,98 @@
-import { jsxs as c, jsx as r } from "react/jsx-runtime";
-import { useState as W, useCallback as s, useMemo as _ } from "react";
-import { Accordion as q, AccordionItem as z, AccordionTrigger as F, AccordionContent as G } from "../accordion.js";
-import { Button as A } from "../button.js";
-import { NestedList as H } from "../nested-list/nested-list.js";
-import { useAccordionNestedListState as J } from "./hooks/useAccordionNestedListState.js";
-import { SelectionMode as K } from "../types/nested-list.types.js";
-import { cn as P } from "../../../lib/utils.js";
-const re = ({
-  sections: l,
-  onChange: d,
+import { jsxs as i, jsx as t } from "react/jsx-runtime";
+import { useState as F, useCallback as d, useMemo as G } from "react";
+import { Accordion as H, AccordionItem as J, AccordionTrigger as K, AccordionContent as Q } from "../accordion.js";
+import { Button as N } from "../button.js";
+import { NestedList as R } from "../nested-list/nested-list.js";
+import { useAccordionNestedListState as U } from "./hooks/useAccordionNestedListState.js";
+import { SelectionMode as X } from "../types/nested-list.types.js";
+import { cn as Y } from "../../../lib/utils.js";
+import { useImpactNovaI18n as Z } from "../../../i18n/ImpactNovaI18nContext.js";
+const ce = ({
+  sections: r,
+  onChange: u,
   onSubmit: h,
   onCancel: m,
-  enableApplyDiscard: N = !0,
-  submitButtonLabel: g = "Apply",
-  cancelButtonLabel: v = "Reset",
+  enableApplyDiscard: v = !0,
+  submitButtonLabel: A,
+  cancelButtonLabel: g,
   className: C = "",
-  enableSearch: S = !0,
-  enableDragDrop: b = !0,
+  enableSearch: L = !0,
+  enableDragDrop: S = !0,
   enableSelectAll: y = !0,
-  selectionMode: x = K.CASCADE_DOWN,
-  searchPlaceholder: k = "Search...",
-  value: D,
-  onValueChange: V,
-  isMultiExpanded: t = !0,
-  defaultCollapseAll: j = !1,
-  validateApply: o
+  selectionMode: x = X.CASCADE_DOWN,
+  searchPlaceholder: B,
+  value: k,
+  onValueChange: D,
+  isMultiExpanded: n = !0,
+  defaultCollapseAll: V = !1,
+  validateApply: c
 }) => {
-  const {
-    currentSections: n,
+  const { t: s } = Z(), j = A ?? s("nestedList.apply"), I = g ?? s("nestedList.reset"), P = B ?? s("nestedList.searchPlaceholder"), {
+    currentSections: l,
     hasChanges: a,
-    setCurrentSection: u,
-    saveAllSections: f,
-    discardAllSections: p
-  } = J({ sections: l }), [L, w] = W(() => j ? t ? [] : "" : l.length > 0 ? t ? [l[0].id] : l[0].id : t ? [] : ""), B = D ?? L, I = V ?? w, M = s(
-    (e, i) => {
-      u(e, i), d?.(e, i);
+    setCurrentSection: f,
+    saveAllSections: p,
+    discardAllSections: b
+  } = U({ sections: r }), [w, M] = F(() => V ? n ? [] : "" : r.length > 0 ? n ? [r[0].id] : r[0].id : n ? [] : ""), O = k ?? w, T = D ?? M, W = d(
+    (e, o) => {
+      f(e, o), u?.(e, o);
     },
-    [d, u]
-  ), O = s(() => {
-    f(), h?.(n);
-  }, [n, h, f]), R = s(() => {
-    p(), m?.();
-  }, [p, m]), T = _(() => a ? o ? o(n) : !0 : !1, [a, o, n]);
-  return /* @__PURE__ */ c(
+    [u, f]
+  ), _ = d(() => {
+    p(), h?.(l);
+  }, [l, h, p]), q = d(() => {
+    b(), m?.();
+  }, [b, m]), z = G(() => a ? c ? c(l) : !0 : !1, [a, c, l]);
+  return /* @__PURE__ */ i(
     "div",
     {
-      className: P("flex flex-col h-full", C),
+      className: Y("flex flex-col h-full", C),
       "data-component": "accordion-nested-list",
       "data-has-changes": a ? "" : void 0,
       children: [
-        /* @__PURE__ */ r("div", { className: "flex-1 min-h-0 overflow-hidden", children: /* @__PURE__ */ r(
-          q,
+        /* @__PURE__ */ t("div", { className: "flex-1 min-h-0 overflow-hidden", children: /* @__PURE__ */ t(
+          H,
           {
-            type: t ? "multiple" : "single",
-            value: B,
-            onValueChange: I,
+            type: n ? "multiple" : "single",
+            value: O,
+            onValueChange: T,
             className: "space-y-4",
-            children: l.map((e) => /* @__PURE__ */ c(z, { value: e.id, children: [
-              /* @__PURE__ */ r(F, { children: e.label }),
-              /* @__PURE__ */ r(G, { className: "min-h-0 h-full", children: /* @__PURE__ */ r("div", { className: "h-full min-h-0 pb-2", children: /* @__PURE__ */ r(
-                H,
+            children: r.map((e) => /* @__PURE__ */ i(J, { value: e.id, children: [
+              /* @__PURE__ */ t(K, { children: e.label }),
+              /* @__PURE__ */ t(Q, { className: "min-h-0 h-full", children: /* @__PURE__ */ t("div", { className: "h-full min-h-0 pb-2", children: /* @__PURE__ */ t(
+                R,
                 {
-                  items: n[e.id] || [],
-                  onChange: (i) => M(e.id, i),
+                  items: l[e.id] || [],
+                  onChange: (o) => W(e.id, o),
                   enableApplyDiscard: !1,
-                  enableSearch: S,
-                  enableDragDrop: b,
+                  enableSearch: L,
+                  enableDragDrop: S,
                   enableSelectAll: y,
                   selectionMode: e.selectionMode ?? x,
-                  searchPlaceholder: k,
+                  searchPlaceholder: P,
                   className: "h-full"
                 }
               ) }) })
             ] }, e.id))
           }
         ) }),
-        N && /* @__PURE__ */ c("div", { className: "flex-shrink-0 flex justify-end gap-2 pt-4 border-t mt-4", children: [
-          /* @__PURE__ */ r(
-            A,
+        v && /* @__PURE__ */ i("div", { className: "flex-shrink-0 flex justify-end gap-2 pt-4 border-t mt-4", children: [
+          /* @__PURE__ */ t(
+            N,
             {
               variant: "tertiary",
-              onClick: R,
+              onClick: q,
               disabled: !a,
-              children: v
+              children: I
             }
           ),
-          /* @__PURE__ */ r(
-            A,
+          /* @__PURE__ */ t(
+            N,
             {
               variant: "default",
-              onClick: O,
-              disabled: !T,
-              children: g
+              onClick: _,
+              disabled: !z,
+              children: j
             }
           )
         ] })
@@ -100,5 +101,5 @@ const re = ({
   );
 };
 export {
-  re as AccordionNestedList
+  ce as AccordionNestedList
 };

package/dist/components/ui/accordion.js

@@ -1,10 +1,11 @@
 import { jsx as e, jsxs as i } from "react/jsx-runtime";
 import * as d from "react";
 import * as r from "@radix-ui/react-accordion";
-import { ChevronRight as m } from "lucide-react";
+import { ChevronRight as f } from "lucide-react";
 import { cn as s } from "../../lib/utils.js";
-import { Tooltip as f, TooltipTrigger as p, TooltipContent as g } from "./tooltip.js";
-const w = r.Root, h = d.forwardRef(({ className: o, ...t }, a) => /* @__PURE__ */ e(
+import { Tooltip as p, TooltipTrigger as g, TooltipContent as h } from "./tooltip.js";
+import { useImpactNovaI18n as x } from "../../i18n/ImpactNovaI18nContext.js";
+const C = r.Root, N = d.forwardRef(({ className: o, ...t }, a) => /* @__PURE__ */ e(
   r.Item,
   {
     ref: a,
@@ -14,33 +15,36 @@ const w = r.Root, h = d.forwardRef(({ className: o, ...t }, a) => /* @__PURE__ *
     ...t
   }
 ));
-h.displayName = "AccordionItem";
-const x = d.forwardRef(({ className: o, children: t, badge: a, rightActions: n, ...c }, l) => /* @__PURE__ */ e(r.Header, { className: "flex", children: /* @__PURE__ */ i(
-  r.Trigger,
-  {
-    ref: l,
-    className: s(
-      "flex flex-1 items-center gap-3 px-4 py-2 text-sm font-semibold transition-all text-left [&[data-state=open]>div>svg]:-rotate-90",
-      o
-    ),
-    ...c,
-    children: [
-      /* @__PURE__ */ i(f, { children: [
-        /* @__PURE__ */ e(p, { asChild: !0, children: /* @__PURE__ */ e("div", { className: "flex items-center justify-center h-8 w-8 shrink-0 rounded-lg bg-secondary text-secondary-foreground transition-transform duration-200", children: /* @__PURE__ */ e(m, { className: "h-4 w-4 transition-transform duration-200" }) }) }),
-        /* @__PURE__ */ e(g, { side: "top", variant: "tertiary", children: "Toggle" })
-      ] }),
-      /* @__PURE__ */ i("div", { className: "flex flex-1 items-center justify-between", children: [
-        /* @__PURE__ */ i("div", { className: "flex items-center gap-3", children: [
-          t,
-          a
+N.displayName = "AccordionItem";
+const v = d.forwardRef(({ className: o, children: t, badge: a, rightActions: n, ...c }, l) => {
+  const { t: m } = x();
+  return /* @__PURE__ */ e(r.Header, { className: "flex", children: /* @__PURE__ */ i(
+    r.Trigger,
+    {
+      ref: l,
+      className: s(
+        "flex flex-1 items-center gap-3 px-4 py-2 text-sm font-semibold transition-all text-left [&[data-state=open]>div>svg]:-rotate-90",
+        o
+      ),
+      ...c,
+      children: [
+        /* @__PURE__ */ i(p, { children: [
+          /* @__PURE__ */ e(g, { asChild: !0, children: /* @__PURE__ */ e("div", { className: "flex items-center justify-center h-8 w-8 shrink-0 rounded-lg bg-secondary text-secondary-foreground transition-transform duration-200", children: /* @__PURE__ */ e(f, { className: "h-4 w-4 transition-transform duration-200" }) }) }),
+          /* @__PURE__ */ e(h, { side: "top", variant: "tertiary", children: m("aria.toggle") })
         ] }),
-        n
-      ] })
-    ]
-  }
-) }));
-x.displayName = r.Trigger.displayName;
-const N = d.forwardRef(({ className: o, children: t, ...a }, n) => /* @__PURE__ */ e(
+        /* @__PURE__ */ i("div", { className: "flex flex-1 items-center justify-between", children: [
+          /* @__PURE__ */ i("div", { className: "flex items-center gap-3", children: [
+            t,
+            a
+          ] }),
+          n
+        ] })
+      ]
+    }
+  ) });
+});
+v.displayName = r.Trigger.displayName;
+const u = d.forwardRef(({ className: o, children: t, ...a }, n) => /* @__PURE__ */ e(
   r.Content,
   {
     ref: n,
@@ -49,10 +53,10 @@ const N = d.forwardRef(({ className: o, children: t, ...a }, n) => /* @__PURE__
     children: /* @__PURE__ */ e("div", { className: s("px-4 pb-4 pt-2", o), children: t })
   }
 ));
-N.displayName = r.Content.displayName;
+u.displayName = r.Content.displayName;
 export {
-  w as Accordion,
-  N as AccordionContent,
-  h as AccordionItem,
-  x as AccordionTrigger
+  C as Accordion,
+  u as AccordionContent,
+  N as AccordionItem,
+  v as AccordionTrigger
 };

package/dist/components/ui/ag-grid-react/cell-renderers/badge-cell-renderer.js

@@ -1,6 +1,6 @@
 import { jsx as d, jsxs as s } from "react/jsx-runtime";
 import { Badge as f } from "../../badge.js";
-import { getFieldValue as a, mapBadgeColor as g, mapBadgeVariant as u } from "./types.js";
+import { getFieldValue as a, mapBadgeColor as g, mapBadgeVariant as u } from "./cell-renderer-utils.js";
 const x = (e) => {
   const { data: l, value: n } = e, i = a(e.badgeLabelField, e.badgeLabel, l) ?? (n != null ? String(n) : void 0), c = a(e.variantField, e.variant, l) ?? "filled", o = a(e.colorField, e.color, l) ?? "default", r = a(e.isIconField, e.isIcon, l), t = a(e.iconField, e.icon, l), m = a(e.sizeField, e.size, l);
   return i ? /* @__PURE__ */ d("div", { className: "w-full h-full flex items-center justify-start ag-cell-inner-padding", children: /* @__PURE__ */ d(

package/dist/components/ui/ag-grid-react/cell-renderers/cell-renderer-utils.d.ts

@@ -0,0 +1,58 @@
+import { BadgeVariant, BadgeColor, ValidationRules, ValueFormatter, SplitCellValueEntry } from './types';
+/**
+ * Maps legacy variant names (from backend/config) to impact-nova Badge variants.
+ */
+export declare const mapBadgeVariant: (v: string | undefined) => BadgeVariant;
+/**
+ * Maps legacy color names (from backend/config) to impact-nova Badge colors.
+ */
+export declare const mapBadgeColor: (c: string | undefined) => BadgeColor;
+/**
+ * Resolves a value from either a static prop or a field in row data.
+ * Used by renderers that support both static and dynamic (field-driven) configuration.
+ */
+export declare const getFieldValue: <T>(fieldName: string | undefined, staticValue: T | undefined, rowData: Record<string, unknown> | null | undefined) => T | undefined;
+/**
+ * Evaluates validation rules against row data
+ */
+export declare const evaluateValidationRules: (rules: ValidationRules | undefined, rowData: Record<string, unknown> | null | undefined) => boolean;
+/**
+ * Resolves the effective value formatter for a cell considering all 4 levels.
+ *
+ * Priority (highest wins): cell > row > split > column
+ *
+ * @param cellValueObj    - The specific cell value object (may contain `cellMetadata.valueFormatter`).
+ * @param rowData         - The full row data object (may contain `rowMetadata.valueFormatter`).
+ * @param splitFormatter  - The split config's `valueFormatter`.
+ * @param columnFormatter - Column-level formatter (e.g. from `data?.valueFormatter`).
+ * @returns The resolved `ValueFormatter` or `null` if none found.
+ */
+export declare const resolveValueFormatter: (cellValueObj: SplitCellValueEntry | null | undefined, rowData: Record<string, unknown> | null | undefined, splitFormatter: ValueFormatter | null | undefined, columnFormatter: ValueFormatter | null | undefined) => ValueFormatter | null;
+/**
+ * Applies a `ValueFormatter` to a raw value, producing a formatted string.
+ *
+ * Shared by `SplitCellRenderer` and `InputDisplayRenderer` to avoid
+ * duplicating the same currency / percentage / decimal formatting logic.
+ *
+ * @param formatter - The resolved `ValueFormatter` describing how to format.
+ * @param val       - The raw value to format.
+ * @returns The formatted string, or `null` if `val` is nullish.
+ */
+export declare const applyValueFormatter: (formatter: ValueFormatter, val: unknown) => string | null;
+/**
+ * Resolves the effective editability for a split sub-cell considering all 4 levels.
+ *
+ * Priority (highest wins): cell > row > split > column
+ *
+ * - **Column level** (`columnEditable`): colDef.editable — baseline for the whole column.
+ * - **Split level** (`splitEditable`): split config's `editable` — per sub-cell override within a split column.
+ * - **Row level** (`rowData.rowMetadata._isDisabled`): disables all cells in the row.
+ * - **Cell level** (`cellValueObj.cellMetadata._isDisabled`): per-cell override — highest priority.
+ *
+ * @param columnEditable  - Whether the parent column is editable (boolean or undefined).
+ * @param splitEditable   - Whether this specific split is marked editable (boolean or undefined).
+ * @param rowData         - The full row data object (may contain `rowMetadata._isDisabled`).
+ * @param cellValueObj    - The specific cell value object (may contain `cellMetadata._isDisabled`).
+ * @returns `true` if the sub-cell should be editable, `false` otherwise.
+ */
+export declare const resolveCellEditable: (columnEditable: boolean | undefined, splitEditable: boolean | undefined, rowData: Record<string, unknown> | null | undefined, cellValueObj: SplitCellValueEntry | null | undefined) => boolean;

package/dist/components/ui/ag-grid-react/cell-renderers/cell-renderer-utils.js

@@ -0,0 +1,104 @@
+const a = (r) => {
+  switch (r) {
+    case "filled":
+      return "solid";
+    case "stroke":
+      return "outline";
+    case "subtle":
+      return "subtle";
+    case "solid":
+      return "solid";
+    case "outline":
+      return "outline";
+    default:
+      return "solid";
+  }
+}, i = (r) => {
+  switch (r) {
+    case "default":
+      return "primary";
+    case "info":
+      return "primary";
+    case "success":
+      return "success";
+    case "warning":
+      return "warning";
+    case "error":
+      return "destructive";
+    case "primary":
+      return "primary";
+    case "destructive":
+      return "destructive";
+    case "neutral":
+      return "neutral";
+    default:
+      return "primary";
+  }
+}, c = (r, u, e) => {
+  if (r && e && r in e) {
+    const n = e[r];
+    return n != null && n !== "" ? n : void 0;
+  }
+  return u;
+}, o = (r, u) => {
+  if (!r?.disabled || !u) return !1;
+  const { operator: e, conditions: n } = r.disabled, l = n.map((t) => {
+    const s = u[t.field];
+    if (s == null) return !1;
+    switch (t.condition) {
+      case ">":
+        return Number(s) > Number(t.value);
+      case "<":
+        return Number(s) < Number(t.value);
+      case ">=":
+        return Number(s) >= Number(t.value);
+      case "<=":
+        return Number(s) <= Number(t.value);
+      case "==":
+        return s == t.value;
+      case "!=":
+        return s != t.value;
+      case "contains":
+        return String(s).includes(String(t.value));
+      default:
+        return !1;
+    }
+  });
+  return e === "AND" ? l.every((t) => t === !0) : e === "OR" ? l.some((t) => t === !0) : !1;
+}, f = (r, u, e, n) => {
+  const l = r?.cellMetadata?.valueFormatter;
+  if (l) return l;
+  const t = u != null && typeof u == "object" ? u.rowMetadata : void 0;
+  return t?.valueFormatter ? t.valueFormatter : e || n || null;
+}, d = (r, u) => {
+  if (u == null) return null;
+  let e = String(u);
+  if (!e) return "--";
+  switch (r.decimals != null && !isNaN(Number(u)) && (e = Number(u).toFixed(r.decimals)), r.type) {
+    case "currencySymbol": {
+      const n = r.symbol ?? "$";
+      return r.position === "suffix" ? `${e} ${n}` : `${n} ${e}`;
+    }
+    case "percentage":
+      return `${e} %`;
+    case "number":
+      return e;
+    default:
+      return e;
+  }
+}, b = (r, u, e, n) => {
+  const l = n?.cellMetadata?._isDisabled;
+  if (l === !0) return !1;
+  if (l === !1) return !0;
+  const s = (e != null && typeof e == "object" ? e.rowMetadata : void 0)?._isDisabled;
+  return s === !0 ? !1 : s === !1 ? !0 : u === !1 ? !1 : u === !0 ? !0 : r === !0;
+};
+export {
+  d as applyValueFormatter,
+  o as evaluateValidationRules,
+  c as getFieldValue,
+  i as mapBadgeColor,
+  a as mapBadgeVariant,
+  b as resolveCellEditable,
+  f as resolveValueFormatter
+};