@zanwaar/tiptap-docs-kit 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 zanwaar
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,273 @@
+# tiptap-docs-kit
+
+`tiptap-docs-kit` adalah extension kit untuk membangun editor dokumen berbasis Tiptap dengan pengalaman seperti word processor (mirip Google Docs / Microsoft Word). Package ini menggabungkan extension umum, halaman A4/Letter, page break, pagination, alignment, warna teks, ukuran font, line spacing, gambar, dan style dokumen dalam satu tempat.
+
+![tiptap-docs-kit preview](./preview.png)
+
+## Tautan
+
+- Package (repo utama): https://github.com/zanwaar/tiptap-docs-kit
+- Demo implementasi (playground React): https://github.com/zanwaar/playground-react
+
+Jalankan demo secara lokal:
+
+```bash
+git clone https://github.com/zanwaar/playground-react
+cd playground-react
+npm install
+npm run dev
+```
+
+## Fitur
+
+- `DocsKit` sebagai satu extension bundle untuk editor dokumen.
+- Page model seperti Word/Docs dengan node `page` (A4 & Letter, potret/lanskap).
+- Pengaturan halaman: ukuran kertas, orientasi, dan margin (preset atau kustom per sisi dalam cm).
+- Page break dengan node `pageBreak`.
+- Pagination otomatis untuk menjaga konten antar halaman.
+- Heading (1/2/3) dan Normal text.
+- Text alignment untuk paragraph dan heading.
+- Text color, text font, dan text size (berbasis `pt`).
+- Line spacing (1, 1.15, 1.5, 2) plus spasi sebelum/sesudah paragraf.
+- Gambar yang dapat di-resize (drag handle), mendukung base64.
+- Table editing: insert, add/delete row/column, merge/split cell, resize column, dan grid.
+- Table-aware pagination yang memecah tabel panjang per row dengan header berulang.
+- Paragraf otomatis disisipkan di bawah tabel agar mudah lanjut menulis.
+- CSS dokumen satu file lewat `@zanwaar/tiptap-docs-kit/style.css`.
+- Helper untuk membuat dokumen kosong dan template dokumen.
+
+## Instalasi
+
+Install dari npm:
+
+```bash
+npm install @zanwaar/tiptap-docs-kit @tiptap/core @tiptap/pm @tiptap/starter-kit @tiptap/extension-image @tiptap/extension-table @tiptap/extension-table-cell @tiptap/extension-table-header @tiptap/extension-table-row
+```
+
+`tiptap-docs-kit` memakai package Tiptap di atas sebagai peer dependencies, jadi pastikan ikut terpasang.
+
+Untuk local development di monorepo/playground:
+
+```json
+{
+  "dependencies": {
+    "@zanwaar/tiptap-docs-kit": "file:../../packages/tiptap-docs-kit"
+  }
+}
+```
+
+Install dependency dari aplikasi consumer:
+
+```bash
+npm install
+```
+
+## Penggunaan React
+
+```tsx
+import { useEditor } from '@tiptap/react'
+import { DocsKit, createBlankWordPageDocument } from '@zanwaar/tiptap-docs-kit'
+import '@zanwaar/tiptap-docs-kit/style.css'
+
+export function Editor() {
+  const editor = useEditor({
+    extensions: [DocsKit],
+    content: createBlankWordPageDocument(),
+    editorProps: {
+      attributes: {
+        class: 'word-editor-document',
+      },
+    },
+  })
+
+  return editor
+}
+```
+
+## Pagination
+
+Gunakan `bindWordPagePagination` pada container scroll editor.
+
+```tsx
+import { useEffect, useRef } from 'react'
+import { EditorContent } from '@tiptap/react'
+import type { Editor } from '@tiptap/react'
+import { bindWordPagePagination } from '@zanwaar/tiptap-docs-kit'
+
+export function Workspace({ editor }: { editor: Editor | null }) {
+  const workspaceRef = useRef<HTMLElement>(null)
+
+  useEffect(() => {
+    if (!editor || !workspaceRef.current) return undefined
+
+    return bindWordPagePagination(editor, workspaceRef.current)
+  }, [editor])
+
+  return (
+    <main className="workspace" ref={workspaceRef}>
+      <EditorContent editor={editor} />
+    </main>
+  )
+}
+```
+
+## Commands
+
+Package ini menambahkan beberapa command ke Tiptap.
+
+### Page
+
+```ts
+editor.chain().focus().insertPage({ pageType: 'body' }).run()
+editor.chain().focus().setPageAttrs({ paperSize: 'a4', orientation: 'portrait', margin: 'narrow' }).run()
+editor.chain().focus().setPageAttrs({ marginValue: '2cm 1.5cm 1.5cm 1.5cm' }).run()
+editor.chain().focus().insertPageBreak().run()
+editor.chain().focus().insertWordPageTemplate('cover').run()
+```
+
+### Text Align
+
+```ts
+editor.chain().focus().setTextAlign('left').run()
+editor.chain().focus().setTextAlign('center').run()
+editor.chain().focus().setTextAlign('right').run()
+editor.chain().focus().setTextAlign('justify').run()
+```
+
+### Text Color, Font, Size
+
+```ts
+editor.chain().focus().setTextColor('#063f81').run()
+editor.chain().focus().unsetTextColor().run()
+editor.chain().focus().setTextFont('Roboto, Arial, sans-serif').run()
+editor.chain().focus().setTextSize('11pt').run()
+```
+
+### Line Spacing
+
+```ts
+editor.chain().focus().setLineSpacing('1.5').run()
+editor.chain().focus().unsetLineSpacing().run()
+editor.chain().focus().setParagraphSpaceBefore('12pt').run()
+editor.chain().focus().setParagraphSpaceAfter('12pt').run()
+```
+
+### Image
+
+```ts
+// Disisipkan sebagai node image. Bisa base64 atau URL.
+editor.chain().focus().insertContent({ type: 'image', attrs: { src, alt: 'Gambar' } }).run()
+```
+
+Gambar dapat di-resize dengan menarik handle di pojok kanan bawah. Lebar disimpan pada atribut `width` node image.
+
+### Table
+
+```ts
+editor.chain().focus().insertTable({ rows: 3, cols: 3, withHeaderRow: true }).run()
+editor.chain().focus().insertGrid({ rows: 4, cols: 4 }).run()
+editor.chain().focus().addColumnAfter().run()
+editor.chain().focus().addRowAfter().run()
+editor.chain().focus().deleteColumn().run()
+editor.chain().focus().deleteRow().run()
+editor.chain().focus().deleteTable().run()
+editor.chain().focus().mergeCells().run()
+editor.chain().focus().splitCell().run()
+```
+
+Tabel panjang akan dipisah antar halaman pada batas row. Jika tabel memiliki header row, header akan diulang pada tabel lanjutan di halaman berikutnya.
+
+## Konfigurasi DocsKit
+
+`DocsKit` bisa dikonfigurasi per extension.
+
+```ts
+DocsKit.configure({
+  starterKit: {},
+  textAlign: { types: ['paragraph', 'heading'] },
+  textColor: {},
+  textFont: {},
+  textSize: {},
+  paragraphSpacing: { types: ['paragraph', 'heading'] },
+  table: { resizable: true },
+  tableCell: {},
+  tableHeader: {},
+  tableRow: {},
+  page: { pasteAsPlainText: true },
+  pageBreak: {},
+  image: { inline: false, allowBase64: true },
+})
+```
+
+Set salah satu opsi ke `false` untuk menonaktifkan extension tersebut.
+
+```ts
+DocsKit.configure({
+  textColor: false,
+})
+```
+
+## CSS
+
+Import style sekali di aplikasi consumer:
+
+```ts
+import '@zanwaar/tiptap-docs-kit/style.css'
+```
+
+Style utama dikontrol melalui CSS variables:
+
+```css
+.word-editor-document {
+  --word-page-width: 794px;
+  --word-page-height: 1123px;
+  --word-page-padding: 96px;
+  --word-page-text-color: #49454f;
+  --word-page-font-family: Roboto, Arial, sans-serif;
+  --word-page-font-size: 11pt;
+  --word-page-line-height: 1.15;
+}
+```
+
+## Exports
+
+```ts
+import {
+  DocsKit,
+  Page,
+  PageBreak,
+  Table,
+  TableCell,
+  TableHeader,
+  TableRow,
+  TextAlign,
+  TextColor,
+  TextFont,
+  TextSize,
+  ParagraphSpacing,
+  ResizableImage,
+  bindWordPagePagination,
+  mergeSplitWordParagraphs,
+  normalizeWordPages,
+  createBlankWordPageDocument,
+  createWordPage,
+  createWordPageDocument,
+  createWordPageTemplate,
+} from '@zanwaar/tiptap-docs-kit'
+```
+
+## Development
+
+Jalankan dari folder package:
+
+```bash
+npm install
+npm run build
+npm run lint
+```
+
+Build akan menghasilkan output ke `dist/` dan menyalin `src/style.css` menjadi `dist/style.css`.
+
+## Catatan Arsitektur
+
+Package ini fokus pada logic Tiptap dan CSS dokumen. UI React seperti toolbar, status bar, sidebar, atau dialog color picker sebaiknya tetap berada di aplikasi consumer atau package React terpisah. Lihat contoh implementasi UI lengkap di https://github.com/zanwaar/playground-react.

