Skip to main content

extension-tables

package @remirror/extension-tables

class TableCellExtension

The extension for a table cell node.

Signature:

export declare class TableCellExtension extends NodeExtension 

Extends: NodeExtension

(Some inherited members may not be shown because they are not represented in the documentation.)

property name

Signature:

get name(): "tableCell";

method createNodeSpec

Signature:

createNodeSpec(extra: ApplySchemaAttributes, override: NodeSpecOverride): TableSchemaSpec;

Parameters:

ParameterTypeDescription
extraApplySchemaAttributes
overrideNodeSpecOverride

Returns:

TableSchemaSpec

class TableControllerCellExtension

This is not used in the basic table extension, but is required for this React Tables extension that extends this

Signature:

export declare class TableControllerCellExtension extends NodeExtension 

Extends: NodeExtension

(Some inherited members may not be shown because they are not represented in the documentation.)

property name

Signature:

get name(): "tableControllerCell";

method createNodeSpec

Signature:

createNodeSpec(_: ApplySchemaAttributes, __: NodeSpecOverride): TableSchemaSpec;

Parameters:

ParameterTypeDescription
_ApplySchemaAttributes
__NodeSpecOverride

Returns:

TableSchemaSpec

class TableExtension

Signature:

export declare class TableExtension extends NodeExtension<TableOptions> 

Extends: NodeExtension<TableOptions>

(Some inherited members may not be shown because they are not represented in the documentation.)

property name

Signature:

get name(): "table";

method addTableColumnAfter

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

Signature:

addTableColumnAfter(): CommandFunction;

Returns:

CommandFunction

method addTableColumnBefore

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

Signature:

addTableColumnBefore(): CommandFunction;

Returns:

CommandFunction

method addTableRowAfter

Add a table row after the current selection.

Signature:

addTableRowAfter(): CommandFunction;

Returns:

CommandFunction

method addTableRowBefore

Add a table row before the current selection.

Signature:

addTableRowBefore(): CommandFunction;

Returns:

CommandFunction

method createEventHandlers

Signature:

createEventHandlers(): CreateEventHandlers;

Returns:

CreateEventHandlers

method createExtensions

Create the table extensions. Set the priority to low so that they appear lower down in the node list.

Signature:

createExtensions(): TableRowExtension[];

Returns:

TableRowExtension[]

method createExternalPlugins

Add the table plugins to the editor.

Signature:

createExternalPlugins(): ProsemirrorPlugin[];

Returns:

ProsemirrorPlugin[]

method createNodeSpec

The last known good state that didn't need fixing. This helps make the fix command more effective.

Signature:

createNodeSpec(extra: ApplySchemaAttributes, override: NodeSpecOverride): TableSchemaSpec;

Parameters:

ParameterTypeDescription
extraApplySchemaAttributes
overrideNodeSpecOverride

Returns:

TableSchemaSpec

method createPlugin

Signature:

createPlugin(): CreateExtensionPlugin;

Returns:

CreateExtensionPlugin

method createTable

Create a table in the editor at the current selection point.

Signature:

createTable(options?: CreateTableCommand): CommandFunction;

Parameters:

ParameterTypeDescription
optionsCreateTableCommand(Optional)

Returns:

CommandFunction

method createTags

Signature:

createTags(): "block"[];

Returns:

"block"[]

method deleteTable

Delete the table.

Signature:

deleteTable(): CommandFunction;

Returns:

CommandFunction

method deleteTableColumn

Remove selected column from the table.

Signature:

deleteTableColumn(): CommandFunction;

Returns:

CommandFunction

method deleteTableRow

Delete the table row at the current selection.

Signature:

deleteTableRow(): CommandFunction;

Returns:

CommandFunction

method enableTableSupport

Enable table usage within the editor. This depends on the browser that is being used.

Signature:

enableTableSupport(): Helper<void>;

Returns:

Helper<void>

method expandCellSelection

Signature:

expandCellSelection(type?: 'column' | 'row' | 'all'): CommandFunction;

Parameters:

ParameterTypeDescription
type'column' | 'row' | 'all'(Optional)

Returns:

CommandFunction

method fixTables

Fix all tables within the document.

This is a **non-chainable** command.

Signature:

fixTables(): NonChainableCommandFunction;

Returns:

NonChainableCommandFunction

method goToNextCell

Signature:

goToNextCell(props: KeyBindingProps): boolean;

Parameters:

ParameterTypeDescription
propsKeyBindingProps

Returns:

boolean

method goToPreviousCell

Signature:

goToPreviousCell(props: KeyBindingProps): boolean;

Parameters:

ParameterTypeDescription
propsKeyBindingProps

