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

package/dist/components/data/data-table/data-table-sheet.js

@@ -22,7 +22,9 @@ const I = ({
   }, [e]);
   return f(() => {
     if (l)
-      return a(1), () => a(-1);
+      return a(1), () => {
+        a(-1);
+      };
   }, [l, a]), /* @__PURE__ */ t(N.Provider, { value: y, children: /* @__PURE__ */ t(k.Provider, { value: l, children: n }) });
 }, M = ({
   children: n,
@@ -67,7 +69,7 @@ const I = ({
               className: "close_icon h-6 w-6 rounded-full hover:bg-muted/50",
               "aria-label": "Close",
               onClick: () => o(!1),
-              children: /* @__PURE__ */ t(C, { className: "!h-3 !w-3 text-content-muted" })
+              children: /* @__PURE__ */ t(C, { className: "!h-3 !w-3 text-content-icon" })
             }
           )
         ] })

package/dist/components/data/data-table/data-table-view-menu.js

@@ -1,102 +1,102 @@
-import { jsx as t, jsxs as s } from "react/jsx-runtime";
+import { jsx as a, jsxs as s } from "react/jsx-runtime";
 import * as c from "react";
-import { DropdownMenuContent as m, DropdownMenuSub as p, DropdownMenuSubTrigger as d, DropdownMenuSubContent as u, DropdownMenuRadioGroup as g, DropdownMenuRadioItem as l, DropdownMenuItem as i, DropdownMenuTrigger as f } from "../../feedback/dropdown-menu/dropdown-menu.js";
+import { DropdownMenuContent as p, DropdownMenuSub as m, DropdownMenuSubTrigger as d, DropdownMenuSubContent as u, DropdownMenuRadioGroup as g, DropdownMenuRadioItem as r, DropdownMenuItem as l, DropdownMenuTrigger as f } from "../../feedback/dropdown-menu/dropdown-menu.js";
 import { Button as h } from "../../primitives/button/button.js";
 import { cn as b } from "../../../lib/utils.js";
 import { Density as x, Stack as T, StackCompact as w, StackComfort as D, Settings as N, ThreeDots as C, Collapse as M, Expand as S } from "impact-nova-icons";