package/dist/extensions/ParagraphSpacing.d.ts

@@ -0,0 +1,16 @@
+import { Extension } from '@tiptap/core';
+export interface ParagraphSpacingOptions {
+    types: string[];
+}
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        paragraphSpacing: {
+            setLineSpacing: (lineHeight: string) => ReturnType;
+            unsetLineSpacing: () => ReturnType;
+            setParagraphSpaceBefore: (spaceBefore: string | null) => ReturnType;
+            setParagraphSpaceAfter: (spaceAfter: string | null) => ReturnType;
+        };
+    }
+}
+export declare const ParagraphSpacing: Extension<ParagraphSpacingOptions, any>;
+//# sourceMappingURL=ParagraphSpacing.d.ts.map

package/dist/extensions/ParagraphSpacing.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ParagraphSpacing.d.ts","sourceRoot":"","sources":["../../src/extensions/ParagraphSpacing.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAExC,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,MAAM,EAAE,CAAA;CAChB;AAED,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,gBAAgB,EAAE;YAChB,cAAc,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,UAAU,CAAA;YAClD,gBAAgB,EAAE,MAAM,UAAU,CAAA;YAClC,uBAAuB,EAAE,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,KAAK,UAAU,CAAA;YACnE,sBAAsB,EAAE,CAAC,UAAU,EAAE,MAAM,GAAG,IAAI,KAAK,UAAU,CAAA;SAClE,CAAA;KACF;CACF;AAQD,eAAO,MAAM,gBAAgB,yCA+D3B,CAAA"}

