@servicetitan/anvil2 2.0.0 → 2.0.2

package/dist/beta/components/Table/DataTable/internal/cells/DataTableBodyMutableCell.d.ts

@@ -0,0 +1,33 @@
+import { DataTableBodyCellProps as BaseDataTableBodyCellProps } from '../../../base/cells/TableBodyCell';
+import { Cell } from '@tanstack/react-table';
+import { CellPosition } from '../../../internal/types';
+/**
+ * Props for the DataTableBodyMutableCell component
+ */
+export type DataTableBodyMutableCellProps<T> = Omit<BaseDataTableBodyCellProps, "onChange"> & {
+    /**
+     * The position of the cell in the table
+     */
+    cellPosition: CellPosition;
+    /**
+     * The TanStack table cell instance
+     */
+    cell: Cell<T, unknown>;
+    /**
+     * Whether the cell is currently hovered
+     */
+    isHovered: boolean;
+};
+/**
+ * Renders a mutable (editable) body cell in a DataTable. This component handles keyboard navigation
+ * and delegates to the appropriate editable cell component (text, select, or multiselect) based on
+ * the column's editMode configuration.
+ *
+ * @param props - The props for the DataTableBodyMutableCell component
+ * @param props.cell - The TanStack table cell instance
+ * @param props.cellPosition - The position of the cell in the table
+ * @param props.children - The content to render in the cell
+ * @param props.isHovered - Whether the cell is currently hovered
+ * @returns The rendered editable cell component or null if no editMode is configured
+ */
+export declare function DataTableBodyMutableCell<T>(props: DataTableBodyMutableCellProps<T>): import("react/jsx-runtime").JSX.Element | null;

package/dist/beta/components/Table/DataTable/internal/cells/DataTableFooterCell.d.ts

