Skip to content

Vizel API / core/src / createVizelTableExtensions

Function: createVizelTableExtensions()

ts
function createVizelTableExtensions(options?): Extensions;

Defined in: packages/core/src/extensions/table.ts:99

Create table extensions for Vizel editor. Returns an array of extensions: Table, TableRow, TableHeader, TableCell.

Parameters

ParameterType
optionsVizelTableOptions

Returns

Extensions

Example

ts
const editor = new Editor({
  extensions: [
    ...createVizelTableExtensions({ resizable: true }),
  ],
});

// Insert a table
editor.chain().focus().insertTable({ rows: 3, cols: 3, withHeaderRow: true }).run();

// Column operations
editor.chain().focus().addColumnBefore().run(); // Add column at the beginning/middle
editor.chain().focus().addColumnAfter().run();  // Add column at the end/middle
editor.chain().focus().deleteColumn().run();

// Row operations
editor.chain().focus().addRowBefore().run();    // Add row at the beginning/middle
editor.chain().focus().addRowAfter().run();     // Add row at the end/middle
editor.chain().focus().deleteRow().run();

// Delete table
editor.chain().focus().deleteTable().run();

// Cell alignment
editor.chain().focus().setCellAttribute('textAlign', 'left').run();
editor.chain().focus().setCellAttribute('textAlign', 'center').run();
editor.chain().focus().setCellAttribute('textAlign', 'right').run();

// Merge and split cells
editor.chain().focus().mergeCells().run();
editor.chain().focus().splitCell().run();
editor.chain().focus().mergeOrSplit().run();

// Header operations
editor.chain().focus().toggleHeaderRow().run();
editor.chain().focus().toggleHeaderColumn().run();
editor.chain().focus().toggleHeaderCell().run();

// Navigation
editor.chain().focus().goToNextCell().run();
editor.chain().focus().goToPreviousCell().run();

// Cell selection
editor.chain().focus().setCellSelection({ anchorCell: 1, headCell: 2 }).run();

// Fix table structure
editor.chain().focus().fixTables().run();

Released under the MIT License.