` framing the table
- `wrapperStyle:` any style (as an object) to style the wrapper `
`
- `tableClassName:` any class names to be passed on to the `
`
- `tableStyle:` any style (as an object) to style ``
- `theadClassName:` any class names to be passed on to the `` element
- `theadStyle:` any style (as an object) to style ``
- `tbodyClassName:` any class names to be passed on to the `` element
- `tbodyStyle:` any style (as an object) to style ``
- `tableResize:` (boolean) override the application level table resize setting for the given tabel
- `columnResize:` (boolean) override the application level column resize setting for the given tabel
#### Rows, cells
- `className:` any class names to be passed on to the `| ` or ` | ` element
- `style:` any style (as an object) to style the `| ` or ` |
` element
- `attributes`: an object which will be passed on straight to the element and converted to attributes (you can also include colSpan and colRow attributes for merged cells). Whatch out that you have to follow React capitalizing conventions. So colRow and colSpan needs to be like so.
### Queries and Commands
`slate-deep-table` exports queries and commands that you can invoke on your `editor` instance:
```js
// anywhere where 'editor' is passed as an argument, or using the react Component's ref,
// you may directly invoke any of the exported functions below, e.g:
const inATable = editor.isSelectionInTable();
if (!inATable) {
editor.insertTable();
}
```
Check `example/main.js` for usage in a typical context.
#### `query isSelectionInTable()`
`editor.isSelectionInTable() => Boolean`
Return true if current cursor position is inside a table.
#### `query getTablePosition()`
`editor.getTablePosition() => null || TablePosition`
Returns null if cursor is not in a table, else returns an object you can use to query the current cell and row location:
```js
const position = editor.getTablePosition();
position.getRowIndex(); // returns row id (0-indexed)
position.getColumnIndex(); // return column index (0-indexed)
position.getWidth(); // returns count of columns
position.getHeight(); // returns count of rows
```
#### `command insertTable()`
`editor.insertTable(columns: Number?, rows: Number?, properties: Object?) => Editor`
Insert a new empty table. Properties can contain table level options as above in object format.
#### `command insertRow()`
`editor.insertRow(at: Number?) => Editor`
Insert a new row after the current one or at the specific index (`at`).
#### `command insertColumn()`
`editor.insertColumn(at: Number?) => Editor`
Insert a new column after the current one or at the specific index (`at`).
#### `command removeTable()`
`editor.removeTable() => Editor`
Remove current table.
#### `command removeRow()`
`editor.removeRow(at: Number?) => Editor`
Remove current row or the one at a specific index (`at`).
#### `command removeColumn()`
`editor.removeColumn(at: Number?) => Editor`
Remove current column or the one at a specific index (`at`).
#### `command moveTableSelection()`
`editor.moveTableSelection(column: Number, row: Number) => Editor`
Move the selection to a specific position in the table.
#### `command moveTableSelectionBy()`
`editor.moveTableSelectionBy(column: Number, row: Number) => Editor`
Move the selection by the given amount of columns and rows.
#### `command toggleTableHeaders()`
`editor.toggleTableHeaders() => Editor`
Toggles whether the table will render the first row as a header row (within a thead) or as a regular row.
---
_Source: https://npm.io/package/@pbackup/slate-deep-table · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._