Skip to content

prosekit/extensions/table

new TableView(node: EditorNode, defaultCellMinWidth: number): TableView

node: EditorNode

defaultCellMinWidth: number

dom: HTMLDivElement

The outer DOM node that represents the document node.

table: HTMLTableElement

colgroup: HTMLTableColElement

contentDOM: HTMLTableSectionElement

The DOM node that should hold the node's content. Only meaningful if the node view also defines a dom property and if its node type is not a leaf node type. When this is present, ProseMirror will take care of rendering the node's children into it. When it is not present, the node view itself is responsible for rendering (or deciding not to render) its child nodes.

update(node: EditorNode): boolean

When given, this will be called when the view is updating itself. It will be given a node, an array of active decorations around the node (which are automatically drawn, and the node view may ignore if it isn't interested in them), and a decoration source that represents any decorations that apply to the content of the node (which again may be ignored). It should return true if it was able to update to that node, and false otherwise. If the node view has a contentDOM property (or no dom property), updating its child nodes will be handled by ProseMirror.

ignoreMutation(record: ViewMutationRecord): boolean

Called when a mutation happens within the view. Return false if the editor should re-read the selection or re-parse the range around the mutation, true if it can safely be ignored.

row: number

The number of rows in the table.

col: number

The number of columns in the table.

header?: boolean

Whether the table has a header row.

false


pos?: number

A hit position of the table cell to select from. By default, the selection anchor will be used.


anchor?: number

A hit position of the table cell to select from. By default, the selection anchor will be used.

head?: number

A hit position of the table cell to select to. By default, the selection head will be used.


anchor?: number

A hit position of the table cell to select from. By default, the selection anchor will be used.

head?: number

A hit position of the table cell to select to. By default, the selection head will be used.


pos?: number

A hit position of the table to select from. By default, the selection anchor will be used.


Options for moveTableRow

from: number

The source row index to move from.

to: number

The destination row index to move to.

select?: boolean

Whether to select the moved row after the operation.

true

pos?: number

Optional position to resolve table from. If not provided, uses the current selection.


Options for moveTableColumn

from: number

The source column index to move from.

to: number

The destination column index to move to.

select?: boolean

Whether to select the moved column after the operation.

true

pos?: number

Optional position to resolve table from. If not provided, uses the current selection.

type ColumnResizingOptions = { handleWidth?: number; cellMinWidth?: number; defaultCellMinWidth?: number; lastColumnResizable?: boolean; View?: ((node: EditorNode, cellMinWidth: number, view: EditorView) => NodeView) | null; }

handleWidth?: number

cellMinWidth?: number

Minimum width of a cell /column. The column cannot be resized smaller than this.

defaultCellMinWidth?: number

The default minWidth of a cell / column when it doesn't have an explicit width (i.e.: it has not been resized manually)

lastColumnResizable?: boolean

View?: ((node: EditorNode, cellMinWidth: number, view: EditorView) => NodeView) | null

A custom node view for the rendering table nodes. By default, the plugin uses the TableView class. You can explicitly set this to null to not use a custom node view.


type TableEditingOptions = { allowTableNodeSelection?: boolean; }

allowTableNodeSelection?: boolean

Whether to allow table node selection.

By default, any node selection wrapping a table will be converted into a CellSelection wrapping all cells in the table. You can pass true to allow the selection to remain a NodeSelection.

false

const exitTable: Command

When the selection is in a table node, create a default block after the table table, and move the cursor there.

function defineTableCommands(): TableCommandsExtension

Adds commands for working with table nodes.


function insertTable(options: InsertTableOptions): Command

Insert a table node with the given number of rows and columns, and optionally a header row.


function selectTableCell(options?: SelectTableCellOptions): Command


function selectTableColumn(options?: SelectTableColumnOptions): Command


function selectTableRow(options?: SelectTableRowOptions): Command


function selectTable(options?: SelectTableOptions): Command


function defineTableEditingPlugin(options?: TableEditingOptions): PlainExtension


function defineColumnResizingPlugin(options?: ColumnResizingOptions): PlainExtension


function defineTablePlugins(): PlainExtension


function defineTableHeaderCellSpec(): TableHeaderCellSpecExtension


function isCellSelection(value: unknown): value is CellSelection

Checks if the given object is a CellSelection instance.


function defineTable(): TableExtension


function addTableColumnBefore(state: EditorState, dispatch?: (tr: Transaction) => void): boolean

Command to add a column before the column with the selection.


function addTableColumnAfter(state: EditorState, dispatch?: (tr: Transaction) => void): boolean

Command to add a column after the column with the selection.


function deleteTableColumn(state: EditorState, dispatch?: (tr: Transaction) => void): boolean

Command function that removes the selected columns from a table.


function addTableRowAbove(state: EditorState, dispatch?: (tr: Transaction) => void): boolean

Add a table row before the selection.


function addTableRowBelow(state: EditorState, dispatch?: (tr: Transaction) => void): boolean

Add a table row after the selection.


function deleteTableRow(state: EditorState, dispatch?: (tr: Transaction) => void): boolean

Remove the selected rows from a table.


function mergeTableCells(state: EditorState, dispatch?: (tr: Transaction) => void): boolean

Merge the selected cells into a single cell. Only available when the selected cells' outline forms a rectangle.


function splitTableCell(state: EditorState, dispatch?: (tr: Transaction) => void): boolean

Split a selected cell, whose rowpan or colspan is greater than one, into smaller cells. Use the first cell type for the new cells.


function deleteTable(state: EditorState, dispatch?: (tr: Transaction) => void): boolean

Deletes the table around the selection, if any.


function deleteCellSelection(state: EditorState, dispatch?: (tr: Transaction) => void): boolean

Deletes the content of the selected cells, if they are not empty.


function moveTableRow(options: MoveTableRowOptions): Command

Move a table row from index from to index to.


function moveTableColumn(options: MoveTableColumnOptions): Command

Move a table column from index from to index to.


function findTable($pos: ResolvedPos): FindNodeResult | null

Find the closest table node for a given position.