Table

The Table extension allows you to add tables to your editor.

• Based on TipTap's table extension. @tiptap/extension-table

Usage

import { Table } from 'reactjs-tiptap-editor/table'; 

const extensions = [
  ...,
  // Import Extensions Here
  Table 
];

Hiding default items from the bubble menu

By default, a bubble menu is used to provide controls for table editing (such as adding rows, cols, ...). Items from this menu can be hidden with "hiddenActions" option in the tableConfig.

<RichTextEditor
  {...otherProps}
  bubbleMenu={{
    tableConfig: {
      hiddenActions: ['setCellBackground'],
    }
  }}
/>

For supported action keys, please see TableBubbleMenu.tsx

Source

Source • Docs

Contributors

Hung Hoang

Zeeshan Ahmad

Changelog

v0.3.5 on 6/19/2025

1ba77 - fix: linting errors

3ad27 - feat: add table, row, and cell borders for improved layout clarit