Tiptap Table Plus

tiptap-table-plus is an npm package that extends the table functionality of the Tiptap editor by adding two new commands: duplicateColumn and duplicateRow.

Installation

To install the package, use npm:

1npm install tiptap-table-plus

Commands

duplicateColumn

This command duplicates the current column. By default, it copies the content of the column as well.

Usage

1editor.commands.duplicateColumn(true);

Parameters

• withContent (boolean):
• If true, the content of the column will be copied. If false, only the structure will be duplicated. Default is true.

duplicateRow

This command duplicates the current row. By default, it copies the content of the row as well.

Usage

1editor.commands.duplicateRow(true);

Parameters

• withContent (boolean):
• If true, the content of the row will be copied. If false, only the structure will be duplicated. Default is true.

Example

Here is an example of how to use these commands in your Tiptap editor setup:

1import { Editor } from '@tiptap/core';
2import Table from '@tiptap/extension-table';
3import TableRow from '@tiptap/extension-table-row';
4import TableCell from '@tiptap/extension-table-cell';
5import TableHeader from '@tiptap/extension-table-header';
6import TiptapTablePlus from 'tiptap-table-plus';
7
8const editor = new Editor({
9  extensions: [
10    Table,
11    TableRow,
12    TableCell,
13    TableHeader,
14    TiptapTablePlus,
15  ],
16  content: '<p>Hello World!</p>',
17});
18
19// Duplicate the current column with content
20editor.commands.duplicateColumn(false);
21
22// Duplicate the current row without content
23editor.commands.duplicateRow(false);

License

This package is open-sourced software licensed under the MIT license.