-import { useImpactNovaI18n as r } from "../../../i18n/use-impact-nova-i18n.js";
+import { useImpactNovaI18n as i } from "../../../i18n/use-impact-nova-i18n.js";
 import { useDataTable as v } from "./data-table-context.js";
 import { DataTableSheetTrigger as P } from "./data-table-sheet.js";
 const y = ({
-  children: a,
+  children: t,
   ...n
 }) => {
-  const { t: o } = r();
-  return /* @__PURE__ */ t(f, { asChild: !0, ...n, children: a ?? /* @__PURE__ */ s(h, { variant: "secondary", size: "icon", "aria-label": o("dataTable.more"), children: [
-    /* @__PURE__ */ t(C, { size: "sm" }),
-    /* @__PURE__ */ t("span", { className: "sr-only", children: o("dataTable.openMenu") })
+  const { t: o } = i();
+  return /* @__PURE__ */ a(f, { asChild: !0, ...n, children: t ?? /* @__PURE__ */ s(h, { variant: "secondary", size: "icon", "aria-label": o("dataTable.more"), children: [
+    /* @__PURE__ */ a(C, { size: "sm" }),
+    /* @__PURE__ */ a("span", { className: "sr-only", children: o("dataTable.openMenu") })
   ] }) });
 };
 y.displayName = "DataTableViewMenuTrigger";
-const k = c.forwardRef(({ className: a, align: n = "end", ...o }, e) => /* @__PURE__ */ t(
-  m,
+const k = c.forwardRef(({ className: t, align: n = "end", ...o }, e) => /* @__PURE__ */ a(
+  p,
   {
     ref: e,
     align: n,
     "data-component": "data-table-view-menu",
-    className: b("w-[240px] flex flex-col gap-[2px]", a),
+    className: b("w-[240px] flex flex-col gap-[2px]", t),
     ...o
   }
 ));
 k.displayName = "DataTableViewMenuContent";
 const G = () => {
-  const { t: a } = r();
-  return /* @__PURE__ */ t(P, { asChild: !0, children: /* @__PURE__ */ t(
-    i,
+  const { t } = i();
+  return /* @__PURE__ */ a(P, { asChild: !0, children: /* @__PURE__ */ a(
+    l,
     {
       className: "flex cursor-pointer gap-2",
       onClick: (n) => n.stopPropagation(),
       onSelect: (n) => n.stopPropagation(),
       children: /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ t(N, { size: "sm", className: "text-content-muted" }),
-        /* @__PURE__ */ t("span", { children: a("dataTable.tableSettings") })
+        /* @__PURE__ */ a(N, { size: "sm", className: "text-content-icon" }),
+        /* @__PURE__ */ a("span", { children: t("dataTable.tableSettings") })
       ] })
     }
   ) });
 }, q = () => {
-  const { t: a } = r(), { rowHeight: n, setRowHeight: o } = v();
-  return /* @__PURE__ */ s(p, { children: [
+  const { t } = i(), { rowHeight: n, setRowHeight: o } = v();
+  return /* @__PURE__ */ s(m, { children: [
     /* @__PURE__ */ s(
       d,
       {
         className: "flex items-center gap-2 cursor-pointer",
         onClick: (e) => e.stopPropagation(),
         children: [
-          /* @__PURE__ */ t(x, { size: "sm", className: "text-content-muted" }),
-          /* @__PURE__ */ t("span", { children: a("dataTable.contentDensity") })
+          /* @__PURE__ */ a(x, { size: "sm", className: "text-content-icon" }),
+          /* @__PURE__ */ a("span", { children: t("dataTable.contentDensity") })
         ]
       }
     ),
-    /* @__PURE__ */ t(u, { className: "w-[190px]", children: /* @__PURE__ */ s(
+    /* @__PURE__ */ a(u, { className: "w-[190px]", children: /* @__PURE__ */ s(
       g,
       {
         value: n,
         onValueChange: (e) => o(e),
         className: "flex flex-col gap-0.5",
         children: [
-          /* @__PURE__ */ t(
-            l,
+          /* @__PURE__ */ a(
+            r,
             {
               value: "default",
               onClick: (e) => e.stopPropagation(),
               onSelect: (e) => e.stopPropagation(),
               children: /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
-                /* @__PURE__ */ t(T, { size: "sm", className: "text-content-muted" }),
-                a("dataTable.densityDefault")
+                /* @__PURE__ */ a(T, { size: "sm", className: "text-content-icon" }),
+                t("dataTable.densityDefault")
               ] })
             }
           ),
-          /* @__PURE__ */ t(
-            l,
+          /* @__PURE__ */ a(
+            r,
             {
               value: "compact",
               onClick: (e) => e.stopPropagation(),
               onSelect: (e) => e.stopPropagation(),
               children: /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
-                /* @__PURE__ */ t(w, { size: "sm", className: "text-content-muted" }),
-                a("dataTable.densityCompact")
+                /* @__PURE__ */ a(w, { size: "sm", className: "text-content-icon" }),
+                t("dataTable.densityCompact")
               ] })
             }
           ),
-          /* @__PURE__ */ t(
-            l,
+          /* @__PURE__ */ a(
+            r,
             {
               value: "comfort",
               onClick: (e) => e.stopPropagation(),
               onSelect: (e) => e.stopPropagation(),
               children: /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
-                /* @__PURE__ */ t(D, { size: "sm", className: "text-content-muted" }),
-                a("dataTable.densityComfort")
+                /* @__PURE__ */ a(D, { size: "sm", className: "text-content-icon" }),
+                t("dataTable.densityComfort")
               ] })
             }
           )
@@ -105,21 +105,21 @@ const G = () => {
     ) })
   ] });
 }, A = ({
-  expanded: a,
+  expanded: t,
   onExpandedChange: n
 }) => {
-  const { t: o } = r();
-  return /* @__PURE__ */ t(
-    i,
+  const { t: o } = i();
+  return /* @__PURE__ */ a(
+    l,
     {
       className: "flex cursor-pointer gap-2",
       onClick: (e) => e.stopPropagation(),
       onSelect: (e) => {
-        e.stopPropagation(), n(!a);
+        e.stopPropagation(), n(!t);
       },
       children: /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
-        a ? /* @__PURE__ */ t(M, { size: "sm", className: "text-content-muted" }) : /* @__PURE__ */ t(S, { size: "sm", className: "text-content-muted" }),
-        /* @__PURE__ */ t("span", { children: o(a ? "dataTable.tableCollapse" : "dataTable.tableExpand") })
+        t ? /* @__PURE__ */ a(M, { size: "sm", className: "text-content-icon" }) : /* @__PURE__ */ a(S, { size: "sm", className: "text-content-icon" }),
+        /* @__PURE__ */ a("span", { children: o(t ? "dataTable.tableCollapse" : "dataTable.tableExpand") })
       ] })
     }
   );

package/dist/components/data/data-table/data-table.d.ts

@@ -1,18 +1,16 @@
-import { default as React } from 'react';
-import { DataTableProps, DataTableContentProps } from './data-table.types';
-export type { DataTableProps, DataTableContentProps } from './data-table.types';
+import { DataTableProps, DataTableContentProps, DataTableToolbarProps } from './data-table.types';
+export type { DataTableProps, DataTableContentProps, DataTableToolbarProps, } from './data-table.types';
 /**
  * DataTable Root
  * Provides context and structural container.
  */
 export declare const DataTable: ({ children, className, }: DataTableProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * DataTable Content — does not subscribe to sheet open/close; only the frame
+ * and sheet UI re-render when the scoped settings panel toggles.
+ */
 export declare function DataTableContent<TData>(props: DataTableContentProps<TData>): import("react/jsx-runtime").JSX.Element;
 /**
- * DataTable Toolbar
- * Generic container for top-bar actions.
- * Users can conditionally render this component to remove it from DOM.
+ * Top bar above the grid. Optional — omit to remove the toolbar from the DOM.
  */
-export declare const DataTableToolbar: ({ children, className, }: {
-    children: React.ReactNode;
-    className?: string;
-}) => import("react/jsx-runtime").JSX.Element;
+export declare const DataTableToolbar: ({ children, className, }: DataTableToolbarProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/data/data-table/data-table.js

@@ -1,170 +1,197 @@
-import { jsx as n, jsxs as C } from "react/jsx-runtime";
-import { useState as a, useRef as E, useCallback as H, useMemo as v, useEffect as y, memo as N } from "react";
-import { AgGridWrapper as z } from "../ag-grid-react/index.js";
-import { cn as w } from "../../../lib/utils.js";
-import { DataTableContext as F, DataTableSheetPortalContext as M, useDataTable as j, useDataTableSheetPortal as P } from "./data-table-context.js";
-import { DATA_TABLE_SCOPED_SHEET_HOST_MIN_HEIGHT_PX as A } from "./data-table-constants.js";
-const D = {
+import { jsx as n, jsxs as G } from "react/jsx-runtime";
+import { useState as h, useRef as E, useCallback as D, useMemo as g, useEffect as y, memo as v } from "react";
+import { AgGridWrapper as O } from "../ag-grid-react/index.js";
+import { cn as H } from "../../../lib/utils.js";
+import { DataTableContext as F, DataTableSheetPortalStoreContext as N, useDataTable as I, useDataTableSheetPortal as A } from "./data-table-context.js";
+import { createDataTableSheetPortalStore as z } from "./data-table-sheet-portal-store.js";
+import { DATA_TABLE_SCOPED_SHEET_HOST_MIN_HEIGHT_PX as B } from "./data-table-constants.js";
+import { extractRuntimeColumnDefs as M, mergeInitialGridRuntimeState as j } from "./data-table-column-def-pin.js";
+const P = {
   default: 46,
   compact: 30,
   comfort: 52
-}, Y = ({
-  children: i,
+}, U = ({
+  children: a,
   className: t
 }) => {
-  const [o, e] = a(null), [r, p] = a(null), [l, c] = a("medium"), [h, d] = a("full"), [m, f] = a("default"), [g, T] = a(!1), u = E(0), x = H((b) => {
-    u.current = Math.max(
-      0,
-      u.current + b
-    ), T(u.current > 0);
-  }, []), S = H((b) => {
-    e(b);
-  }, []), s = {
+  const [r, e] = h(null), [o, c] = h("medium"), [i, S] = h("full"), [s, m] = h("default"), d = E(z()), u = D((l) => {
+    d.current.registerScopedSheetDepth(l);
+  }, []), f = D((l) => {
+    e(l);
+  }, []), x = {
     small: "12px",
     medium: "14px",
     large: "16px"
-  }[l], O = `${D[m]}px`, R = v(
+  }[o], b = `${P[s]}px`, T = g(
     () => ({
-      gridApi: o,
-      registerApi: S,
-      registerScopedSheetDepth: x,
-      fontSize: l,
+      gridApi: r,
+      registerApi: f,
+      registerScopedSheetDepth: u,
+      fontSize: o,
       setFontSize: c,
-      numericFormat: h,
-      setNumericFormat: d,
-      rowHeight: m,
-      setRowHeight: f
+      numericFormat: i,
+      setNumericFormat: S,
+      rowHeight: s,
+      setRowHeight: m
     }),
     [
+      r,
+      f,
+      u,
       o,
-      S,
-      x,
-      l,
-      c,
-      h,
-      d,
-      m,
-      f
+      i,
+      s
     ]
-  ), G = v(
-    () => ({
-      sheetTarget: r,
-      setSheetTarget: p,
-      scopedSheetOpen: g
-    }),
-    [r, p, g]
   );
-  return /* @__PURE__ */ n(F.Provider, { value: R, children: /* @__PURE__ */ n(M.Provider, { value: G, children: /* @__PURE__ */ n(
-    "div",
+  return /* @__PURE__ */ n(F.Provider, { value: T, children: /* @__PURE__ */ n(
+    N.Provider,
     {
-      "data-component": "data-table",
-      className: w(
-        "flex flex-col w-full min-h-0 rounded-[inherit]",
-        t
-      ),
-      style: {
-        "--ag-font-size": s,
-        "--ag-row-height": O
-      },
-      children: i
+      value: d.current,
+      children: /* @__PURE__ */ n(
+        "div",
+        {
+          "data-component": "data-table",
+          className: H(
+            "flex flex-col w-full min-h-0 rounded-[inherit]",
+            t
+          ),
+          style: {
+            "--ag-font-size": x,
+            "--ag-row-height": b
+          },
+          children: a
+        }
+      )
     }
-  ) }) });
-}, _ = {
+  ) });
+}, w = {
   full: "full_no",
   k: "thou",
   m: "mil",
   b: "bil",
   full_precision: "full_precision"
-}, k = N(function() {
-  const { setSheetTarget: t, scopedSheetOpen: o } = P();
+}, k = v(function() {
+  const { setSheetTarget: t } = A();
   return /* @__PURE__ */ n(
     "div",
     {
       ref: t,
-      className: "absolute inset-0 pointer-events-none z-[39] flex overflow-x-hidden overflow-y-visible",
-      style: o ? { minHeight: A } : void 0
+      className: "absolute inset-0 pointer-events-none z-[39] flex overflow-x-hidden overflow-y-visible"
+    }
+  );
+}), L = v(function({
+  className: t,
+  children: r
+}) {
+  const { scopedSheetOpen: e } = A();
+  return /* @__PURE__ */ G(
+    "div",
+    {
+      className: H(
+        "relative flex-1 min-h-0 w-full bg-canvas-elevated rounded-b-[inherit] grid-rounded-bottom",
+        t
+      ),
+      style: e ? { minHeight: B } : void 0,
+      children: [
+        r,
+        /* @__PURE__ */ n(k, {})
+      ]
+    }
+  );
+}), W = v(function({
+  resolvedRowHeight: t,
+  mergedContext: r,
+  onGridReady: e,
+  columnDefs: o,
+  maintainColumnOrder: c = !0,
+  ...i
+}) {
+  return /* @__PURE__ */ n(
+    O,
+    {
+      ...i,
+      columnDefs: o,
+      rowHeight: t,
+      onGridReady: e,
+      context: r,
+      maintainColumnOrder: c
     }
   );
 });
-function $(i) {
+function Z(a) {
   const {
     registerApi: t,
-    rowHeight: o,
+    rowHeight: r,
     gridApi: e,
-    numericFormat: r
-  } = j(), { scopedSheetOpen: p } = P(), {
-    className: l,
-    onGridReady: c,
-    rowHeight: h,
-    context: d,
+    numericFormat: o
+  } = I(), {
+    className: c,
+    onGridReady: i,
+    rowHeight: S,
+    context: s,
     columnDefs: m,
-    maintainColumnOrder: f = !0,
-    ...g
-  } = i, T = D[o], u = h ?? T, x = v(
+    initialState: d,
+    maintainColumnOrder: u = !0,
+    ...f
+  } = a, x = P[r], b = S ?? x, { runtimeColumnDefs: T, extractedRuntimeDefaults: l } = g(
+    () => M(m ?? void 0),
+    [m]
+  ), _ = g(
+    () => j(d, l),
+    [d, l]
+  ), C = g(
     () => ({
-      ...d,
-      formatType: _[r]
+      ...s,
+      formatType: w[o]
     }),
-    [d, r]
+    [s, o]
   );
   y(() => {
     e?.resetRowHeights();
-  }, [o, e]), y(() => {
+  }, [r, e]), y(() => {
     if (e) {
-      const s = e.getGridOption("context") || {};
+      const p = e.getGridOption("context") || {};
       e.setGridOption("context", {
-        ...s,
-        formatType: _[r]
+        ...p,
+        formatType: w[o]
       }), e.refreshCells({ force: !0 });
     }
-  }, [r, e]);
-  const S = H(
-    (s) => {
-      t(s.api), c?.(s);
+  }, [o, e]);
+  const R = D(
+    (p) => {
+      t(p.api), i?.(p);
     },
-    [t, c]
+    [t, i]
   );
-  return /* @__PURE__ */ C(
-    "div",
+  return /* @__PURE__ */ n(L, { className: c, children: /* @__PURE__ */ n(
+    W,
     {
-      className: w(
-        "relative flex-1 min-h-0 w-full bg-canvas-elevated rounded-b-[inherit] grid-rounded-bottom",
-        l
-      ),
-      style: p ? { minHeight: A } : void 0,
-      children: [
-        /* @__PURE__ */ n(
-          z,
-          {
-            ...g,
-            columnDefs: m,
-            rowHeight: u,
-            onGridReady: S,
-            context: x,
-            maintainColumnOrder: f
-          }
-        ),
-        /* @__PURE__ */ n(k, {})
-      ]
+      ...f,
+      columnDefs: T,
+      initialState: _,
+      maintainColumnOrder: u,
+      resolvedRowHeight: b,
+      mergedContext: C,
+      onGridReady: R
     }
-  );
+  ) });
 }
-const q = ({
-  children: i,
+const ee = ({
+  children: a,
   className: t
 }) => /* @__PURE__ */ n(
   "div",
   {
     "data-component": "data-table-toolbar",
-    className: w(
+    className: H(
       "flex items-center justify-between px-4 py-3 shrink-0 bg-canvas-elevated rounded-t-[inherit]",
       t
     ),
-    children: i
+    children: a
   }
 );
 export {
-  Y as DataTable,
-  $ as DataTableContent,
-  q as DataTableToolbar
+  U as DataTable,
+  Z as DataTableContent,
+  ee as DataTableToolbar
 };

package/dist/components/data/data-table/data-table.types.d.ts

@@ -1,9 +1,44 @@
 import { AgGridWrapperProps } from '../ag-grid-react/ag-grid.types';
 import type * as React from "react";
+/**
+ * Root layout provider for data tables. Compose toolbar, sheet, and `DataTableContent` as children.
+ */
 export type DataTableProps = {
     children: React.ReactNode;
     className?: string;
 };
+/**
+ * AG Grid surface — forwards native `AgGridReact` props (rowData, columnDefs, rowModelType, treeData, …)
+ * with Impact Nova styling. See https://www.ag-grid.com/react-data-grid/grid-options/
+ */
 export type DataTableContentProps<TData = unknown> = AgGridWrapperProps<TData> & {
     className?: string;
 };
+/**
+ * Top bar above the grid. Optional — omit to remove the toolbar from the DOM.
+ *
+ * Layout is `justify-between`: place a title or context on the left, actions on the right
+ * (filter toggle, `DataTableSheet` / view menu, export, density, saved views).
+ */
+export type DataTableToolbarProps = {
+    /** Toolbar slots — typically title (left) and action buttons / `DataTableSheet` (right). */
+    children: React.ReactNode;
+    /** Extra classes on the toolbar root (`data-component="data-table-toolbar"`). */
+    className?: string;
+};
+/**
+ * Scoped settings panel state. Renders inside the `DataTable` container (not a viewport modal).
+ *
+ * Compose `DataTableSheetContent` for the slide-in panel, triggers from the toolbar or view menu,
+ * and optional `DataTableColumnList` / `DataTableSavedViews` inside the sheet body.
+ */
+export type DataTableSheetProps = {
+    /** Sheet subtree — typically `DataTableSheetContent`, triggers, and settings panels. */
+    children: React.ReactNode;
+    /** Initial open state when `open` is not provided (uncontrolled). */
+    defaultOpen?: boolean;
+    /** Controlled open state. Pair with `onOpenChange`. */
+    open?: boolean;
+    /** Called when the user opens or closes the sheet. */
+    onOpenChange?: (open: boolean) => void;
+};

package/dist/components/data/data-table/index.js

@@ -1,40 +1,41 @@
 import { DataTable as t, DataTableContent as o, DataTableToolbar as r } from "./data-table.js";
 import { DATA_TABLE_SCOPED_SHEET_HOST_MIN_HEIGHT_PX as l, TABLE_VIEWPORT_SHELL_EXPANDED_CLASS as D } from "./data-table-constants.js";
-import { DataTableColumnList as b } from "./data-table-column-list.js";
-import { DataTableContext as S, DataTableSheetPortalContext as m, useDataTable as p, useDataTableSheetPortal as x } from "./data-table-context.js";
-import { DataTableFormatOptions as u } from "./data-table-format-options.js";
-import { DataTableSheet as _, DataTableSheetContent as h, DataTableSheetHeader as s, DataTableSheetTrigger as C } from "./data-table-sheet.js";
+import { DataTableColumnList as n } from "./data-table-column-list.js";
+import { DataTableContext as i, DataTableSheetPortalStoreContext as m, useDataTable as p, useDataTableSheetPortal as x, useDataTableSheetPortalStore as f } from "./data-table-context.js";
+import { DataTableFormatOptions as E } from "./data-table-format-options.js";
+import { DataTableSheet as h, DataTableSheetContent as s, DataTableSheetHeader as C, DataTableSheetTrigger as w } from "./data-table-sheet.js";
 import { useDataTableSheet as V, useDataTableSheetApi as A } from "./data-table-sheet-context.js";
-import { DataTableViewMenuContent as P, DataTableViewMenuDensity as d, DataTableViewMenuSettingsItem as g, DataTableViewMenuTrigger as H, DataTableViewMenuViewportExpand as I } from "./data-table-view-menu.js";
-import { DataTableSavedViews as O } from "./data-table-saved-views.js";
-import { PinSwitch as B } from "./pin-switch.js";
-import { ColumnIndicator as X } from "./column-indicator.js";
-import { IndicatorLegend as y } from "./indicator-legend.js";
+import { DataTableViewMenuContent as d, DataTableViewMenuDensity as g, DataTableViewMenuSettingsItem as H, DataTableViewMenuTrigger as I, DataTableViewMenuViewportExpand as M } from "./data-table-view-menu.js";
+import { DataTableSavedViews as c } from "./data-table-saved-views.js";
+import { PinSwitch as N } from "./pin-switch.js";
+import { ColumnIndicator as v } from "./column-indicator.js";
+import { IndicatorLegend as F } from "./indicator-legend.js";
 export {
-  X as ColumnIndicator,
+  v as ColumnIndicator,
   l as DATA_TABLE_SCOPED_SHEET_HOST_MIN_HEIGHT_PX,
   t as DataTable,
-  b as DataTableColumnList,
+  n as DataTableColumnList,
   o as DataTableContent,
-  S as DataTableContext,
-  u as DataTableFormatOptions,
-  O as DataTableSavedViews,
-  _ as DataTableSheet,
-  h as DataTableSheetContent,
-  s as DataTableSheetHeader,
-  m as DataTableSheetPortalContext,
-  C as DataTableSheetTrigger,
+  i as DataTableContext,
+  E as DataTableFormatOptions,
+  c as DataTableSavedViews,
+  h as DataTableSheet,
+  s as DataTableSheetContent,
+  C as DataTableSheetHeader,
+  m as DataTableSheetPortalStoreContext,
+  w as DataTableSheetTrigger,
   r as DataTableToolbar,
-  P as DataTableViewMenuContent,
-  d as DataTableViewMenuDensity,
-  g as DataTableViewMenuSettingsItem,
-  H as DataTableViewMenuTrigger,
-  I as DataTableViewMenuViewportExpand,
-  y as IndicatorLegend,
-  B as PinSwitch,
+  d as DataTableViewMenuContent,
+  g as DataTableViewMenuDensity,
+  H as DataTableViewMenuSettingsItem,
+  I as DataTableViewMenuTrigger,
+  M as DataTableViewMenuViewportExpand,
+  F as IndicatorLegend,
+  N as PinSwitch,
   D as TABLE_VIEWPORT_SHELL_EXPANDED_CLASS,
   p as useDataTable,
   V as useDataTableSheet,
   A as useDataTableSheetApi,
-  x as useDataTableSheetPortal
+  x as useDataTableSheetPortal,
+  f as useDataTableSheetPortalStore
 };

package/dist/components/data/data-table/indicator-legend.js

@@ -1,15 +1,15 @@
 import { jsxs as t, jsx as e } from "react/jsx-runtime";
-import { useImpactNovaI18n as r } from "../../../i18n/use-impact-nova-i18n.js";
-import { ColumnIndicator as n } from "./column-indicator.js";
+import { useImpactNovaI18n as n } from "../../../i18n/use-impact-nova-i18n.js";
+import { ColumnIndicator as r } from "./column-indicator.js";
 const i = () => {
-  const { t: a } = r();
-  return /* @__PURE__ */ t("div", { className: "flex items-center gap-3 text-[10px] text-content-muted", "data-component": "indicator-legend", children: [
+  const { t: a } = n();
+  return /* @__PURE__ */ t("div", { className: "flex items-center gap-3 text-[10px] text-secondary-foreground", "data-component": "indicator-legend", children: [
     /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: [
-      /* @__PURE__ */ e(n, { type: "sort" }),
+      /* @__PURE__ */ e(r, { type: "sort" }),
       /* @__PURE__ */ e("span", { children: a("dataTable.indicatorSort") })
     ] }),
     /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: [
-      /* @__PURE__ */ e(n, { type: "filter" }),
+      /* @__PURE__ */ e(r, { type: "filter" }),
       /* @__PURE__ */ e("span", { children: a("dataTable.indicatorSearch") })
     ] })
   ] });