package/dist/extensions/ParagraphSpacing.js

@@ -0,0 +1,64 @@
+import { Extension } from '@tiptap/core';
+const updateTextblockAttributes = (commands, types, attributes) => types.some((type) => commands.updateAttributes(type, attributes));
+export const ParagraphSpacing = Extension.create({
+    name: 'paragraphSpacing',
+    addOptions() {
+        return {
+            types: ['paragraph', 'heading'],
+        };
+    },
+    addGlobalAttributes() {
+        return [
+            {
+                types: this.options.types,
+                attributes: {
+                    lineHeight: {
+                        default: null,
+                        parseHTML: (element) => element.style.lineHeight || element.getAttribute('data-line-height'),
+                        renderHTML: (attributes) => {
+                            if (!attributes.lineHeight)
+                                return {};
+                            return {
+                                'data-line-height': attributes.lineHeight,
+                                style: `line-height: ${attributes.lineHeight}`,
+                            };
+                        },
+                    },
+                    spaceBefore: {
+                        default: null,
+                        parseHTML: (element) => element.style.marginTop || element.getAttribute('data-space-before'),
+                        renderHTML: (attributes) => {
+                            if (!attributes.spaceBefore)
+                                return {};
+                            return {
+                                'data-space-before': attributes.spaceBefore,
+                                style: `margin-top: ${attributes.spaceBefore}`,
+                            };
+                        },
+                    },
+                    spaceAfter: {
+                        default: null,
+                        parseHTML: (element) => element.style.marginBottom || element.getAttribute('data-space-after'),
+                        renderHTML: (attributes) => {
+                            if (!attributes.spaceAfter)
+                                return {};
+                            return {
+                                'data-space-after': attributes.spaceAfter,
+                                style: `margin-bottom: ${attributes.spaceAfter}`,
+                            };
+                        },
+                    },
+                },
+            },
+        ];
+    },
+    addCommands() {
+        return {
+            setLineSpacing: (lineHeight) => ({ commands }) => updateTextblockAttributes(commands, this.options.types, { lineHeight }),
+            unsetLineSpacing: () => ({ commands }) => updateTextblockAttributes(commands, this.options.types, { lineHeight: null }),
+            setParagraphSpaceBefore: (spaceBefore) => ({ commands }) => updateTextblockAttributes(commands, this.options.types, { spaceBefore }),
+            setParagraphSpaceAfter: (spaceAfter) => ({ commands }) => updateTextblockAttributes(commands, this.options.types, { spaceAfter }),
+        };
+    },
+});
+//# sourceMappingURL=ParagraphSpacing.js.map

