# blocks/table

> Table — a grid of per-cell editable blocks: the table's children are paragraphs laid out row by row, `cols` wide, on a CSS grid.

Table (F-33) — a grid of per-cell editable blocks: the table's children are paragraphs laid out row by row, `cols` wide, on a CSS grid. Tab / ⇧Tab and ↑ ↓ move between cells, Enter moves down; adding or removing a row or column is one transaction, so one undo step. Columns resize with Pointer Events. No merged cells. Markdown: GFM table.

```js
import table from 'verbal-editor/blocks/table';
```

| JS gzip | CSS gzip |
| --- | --- |
| 2.47 KB | 0.69 KB |

See it live on [Tables & charts](#/examples/tables) — every example page on the landing is editable.

## Contract

|  |  |
| --- | --- |
| Block type | `table` |
| Content | no text of its own |
| Props | `cols: number` `header: boolean` `widths: array` |
| Slash menu | `⊞ Table` |
| Keywords | `grid` `spreadsheet` |
| Keys | `Tab` `⇧Tab` `⏎` `↑` `↓` `Backspace` `Delete` `⌘⇧↑` `⌘⇧↓` `Paste` |
| Pastes from | `Markdown` |
| Copies as | `Markdown` `HTML` |

## Acceptance

| Feature | Acceptance | Budget |
| --- | --- | --- |
| F-33 · Table | Arrow/Tab navigation between cells; row/column insert and delete are single undo steps. **No merged cells in v1** | ≤ 4KB |

## API

### `addRow(editor, table, row)`

Row and column edits; each is a single transaction. `row` / `col` is the one to add after or remove.

| Parameter | Type | Description |
| --- | --- | --- |
| `editor` | `import('../../index.js').Editor` | — |
| `table` | `string` | the table block's id |
| `row` | `number` | — |

### `addColumn(editor, table, col)`

@param {import('../../index.js').Editor} editor

| Parameter | Type | Description |
| --- | --- | --- |
| `table` | `string` | — |
| `col` | `number` | — |

### `removeRow(editor, table, row)`

@param {import('../../index.js').Editor} editor

| Parameter | Type | Description |
| --- | --- | --- |
| `table` | `string` | — |
| `row` | `number` | — |

### `removeColumn(editor, table, col)`

@param {import('../../index.js').Editor} editor

| Parameter | Type | Description |
| --- | --- | --- |
| `table` | `string` | — |
| `col` | `number` | — |