@meitner/tiptap-table-plus
v3.1.1
Published
Meitner fork of tiptap-table-plus — Tiptap table extra options like duplicate column, duplicate row etc...
Readme
Tiptap Table Plus — Meitner fork
Meitner's fork of tiptap-table-plus, published to the public npm registry as @meitner/tiptap-table-plus. It replaces the Yarn patch: protocol entry that previously lived in the platform repo.
The scope is @meitner, matching @meitner/eslint-plugin. Earlier versions were published to GitHub Packages as @meitner-se/tiptap-table-plus — that scope was forced by GitHub Packages, which requires a package to be scoped to the account owning the repository, and which demands an authentication token even to read a public package. Publishing to npm drops that requirement: consumers need no token, no .npmrc, and no registry configuration.
@meitner-se/tiptap-table-plus is frozen at 3.1.1 on GitHub Packages and receives no further releases.
npm install @meitner/tiptap-table-plusThe import surface is unchanged from upstream, so the usage examples further down apply as written — only the specifier differs.
Why this fork exists
main is based on the source that upstream actually published as npm [email protected]. That source is not on upstream's main (which still carries 2.1.0, Tiptap v2 peer deps, and no TableKit) — it lives on upstream's tiptap-v2 branch at 1c1b349, despite the branch name. The gitHead npm recorded for 3.1.0 (08b6328) does not exist in any pushed upstream branch. Building 1c1b349 reproduces the published 3.1.0 tarball byte for byte.
On top of that base, this fork carries:
- Explicit
.jsextensions on every relative import. Upstream emits ESM with extensionless specifiers, which Node cannot resolve —./paginationin particular is a directory import. Applies to the emitted declarations too, somoduleResolution: NodeNextconsumers type-check. - Position mapping in
TableRowGroup. Row-group normalisation computedposagainst the pre-transaction document and then wrote with it directly, so a second table in the same pass was replaced at a stale range. Positions are now mapped throughtr.mapping.
Upstream's main also contains a resize-handle z-index change (9999 → auto) that never made it into 3.1.0. It is deliberately not included here — it changes stacking behaviour and should be adopted as its own reviewed change.
Branches
meitner-main— the default branch, and what we publish from.main— an untouched mirror of upstream'smain, kept only for pulling future upstream work. It is not an ancestor of what we ship; do not rebase onto it.
Releasing
Changesets, the same flow as @meitner/eslint-plugin. Add a changeset alongside the change:
npx changesetOn merge to meitner-main, .github/workflows/release.yaml opens a "Version Packages" PR that consumes the pending changesets, bumps the version and writes the changelog. Merging that PR publishes to npm. prepack compiles dist, so a publish always ships a fresh build.
Publishing uses npm trusted publishing: the workflow requests an OIDC token from GitHub, and npm exchanges it for a short-lived publish credential. There is no npm token stored in this repository, nothing to rotate, and every release carries a provenance attestation. The id-token: write permission is what makes this work — dropping it breaks releases.
3.1.1 predates changesets and was published by hand; its changelog entry is written by hand to match. Everything from 3.1.2 on is generated.
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.
Demo : https://romikmakavana.me/tiptap/table-plus/example
Documentation : https://romikmakavana.me/tiptap/table-plus
Installation
This package supports both TipTap v2 and TipTap v3. Choose the appropriate installation command based on your TipTap version:
For TipTap v3 (Recommended)
# Install latest version (defaults to TipTap v3)
npm install tiptap-table-plus
# Or explicitly install the tiptap-v3 tag
npm install tiptap-table-plus@tiptap-v3For TipTap v2
npm install tiptap-table-plus@tiptap-v2Note: Both versions are maintained and updated with each release. The latest tag (default) points to the TipTap v3 compatible version.
Peer Dependencies
This package works with peer dependencies. The required packages differ based on your TipTap version:
For TipTap v3
TipTap v3 bundles table extensions into a single package. Install the following:
npm install @tiptap/extension-table @tiptap/pmFor TipTap v2
TipTap v2 uses separate packages for each table extension. Install the following:
npm install @tiptap/extension-table @tiptap/extension-table-cell @tiptap/extension-table-header @tiptap/extension-table-row @tiptap/pmNote: Make sure you have these peer dependencies installed as they are required for the package to function properly. The package will not work without these Tiptap extensions and ProseMirror.
Without Pagination
| Command | Parameters | Default | Description |
| ----------------- | ----------------------- | ------- | ----------------------------------------------------------------------------------------------------------- |
| duplicateColumn | withContent (boolean) | true | Duplicates the current column. If true, copies column content; if false, only duplicates the structure. |
| duplicateRow | withContent (boolean) | true | Duplicates the current row. If true, copies row content; if false, only duplicates the structure. |
Example
Here are examples of how to use these commands in your Tiptap editor setup:
For TipTap v3
import { Editor } from '@tiptap/core';
import { Table, TableRow, TableCell, TableHeader } from '@tiptap/extension-table';
import { WithoutPagination } from 'tiptap-table-plus';
const { TableKitPlus } = WithoutPagination;
const editor = new Editor({
extensions: [
TableKitPlus
],
content: '<table border="1"><tr><th colspan="1" rowspan="1"><p>Name</p></th><th colspan="1" rowspan="1"><p>Region</p></th><th colspan="1" rowspan="1"><p>Country</p></th></tr><tr><td colspan="1" rowspan="1"><p>Liberty Hays</p></td><td colspan="1" rowspan="1"><p>Araucanía</p></td><td colspan="1" rowspan="1"><p>Canada</p></td></tr></table>',
});For TipTap v2
import { Editor } from '@tiptap/core';
import TableRow from '@tiptap/extension-table-row';
import TableCell from '@tiptap/extension-table-cell';
import TableHeader from '@tiptap/extension-table-header';
import { WithoutPagination } from 'tiptap-table-plus';
const { TablePlus, TableRowPlus, TableCellPlus, TableHeaderPlus } = WithoutPagination;
const editor = new Editor({
extensions: [
TablePlus,
TableRowPlus,
TableCellPlus,
TableHeaderPlus,
],
content: '<table border="1"><tr><th colspan="1" rowspan="1"><p>Name</p></th><th colspan="1" rowspan="1"><p>Region</p></th><th colspan="1" rowspan="1"><p>Country</p></th></tr><tr><td colspan="1" rowspan="1"><p>Liberty Hays</p></td><td colspan="1" rowspan="1"><p>Araucanía</p></td><td colspan="1" rowspan="1"><p>Canada</p></td></tr></table>',
});Pagination Table Support
The package now includes advanced pagination table support with automatic row grouping based on rowspan logic. This feature automatically organizes table rows into logical groups for better pagination and display.
Tiptap Pagination : https://romikmakavana.me/tiptap/pagination-plus/
Features
- Automatic Row Grouping: Intelligently groups table rows based on rowspan attributes
- Enhanced Table Structure: Supports both direct table rows and grouped table rows
- Smart Pagination: Automatically handles complex table layouts with merged cells
- CSS Custom Properties: Provides CSS variables for styling and layout control
- Column Resize Support – Allows users to interactively adjust column widths for better readability
Usage with Pagination
Here's how to set up the pagination table extension:
For TipTap v3
import { Editor } from '@tiptap/core';
import { Table, TableRow, TableCell, TableHeader } from '@tiptap/extension-table';
import { TableKitPlus } from 'tiptap-table-plus';
import { PaginationPlus } from "tiptap-pagination-plus";
const editor = new Editor({
extensions: [
TableKitPlus, // TipTap v3 only - includes TableRowPlus, TableCellPlus, TableHeaderPlus
PaginationPlus
],
content: '<table border="1"><tr><th colspan="1" rowspan="1"><p>Name</p></th><th colspan="1" rowspan="1"><p>Region</p></th><th colspan="1" rowspan="1"><p>Country</p></th></tr><tr><td colspan="1" rowspan="1"><p>Liberty Hays</p></td><td colspan="1" rowspan="1"><p>Araucanía</p></td><td colspan="1" rowspan="1"><p>Canada</p></td></tr></table>',
});Note for TipTap v3: TableKitPlus is a convenience extension that includes TableRowPlus, TableCellPlus, and TableHeaderPlus. You can use either TableKitPlus or import the individual extensions separately.
For TipTap v2
import { Editor } from '@tiptap/core';
import { TablePlus, TableRowPlus, TableCellPlus, TableHeaderPlus } from 'tiptap-table-plus';
import { PaginationPlus } from "tiptap-pagination-plus";
const editor = new Editor({
extensions: [
TablePlus,
TableRowPlus,
TableCellPlus,
TableHeaderPlus,
PaginationPlus
],
content: '<table border="1"><tr><th colspan="1" rowspan="1"><p>Name</p></th><th colspan="1" rowspan="1"><p>Region</p></th><th colspan="1" rowspan="1"><p>Country</p></th></tr><tr><td colspan="1" rowspan="1"><p>Liberty Hays</p></td><td colspan="1" rowspan="1"><p>Araucanía</p></td><td colspan="1" rowspan="1"><p>Canada</p></td></tr></table>',
});How It Works
The pagination system automatically:
- Analyzes Table Structure: Examines rowspan attributes and table layout
- Groups Related Rows: Creates logical groups based on merged cells
- Optimizes Pagination: Ensures related content stays together across page breaks
- Maintains Consistency: Automatically updates grouping when table structure changes
License
This package is open-sourced software licensed under the MIT license.