package/dist/extensions/ParagraphSpacing.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ParagraphSpacing.js","sourceRoot":"","sources":["../../src/extensions/ParagraphSpacing.ts"],"names":[],"mappings":"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"}

package/dist/extensions/ResizableImage.d.ts

@@ -0,0 +1,2 @@
+export declare const ResizableImage: import("@tiptap/core").Node<import("@tiptap/extension-image").ImageOptions, any>;
+//# sourceMappingURL=ResizableImage.d.ts.map

package/dist/extensions/ResizableImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResizableImage.d.ts","sourceRoot":"","sources":["../../src/extensions/ResizableImage.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,kFA0FzB,CAAA"}

package/dist/extensions/ResizableImage.js

@@ -0,0 +1,82 @@
+import Image from '@tiptap/extension-image';
+export const ResizableImage = Image.extend({
+    name: 'image',
+    addAttributes() {
+        return {
+            ...this.parent?.(),
+            width: {
+                default: null,
+                parseHTML: (element) => element.getAttribute('width') || element.style.width || null,
+                renderHTML: (attributes) => {
+                    if (!attributes.width)
+                        return {};
+                    const width = typeof attributes.width === 'number' ? `${attributes.width}px` : attributes.width;
+                    return { style: `width: ${width}` };
+                },
+            },
+        };
+    },
+    addNodeView() {
+        return ({ node, editor, getPos }) => {
+            const container = document.createElement('div');
+            container.className = 'word-page-image-wrapper';
+            const image = document.createElement('img');
+            image.src = node.attrs.src ?? '';
+            if (node.attrs.alt)
+                image.alt = node.attrs.alt;
+            if (node.attrs.title)
+                image.title = node.attrs.title;
+            if (node.attrs.width)
+                image.style.width = typeof node.attrs.width === 'number' ? `${node.attrs.width}px` : node.attrs.width;
+            image.className = 'word-page-image';
+            const handle = document.createElement('span');
+            handle.className = 'word-page-image-handle';
+            handle.setAttribute('contenteditable', 'false');
+            container.append(image, handle);
+            const startResize = (event) => {
+                event.preventDefault();
+                event.stopPropagation();
+                const startX = event.clientX;
+                const startWidth = image.getBoundingClientRect().width;
+                const onMouseMove = (moveEvent) => {
+                    const nextWidth = Math.max(40, Math.round(startWidth + (moveEvent.clientX - startX)));
+                    image.style.width = `${nextWidth}px`;
+                };
+                const onMouseUp = () => {
+                    document.removeEventListener('mousemove', onMouseMove);
+                    document.removeEventListener('mouseup', onMouseUp);
+                    if (typeof getPos !== 'function')
+                        return;
+                    const position = getPos();
+                    if (typeof position !== 'number')
+                        return;
+                    const finalWidth = Math.round(image.getBoundingClientRect().width);
+                    editor.view.dispatch(editor.view.state.tr.setNodeMarkup(position, undefined, {
+                        ...node.attrs,
+                        width: `${finalWidth}px`,
+                    }));
+                };
+                document.addEventListener('mousemove', onMouseMove);
+                document.addEventListener('mouseup', onMouseUp);
+            };
+            handle.addEventListener('mousedown', startResize);
+            return {
+                dom: container,
+                update: (updatedNode) => {
+                    if (updatedNode.type.name !== this.name)
+                        return false;
+                    image.src = updatedNode.attrs.src ?? '';
+                    image.alt = updatedNode.attrs.alt ?? '';
+                    image.style.width = updatedNode.attrs.width
+                        ? (typeof updatedNode.attrs.width === 'number' ? `${updatedNode.attrs.width}px` : updatedNode.attrs.width)
+                        : '';
+                    return true;
+                },
+                destroy: () => {
+                    handle.removeEventListener('mousedown', startResize);
+                },
+            };
+        };
+    },
+});
+//# sourceMappingURL=ResizableImage.js.map

package/dist/extensions/ResizableImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResizableImage.js","sourceRoot":"","sources":["../../src/extensions/ResizableImage.ts"],"names":[],"mappings":"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"}

package/dist/extensions/TextAlign.d.ts

