diff --git a/docs/layout-blocks.md b/docs/layout-blocks.md index e1e830f..ef585c4 100644 --- a/docs/layout-blocks.md +++ b/docs/layout-blocks.md @@ -314,6 +314,91 @@ Display a card of the call that was registered to Slack workspace. [Learn about - `callId` (**required**): A string of registered call's ID. - `id` / `blockId` (optional): A string of unique identifier of block. +## [``: Table Block](https://api.slack.com/reference/block-kit/blocks#table) + +Display a table with rows and cells. This block allows you to present tabular data in a structured format. + +```jsx + +
+ + Name + Age + Department + + + Alice + 30 + Engineering + + + Bob + 25 + Design + +
+ +``` + +### Props + +- `id` / `blockId` (optional): A string of unique identifier of block. +- `columnSettings` (optional): An array of column settings to control alignment and wrapping. + +### Column Settings + +You can customize column appearance by providing `columnSettings` prop: + +```jsx + + + + Product + Price + Status + + + Widget A + $99.99 + Available + +
+
+``` + +Each column setting object can have: + +- `align` (optional): Text alignment - `'left'`, `'center'`, or `'right'`. Default is `'left'`. +- `wrap` (optional): Whether text should wrap. Default is `false`. + +### ``: Table row + +Represents a single row in the table. Each row contains `` components. + +### ``: Table cell + +Represents a single cell within a table row. The content will be converted to plain text. + +```jsx + + Text content + {123} + +``` + +### Constraints + +- Maximum 100 rows per table +- Maximum 20 cells per row +- Maximum 20 column settings +- One table per message (Slack limitation) + --- ###### [Top](../README.md) » [JSX components for Block Kit](jsx-components-for-block-kit.md) » Layout blocks diff --git a/src/block-kit/container/Blocks.ts b/src/block-kit/container/Blocks.ts index 3d63218..1bef5a3 100644 --- a/src/block-kit/container/Blocks.ts +++ b/src/block-kit/container/Blocks.ts @@ -31,6 +31,7 @@ import { * - `