# TableProps

Source: /tuil/docs/reference/components/tables/table-props
Locale: en

TableProps component contract.



{/* Generated by tooling/docs/generate-reference.ts. */}

## Type [#type]

```ts
export interface TableProps<TData>
  extends CommonComponentProps,
    SlottedComponentProps<TableSlots> {
  readonly columns: readonly TableColumn<TData>[];
  readonly rows: readonly TData[];
  readonly getRowKey: (row: TData, index: number) => string;
  readonly height?: number;
  readonly width?: number;
  readonly focusMode?: "row" | "cell";
  readonly frozenColumns?: number;
  readonly selectedRowKeys?: readonly string[];
  readonly defaultSelectedRowKeys?: readonly string[];
  readonly onActivate?: (
    row: TData,
    column: TableColumn<TData>,
    rowIndex: number,
  ) => void | Promise<void>;
  readonly onSelectionChange?: (
    selected: readonly string[],
  ) => void | Promise<void>;
  readonly staticLimit?: number;
}
```

## Members [#members]

| Member                   | Type                                                                                                                                                                                                                                                                                                                     | Required | Description                                                                                                                                                                                                                                                                                                                                                        | Related types                                                                                                                                                                                |
| ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `columns`                | `readonly TableColumn<TData>[]`                                                                                                                                                                                                                                                                                          | Yes      | The `columns` member uses the `readonly TableColumn<TData>[]` contract.                                                                                                                                                                                                                                                                                            | —                                                                                                                                                                                            |
| `rows`                   | `readonly TData[]`                                                                                                                                                                                                                                                                                                       | Yes      | The `rows` member uses the `readonly TData[]` contract.                                                                                                                                                                                                                                                                                                            | —                                                                                                                                                                                            |
| `getRowKey`              | `(row: TData, index: number) => string`                                                                                                                                                                                                                                                                                  | Yes      | The `getRowKey` member uses the `(row: TData, index: number) => string` contract.                                                                                                                                                                                                                                                                                  | —                                                                                                                                                                                            |
| `height`                 | `number \| undefined`                                                                                                                                                                                                                                                                                                    | No       | The `height` member uses the `number \| undefined` contract.                                                                                                                                                                                                                                                                                                       | —                                                                                                                                                                                            |
| `width`                  | `number \| undefined`                                                                                                                                                                                                                                                                                                    | No       | The `width` member uses the `number \| undefined` contract.                                                                                                                                                                                                                                                                                                        | —                                                                                                                                                                                            |
| `focusMode`              | `"row" \| "cell" \| undefined`                                                                                                                                                                                                                                                                                           | No       | The `focusMode` member uses the `"row" \| "cell" \| undefined` contract.                                                                                                                                                                                                                                                                                           | —                                                                                                                                                                                            |
| `frozenColumns`          | `number \| undefined`                                                                                                                                                                                                                                                                                                    | No       | The `frozenColumns` member uses the `number \| undefined` contract.                                                                                                                                                                                                                                                                                                | —                                                                                                                                                                                            |
| `selectedRowKeys`        | `readonly string[] \| undefined`                                                                                                                                                                                                                                                                                         | No       | The `selectedRowKeys` member uses the `readonly string[] \| undefined` contract.                                                                                                                                                                                                                                                                                   | —                                                                                                                                                                                            |
| `defaultSelectedRowKeys` | `readonly string[] \| undefined`                                                                                                                                                                                                                                                                                         | No       | The `defaultSelectedRowKeys` member uses the `readonly string[] \| undefined` contract.                                                                                                                                                                                                                                                                            | —                                                                                                                                                                                            |
| `onActivate`             | `((row: TData, column: TableColumn<TData>, rowIndex: number) => void \| Promise<void>) \| undefined`                                                                                                                                                                                                                     | No       | The `onActivate` member uses the `((row: TData, column: TableColumn<TData>, rowIndex: number) => void \| Promise<void>) \| undefined` contract.                                                                                                                                                                                                                    | —                                                                                                                                                                                            |
| `onSelectionChange`      | `((selected: readonly string[]) => void \| Promise<void>) \| undefined`                                                                                                                                                                                                                                                  | No       | The `onSelectionChange` member uses the `((selected: readonly string[]) => void \| Promise<void>) \| undefined` contract.                                                                                                                                                                                                                                          | —                                                                                                                                                                                            |
| `staticLimit`            | `number \| undefined`                                                                                                                                                                                                                                                                                                    | No       | The `staticLimit` member uses the `number \| undefined` contract.                                                                                                                                                                                                                                                                                                  | —                                                                                                                                                                                            |
| `variant`                | `string \| undefined`                                                                                                                                                                                                                                                                                                    | No       | The `variant` member uses the `string \| undefined` contract.                                                                                                                                                                                                                                                                                                      | —                                                                                                                                                                                            |
| `size`                   | `"sm" \| "md" \| "lg" \| undefined`                                                                                                                                                                                                                                                                                      | No       | The `size` member uses the `"sm" \| "md" \| "lg" \| undefined` contract.                                                                                                                                                                                                                                                                                           | —                                                                                                                                                                                            |
| `unstyled`               | `boolean \| undefined`                                                                                                                                                                                                                                                                                                   | No       | The `unstyled` member uses the `boolean \| undefined` contract.                                                                                                                                                                                                                                                                                                    | —                                                                                                                                                                                            |
| `className`              | `string \| undefined`                                                                                                                                                                                                                                                                                                    | No       | The `className` member uses the `string \| undefined` contract.                                                                                                                                                                                                                                                                                                    | —                                                                                                                                                                                            |
| `layout`                 | `Partial<Omit<LayoutNodeInput, "children" \| "id" \| "semantics">> \| undefined`                                                                                                                                                                                                                                         | No       | The `layout` member uses the `Partial<Omit<LayoutNodeInput, "children" \| "id" \| "semantics">> \| undefined` contract.                                                                                                                                                                                                                                            | —                                                                                                                                                                                            |
| `id`                     | `string \| undefined`                                                                                                                                                                                                                                                                                                    | No       | The `id` member uses the `string \| undefined` contract.                                                                                                                                                                                                                                                                                                           | —                                                                                                                                                                                            |
| `testId`                 | `string \| undefined`                                                                                                                                                                                                                                                                                                    | No       | The `testId` member uses the `string \| undefined` contract.                                                                                                                                                                                                                                                                                                       | —                                                                                                                                                                                            |
| `role`                   | `SemanticRole \| undefined`                                                                                                                                                                                                                                                                                              | No       | The `role` member uses the `SemanticRole \| undefined` contract.                                                                                                                                                                                                                                                                                                   | [`SemanticRole`](/tuil/docs/reference/packages/core/api/semantic-role)                                                                                                                            |
| `label`                  | `string \| undefined`                                                                                                                                                                                                                                                                                                    | No       | The `label` member uses the `string \| undefined` contract.                                                                                                                                                                                                                                                                                                        | —                                                                                                                                                                                            |
| `description`            | `string \| undefined`                                                                                                                                                                                                                                                                                                    | No       | The `description` member uses the `string \| undefined` contract.                                                                                                                                                                                                                                                                                                  | —                                                                                                                                                                                            |
| `disabled`               | `boolean \| undefined`                                                                                                                                                                                                                                                                                                   | No       | The `disabled` member uses the `boolean \| undefined` contract.                                                                                                                                                                                                                                                                                                    | —                                                                                                                                                                                            |
| `readOnly`               | `boolean \| undefined`                                                                                                                                                                                                                                                                                                   | No       | The `readOnly` member uses the `boolean \| undefined` contract.                                                                                                                                                                                                                                                                                                    | —                                                                                                                                                                                            |
| `selected`               | `boolean \| undefined`                                                                                                                                                                                                                                                                                                   | No       | The `selected` member uses the `boolean \| undefined` contract.                                                                                                                                                                                                                                                                                                    | —                                                                                                                                                                                            |
| `checked`                | `boolean \| undefined`                                                                                                                                                                                                                                                                                                   | No       | The `checked` member uses the `boolean \| undefined` contract.                                                                                                                                                                                                                                                                                                     | —                                                                                                                                                                                            |
| `expanded`               | `boolean \| undefined`                                                                                                                                                                                                                                                                                                   | No       | The `expanded` member uses the `boolean \| undefined` contract.                                                                                                                                                                                                                                                                                                    | —                                                                                                                                                                                            |
| `valueText`              | `string \| undefined`                                                                                                                                                                                                                                                                                                    | No       | The `valueText` member uses the `string \| undefined` contract.                                                                                                                                                                                                                                                                                                    | —                                                                                                                                                                                            |
| `slots`                  | `Partial<SlotComponents<&#123; root: import("ink").BoxProps; header: import("ink").BoxProps; headerCell: import("ink").TextProps; body: import("ink").BoxProps; row: import("ink").BoxProps; cell: import("ink").TextProps; overflow: import("ink").TextProps; empty: import("ink").TextProps; &#125;>> \| undefined`    | No       | The `slots` member uses the `Partial<SlotComponents<&#123; root: import("ink").BoxProps; header: import("ink").BoxProps; headerCell: import("ink").TextProps; body: import("ink").BoxProps; row: import("ink").BoxProps; cell: import("ink").TextProps; overflow: import("ink").TextProps; empty: import("ink").TextProps; &#125;>> \| undefined` contract.        | [`BoxProps`](/tuil/docs/reference/packages/ink/api/box-props), [`SlotComponents`](/tuil/docs/reference/packages/theme/api/slot-components), [`TextProps`](/tuil/docs/reference/packages/ink/api/text-props) |
| `slotProps`              | `Partial<SlotProps<&#123; root: import("ink").BoxProps; header: import("ink").BoxProps; headerCell: import("ink").TextProps; body: import("ink").BoxProps; row: import("ink").BoxProps; cell: import("ink").TextProps; overflow: import("ink").TextProps; empty: import("ink").TextProps; &#125;, object>> \| undefined` | No       | The `slotProps` member uses the `Partial<SlotProps<&#123; root: import("ink").BoxProps; header: import("ink").BoxProps; headerCell: import("ink").TextProps; body: import("ink").BoxProps; row: import("ink").BoxProps; cell: import("ink").TextProps; overflow: import("ink").TextProps; empty: import("ink").TextProps; &#125;, object>> \| undefined` contract. | [`BoxProps`](/tuil/docs/reference/packages/ink/api/box-props), [`SlotProps`](/tuil/docs/reference/packages/theme/api/slot-props), [`TextProps`](/tuil/docs/reference/packages/ink/api/text-props)           |

## Source [#source]

[View the secondary source reference](https://github.com/mwillbanks/tuil/blob/main/registry/data-display/complex-data.tsx)