@@ -0,0 +1,15 @@
+import { Extension } from '@tiptap/core';
+type TextAlignment = 'left' | 'center' | 'right' | 'justify';
+interface TextAlignOptions {
+    types: string[];
+}
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        textAlign: {
+            setTextAlign: (alignment: TextAlignment) => ReturnType;
+        };
+    }
+}
+export declare const TextAlign: Extension<TextAlignOptions, any>;
+export {};
+//# sourceMappingURL=TextAlign.d.ts.map

package/dist/extensions/TextAlign.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextAlign.d.ts","sourceRoot":"","sources":["../../src/extensions/TextAlign.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAExC,KAAK,aAAa,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAA;AAE5D,UAAU,gBAAgB;IACxB,KAAK,EAAE,MAAM,EAAE,CAAA;CAChB;AAED,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,SAAS,EAAE;YACT,YAAY,EAAE,CAAC,SAAS,EAAE,aAAa,KAAK,UAAU,CAAA;SACvD,CAAA;KACF;CACF;AAED,eAAO,MAAM,SAAS,kCAqCpB,CAAA"}

package/dist/extensions/TextAlign.js

@@ -0,0 +1,37 @@
+import { Extension } from '@tiptap/core';
+export const TextAlign = Extension.create({
+    name: 'textAlign',
+    addOptions() {
+        return {
+            types: ['paragraph', 'heading'],
+        };
+    },
+    addGlobalAttributes() {
+        return [
+            {
+                types: this.options.types,
+                attributes: {
+                    textAlign: {
+                        default: null,
+                        parseHTML: (element) => element.style.textAlign || null,
+                        renderHTML: (attributes) => {
+                            if (!attributes.textAlign)
+                                return {};
+                            return {
+                                style: `text-align: ${attributes.textAlign}`,
+                            };
+                        },
+                    },
+                },
+            },
+        ];
+    },
+    addCommands() {
+        return {
+            setTextAlign: (alignment) => ({ commands }) => this.options.types
+                .map((type) => commands.updateAttributes(type, { textAlign: alignment }))
+                .some(Boolean),
+        };
+    },
+});
+//# sourceMappingURL=TextAlign.js.map

package/dist/extensions/TextAlign.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextAlign.js","sourceRoot":"","sources":["../../src/extensions/TextAlign.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAgBxC,MAAM,CAAC,MAAM,SAAS,GAAG,SAAS,CAAC,MAAM,CAAmB;IAC1D,IAAI,EAAE,WAAW;IAEjB,UAAU;QACR,OAAO;YACL,KAAK,EAAE,CAAC,WAAW,EAAE,SAAS,CAAC;SAChC,CAAA;IACH,CAAC;IAED,mBAAmB;QACjB,OAAO;YACL;gBACE,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,KAAK;gBACzB,UAAU,EAAE;oBACV,SAAS,EAAE;wBACT,OAAO,EAAE,IAAI;wBACb,SAAS,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,IAAI,IAAI;wBACvD,UAAU,EAAE,CAAC,UAAU,EAAE,EAAE;4BACzB,IAAI,CAAC,UAAU,CAAC,SAAS;gCAAE,OAAO,EAAE,CAAA;4BAEpC,OAAO;gCACL,KAAK,EAAE,eAAe,UAAU,CAAC,SAAS,EAAE;6BAC7C,CAAA;wBACH,CAAC;qBACF;iBACF;aACF;SACF,CAAA;IACH,CAAC;IAED,WAAW;QACT,OAAO;YACL,YAAY,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK;iBAC9D,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,QAAQ,CAAC,gBAAgB,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC,CAAC;iBACxE,IAAI,CAAC,OAAO,CAAC;SACjB,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}

package/dist/extensions/TextColor.d.ts

@@ -0,0 +1,14 @@
+import { Mark } from '@tiptap/core';
+export interface TextColorOptions {
+    HTMLAttributes: Record<string, unknown>;
+}
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        textColor: {
+            setTextColor: (color: string) => ReturnType;
+            unsetTextColor: () => ReturnType;
+        };
+    }
+}
+export declare const TextColor: Mark<TextColorOptions, any>;
+//# sourceMappingURL=TextColor.d.ts.map

package/dist/extensions/TextColor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextColor.d.ts","sourceRoot":"","sources":["../../src/extensions/TextColor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAA;AAEpD,MAAM,WAAW,gBAAgB;IAC/B,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;CACxC;AAED,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,SAAS,EAAE;YACT,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,UAAU,CAAA;YAC3C,cAAc,EAAE,MAAM,UAAU,CAAA;SACjC,CAAA;KACF;CACF;AAED,eAAO,MAAM,SAAS,6BAgDpB,CAAA"}