Returns:

boolean

method mergeTableCells

Merge the table cells.

Signature:

mergeTableCells(): CommandFunction;

Returns:

CommandFunction

method onSetOptions

This managers the updates of the collaboration provider.

Signature:

protected onSetOptions(props: OnSetOptionsProps<TableOptions>): void;

Parameters:

ParameterTypeDescription
propsOnSetOptionsProps<TableOptions>

Returns:

void

method onStateUpdate

Signature:

onStateUpdate(props: StateUpdateLifecycleProps): void;

Parameters:

ParameterTypeDescription
propsStateUpdateLifecycleProps

Returns:

void

method selectParentCell

Signature:

selectParentCell(): CommandFunction;

Returns:

CommandFunction

method setTableCellAttribute

Set the attribute for a table cell.

Signature:

setTableCellAttribute(name: string, value: unknown): CommandFunction;

Parameters:

ParameterTypeDescription
namestring
valueunknown

Returns:

CommandFunction

method setTableCellBackground

Update the background of one cell or multiple cells by passing a color string. You can also remove the color by passing a null.

Signature:

setTableCellBackground(background: string | null): CommandFunction;

Parameters:

ParameterTypeDescription
backgroundstring | null

Returns:

CommandFunction

method splitTableCell

Split the merged cells into individual cells.

Signature:

splitTableCell(): CommandFunction;

Returns:

CommandFunction

method tableHasHeader

Determines if the first row/column is a header row/column

Signature:

tableHasHeader(type?: 'column' | 'row', state?: EditorState): Helper<boolean>;

Parameters:

ParameterTypeDescription
type'column' | 'row'(Optional)
stateEditorState(Optional)

Returns:

Helper<boolean>

method toggleTableCellMerge

Toggles between merging cells.

Signature:

toggleTableCellMerge(): CommandFunction;

Returns:

CommandFunction

method toggleTableHeader

Toggles between row/column header and normal cells (Only applies to first row/column).

Signature:

toggleTableHeader(type?: 'column' | 'row'): CommandFunction;

Parameters:

ParameterTypeDescription
type'column' | 'row'(Optional)

Returns:

CommandFunction

method toggleTableHeaderCell

Toggle a cell as a table header cell.

Signature:

toggleTableHeaderCell(): CommandFunction;

Returns:

CommandFunction

method toggleTableHeaderColumn

Toggles a column as the header column.

Signature:

toggleTableHeaderColumn(): CommandFunction;

Returns:

CommandFunction

method toggleTableHeaderRow

Toggles a row as a table header row.

Signature:

toggleTableHeaderRow(): CommandFunction;

Returns:

CommandFunction

class TableHeaderCellExtension

The extension for the table header node.

Signature:

export declare class TableHeaderCellExtension extends NodeExtension 

Extends: NodeExtension

(Some inherited members may not be shown because they are not represented in the documentation.)

property name

Signature:

get name(): "tableHeaderCell";

method createNodeSpec

Signature:

createNodeSpec(extra: ApplySchemaAttributes, override: NodeSpecOverride): TableSchemaSpec;

Parameters:

ParameterTypeDescription
extraApplySchemaAttributes
overrideNodeSpecOverride

Returns:

TableSchemaSpec

class TableRowExtension

The extension for a table row node.

Signature:

export declare class TableRowExtension extends NodeExtension 

Extends: NodeExtension

(Some inherited members may not be shown because they are not represented in the documentation.)

property name

Signature:

get name(): "tableRow";

method createExtensions

Automatically create the TableCellExtension and TableHeaderCellExtension. This is placed here so that this extension can be tested independently from the TableExtension.

Signature:

createExtensions(): Array<TableCellExtension | TableHeaderCellExtension | TableControllerCellExtension>;

Returns:

Array<TableCellExtension | TableHeaderCellExtension | TableControllerCellExtension>

method createNodeSpec

Signature:

createNodeSpec(extra: ApplySchemaAttributes, override: NodeSpecOverride): TableSchemaSpec;

Parameters:

ParameterTypeDescription
extraApplySchemaAttributes
overrideNodeSpecOverride

Returns:

TableSchemaSpec

function createTable()

Returns a table node of a given size.

Signature:

export declare function createTable(props: CreateTableProps): ProsemirrorNode;

Parameters:

ParameterTypeDescription
propsCreateTableProps

Returns:

ProsemirrorNode

Remarks:

const table = createTable({ schema: state.schema }); // 3x3 table node
dispatch(tr.replaceSelectionWith(table).scrollIntoView());

variable activeCellColumnPositioner

Creates a positioner for the current column in a table

It spans the full width and height of the column containing the current cell

