@tiptap/extension-table

What is @tiptap/extension-table?

@tiptap/extension-table is an extension for the Tiptap editor that provides table functionalities. It allows users to create, edit, and manage tables within the Tiptap rich-text editor.

What are @tiptap/extension-table's main functionalities?

Create Table

This code demonstrates how to create a table with 3 rows and 3 columns in the Tiptap editor using the @tiptap/extension-table package.

import { Table } from '@tiptap/extension-table';
import { TableRow } from '@tiptap/extension-table-row';
import { TableCell } from '@tiptap/extension-table-cell';
import { TableHeader } from '@tiptap/extension-table-header';

const editor = new Editor({
  extensions: [
    Table.configure({ resizable: true }),
    TableRow,
    TableCell,
    TableHeader,
  ],
});

editor.chain().focus().insertTable({ rows: 3, cols: 3 }).run();

Add Row

This code demonstrates how to add a new row to an existing table in the Tiptap editor.

editor.chain().focus().addRowAfter().run();

Add Column

This code demonstrates how to add a new column to an existing table in the Tiptap editor.

editor.chain().focus().addColumnAfter().run();

Delete Table

This code demonstrates how to delete an existing table in the Tiptap editor.

editor.chain().focus().deleteTable().run();

Merge Cells

This code demonstrates how to merge selected cells in a table within the Tiptap editor.

editor.chain().focus().mergeCells().run();

Other packages similar to @tiptap/extension-table

prosemirror-tables

prosemirror-tables is a plugin for ProseMirror that provides table functionalities. It offers similar features to @tiptap/extension-table, such as creating, editing, and managing tables. However, it is designed specifically for the ProseMirror editor and may require more configuration compared to Tiptap's extension.

slate-tables

slate-tables is a plugin for the Slate editor that adds table functionalities. It allows users to create and manipulate tables within the Slate rich-text editor. While it offers similar features to @tiptap/extension-table, it is tailored for use with the Slate editor and may have different APIs and configuration options.

draft-js-table-plugin

draft-js-table-plugin is a plugin for the Draft.js editor that provides table functionalities. It enables users to create and manage tables within the Draft.js editor. Like @tiptap/extension-table, it offers features for table manipulation, but it is designed specifically for Draft.js and may have different implementation details.

README

@tiptap/extension-table

Introduction

tiptap is a headless wrapper around ProseMirror – a toolkit for building rich text WYSIWYG editors, which is already in use at many well-known companies such as New York Times, The Guardian or Atlassian.

Offical Documentation

Documentation can be found on the tiptap website.

License

tiptap is open-sourced software licensed under the MIT license.