package/dist/extensions/TextColor.js

@@ -0,0 +1,46 @@
+import { Mark, mergeAttributes } from '@tiptap/core';
+export const TextColor = Mark.create({
+    name: 'textColor',
+    addOptions() {
+        return {
+            HTMLAttributes: {},
+        };
+    },
+    addAttributes() {
+        return {
+            color: {
+                default: null,
+                parseHTML: (element) => element.style.color || element.getAttribute('data-text-color'),
+                renderHTML: (attributes) => {
+                    if (!attributes.color)
+                        return {};
+                    return {
+                        'data-text-color': attributes.color,
+                        style: `color: ${attributes.color}`,
+                    };
+                },
+            },
+        };
+    },
+    parseHTML() {
+        return [
+            {
+                tag: 'span[data-text-color]',
+            },
+            {
+                style: 'color',
+                getAttrs: (color) => (typeof color === 'string' ? { color } : false),
+            },
+        ];
+    },
+    renderHTML({ HTMLAttributes }) {
+        return ['span', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0];
+    },
+    addCommands() {
+        return {
+            setTextColor: (color) => ({ commands }) => commands.setMark(this.name, { color }),
+            unsetTextColor: () => ({ commands }) => commands.unsetMark(this.name),
+        };
+    },
+});
+//# sourceMappingURL=TextColor.js.map

package/dist/extensions/TextColor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextColor.js","sourceRoot":"","sources":["../../src/extensions/TextColor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAepD,MAAM,CAAC,MAAM,SAAS,GAAG,IAAI,CAAC,MAAM,CAAmB;IACrD,IAAI,EAAE,WAAW;IAEjB,UAAU;QACR,OAAO;YACL,cAAc,EAAE,EAAE;SACnB,CAAA;IACH,CAAC;IAED,aAAa;QACX,OAAO;YACL,KAAK,EAAE;gBACL,OAAO,EAAE,IAAI;gBACb,SAAS,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,IAAI,OAAO,CAAC,YAAY,CAAC,iBAAiB,CAAC;gBACtF,UAAU,EAAE,CAAC,UAAU,EAAE,EAAE;oBACzB,IAAI,CAAC,UAAU,CAAC,KAAK;wBAAE,OAAO,EAAE,CAAA;oBAEhC,OAAO;wBACL,iBAAiB,EAAE,UAAU,CAAC,KAAK;wBACnC,KAAK,EAAE,UAAU,UAAU,CAAC,KAAK,EAAE;qBACpC,CAAA;gBACH,CAAC;aACF;SACF,CAAA;IACH,CAAC;IAED,SAAS;QACP,OAAO;YACL;gBACE,GAAG,EAAE,uBAAuB;aAC7B;YACD;gBACE,KAAK,EAAE,OAAO;gBACd,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC;aACrE;SACF,CAAA;IACH,CAAC;IAED,UAAU,CAAC,EAAE,cAAc,EAAE;QAC3B,OAAO,CAAC,MAAM,EAAE,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,EAAE,cAAc,CAAC,EAAE,CAAC,CAAC,CAAA;IAClF,CAAC;IAED,WAAW;QACT,OAAO;YACL,YAAY,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,CAAC;YACjF,cAAc,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,QAAQ,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;SACtE,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}

package/dist/extensions/TextFont.d.ts

@@ -0,0 +1,14 @@
+import { Mark } from '@tiptap/core';
+export interface TextFontOptions {
+    HTMLAttributes: Record<string, unknown>;
+}
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        textFont: {
+            setTextFont: (fontFamily: string) => ReturnType;
+            unsetTextFont: () => ReturnType;
+        };
+    }
+}
+export declare const TextFont: Mark<TextFontOptions, any>;
+//# sourceMappingURL=TextFont.d.ts.map

package/dist/extensions/TextFont.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextFont.d.ts","sourceRoot":"","sources":["../../src/extensions/TextFont.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAA;AAEpD,MAAM,WAAW,eAAe;IAC9B,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;CACxC;AAED,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,QAAQ,EAAE;YACR,WAAW,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,UAAU,CAAA;YAC/C,aAAa,EAAE,MAAM,UAAU,CAAA;SAChC,CAAA;KACF;CACF;AAQD,eAAO,MAAM,QAAQ,4BAsDnB,CAAA"}