Signature:

activeCellColumnPositioner: Positioner<ActiveCellColumnPositionerData>

variable activeCellPositioner

Creates a positioner for the current cell node.

It spans the full width and height of the cell.

Signature:

activeCellPositioner: Positioner<FindProsemirrorNodeResult>

variable activeCellRowPositioner

Creates a positioner for the current row in a table

It spans the full width and height of the row containing the current cell

Signature:

activeCellRowPositioner: Positioner<ActiveCellColumnPositionerData>

variable allCellSelectionPositioner

Creates a positioner if all the cells in a table are selected

It spans the full width and height of the selected cells (the entire table)

Signature:

allCellSelectionPositioner: Positioner<CellSelection>

variable allColumnsStartPositioner

Creates a positioner for top of each column in a table

It returns multiple positions, for the top side of each column in a table

Signature:

allColumnsStartPositioner: Positioner<NodeWithPosition>

variable allRowsStartPositioner

Creates a positioner for left of each row in a table

It returns multiple positions, for the left side of each row in a table

Signature:

allRowsStartPositioner: Positioner<NodeWithPosition>

variable cellColumnSelectionPositioner

Creates a positioner if the cell selection goes all the way from the top to the bottom of the table

It spans the full width and height of the selected cells

Signature:

cellColumnSelectionPositioner: Positioner<CellSelection>

variable cellRowSelectionPositioner

Creates a positioner if the cell selection goes all the way from the left to the right of the table

It spans the full width and height of the selected cells

Signature:

cellRowSelectionPositioner: Positioner<CellSelection>

variable cellSelectionPositioner

Creates a positioner for the current cell selection in a table

It spans the full width and height of the selected cells

Signature:

cellSelectionPositioner: Positioner<CellSelection>

variable createTableOptions

Signature:

createTableOptions: Remirror.CommandDecoratorOptions

variable selectedColumnPositioner

Creates a positioner for the current column in a table if the whole column is selected

It spans the full width and height of a selected single column

Signature:

selectedColumnPositioner: Positioner<ActiveCellColumnPositionerData>

variable selectedRowPositioner

Creates a positioner for the current row in a table if the whole row is selected

It spans the full width and height of a selected single row

Signature:

selectedRowPositioner: Positioner<ActiveCellColumnPositionerData>

variable tablePositioner

Creates a positioner for the current table node.

It spans the full width and height of the table.

Signature:

tablePositioner: Positioner<FindProsemirrorNodeResult>

interface ActiveCellColumnPositionerData

Signature:

export interface ActiveCellColumnPositionerData 

property pos

Signature:

pos: number;

property rect

Signature:

rect: DOMRect;

interface CreateTableCommand

Signature:

export interface CreateTableCommand 

property cellContent

Defines the content of each cell as a prosemirror node.

Signature:

cellContent?: ProsemirrorNode;

property columnsCount

Defines the number of columns to create with.

Signature:

columnsCount?: number;

property rowsCount

Defines the number of rows to create with.

Signature:

rowsCount?: number;

property withHeaderRow

When true the first row of the table will be a header row.

Signature:

withHeaderRow?: boolean;

interface TableOptions

Signature:

export interface TableOptions 

property resizable

When true the table will be resizable.

Signature:

resizable?: boolean;

property resizeableOptions

The options passed to the column resizing plugin

Signature:

resizeableOptions?: TableResizableOptions;

property tabKeyboardShortcuts

Whether to use Tab and Shift-Tab to navigate between cells

@defaultValue: false

Signature:

tabKeyboardShortcuts?: boolean;

interface TableResizableOptions

Signature:

export interface TableResizableOptions 

property cellMinWidth

Signature:

cellMinWidth?: number;

property handleWidth

Signature:

handleWidth?: number;

interface TableSchemaSpec

Signature:

export interface TableSchemaSpec extends NodeExtensionSpec 

Extends: NodeExtensionSpec

(Some inherited members may not be shown because they are not represented in the documentation.)

property tableRole

Signature:

tableRole: TableRole;

property toDOM

Defines the default way a node of this type should be serialized to DOM/HTML (as used by [[DOMSerializer.fromSchema]].

Should return a [[DOMOutputSpec]] that describes a DOM node, with an optional number zero (“hole”) in it to indicate where the node's content should be inserted.

Signature:

toDOM?: (node: NodeWithAttributes) => DOMOutputSpec;

type ActiveCellRowPositionerData

Signature:

export type ActiveCellRowPositionerData = ActiveCellColumnPositionerData;

References: ActiveCellColumnPositionerData

type TableRole

Signature:

export type TableRole = (typeof TABLE_ROLES)[number];