@@ -14,5 +14,7 @@ export type DataTableFooterCellProps = BaseDataTableFooterCellProps & {
  * @param props - The props for the DataTableFooterCell component
  * @param props.cellPosition - The cell position of the cell
  * @param props.children - The children of the DataTableFooterCell component
+ * @param props.className - The class name of the DataTableFooterCell component
+ * @param props.tabIndex - The tab index of the cell
  */
 export declare function DataTableFooterCell(props: DataTableFooterCellProps): import("react/jsx-runtime").JSX.Element;

package/dist/beta/components/Table/DataTable/internal/cells/DataTableHeaderCell.d.ts

@@ -18,6 +18,7 @@ export type DataTableHeaderCellProps<T> = BaseDataTableHeaderCellProps & {
  * @param props.cellPosition - The cell position of the cell
  * @param props.children - The children of the DataTableHeaderCell component
  * @param props.header - The header of the DataTableHeaderCell component
+ * @param props.isFocused - Whether the cell is focused
  */
 declare function DataTableHeaderCellInner<T>(props: DataTableHeaderCellProps<T>, forwardedRef: Ref<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
 /**

package/dist/beta/components/Table/DataTable/internal/constants.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Internal column ID for the primary row action column.
+ * This column typically contains expand buttons, but may also contain
+ * checkboxes for nested rows when selection is enabled.
+ */
+export declare const INTERNAL_ROW_ACTION_PRIMARY_COLUMN_ID = "a2-table-internal-row-action-primary";
+/**
+ * Internal column ID for the secondary row action column.
+ * This column contains checkboxes for row selection when enabled.
+ * For nested rows, this column renders nothing (selection is handled
+ * in the primary action column instead).
+ */
+export declare const INTERNAL_ROW_ACTION_SECONDARY_COLUMN_ID = "a2-table-internal-row-action-secondary";

package/dist/beta/components/Table/DataTable/internal/context/focus/DTFocusContext.d.ts

@@ -0,0 +1,57 @@
+import { CellPosition } from '../../../../internal/types';
+export type DTFocusState = {
+    /**
+     * The currently focused cell or null if no cell is focused
+     */
+    focusedCell: CellPosition | null;
+    /**
+     * The last focused cell when the table was blurred or { rowIndex: 0, columnIndex: 0 } if never focused
+     */
+    focusRestorePoint: CellPosition;
+    /**
+     * Whether the focus has been disrupted by a sub component
+     */
+    hasFocusBeenDisrupted: boolean;
+};
+export type DTFocusStateContextValue = {
+    getFocusedCell: () => CellPosition | null;
+};
+export type DTFocusCellAction = {
+    type: "FOCUS_CELL";
+    payload: {
+        cellPosition: CellPosition;
+    };
+};
+export type DTFocusTableAction = {
+    type: "FOCUS_TABLE";
+};
+export type DTFocusMoveAction = {
+    type: "MOVE_FOCUS";
+    payload: {
+        direction: "up" | "down" | "left" | "right";
+    };
+};
+export type DTFocusJumpAction = {
+    type: "JUMP_FOCUS";
+    payload: {
+        direction: "up" | "down" | "left" | "right";
+    };
+};
+export type DTFocusCellManuallyAction = {
+    type: "FOCUS_CELL_MANUALLY";
+    payload: {
+        cellPosition: CellPosition;
+    };
+};
+export type DTBlurAction = {
+    type: "BLUR";
+};
+export type DTFocusSubComponentAction = {
+    type: "FOCUS_SUB_COMPONENT";
+};
+export type DTFocusSubComponentBlurAction = {
+    type: "BLUR_SUB_COMPONENT";
+};
+export type DTFocusAction = DTFocusCellAction | DTFocusTableAction | DTFocusMoveAction | DTFocusJumpAction | DTBlurAction | DTFocusSubComponentAction | DTFocusSubComponentBlurAction | DTFocusCellManuallyAction;
+export declare const DTFocusStateContext: import('react').Context<DTFocusStateContextValue>;
+export declare const DTFocusDispatchContext: import('react').Context<import('react').Dispatch<DTFocusAction>>;

package/dist/beta/components/Table/DataTable/internal/context/focus/DTFocusProvider.d.ts

@@ -0,0 +1,9 @@
+export interface DTFocusProviderProps {
+    children: React.ReactNode;
+    rowCount: number;
+    columnCount: number;
+    tableRef: React.RefObject<HTMLDivElement>;
+    leftPinnedWidth: number;
+    rightPinnedWidth: number;
+}
+export declare function DTFocusProvider({ children, rowCount, columnCount, tableRef, leftPinnedWidth, rightPinnedWidth, }: DTFocusProviderProps): import("react/jsx-runtime").JSX.Element;

package/dist/beta/components/Table/DataTable/internal/context/focus/useDTFocusDispatchContext.d.ts

@@ -0,0 +1,11 @@
+import { CellPosition } from '../../../../internal/types';
+export declare function useDTFocusDispatchContext(): {
+    focusTableGenerally: () => void;
+    moveFocusToCell: (cellPosition: CellPosition) => void;
+    moveFocus: (direction: "up" | "down" | "left" | "right") => void;
+    jumpFocus: (direction: "up" | "down" | "left" | "right") => void;
+    blur: () => void;
+    focusSubComponent: () => void;
+    blurSubComponent: () => void;
+    dispatch: import('react').Dispatch<import('./DTFocusContext').DTFocusAction>;
+};

package/dist/beta/components/Table/DataTable/internal/context/focus/useDTFocusStateContext.d.ts

@@ -0,0 +1 @@
+export declare function useDTFocusStateContext(): import('./DTFocusContext').DTFocusStateContextValue;

package/dist/beta/components/Table/DataTable/internal/context/hover/DTHoverContext.d.ts

@@ -0,0 +1,31 @@
+export type DTHoverState = {
+    hoveredColumnId: string | null;
+    resizingColumnId: string | null;
+};
+export type DTHoverStartAction = {
+    type: "HOVER_START";
+    payload: {
+        columnId: string;
+    };
+};
+export type DTHoverEndAction = {
+    type: "HOVER_END";
+    payload: {
+        columnId: string;
+    };
+};
+export type DTResizeStartAction = {
+    type: "RESIZE_START";
+    payload: {
+        columnId: string;
+    };
+};
+export type DTResizeEndAction = {
+    type: "RESIZE_END";
+    payload: {
+        columnId: string;
+    };
+};
+export type DTHoverAction = DTHoverStartAction | DTHoverEndAction | DTResizeStartAction | DTResizeEndAction;
+export declare const DTHoverStateContext: import('react').Context<DTHoverState>;
+export declare const DTHoverDispatchContext: import('react').Context<import('react').Dispatch<DTHoverAction>>;

package/dist/beta/components/Table/DataTable/internal/context/hover/DTHoverProvider.d.ts

@@ -0,0 +1,3 @@
+export declare function DTHoverProvider({ children }: {
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/beta/components/Table/DataTable/internal/context/hover/useDTHoverDispatchContext.d.ts

@@ -0,0 +1 @@
+export declare function useDTHoverDispatchContext(): import('react').Dispatch<import('./DTHoverContext').DTHoverAction>;

package/dist/beta/components/Table/DataTable/internal/context/hover/useDTHoverStateContext.d.ts

@@ -0,0 +1,4 @@
+export declare function useDTHoverStateContext(): {
+    getIsHovered: (columnId: string) => boolean;
+    hoveredColumnId: string | null;
+};

package/dist/beta/components/Table/DataTable/internal/editable-cells/DataTableEditableMultiselectCell.d.ts

@@ -1,26 +1,22 @@
-import { DataTableEditableCellProps } from './types';
+import { EditableCellImperativeHandle, BaseEditableCellProps } from './types';
+export type DataTableEditableMultiselectCellProps<T> = BaseEditableCellProps<T>;
 /**
- * Props for the DataTableEditableMultiselectCell component
- * @extends DataTableEditableCellProps<string[]>
- */
-export type DataTableEditableMultiselectCellProps = DataTableEditableCellProps<string[]> & {
-    /**
-     * The options available for selection
-     */
-    options: {
-        value: string;
-        label: string;
-    }[];
-};
-/**
- * Editable multiselect cell for data tables
+ * Renders an editable multiselect cell in a DataTable. This component provides a popover with a
+ * searchable list that appears when the cell is activated, allowing users to select multiple values
+ * from a list of options. Supports keyboard navigation, search filtering, and commit/cancel operations.
+ *
  * @param props - The props for the DataTableEditableMultiselectCell component
- * @param props.cellProps - The props for the DataTableEditableMultiselectCell component
- * @param props.children - The children of the DataTableEditableMultiselectCell component
- * @param props.rowId - The row id of the DataTableEditableMultiselectCell component
- * @param props.onChange - Called when the cell value is saved (on blur or enter/F2 key pressed)
- * @param props.cellPosition - The cell position of the DataTableEditableMultiselectCell component
- * @param props.value - The value of the DataTableEditableMultiselectCell component
- * @param props.options - The options available for selection
+ * @param props.cell - The TanStack table cell instance
+ * @param props.cellProps - Props for styling and event handling of the cell container
+ * @param props.cellPosition - The position of the cell in the table
+ * @param props.children - The content to display when not editing
+ * @param props.isHovered - Whether the cell is currently hovered
+ * @param ref - Ref to the imperative handle for programmatic control
+ * @returns The rendered editable multiselect cell component
  */
-export declare const DataTableEditableMultiselectCell: ({ cellProps, children, rowId, onChange, cellPosition, value, options, }: DataTableEditableMultiselectCellProps) => import("react/jsx-runtime").JSX.Element;
+export declare function DataTableEditableMultiselectCellInner<T>(props: DataTableEditableMultiselectCellProps<T>, ref: React.Ref<EditableCellImperativeHandle>): import("react/jsx-runtime").JSX.Element;
+export declare const DataTableEditableMultiselectCell: (<T>(props: DataTableEditableMultiselectCellProps<T> & {
+    ref?: React.Ref<EditableCellImperativeHandle>;
+}) => React.ReactElement) & {
+    displayName: string;
+};

package/dist/beta/components/Table/DataTable/internal/editable-cells/DataTableEditableSelectCell.d.ts

@@ -1,26 +1,7 @@
-import { DataTableEditableCellProps } from './types';
-/**
- * Props for the DataTableEditableSelectCell component
- * @extends DataTableEditableCellProps<string>
- */
-export type DataTableEditableSelectCellProps = DataTableEditableCellProps<string> & {
-    /**
-     * The options available for selection
-     */
-    options: {
-        value: string;
-        label: string;
-    }[];
+import { EditableCellImperativeHandle, BaseEditableCellProps } from './types';
+export type DataTableEditableSelectCellProps<T> = BaseEditableCellProps<T>;
+export declare const DataTableEditableSelectCell: (<T>(props: DataTableEditableSelectCellProps<T> & {
+    ref?: React.Ref<EditableCellImperativeHandle>;
+}) => React.ReactElement) & {
+    displayName: string;
 };
-/**
- * Editable select cell for data tables
- * @param props - The props for the DataTableEditableSelectCell component
- * @param props.cellProps - The props for the DataTableEditableSelectCell component
- * @param props.children - The children of the DataTableEditableSelectCell component
- * @param props.rowId - The row id of the DataTableEditableSelectCell component
- * @param props.onChange - Called when the cell value is saved (on blur or enter/F2 key pressed)
- * @param props.cellPosition - The cell position of the DataTableEditableSelectCell component
- * @param props.value - The value of the DataTableEditableSelectCell component
- * @param props.options - The options available for selection
- */
-export declare const DataTableEditableSelectCell: ({ cellProps, children, rowId, onChange, cellPosition, value, options, }: DataTableEditableSelectCellProps) => import("react/jsx-runtime").JSX.Element;

package/dist/beta/components/Table/DataTable/internal/editable-cells/DataTableEditableTextCell.d.ts

@@ -1,17 +1,7 @@
-import { DataTableEditableCellProps } from './types';
-/**
- * Props for the DataTableEditableTextCell component
- * @extends DataTableEditableCellProps<string>
- */
-export type DataTableEditableTextCellProps = DataTableEditableCellProps<string>;
-/**
- * Editable text cell for data tables
- * @param props - The props for the DataTableEditableTextCell component
- * @param props.cellProps - The props for the DataTableEditableTextCell component
- * @param props.children - The children of the DataTableEditableTextCell component
- * @param props.rowId - The row id of the DataTableEditableTextCell component
- * @param props.onChange - Called when the cell value is saved (on blur or enter/F2 key pressed)
- * @param props.cellPosition - The cell position of the DataTableEditableTextCell component
- * @param props.value - The value of the DataTableEditableTextCell component
- */
-export declare const DataTableEditableTextCell: ({ cellProps, children, rowId, onChange, cellPosition, value, }: DataTableEditableTextCellProps) => import("react/jsx-runtime").JSX.Element;
+import { EditableCellImperativeHandle, BaseEditableCellProps } from './types';
+export type DataTableEditableTextCellProps<T> = BaseEditableCellProps<T>;
+export declare const DataTableEditableTextCell: (<T>(props: DataTableEditableTextCellProps<T> & {
+    ref?: React.Ref<EditableCellImperativeHandle>;
+}) => React.ReactElement) & {
+    displayName: string;
+};

package/dist/beta/components/Table/DataTable/internal/editable-cells/types.d.ts

@@ -1,50 +1,42 @@
-import { Ref } from 'react';
-import { TableBodyCellProps } from '../../../base/cells/TableBodyCell';
-import { CellPosition } from '../../../internal/focus-management/types';
+import { DataTableBodyCellProps } from '../../../base/cells/TableBodyCell';
+import { CellPosition } from '../../../internal/types';
+import { Cell } from '@tanstack/react-table';
 /**
- * Props for the useEditCell hook
- * @extends Pick<UseEditCellProps<T>, "onChange" | "cellPosition" | "rowId">
+ * Imperative handle for editable cell components, allowing programmatic control
+ * of editing state and focus management
  */
-export type UseEditCellProps<T> = {
+export type EditableCellImperativeHandle = {
+    invoke: () => void;
+    focus: () => void;
+};
+/**
+ * Props passed to editable cells for styling and event handling
+ * This is a subset of DataTableBodyCellProps containing only the properties
+ * that are actually used by editable cell components
+ */
+export type EditableCellCellProps = Pick<DataTableBodyCellProps, "className" | "onKeyDown" | "style">;
+/**
+ * Base props shared by all editable cell components
+ */
+export type BaseEditableCellProps<T> = {
     /**
-     * The initial value of the cell
+     * The TanStack table cell instance
      */
-    initialValue: T;
+    cell: Cell<T, unknown>;
     /**
-     * Called when the cell value is saved (on blur or enter/F2 key pressed)
+     * Props for styling and event handling of the cell container
      */
-    onChange: (value: T, rowId: string) => void;
+    cellProps: EditableCellCellProps;
     /**
-     * The cell position of the cell
+     * The position of the cell in the table
      */
     cellPosition: CellPosition;
     /**
-     * The row id of the cell
+     * The children to render in the cell
      */
-    rowId: string;
-};
-/**
- * Return type for the useEditCell hook
- * @extends Pick<UseEditCellProps<T>, "onChange" | "cellPosition" | "rowId">
- */
-export type UseEditCellReturn<T> = {
-    isEditing: boolean;
-    editValue: T;
-    updateEditValue: (editValue: T) => void;
-    saveValue: () => void;
-    cancelEdit: () => void;
-    onClick: () => void;
-    onKeyDown: (event: React.KeyboardEvent<HTMLElement>) => void;
-    onBlur: () => void;
-};
-/**
- * Common props for the editable cells in data tables
- * @extends Pick<UseEditCellProps<T>, "onChange" | "cellPosition" | "rowId">
- */
-export type DataTableEditableCellProps<T> = Pick<UseEditCellProps<T>, "onChange" | "cellPosition" | "rowId"> & {
-    cellProps: TableBodyCellProps & {
-        ref: Ref<HTMLDivElement>;
-    };
     children: React.ReactNode;
-    value: T;
+    /**
+     * Whether the cell is currently hovered
+     */
+    isHovered: boolean;
 };

package/dist/beta/components/Table/DataTable/internal/util/cellPositionHelpers.d.ts

@@ -0,0 +1,6 @@
+import { CellPosition } from '../../../internal/types';
+export declare function formatCellPositionString(cellPosition: CellPosition): string;
+/**
+ * Checks if two cell positions are equal.
+ */
+export declare function areCellPositionsEqual(pos1: CellPosition | null | undefined, pos2: CellPosition | null | undefined): boolean;

package/dist/beta/components/Table/DataTable/internal/util/cellTypeHelpers.d.ts

@@ -0,0 +1,42 @@
+import { Cell } from '@tanstack/react-table';
+/**
+ * Extracts the column ID from a cell, with proper type narrowing.
+ * Uses the stored ColumnDef from meta if available, otherwise falls back to column.id.
+ *
+ * @param cell - The TanStack table cell instance
+ * @returns The column ID as a keyof T
+ */
+export declare function getColumnId<T>(cell: Cell<T, unknown>): keyof T;
+/**
+ * Gets the cell value with proper type narrowing based on column ID.
+ * Uses the column ID to narrow the return type from `unknown` to `T[K]`.
+ *
+ * @param cell - The TanStack table cell instance
+ * @param _columnId - The column ID to use for type narrowing (unused at runtime, only for TypeScript)
+ * @returns The cell value, typed as T[K]
+ */
+export declare function getCellValue<T, K extends keyof T>(cell: Cell<T, unknown>, _columnId: K): T[K];
+/**
+ * Gets the onChange callback with proper typing based on column ID.
+ * Returns a callback that accepts T[K] instead of the union type T[keyof T].
+ *
+ * @param cell - The TanStack table cell instance
+ * @param _columnId - The column ID to use for type narrowing (unused at runtime, only for TypeScript)
+ * @returns The onChange callback, typed to accept T[K], or undefined if not configured
+ */
+export declare function getCellOnChange<T, K extends keyof T>(cell: Cell<T, unknown>, _columnId: K): ((value: T[K], rowId: string) => void) | undefined;
+/**
+ * Logs a warning when a cell value type doesn't match the expected type for its editMode.
+ *
+ * @param params - The warning parameters
+ * @param params.columnId - The column ID for the warning message
+ * @param params.editMode - The editMode of the column
+ * @param params.expectedType - The expected type description
+ * @param params.receivedType - The actual type received
+ */
+export declare function logWarningForInvalidCellValueType({ columnId, editMode, expectedType, receivedType, }: {
+    columnId: string;
+    editMode: string;
+    expectedType: string;
+    receivedType: string;
+}): void;

package/dist/beta/components/Table/{internal → DataTable/internal/util}/getTanStackColumnDef.d.ts

@@ -1,24 +1,32 @@
 import { ColumnDef as TanstackColumnDef } from '@tanstack/react-table';
-import { ColumnDef } from '../types';
+import { ColumnDef } from '../../../types';
 declare module "@tanstack/react-table" {
     interface ColumnMeta<TData, TValue> {
         editMode?: ColumnDef<TData>["editMode"];
         onChange?: ColumnDef<TData>["onChange"];
         options?: ColumnDef<TData>["options"];
+        /**
+         * The original column definition, stored for type narrowing and runtime access
+         */
+        columnDef?: ColumnDef<TData>;
     }
 }
 /**
  * Props for the getTanStackColumnDef function
- * @extends ColumnDef<T>
  */
 export type TanStackColumnDefProps<T> = {
+    /**
+     * The column definition to convert to a TanStack column definition
+     */
     columnDef: ColumnDef<T>;
 };
 /**
- * Build the column definition for TanStack useReactTable
- * This allows for customized column definitions that maintain type safety
+ * Build the column definition for TanStack useReactTable.
+ * This converts our ColumnDef<T> to TanStack's column definition format,
+ * preserving the original column definition in meta for type narrowing.
+ *
  * @param props - The props for the getTanStackColumnDef function
- * @param props.columnDef - The column definition for the TanStack useReactTable
- * @returns The column definition for the TanStack useReactTable
+ * @param props.columnDef - The column definition to convert
+ * @returns The column definition for TanStack useReactTable
  */
 export declare function getTanStackColumnDef<T>({ columnDef, }: TanStackColumnDefProps<T>): TanstackColumnDef<T, any>;

package/dist/beta/components/Table/DataTable/stories/DataTable.story-data.d.ts

@@ -12,6 +12,7 @@ export type TableStoryData = {
 };
 export declare const data: TableRow<TableStoryData>[];
 export declare const expandedRowData: TableRow<TableStoryData>[];
+export declare const deepExpandedRowData: TableRow<TableStoryData>[];
 export declare const subComponentsData: TableRow<TableStoryData>[];
 export declare const primaryColumns: import('../..').ColumnDef<TableStoryData>[];
 export declare const groupedColumns: import('../..').ColumnDef<TableStoryData>[];
@@ -19,8 +20,9 @@ export declare const columnsWithMaxWidth: import('../..').ColumnDef<TableStoryDa
 export declare const columnsWithoutFooter: import('../..').ColumnDef<TableStoryData>[];
 export type Category = "electronics" | "clothing" | "home" | "garden" | "other";
 export type EditableTableStoryData = {
-    id: string;
-    status?: Status[];
+    id?: string;
+    note?: string;
+    status?: Status;
     payment_type: "credit_card" | "cash" | "bank_transfer" | "check" | "paypal";
     categories: Category[];
 };

package/dist/beta/components/Table/DataTable/types.d.ts

@@ -8,6 +8,15 @@ export type DataTablePaginationConfig<T> = {
      * @default 25
      */
     rowsPerPage?: number;
+    /**
+     * Available options for rows per page selection
+     * @default [25, 50, 100]
+     */
+    rowsPerPageOptions?: number[];
+    /**
+     * Callback when rows per page changes
+     */
+    onRowsPerPageChange?: (rowsPerPage: number) => void;
     /**
      * Current page index (0-based)
      */
@@ -47,3 +56,15 @@ export type DataTablePaginationConfig<T> = {
      */
     refreshKey?: string | number;
 };
+/**
+ * Ref handle for DataTable component
+ * @property {function} refresh - Triggers a data refetch and resets the page index to 0. Useful for manually refreshing data after external changes (e.g., after a mutation).
+ */
+export type DataTableRef = {
+    /**
+     * Triggers a data refetch and resets the page index to 0.
+     * Useful for manually refreshing data after external changes (e.g., after a mutation).
+     * When using controlled pagination, this will call `onPageChange(0)`.
+     */
+    refresh: () => void;
+};

package/dist/beta/components/Table/base/TableContainer.d.ts

@@ -5,24 +5,13 @@ import { LayoutUtilProps } from '../../../../types';
  * @extends LayoutUtilProps
  * @extends ComponentPropsWithoutRef<"div">
  */
-export type TableContainerProps = LayoutUtilProps & ComponentPropsWithoutRef<"div"> & {
-    /**
-     * The background color of the table container
-     */
-    background?: "default" | "strong";
-};
+export type TableContainerProps = LayoutUtilProps & ComponentPropsWithoutRef<"div">;
 /**
- * Styled container for tables that includes a scroll container and a background color
+ * Styled container for tables that includes a scroll container and provides consistent background and border treatment
  * @param props - The props for the TableContainer component
  * @param props.children - The children of the TableContainer component
  * @param props.className - The class name of the TableContainer component
  * @param props.style - The style of the TableContainer component
- * @param props.background - The background color of the table container
  * @param props.ref - The ref of the TableContainer component
  */
-export declare const TableContainer: import('react').ForwardRefExoticComponent<LayoutUtilProps & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    /**
-     * The background color of the table container
-     */
-    background?: "default" | "strong";
-} & import('react').RefAttributes<HTMLDivElement>>;
+export declare const TableContainer: import('react').ForwardRefExoticComponent<LayoutUtilProps & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;