@axzydev/axzy_ui_system 1.4.7 → 1.4.8

package/dist/index.d.cts

@@ -1,6 +1,6 @@
 import * as Yup from 'yup';
 import * as React$1 from 'react';
-import React__default, { RefObject, CSSProperties, ReactNode, ElementType, ChangeEvent, FocusEvent, KeyboardEvent, HTMLAttributes } from 'react';
+import React__default, { CSSProperties, RefObject, ReactNode, ElementType, ChangeEvent, FocusEvent, KeyboardEvent, HTMLAttributes } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
 declare const useClickOutside: (ref: React.RefObject<HTMLElement>, callback: () => void) => void;
@@ -19,6 +19,110 @@ interface UseDebouncedSearchResult {
 declare function useDebouncedSearch({ initialValue, debounceMs, onSearch, }: UseDebouncedSearchOptions): UseDebouncedSearchResult;
 
 type TableVariants = "default" | "striped" | "bordered";
+/**
+ * A single, optional style slot for one region of a table. Both fields are
+ * merged *after* the component's built-in values.
+ */
+interface TableDesignSlot {
+    /**
+     * Extra CSS classes merged after the built-in ones. Note that Tailwind
+     * resolves conflicts by utility order (not class order), so use inline
+     * `style` (or `!` modifiers) when a value must always win.
+     */
+    className?: string;
+    /** Inline CSS merged after the built-in values; wins over classes unless the global theme forces a value with `!important`. */
+    style?: CSSProperties;
+}
+/**
+ * Per-instance visual overrides for a table. Every region is optional and, when
+ * present, is applied on top of the built-in styles. The global
+ * `ITThemeProvider` colors (`--color-table-*`) still apply underneath, so use
+ * `TableColors` for this-instance color changes instead of `style`.
+ */
+interface TableDesign {
+    /** Outermost wrapper (`space-y-4 w-full`). Prefer `containerClassName` for width/spacing. */
+    container?: TableDesignSlot;
+    /** The rounded card surface that wraps the toolbar, table and footer (border, radius, shadow, background). */
+    card?: TableDesignSlot;
+    /** Toolbar strip holding the title and/or the Table|Cards toggle. */
+    toolbar?: TableDesignSlot;
+    /** The `<thead>` row that carries the column titles. */
+    header?: TableDesignSlot;
+    /** Every `<th>` header cell. */
+    headerCell?: TableDesignSlot;
+    /** Every body `<tr>`. */
+    row?: TableDesignSlot;
+    /** Every body `<td>`. */
+    cell?: TableDesignSlot;
+    /** Scroll wrapper of the cards view (the responsive card list). */
+    cards?: TableDesignSlot;
+    /** Pagination footer strip. */
+    footer?: TableDesignSlot;
+}
+/**
+ * Per-instance color overrides. They are written as local `--color-table-*`
+ * variables on the table wrapper, so they beat the global theme for this
+ * instance only, without touching `ITThemeProvider`.
+ */
+interface TableColors {
+    /** Header row background. Overrides the theme's `table.headerBg` for this instance. */
+    headerBg?: string;
+    /** Header text color. Overrides the theme's `table.headerText` for this instance. */
+    headerText?: string;
+    /** Body row background. Overrides the theme's `table.rowBg` for this instance. */
+    rowBg?: string;
+    /** Body text color. Overrides the theme's `table.rowText` for this instance. */
+    rowText?: string;
+    /** Body row hover background. Overrides the theme's `table.rowHover` for this instance. */
+    rowHover?: string;
+}
+/**
+ * Shared design props for ITTable and ITDataTable. `design` exposes every
+ * region as an object; the flat `*ClassName` / `*Style` shortcuts are merged
+ * after it, so the flat prop wins when both are provided.
+ */
+interface TableDesignProps {
+    /** Whether to render the Table|Cards view switcher in the toolbar. Hiding it still honors `defaultView` and `autoCardBreakpoint`. @default true */
+    showViewToggle?: boolean;
+    /** Per-region visual overrides (classes + inline styles). */
+    design?: TableDesign;
+    /** Per-instance color overrides for header and rows, beating the global theme. */
+    colors?: TableColors;
+    /** Inline styles for the outermost wrapper. */
+    containerStyle?: CSSProperties;
+    /** Extra classes for the card surface (the rounded container). */
+    cardClassName?: string;
+    /** Inline styles for the card surface. */
+    cardStyle?: CSSProperties;
+    /** Extra classes for the toolbar strip (title + view toggle). */
+    toolbarClassName?: string;
+    /** Inline styles for the toolbar strip. */
+    toolbarStyle?: CSSProperties;
+    /** Extra classes for the header row. */
+    headerClassName?: string;
+    /** Inline styles for the header row. */
+    headerStyle?: CSSProperties;
+    /** Extra classes for every header cell. */
+    headerCellClassName?: string;
+    /** Inline styles for every header cell. */
+    headerCellStyle?: CSSProperties;
+    /** Extra classes for every body row. */
+    rowClassName?: string;
+    /** Inline styles for every body row. */
+    rowStyle?: CSSProperties;
+    /** Extra classes for every body cell. */
+    cellClassName?: string;
+    /** Inline styles for every body cell. */
+    cellStyle?: CSSProperties;
+    /** Extra classes for the cards-view scroll wrapper. */
+    cardsClassName?: string;
+    /** Inline styles for the cards-view scroll wrapper. */
+    cardsStyle?: CSSProperties;
+    /** Extra classes for the pagination footer strip. */
+    footerClassName?: string;
+    /** Inline styles for the pagination footer strip. */
+    footerStyle?: CSSProperties;
+}
 /**
  * Value stored for a single column filter.
  *
@@ -1159,6 +1263,14 @@ interface Column<T = any> {
     label: string;
     /** Additional CSS classes applied to both the header (`<th>`) and body (`<td>`) cells of this column. */
     className?: string;
+    /** Extra CSS classes applied only to this column's header (`<th>`), merged after `className`. */
+    headerClassName?: string;
+    /** Inline styles applied only to this column's header (`<th>`), merged after the table-level header-cell style. */
+    headerStyle?: React.CSSProperties;
+    /** Extra CSS classes applied only to this column's body cells (`<td>`), merged after `className`. */
+    cellClassName?: string;
+    /** Inline styles applied only to this column's body cells (`<td>`), merged after the table-level cell style. */
+    cellStyle?: React.CSSProperties;
     /** Formats numeric values as Mexican pesos (MXN) via `Intl`-based currency formatting. Only applies when `type` is `"number"`. @default false */
     currencyMX?: boolean;
     /** Custom action buttons/content rendered for a `"actions"`-type column. Receives the full row object. */
@@ -1236,7 +1348,7 @@ interface Column<T = any> {
      */
     pinned?: "left" | "right";
 }
-interface ITTableProps<T> {
+interface ITTableProps<T> extends TableDesignProps {
     /** Column definitions: key, label, type, sortable behavior, filters, and custom rendering. */
     columns: Column<T>[];
     /** Additional CSS classes for the outermost container. */
@@ -1352,7 +1464,7 @@ interface ITDataTableResponse<T> {
     /** Total row count across all pages (used to compute the paginator's total pages). */
     total: number;
 }
-interface ITDataTableProps<T extends Record<string, unknown>> {
+interface ITDataTableProps<T extends Record<string, unknown>> extends TableDesignProps {
     /**
      * The column configuration array matching ITTable but adapted for Server-Side processing
      */
@@ -1492,7 +1604,7 @@ interface ITDataTableProps<T extends Record<string, unknown>> {
  * />
  * ```
  */
-declare function ITDataTable<T extends Record<string, unknown>>({ columns, fetchData, debounceMs, externalFilters, loadingIndicator, fetchOnMount, reloadTrigger, containerClassName, className, variant, size, itemsPerPageOptions, defaultItemsPerPage, title, renderCard, defaultView, showVerticalBorder, verticalBorderClassname, onRowClick, layout, density, autoCardBreakpoint, virtualized, virtualizedMaxHeight, rowHeight, overscan, stickyHeader, }: ITDataTableProps<T>): react_jsx_runtime.JSX.Element;
+declare function ITDataTable<T extends Record<string, unknown>>({ columns, fetchData, debounceMs, externalFilters, loadingIndicator, fetchOnMount, reloadTrigger, containerClassName, className, variant, size, itemsPerPageOptions, defaultItemsPerPage, title, renderCard, defaultView, showVerticalBorder, verticalBorderClassname, onRowClick, layout, density, autoCardBreakpoint, virtualized, virtualizedMaxHeight, rowHeight, overscan, stickyHeader, showViewToggle, design, colors, containerStyle, cardClassName, cardStyle, toolbarClassName, toolbarStyle, headerClassName, headerStyle, headerCellClassName, headerCellStyle, rowClassName, rowStyle, cellClassName, cellStyle, cardsClassName, cardsStyle, footerClassName, footerStyle, }: ITDataTableProps<T>): react_jsx_runtime.JSX.Element;
 
 interface ITDatePickerProps {
     /** Unique name attribute for the underlying input element. */
@@ -3424,7 +3536,7 @@ declare function ITLineBarChart({ data, ariaLabel, lineLabel, barLabel, lineColo
  *   size="sm"
  * />
  */
-declare function ITTable<T extends Record<string, unknown>>({ columns, data, containerClassName, variant, size, itemsPerPageOptions, defaultItemsPerPage, title, renderCard, defaultView, showVerticalBorder, verticalBorderClassname, onRowClick, layout, density, autoCardBreakpoint, virtualized, virtualizedMaxHeight, rowHeight, overscan, stickyHeader, }: ITTableProps<T>): react_jsx_runtime.JSX.Element;
+declare function ITTable<T extends Record<string, unknown>>({ columns, data, containerClassName, variant, size, itemsPerPageOptions, defaultItemsPerPage, title, renderCard, defaultView, showVerticalBorder, verticalBorderClassname, onRowClick, layout, density, autoCardBreakpoint, virtualized, virtualizedMaxHeight, rowHeight, overscan, stickyHeader, showViewToggle, design, colors, containerStyle, cardClassName, cardStyle, toolbarClassName, toolbarStyle, headerClassName, headerStyle, headerCellClassName, headerCellStyle, rowClassName, rowStyle, cellClassName, cellStyle, cardsClassName, cardsStyle, footerClassName, footerStyle, }: ITTableProps<T>): react_jsx_runtime.JSX.Element;
 
 interface ITTextProps extends HTMLAttributes<HTMLElement> {
     /** The content rendered inside the element. */
@@ -4313,4 +4425,4 @@ declare const resolveCssColor: (colorStr: string, palette?: ITThemePalette, isDa
  */
 declare const getContrastTextColor: (bgColor: string, palette?: ITThemePalette, isDarkMode?: boolean) => "text-white" | "text-slate-800";
 
-export { type Column, type ColumnFilterMode, type ColumnFilterValue, type ColumnFilters, type FieldConfig, type FieldConfigV2, FileTypeEnum, ITAccordion, type ITAccordionItem, type ITAccordionProps, ITAlert, type ITAlertProps, ITAvatar, type ITAvatarProps, ITBadget, type ITBadgetProps, type ITBreadcrumbItem, ITBreadcrumbs, type ITBreadcrumbsProps, ITButton, type ITButtonProps, ITCalendar, type ITCalendarProps, ITCard, type ITCardProps, ITCheckbox, type ITCheckboxProps, ITChip, ITChipInput, type ITChipInputProps, type ITChipProps, ITConfirmDialog, type ITConfirmDialogProps, ITDataTable, type ITDataTableFetchParams, type ITDataTableProps, type ITDataTableResponse, ITDatePicker, type ITDatePickerProps, ITDialog, type ITDialogProps, ITDivider, type ITDividerProps, ITDrawer, type ITDrawerProps, ITDropdownMenu, type ITDropdownMenuItem, type ITDropdownMenuProps, ITDropfile, ITEmptyState, type ITEmptyStateProps, ITField, type ITFieldProps, ITFlex, type ITFlexProps, ITFormBuilder, type ITFormBuilderProps, ITFormHeader, type ITFormHeaderProps, ITGrid, type ITGridProps, ITImage, type ITImageProps, ITInput, ITInputNumber, type ITInputNumberProps, type ITInputProps, ITLayout, type ITLayoutProps, ITLineBarChart, type ITLineBarChartProps, type ITLineBarDatum, ITLoader, type LoaderProps as ITLoaderProps, ITMaskedInput, type ITMaskedInputProps, ITMultiSelect, type ITMultiSelectOption, type ITMultiSelectProps, ITNavbar, type ITNavbarProps, type ITNavigationItem, type ITNavigationSubItem, type ITNavigationSubItemEntry, type ITNavigationSubItemGroup, ITPage, ITPageHeader, type ITPageHeaderProps, type ITPageProps, ITPagination, type ITPaginationProps, ITPopover, type ITPopoverProps, ITProgress, type ITProgressProps, ITRadioGroup, type ITRadioGroupProps, type ITRadioOption, ITSearchSelect, type ITSearchSelectProps, ITSearchTable, type ITSearchTableProps, ITSegmentedControl, type ITSegmentedControlProps, ITSelect, type ITSelectProps, ITSidebar, type ITSidebarBrand, type ITSidebarNotification, type ITSidebarProps, ITSkeleton, type ITSkeletonProps, ITSlideToggle, type ITSlideToggleProps, ITSlider, type ITSliderProps, ITStack, type ITStackProps, ITStatCard, type ITStatCardProps, ITStepper, type ITStepperProps, type ITTabItem, ITTable, type ITTableProps, ITTabs, type ITTabsProps, ITText, type ITTextProps, ITTextarea, type ITTextareaProps, type ITThemeAppearance, type ITThemeConfig, type ITThemePalette, ITThemeProvider, type ITThemeProviderProps, ITTimePicker, type ITTimePickerProps, ITToast, type ITToastProps, ITTripleFilter, type ITTripleFilterOption, type ITTripleFilterProps, ITWysiwyg, type ITWysiwygProps, type TableDensity, UploadStatus, type UseTableStateOptions, type UseTableStateResult, createValidationSchema, getContrastTextColor, isLightColor, resolveCssColor, useClickOutside, useDebouncedSearch, useEditableRow, useFloatingPanel, useITFlatAppearance, useITTheme, useITThemeSafe, useTableState };
+export { type Column, type ColumnFilterMode, type ColumnFilterValue, type ColumnFilters, type FieldConfig, type FieldConfigV2, FileTypeEnum, ITAccordion, type ITAccordionItem, type ITAccordionProps, ITAlert, type ITAlertProps, ITAvatar, type ITAvatarProps, ITBadget, type ITBadgetProps, type ITBreadcrumbItem, ITBreadcrumbs, type ITBreadcrumbsProps, ITButton, type ITButtonProps, ITCalendar, type ITCalendarProps, ITCard, type ITCardProps, ITCheckbox, type ITCheckboxProps, ITChip, ITChipInput, type ITChipInputProps, type ITChipProps, ITConfirmDialog, type ITConfirmDialogProps, ITDataTable, type ITDataTableFetchParams, type ITDataTableProps, type ITDataTableResponse, ITDatePicker, type ITDatePickerProps, ITDialog, type ITDialogProps, ITDivider, type ITDividerProps, ITDrawer, type ITDrawerProps, ITDropdownMenu, type ITDropdownMenuItem, type ITDropdownMenuProps, ITDropfile, ITEmptyState, type ITEmptyStateProps, ITField, type ITFieldProps, ITFlex, type ITFlexProps, ITFormBuilder, type ITFormBuilderProps, ITFormHeader, type ITFormHeaderProps, ITGrid, type ITGridProps, ITImage, type ITImageProps, ITInput, ITInputNumber, type ITInputNumberProps, type ITInputProps, ITLayout, type ITLayoutProps, ITLineBarChart, type ITLineBarChartProps, type ITLineBarDatum, ITLoader, type LoaderProps as ITLoaderProps, ITMaskedInput, type ITMaskedInputProps, ITMultiSelect, type ITMultiSelectOption, type ITMultiSelectProps, ITNavbar, type ITNavbarProps, type ITNavigationItem, type ITNavigationSubItem, type ITNavigationSubItemEntry, type ITNavigationSubItemGroup, ITPage, ITPageHeader, type ITPageHeaderProps, type ITPageProps, ITPagination, type ITPaginationProps, ITPopover, type ITPopoverProps, ITProgress, type ITProgressProps, ITRadioGroup, type ITRadioGroupProps, type ITRadioOption, ITSearchSelect, type ITSearchSelectProps, ITSearchTable, type ITSearchTableProps, ITSegmentedControl, type ITSegmentedControlProps, ITSelect, type ITSelectProps, ITSidebar, type ITSidebarBrand, type ITSidebarNotification, type ITSidebarProps, ITSkeleton, type ITSkeletonProps, ITSlideToggle, type ITSlideToggleProps, ITSlider, type ITSliderProps, ITStack, type ITStackProps, ITStatCard, type ITStatCardProps, ITStepper, type ITStepperProps, type ITTabItem, ITTable, type ITTableProps, ITTabs, type ITTabsProps, ITText, type ITTextProps, ITTextarea, type ITTextareaProps, type ITThemeAppearance, type ITThemeConfig, type ITThemePalette, ITThemeProvider, type ITThemeProviderProps, ITTimePicker, type ITTimePickerProps, ITToast, type ITToastProps, ITTripleFilter, type ITTripleFilterOption, type ITTripleFilterProps, ITWysiwyg, type ITWysiwygProps, type TableColors, type TableDensity, type TableDesign, type TableDesignProps, type TableDesignSlot, UploadStatus, type UseTableStateOptions, type UseTableStateResult, createValidationSchema, getContrastTextColor, isLightColor, resolveCssColor, useClickOutside, useDebouncedSearch, useEditableRow, useFloatingPanel, useITFlatAppearance, useITTheme, useITThemeSafe, useTableState };

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as Yup from 'yup';
 import * as React$1 from 'react';
-import React__default, { RefObject, CSSProperties, ReactNode, ElementType, ChangeEvent, FocusEvent, KeyboardEvent, HTMLAttributes } from 'react';
+import React__default, { CSSProperties, RefObject, ReactNode, ElementType, ChangeEvent, FocusEvent, KeyboardEvent, HTMLAttributes } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
 declare const useClickOutside: (ref: React.RefObject<HTMLElement>, callback: () => void) => void;
@@ -19,6 +19,110 @@ interface UseDebouncedSearchResult {
 declare function useDebouncedSearch({ initialValue, debounceMs, onSearch, }: UseDebouncedSearchOptions): UseDebouncedSearchResult;
 
 type TableVariants = "default" | "striped" | "bordered";
+/**
+ * A single, optional style slot for one region of a table. Both fields are
+ * merged *after* the component's built-in values.
+ */
+interface TableDesignSlot {
+    /**
+     * Extra CSS classes merged after the built-in ones. Note that Tailwind
+     * resolves conflicts by utility order (not class order), so use inline
+     * `style` (or `!` modifiers) when a value must always win.
+     */
+    className?: string;
+    /** Inline CSS merged after the built-in values; wins over classes unless the global theme forces a value with `!important`. */
+    style?: CSSProperties;
+}
+/**
+ * Per-instance visual overrides for a table. Every region is optional and, when
+ * present, is applied on top of the built-in styles. The global
+ * `ITThemeProvider` colors (`--color-table-*`) still apply underneath, so use
+ * `TableColors` for this-instance color changes instead of `style`.
+ */
+interface TableDesign {
+    /** Outermost wrapper (`space-y-4 w-full`). Prefer `containerClassName` for width/spacing. */
+    container?: TableDesignSlot;
+    /** The rounded card surface that wraps the toolbar, table and footer (border, radius, shadow, background). */
+    card?: TableDesignSlot;
+    /** Toolbar strip holding the title and/or the Table|Cards toggle. */
+    toolbar?: TableDesignSlot;
+    /** The `<thead>` row that carries the column titles. */
+    header?: TableDesignSlot;
+    /** Every `<th>` header cell. */
+    headerCell?: TableDesignSlot;
+    /** Every body `<tr>`. */
+    row?: TableDesignSlot;
+    /** Every body `<td>`. */
+    cell?: TableDesignSlot;
+    /** Scroll wrapper of the cards view (the responsive card list). */
+    cards?: TableDesignSlot;
+    /** Pagination footer strip. */
+    footer?: TableDesignSlot;
+}
+/**
+ * Per-instance color overrides. They are written as local `--color-table-*`
+ * variables on the table wrapper, so they beat the global theme for this
+ * instance only, without touching `ITThemeProvider`.
+ */
+interface TableColors {
+    /** Header row background. Overrides the theme's `table.headerBg` for this instance. */
+    headerBg?: string;
+    /** Header text color. Overrides the theme's `table.headerText` for this instance. */
+    headerText?: string;
+    /** Body row background. Overrides the theme's `table.rowBg` for this instance. */
+    rowBg?: string;
+    /** Body text color. Overrides the theme's `table.rowText` for this instance. */
+    rowText?: string;
+    /** Body row hover background. Overrides the theme's `table.rowHover` for this instance. */
+    rowHover?: string;
+}
+/**
+ * Shared design props for ITTable and ITDataTable. `design` exposes every
+ * region as an object; the flat `*ClassName` / `*Style` shortcuts are merged
+ * after it, so the flat prop wins when both are provided.
+ */
+interface TableDesignProps {
+    /** Whether to render the Table|Cards view switcher in the toolbar. Hiding it still honors `defaultView` and `autoCardBreakpoint`. @default true */
+    showViewToggle?: boolean;
+    /** Per-region visual overrides (classes + inline styles). */
+    design?: TableDesign;
+    /** Per-instance color overrides for header and rows, beating the global theme. */
+    colors?: TableColors;
+    /** Inline styles for the outermost wrapper. */
+    containerStyle?: CSSProperties;
+    /** Extra classes for the card surface (the rounded container). */
+    cardClassName?: string;
+    /** Inline styles for the card surface. */
+    cardStyle?: CSSProperties;
+    /** Extra classes for the toolbar strip (title + view toggle). */
+    toolbarClassName?: string;
+    /** Inline styles for the toolbar strip. */
+    toolbarStyle?: CSSProperties;
+    /** Extra classes for the header row. */
+    headerClassName?: string;
+    /** Inline styles for the header row. */
+    headerStyle?: CSSProperties;
+    /** Extra classes for every header cell. */
+    headerCellClassName?: string;
+    /** Inline styles for every header cell. */
+    headerCellStyle?: CSSProperties;
+    /** Extra classes for every body row. */
+    rowClassName?: string;
+    /** Inline styles for every body row. */
+    rowStyle?: CSSProperties;
+    /** Extra classes for every body cell. */
+    cellClassName?: string;
+    /** Inline styles for every body cell. */
+    cellStyle?: CSSProperties;
+    /** Extra classes for the cards-view scroll wrapper. */
+    cardsClassName?: string;
+    /** Inline styles for the cards-view scroll wrapper. */
+    cardsStyle?: CSSProperties;
+    /** Extra classes for the pagination footer strip. */
+    footerClassName?: string;
+    /** Inline styles for the pagination footer strip. */
+    footerStyle?: CSSProperties;
+}
 /**
  * Value stored for a single column filter.
  *
@@ -1159,6 +1263,14 @@ interface Column<T = any> {
     label: string;
     /** Additional CSS classes applied to both the header (`<th>`) and body (`<td>`) cells of this column. */
     className?: string;
+    /** Extra CSS classes applied only to this column's header (`<th>`), merged after `className`. */
+    headerClassName?: string;
+    /** Inline styles applied only to this column's header (`<th>`), merged after the table-level header-cell style. */
+    headerStyle?: React.CSSProperties;
+    /** Extra CSS classes applied only to this column's body cells (`<td>`), merged after `className`. */
+    cellClassName?: string;
+    /** Inline styles applied only to this column's body cells (`<td>`), merged after the table-level cell style. */
+    cellStyle?: React.CSSProperties;
     /** Formats numeric values as Mexican pesos (MXN) via `Intl`-based currency formatting. Only applies when `type` is `"number"`. @default false */
     currencyMX?: boolean;
     /** Custom action buttons/content rendered for a `"actions"`-type column. Receives the full row object. */
@@ -1236,7 +1348,7 @@ interface Column<T = any> {
      */
     pinned?: "left" | "right";
 }
-interface ITTableProps<T> {
+interface ITTableProps<T> extends TableDesignProps {
     /** Column definitions: key, label, type, sortable behavior, filters, and custom rendering. */
     columns: Column<T>[];
     /** Additional CSS classes for the outermost container. */
@@ -1352,7 +1464,7 @@ interface ITDataTableResponse<T> {
     /** Total row count across all pages (used to compute the paginator's total pages). */
     total: number;
 }
-interface ITDataTableProps<T extends Record<string, unknown>> {
+interface ITDataTableProps<T extends Record<string, unknown>> extends TableDesignProps {
     /**
      * The column configuration array matching ITTable but adapted for Server-Side processing
      */
@@ -1492,7 +1604,7 @@ interface ITDataTableProps<T extends Record<string, unknown>> {
  * />
  * ```
  */
-declare function ITDataTable<T extends Record<string, unknown>>({ columns, fetchData, debounceMs, externalFilters, loadingIndicator, fetchOnMount, reloadTrigger, containerClassName, className, variant, size, itemsPerPageOptions, defaultItemsPerPage, title, renderCard, defaultView, showVerticalBorder, verticalBorderClassname, onRowClick, layout, density, autoCardBreakpoint, virtualized, virtualizedMaxHeight, rowHeight, overscan, stickyHeader, }: ITDataTableProps<T>): react_jsx_runtime.JSX.Element;
+declare function ITDataTable<T extends Record<string, unknown>>({ columns, fetchData, debounceMs, externalFilters, loadingIndicator, fetchOnMount, reloadTrigger, containerClassName, className, variant, size, itemsPerPageOptions, defaultItemsPerPage, title, renderCard, defaultView, showVerticalBorder, verticalBorderClassname, onRowClick, layout, density, autoCardBreakpoint, virtualized, virtualizedMaxHeight, rowHeight, overscan, stickyHeader, showViewToggle, design, colors, containerStyle, cardClassName, cardStyle, toolbarClassName, toolbarStyle, headerClassName, headerStyle, headerCellClassName, headerCellStyle, rowClassName, rowStyle, cellClassName, cellStyle, cardsClassName, cardsStyle, footerClassName, footerStyle, }: ITDataTableProps<T>): react_jsx_runtime.JSX.Element;
 
 interface ITDatePickerProps {
     /** Unique name attribute for the underlying input element. */
@@ -3424,7 +3536,7 @@ declare function ITLineBarChart({ data, ariaLabel, lineLabel, barLabel, lineColo
  *   size="sm"
  * />
  */
-declare function ITTable<T extends Record<string, unknown>>({ columns, data, containerClassName, variant, size, itemsPerPageOptions, defaultItemsPerPage, title, renderCard, defaultView, showVerticalBorder, verticalBorderClassname, onRowClick, layout, density, autoCardBreakpoint, virtualized, virtualizedMaxHeight, rowHeight, overscan, stickyHeader, }: ITTableProps<T>): react_jsx_runtime.JSX.Element;
+declare function ITTable<T extends Record<string, unknown>>({ columns, data, containerClassName, variant, size, itemsPerPageOptions, defaultItemsPerPage, title, renderCard, defaultView, showVerticalBorder, verticalBorderClassname, onRowClick, layout, density, autoCardBreakpoint, virtualized, virtualizedMaxHeight, rowHeight, overscan, stickyHeader, showViewToggle, design, colors, containerStyle, cardClassName, cardStyle, toolbarClassName, toolbarStyle, headerClassName, headerStyle, headerCellClassName, headerCellStyle, rowClassName, rowStyle, cellClassName, cellStyle, cardsClassName, cardsStyle, footerClassName, footerStyle, }: ITTableProps<T>): react_jsx_runtime.JSX.Element;
 
 interface ITTextProps extends HTMLAttributes<HTMLElement> {
     /** The content rendered inside the element. */
@@ -4313,4 +4425,4 @@ declare const resolveCssColor: (colorStr: string, palette?: ITThemePalette, isDa
  */
 declare const getContrastTextColor: (bgColor: string, palette?: ITThemePalette, isDarkMode?: boolean) => "text-white" | "text-slate-800";
 
-export { type Column, type ColumnFilterMode, type ColumnFilterValue, type ColumnFilters, type FieldConfig, type FieldConfigV2, FileTypeEnum, ITAccordion, type ITAccordionItem, type ITAccordionProps, ITAlert, type ITAlertProps, ITAvatar, type ITAvatarProps, ITBadget, type ITBadgetProps, type ITBreadcrumbItem, ITBreadcrumbs, type ITBreadcrumbsProps, ITButton, type ITButtonProps, ITCalendar, type ITCalendarProps, ITCard, type ITCardProps, ITCheckbox, type ITCheckboxProps, ITChip, ITChipInput, type ITChipInputProps, type ITChipProps, ITConfirmDialog, type ITConfirmDialogProps, ITDataTable, type ITDataTableFetchParams, type ITDataTableProps, type ITDataTableResponse, ITDatePicker, type ITDatePickerProps, ITDialog, type ITDialogProps, ITDivider, type ITDividerProps, ITDrawer, type ITDrawerProps, ITDropdownMenu, type ITDropdownMenuItem, type ITDropdownMenuProps, ITDropfile, ITEmptyState, type ITEmptyStateProps, ITField, type ITFieldProps, ITFlex, type ITFlexProps, ITFormBuilder, type ITFormBuilderProps, ITFormHeader, type ITFormHeaderProps, ITGrid, type ITGridProps, ITImage, type ITImageProps, ITInput, ITInputNumber, type ITInputNumberProps, type ITInputProps, ITLayout, type ITLayoutProps, ITLineBarChart, type ITLineBarChartProps, type ITLineBarDatum, ITLoader, type LoaderProps as ITLoaderProps, ITMaskedInput, type ITMaskedInputProps, ITMultiSelect, type ITMultiSelectOption, type ITMultiSelectProps, ITNavbar, type ITNavbarProps, type ITNavigationItem, type ITNavigationSubItem, type ITNavigationSubItemEntry, type ITNavigationSubItemGroup, ITPage, ITPageHeader, type ITPageHeaderProps, type ITPageProps, ITPagination, type ITPaginationProps, ITPopover, type ITPopoverProps, ITProgress, type ITProgressProps, ITRadioGroup, type ITRadioGroupProps, type ITRadioOption, ITSearchSelect, type ITSearchSelectProps, ITSearchTable, type ITSearchTableProps, ITSegmentedControl, type ITSegmentedControlProps, ITSelect, type ITSelectProps, ITSidebar, type ITSidebarBrand, type ITSidebarNotification, type ITSidebarProps, ITSkeleton, type ITSkeletonProps, ITSlideToggle, type ITSlideToggleProps, ITSlider, type ITSliderProps, ITStack, type ITStackProps, ITStatCard, type ITStatCardProps, ITStepper, type ITStepperProps, type ITTabItem, ITTable, type ITTableProps, ITTabs, type ITTabsProps, ITText, type ITTextProps, ITTextarea, type ITTextareaProps, type ITThemeAppearance, type ITThemeConfig, type ITThemePalette, ITThemeProvider, type ITThemeProviderProps, ITTimePicker, type ITTimePickerProps, ITToast, type ITToastProps, ITTripleFilter, type ITTripleFilterOption, type ITTripleFilterProps, ITWysiwyg, type ITWysiwygProps, type TableDensity, UploadStatus, type UseTableStateOptions, type UseTableStateResult, createValidationSchema, getContrastTextColor, isLightColor, resolveCssColor, useClickOutside, useDebouncedSearch, useEditableRow, useFloatingPanel, useITFlatAppearance, useITTheme, useITThemeSafe, useTableState };
+export { type Column, type ColumnFilterMode, type ColumnFilterValue, type ColumnFilters, type FieldConfig, type FieldConfigV2, FileTypeEnum, ITAccordion, type ITAccordionItem, type ITAccordionProps, ITAlert, type ITAlertProps, ITAvatar, type ITAvatarProps, ITBadget, type ITBadgetProps, type ITBreadcrumbItem, ITBreadcrumbs, type ITBreadcrumbsProps, ITButton, type ITButtonProps, ITCalendar, type ITCalendarProps, ITCard, type ITCardProps, ITCheckbox, type ITCheckboxProps, ITChip, ITChipInput, type ITChipInputProps, type ITChipProps, ITConfirmDialog, type ITConfirmDialogProps, ITDataTable, type ITDataTableFetchParams, type ITDataTableProps, type ITDataTableResponse, ITDatePicker, type ITDatePickerProps, ITDialog, type ITDialogProps, ITDivider, type ITDividerProps, ITDrawer, type ITDrawerProps, ITDropdownMenu, type ITDropdownMenuItem, type ITDropdownMenuProps, ITDropfile, ITEmptyState, type ITEmptyStateProps, ITField, type ITFieldProps, ITFlex, type ITFlexProps, ITFormBuilder, type ITFormBuilderProps, ITFormHeader, type ITFormHeaderProps, ITGrid, type ITGridProps, ITImage, type ITImageProps, ITInput, ITInputNumber, type ITInputNumberProps, type ITInputProps, ITLayout, type ITLayoutProps, ITLineBarChart, type ITLineBarChartProps, type ITLineBarDatum, ITLoader, type LoaderProps as ITLoaderProps, ITMaskedInput, type ITMaskedInputProps, ITMultiSelect, type ITMultiSelectOption, type ITMultiSelectProps, ITNavbar, type ITNavbarProps, type ITNavigationItem, type ITNavigationSubItem, type ITNavigationSubItemEntry, type ITNavigationSubItemGroup, ITPage, ITPageHeader, type ITPageHeaderProps, type ITPageProps, ITPagination, type ITPaginationProps, ITPopover, type ITPopoverProps, ITProgress, type ITProgressProps, ITRadioGroup, type ITRadioGroupProps, type ITRadioOption, ITSearchSelect, type ITSearchSelectProps, ITSearchTable, type ITSearchTableProps, ITSegmentedControl, type ITSegmentedControlProps, ITSelect, type ITSelectProps, ITSidebar, type ITSidebarBrand, type ITSidebarNotification, type ITSidebarProps, ITSkeleton, type ITSkeletonProps, ITSlideToggle, type ITSlideToggleProps, ITSlider, type ITSliderProps, ITStack, type ITStackProps, ITStatCard, type ITStatCardProps, ITStepper, type ITStepperProps, type ITTabItem, ITTable, type ITTableProps, ITTabs, type ITTabsProps, ITText, type ITTextProps, ITTextarea, type ITTextareaProps, type ITThemeAppearance, type ITThemeConfig, type ITThemePalette, ITThemeProvider, type ITThemeProviderProps, ITTimePicker, type ITTimePickerProps, ITToast, type ITToastProps, ITTripleFilter, type ITTripleFilterOption, type ITTripleFilterProps, ITWysiwyg, type ITWysiwygProps, type TableColors, type TableDensity, type TableDesign, type TableDesignProps, type TableDesignSlot, UploadStatus, type UseTableStateOptions, type UseTableStateResult, createValidationSchema, getContrastTextColor, isLightColor, resolveCssColor, useClickOutside, useDebouncedSearch, useEditableRow, useFloatingPanel, useITFlatAppearance, useITTheme, useITThemeSafe, useTableState };