From 31ff04e8ab47a200376c95c1e7ce2c7d5348a40b Mon Sep 17 00:00:00 2001 From: zbeyens Date: Wed, 6 Nov 2024 01:26:44 +0000 Subject: [PATCH] docs --- components.json | 2 +- package.json | 13 +- pnpm-lock.yaml | 63 ++-- src/components/editor/plate-types.ts | 50 --- src/components/editor/plugins/ai-plugins.tsx | 55 +-- src/components/editor/plugins/align-plugin.ts | 17 + .../editor/plugins/autoformat-plugin.ts | 70 +--- .../editor/plugins/basic-nodes-plugins.tsx | 14 + .../editor/plugins/block-menu-plugins.ts | 13 + .../editor/plugins/block-selection-plugins.ts | 23 ++ .../editor/plugins/comments-plugin.tsx | 24 ++ ...copilot-plugins.tsx => copilot-plugins.ts} | 2 +- .../editor/plugins/delete-plugins.ts | 20 ++ src/components/editor/plugins/dnd-plugins.tsx | 22 ++ .../editor/plugins/editor-plugins.tsx | 98 +++++ .../editor/plugins/exit-break-plugin.ts | 28 ++ .../editor/plugins/indent-list-plugins.ts | 57 +++ .../editor/plugins/line-height-plugin.ts | 15 + src/components/editor/plugins/link-plugin.tsx | 9 + .../editor/plugins/media-plugins.tsx | 29 ++ .../editor/plugins/mention-plugin.ts | 7 + .../editor/plugins/reset-block-type-plugin.ts | 63 ++++ .../editor/plugins/soft-break-plugin.ts | 30 ++ .../editor/plugins/tabbable-plugin.ts | 34 ++ src/components/editor/plugins/table-plugin.ts | 9 + src/components/editor/plugins/toc-plugin.ts | 11 + src/components/editor/use-chat.tsx | 10 +- src/components/editor/use-create-editor.tsx | 336 +----------------- .../plate-ui/fixed-toolbar-buttons.tsx | 8 - .../plate-ui/indent-fire-marker.tsx | 22 ++ src/components/plate-ui/list-element.tsx | 31 -- .../plate-ui/list-toolbar-button.tsx | 36 -- src/components/plate-ui/with-draggables.tsx | 14 +- 33 files changed, 608 insertions(+), 627 deletions(-) create mode 100644 src/components/editor/plugins/align-plugin.ts create mode 100644 src/components/editor/plugins/basic-nodes-plugins.tsx create mode 100644 src/components/editor/plugins/block-menu-plugins.ts create mode 100644 src/components/editor/plugins/block-selection-plugins.ts create mode 100644 src/components/editor/plugins/comments-plugin.tsx rename src/components/editor/plugins/{copilot-plugins.tsx => copilot-plugins.ts} (95%) create mode 100644 src/components/editor/plugins/delete-plugins.ts create mode 100644 src/components/editor/plugins/dnd-plugins.tsx create mode 100644 src/components/editor/plugins/editor-plugins.tsx create mode 100644 src/components/editor/plugins/exit-break-plugin.ts create mode 100644 src/components/editor/plugins/indent-list-plugins.ts create mode 100644 src/components/editor/plugins/line-height-plugin.ts create mode 100644 src/components/editor/plugins/link-plugin.tsx create mode 100644 src/components/editor/plugins/media-plugins.tsx create mode 100644 src/components/editor/plugins/mention-plugin.ts create mode 100644 src/components/editor/plugins/reset-block-type-plugin.ts create mode 100644 src/components/editor/plugins/soft-break-plugin.ts create mode 100644 src/components/editor/plugins/tabbable-plugin.ts create mode 100644 src/components/editor/plugins/table-plugin.ts create mode 100644 src/components/editor/plugins/toc-plugin.ts create mode 100644 src/components/plate-ui/indent-fire-marker.tsx delete mode 100644 src/components/plate-ui/list-element.tsx delete mode 100644 src/components/plate-ui/list-toolbar-button.tsx diff --git a/components.json b/components.json index 64c647d..acea771 100644 --- a/components.json +++ b/components.json @@ -12,7 +12,7 @@ "aliases": { "ui": "@/components/plate-ui" }, - "url": "https://platejs.org/r" + "url": "http://localhost:3000/r" } }, "rsc": true, diff --git a/package.json b/package.json index 300c0c0..0fc64d1 100644 --- a/package.json +++ b/package.json @@ -27,7 +27,7 @@ "@radix-ui/react-toolbar": "^1.1.0", "@radix-ui/react-tooltip": "^1.1.3", "@udecode/cn": "^39.0.0", - "@udecode/plate-ai": "^39.2.19", + "@udecode/plate-ai": "39.3.0", "@udecode/plate-alignment": "^39.0.0", "@udecode/plate-autoformat": "^39.0.0", "@udecode/plate-basic-elements": "^39.0.0", @@ -42,8 +42,8 @@ "@udecode/plate-common": "^39.2.21", "@udecode/plate-cursor": "^39.2.11", "@udecode/plate-date": "^39.0.0", - "@udecode/plate-dnd": "^39.0.0", - "@udecode/plate-docx": "^39.2.13", + "@udecode/plate-dnd": "39.3.0", + "@udecode/plate-docx": "39.3.3", "@udecode/plate-emoji": "^39.0.0", "@udecode/plate-excalidraw": "^39.0.0", "@udecode/plate-floating": "^39.1.6", @@ -58,11 +58,10 @@ "@udecode/plate-layout": "^39.0.0", "@udecode/plate-line-height": "^39.0.0", "@udecode/plate-link": "^39.1.9", - "@udecode/plate-list": "^39.0.0", "@udecode/plate-markdown": "^39.2.0", "@udecode/plate-math": "^39.2.0", - "@udecode/plate-media": "^39.2.13", - "@udecode/plate-mention": "^39.0.0", + "@udecode/plate-media": "39.3.3", + "@udecode/plate-mention": "39.3.4", "@udecode/plate-node-id": "^39.0.0", "@udecode/plate-reset-node": "^39.0.0", "@udecode/plate-resizable": "^39.1.6", @@ -129,4 +128,4 @@ ] } } -} +} \ No newline at end of file diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 4532702..aa6683f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -51,8 +51,8 @@ importers: specifier: ^39.0.0 version: 39.0.0(@types/react@18.3.12)(class-variance-authority@0.7.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(tailwind-merge@2.5.4) '@udecode/plate-ai': - specifier: ^39.2.19 - version: 39.2.19(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) + specifier: 39.3.0 + version: 39.3.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-alignment': specifier: ^39.0.0 version: 39.0.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) @@ -96,11 +96,11 @@ importers: specifier: ^39.0.0 version: 39.0.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-dnd': - specifier: ^39.0.0 - version: 39.0.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dnd-html5-backend@16.0.1)(react-dnd@16.0.1(@types/node@22.8.6)(@types/react@18.3.12)(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) + specifier: 39.3.0 + version: 39.3.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dnd-html5-backend@16.0.1)(react-dnd@16.0.1(@types/node@22.8.6)(@types/react@18.3.12)(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-docx': - specifier: ^39.2.13 - version: 39.2.13(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) + specifier: 39.3.3 + version: 39.3.3(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-emoji': specifier: ^39.0.0 version: 39.0.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) @@ -143,9 +143,6 @@ importers: '@udecode/plate-link': specifier: ^39.1.9 version: 39.1.9(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) - '@udecode/plate-list': - specifier: ^39.0.0 - version: 39.0.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-markdown': specifier: ^39.2.0 version: 39.2.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) @@ -153,11 +150,11 @@ importers: specifier: ^39.2.0 version: 39.2.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-media': - specifier: ^39.2.13 - version: 39.2.13(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) + specifier: 39.3.3 + version: 39.3.3(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-mention': - specifier: ^39.0.0 - version: 39.0.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) + specifier: 39.3.4 + version: 39.3.4(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-node-id': specifier: ^39.0.0 version: 39.0.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) @@ -1394,8 +1391,8 @@ packages: react-dom: '>=16.8.0' tailwind-merge: '>=2.2.0' - '@udecode/plate-ai@39.2.19': - resolution: {integrity: sha512-khOmvWALhzg+CJ4rdXA9D4iGKIM56ITgjKZOLm2h+OsLVuYusUqLTAjUlphuzbhGwcPDFfA+4UWZWpvGwGAaIQ==} + '@udecode/plate-ai@39.3.0': + resolution: {integrity: sha512-+9jCrpaMn2CRTxPq0ZB8lTXeNZtOvx8yphS/o9s+tnbfNmuRIAEfsDOez4Gn5UAfllNwfDyGpgtaV5UJ//vAgA==} peerDependencies: '@udecode/plate-common': '>=39.2.13' react: '>=16.8.0' @@ -1568,10 +1565,10 @@ packages: slate-hyperscript: '>=0.66.0' slate-react: '>=0.99.0' - '@udecode/plate-dnd@39.0.0': - resolution: {integrity: sha512-y5+Lv8V6o8aTh+wZEBoWeAisokdpBoVlVeMXZFTgPwquGlv+lkdb1BG4CF9JtdQVtdkmeh36Zfk6z4UT8pyYzg==} + '@udecode/plate-dnd@39.3.0': + resolution: {integrity: sha512-m8F9aE9/ZAgsLBIvHKNJNpboV5PU4JlFWT2Im87icmQhKMaD+z7Ft1yDf+6o2Q/BhttKVytsUt92Vgv0Fk5EUQ==} peerDependencies: - '@udecode/plate-common': '>=39.0.0' + '@udecode/plate-common': '>=39.2.21' react: '>=16.8.0' react-dnd: '>=14.0.0' react-dnd-html5-backend: '>=14.0.0' @@ -1581,10 +1578,10 @@ packages: slate-hyperscript: '>=0.66.0' slate-react: '>=0.108.0' - '@udecode/plate-docx@39.2.13': - resolution: {integrity: sha512-vkljANWZLE8fq2uZ1gAWTHq5xoyrowcL9p3LC31TJEw3w0YRjs+uZCtgZAy+UY3Nn7Ef9oSzAjU/7YUSek2xBA==} + '@udecode/plate-docx@39.3.3': + resolution: {integrity: sha512-BPtKdEYpKrgO9KMyIZmb+bt5dp5dArvS2TQqU/ZNdph5cKrTHsC9WazzBHasX61qT4focp/VHfMAMtO1Kf8vwA==} peerDependencies: - '@udecode/plate-common': '>=39.2.13' + '@udecode/plate-common': '>=39.2.21' react: '>=16.8.0' react-dom: '>=16.8.0' slate: '>=0.103.0' @@ -1779,10 +1776,10 @@ packages: slate-hyperscript: '>=0.66.0' slate-react: '>=0.108.0' - '@udecode/plate-media@39.2.13': - resolution: {integrity: sha512-NMudooBHWq9tTtlj9RLrNQ17zwrahpFrvLQ6gx1jefbtQ/mVx1GB9+1CE8StsvSA2iOoceYuECdnRkbnY1s4sA==} + '@udecode/plate-media@39.3.3': + resolution: {integrity: sha512-H+VffX5dUYb1mBjPHw2Qu659I/YQau5MsW8K1SNM90gpp6brzpkDbglZhRjqgqLO11UK7yGBtB3ffDCdf7P9ng==} peerDependencies: - '@udecode/plate-common': '>=39.2.13' + '@udecode/plate-common': '>=39.2.21' react: '>=16.8.0' react-dom: '>=16.8.0' slate: '>=0.103.0' @@ -1790,10 +1787,10 @@ packages: slate-hyperscript: '>=0.66.0' slate-react: '>=0.108.0' - '@udecode/plate-mention@39.0.0': - resolution: {integrity: sha512-5ikECX8Ap2orI+2pVyYOTlbuwtV2fegdF0bOcKmvLunzsMUb/dPGf4gVuZOCKw8li0yhUm3spHg9XPg3vSfgmQ==} + '@udecode/plate-mention@39.3.4': + resolution: {integrity: sha512-vU6VK7Bv+FVaz8Q8IfVWtSflO6IbY3jQfkGvh/rkuJ1kUCtyjmrop4OfukPHuBRzUf9wcT4NUbA9oJgYI+X/Nw==} peerDependencies: - '@udecode/plate-common': '>=39.0.0' + '@udecode/plate-common': '>=39.2.21' react: '>=16.8.0' react-dom: '>=16.8.0' slate: '>=0.103.0' @@ -5037,7 +5034,7 @@ snapshots: transitivePeerDependencies: - '@types/react' - '@udecode/plate-ai@39.2.19(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2)': + '@udecode/plate-ai@39.3.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2)': dependencies: '@udecode/plate-common': 39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-markdown': 39.2.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) @@ -5243,7 +5240,7 @@ snapshots: slate-hyperscript: 0.100.0(slate@0.110.2) slate-react: 0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2) - '@udecode/plate-dnd@39.0.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dnd-html5-backend@16.0.1)(react-dnd@16.0.1(@types/node@22.8.6)(@types/react@18.3.12)(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2)': + '@udecode/plate-dnd@39.3.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dnd-html5-backend@16.0.1)(react-dnd@16.0.1(@types/node@22.8.6)(@types/react@18.3.12)(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2)': dependencies: '@udecode/plate-common': 39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) lodash: 4.17.21 @@ -5257,13 +5254,13 @@ snapshots: slate-hyperscript: 0.100.0(slate@0.110.2) slate-react: 0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2) - '@udecode/plate-docx@39.2.13(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2)': + '@udecode/plate-docx@39.3.3(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2)': dependencies: '@udecode/plate-common': 39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-heading': 39.0.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-indent': 39.0.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-indent-list': 39.1.10(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) - '@udecode/plate-media': 39.2.13(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) + '@udecode/plate-media': 39.3.3(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-table': 39.1.6(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) react: 18.3.1 react-dom: 18.3.1(react@18.3.1) @@ -5465,7 +5462,7 @@ snapshots: slate-hyperscript: 0.100.0(slate@0.110.2) slate-react: 0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2) - '@udecode/plate-media@39.2.13(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2)': + '@udecode/plate-media@39.3.3(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2)': dependencies: '@udecode/plate-common': 39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) js-video-url-parser: 0.5.1 @@ -5476,7 +5473,7 @@ snapshots: slate-hyperscript: 0.100.0(slate@0.110.2) slate-react: 0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2) - '@udecode/plate-mention@39.0.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2)': + '@udecode/plate-mention@39.3.4(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2)': dependencies: '@udecode/plate-combobox': 39.0.0(@udecode/plate-common@39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) '@udecode/plate-common': 39.2.21(@types/react@18.3.12)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(scheduler@0.23.2)(slate-history@0.110.3(slate@0.110.2))(slate-hyperscript@0.100.0(slate@0.110.2))(slate-react@0.111.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(slate-dom@0.111.0(slate@0.110.2))(slate@0.110.2))(slate@0.110.2) diff --git a/src/components/editor/plate-types.ts b/src/components/editor/plate-types.ts index 32b8e0b..75e79cf 100644 --- a/src/components/editor/plate-types.ts +++ b/src/components/editor/plate-types.ts @@ -16,13 +16,6 @@ import type { HEADING_KEYS } from '@udecode/plate-heading'; import type { HorizontalRulePlugin } from '@udecode/plate-horizontal-rule/react'; import type { TLinkElement } from '@udecode/plate-link'; import type { LinkPlugin } from '@udecode/plate-link/react'; -import type { TTodoListItemElement } from '@udecode/plate-list'; -import type { - BulletedListPlugin, - ListItemPlugin, - NumberedListPlugin, - TodoListPlugin, -} from '@udecode/plate-list/react'; import type { TImageElement, TMediaEmbedElement } from '@udecode/plate-media'; import type { ImagePlugin, MediaEmbedPlugin } from '@udecode/plate-media/react'; import type { @@ -142,21 +135,6 @@ export interface MyH3Element extends MyBlockElement { type: typeof HEADING_KEYS.h3; } -export interface MyH4Element extends MyBlockElement { - children: MyInlineChildren; - type: typeof HEADING_KEYS.h4; -} - -export interface MyH5Element extends MyBlockElement { - children: MyInlineChildren; - type: typeof HEADING_KEYS.h5; -} - -export interface MyH6Element extends MyBlockElement { - children: MyInlineChildren; - type: typeof HEADING_KEYS.h6; -} - export interface MyBlockquoteElement extends MyBlockElement { children: MyInlineChildren; type: typeof BlockquotePlugin.key; @@ -187,28 +165,6 @@ export interface MyTableCellElement extends TElement { type: typeof TableCellPlugin.key; } -export interface MyBulletedListElement extends TElement, MyBlockElement { - children: MyListItemElement[]; - type: typeof BulletedListPlugin.key; -} - -export interface MyNumberedListElement extends TElement, MyBlockElement { - children: MyListItemElement[]; - type: typeof NumberedListPlugin.key; -} - -export interface MyListItemElement extends TElement, MyBlockElement { - children: MyInlineChildren; - type: typeof ListItemPlugin.key; -} - -export interface MyTodoListElement - extends TTodoListItemElement, - MyBlockElement { - children: MyInlineChildren; - type: typeof TodoListPlugin.key; -} - export interface MyToggleElement extends TToggleElement, MyBlockElement { children: MyInlineChildren; type: typeof TogglePlugin.key; @@ -242,22 +198,16 @@ export type MyNestableBlock = MyParagraphElement; export type MyRootBlock = | MyBlockquoteElement - | MyBulletedListElement | MyCodeBlockElement | MyExcalidrawElement | MyH1Element | MyH2Element | MyH3Element - | MyH4Element - | MyH5Element - | MyH6Element | MyHrElement | MyImageElement | MyMediaEmbedElement - | MyNumberedListElement | MyParagraphElement | MyTableElement - | MyTodoListElement | MyToggleElement; export type MyValue = MyRootBlock[]; diff --git a/src/components/editor/plugins/ai-plugins.tsx b/src/components/editor/plugins/ai-plugins.tsx index 34c4029..d5fa17d 100644 --- a/src/components/editor/plugins/ai-plugins.tsx +++ b/src/components/editor/plugins/ai-plugins.tsx @@ -22,19 +22,11 @@ import { PlateLeaf, createPlateEditor, } from '@udecode/plate-common/react'; -import { - FontBackgroundColorPlugin, - FontColorPlugin, -} from '@udecode/plate-font/react'; import { HEADING_KEYS } from '@udecode/plate-heading'; -import { HeadingPlugin } from '@udecode/plate-heading/react'; import { HorizontalRulePlugin } from '@udecode/plate-horizontal-rule/react'; -import { IndentPlugin } from '@udecode/plate-indent/react'; -import { IndentListPlugin } from '@udecode/plate-indent-list/react'; import { LinkPlugin } from '@udecode/plate-link/react'; import { MarkdownPlugin } from '@udecode/plate-markdown'; import { BlockSelectionPlugin } from '@udecode/plate-selection/react'; -import Prism from 'prismjs'; import { AIMenu } from '@/components/plate-ui/ai-menu'; import { BlockquoteElement } from '@/components/plate-ui/blockquote-element'; @@ -46,9 +38,12 @@ import { SelectionOverlayPlugin } from '@/components/plate-ui/cursor-overlay'; import { HeadingElement } from '@/components/plate-ui/heading-element'; import { HrElement } from '@/components/plate-ui/hr-element'; import { LinkElement } from '@/components/plate-ui/link-element'; -import { LinkFloatingToolbar } from '@/components/plate-ui/link-floating-toolbar'; import { ParagraphElement } from '@/components/plate-ui/paragraph-element'; +import { basicNodesPlugins } from './basic-nodes-plugins'; +import { indentListPlugins } from './indent-list-plugins'; +import { linkPlugin } from './link-plugin'; + const createAIEditor = () => { const editor = createPlateEditor({ id: 'ai', @@ -73,39 +68,12 @@ const createAIEditor = () => { }, plugins: [ ParagraphPlugin, - IndentPlugin.configure({ - inject: { - targetPlugins: [ - ParagraphPlugin.key, - HEADING_KEYS.h1, - HEADING_KEYS.h2, - HEADING_KEYS.h3, - BlockquotePlugin.key, - CodeBlockPlugin.key, - ], - }, - }), - IndentListPlugin.configure({ - inject: { - targetPlugins: [ - ParagraphPlugin.key, - HEADING_KEYS.h1, - HEADING_KEYS.h2, - HEADING_KEYS.h3, - BlockquotePlugin.key, - CodeBlockPlugin.key, - ], - }, - }), - HeadingPlugin.configure({ options: { levels: 3 } }), - BlockquotePlugin, - CodeBlockPlugin.configure({ options: { prism: Prism } }), + ...basicNodesPlugins, HorizontalRulePlugin, - LinkPlugin.configure({ - render: { afterEditable: () => }, - }), + linkPlugin, + ...indentListPlugins, MarkdownPlugin.configure({ options: { indentList: true } }), - // FIXME: Fixed the throw error: BlockSelectionPlugin is missing. readonly editor need'nt this plugin so using an empty plugin instead + // FIXME BlockSelectionPlugin.configure({ api: {}, extendEditor: null, @@ -114,13 +82,6 @@ const createAIEditor = () => { useHooks: null, handlers: {}, }), - BoldPlugin, - ItalicPlugin, - UnderlinePlugin, - StrikethroughPlugin, - CodePlugin, - FontColorPlugin, - FontBackgroundColorPlugin, ], value: [{ children: [{ text: '' }], type: 'p' }], }); diff --git a/src/components/editor/plugins/align-plugin.ts b/src/components/editor/plugins/align-plugin.ts new file mode 100644 index 0000000..24a7e28 --- /dev/null +++ b/src/components/editor/plugins/align-plugin.ts @@ -0,0 +1,17 @@ +'use client'; + +import { AlignPlugin } from '@udecode/plate-alignment/react'; +import { ParagraphPlugin } from '@udecode/plate-common/react'; +import { HEADING_LEVELS } from '@udecode/plate-heading'; +import { ImagePlugin, MediaEmbedPlugin } from '@udecode/plate-media/react'; + +export const alignPlugin = AlignPlugin.extend({ + inject: { + targetPlugins: [ + ParagraphPlugin.key, + ...HEADING_LEVELS, + MediaEmbedPlugin.key, + ImagePlugin.key, + ], + }, +}); diff --git a/src/components/editor/plugins/autoformat-plugin.ts b/src/components/editor/plugins/autoformat-plugin.ts index 54ae5cb..ca80d06 100644 --- a/src/components/editor/plugins/autoformat-plugin.ts +++ b/src/components/editor/plugins/autoformat-plugin.ts @@ -1,11 +1,7 @@ 'use client'; -import type { - AutoformatBlockRule, - AutoformatRule, -} from '@udecode/plate-autoformat'; +import type { AutoformatRule } from '@udecode/plate-autoformat'; import type { SlateEditor } from '@udecode/plate-common'; -import type { TTodoListItemElement } from '@udecode/plate-list'; import { autoformatArrow, @@ -34,7 +30,6 @@ import { import { getParentNode, insertNodes, - isBlock, isElement, isType, setNodes, @@ -48,18 +43,8 @@ import { ListStyleType, toggleIndentList, } from '@udecode/plate-indent-list'; -import { toggleList, unwrapList } from '@udecode/plate-list'; -import { - BulletedListPlugin, - ListItemPlugin, - NumberedListPlugin, - TodoListPlugin, -} from '@udecode/plate-list/react'; import { TogglePlugin, openNextToggles } from '@udecode/plate-toggle/react'; -export const preFormat: AutoformatBlockRule['preFormat'] = (editor) => - unwrapList(editor); - export const format = (editor: SlateEditor, customFormatting: any) => { if (editor.selection) { const parentEntry = getParentNode(editor, editor.selection); @@ -78,14 +63,6 @@ export const format = (editor: SlateEditor, customFormatting: any) => { } }; -export const formatList = (editor: SlateEditor, elementType: string) => { - format(editor, () => - toggleList(editor, { - type: elementType, - }) - ); -}; - export const autoformatMarks: AutoformatRule[] = [ { match: '***', @@ -163,43 +140,36 @@ export const autoformatBlocks: AutoformatRule[] = [ { match: '# ', mode: 'block', - preFormat, type: HEADING_KEYS.h1, }, { match: '## ', mode: 'block', - preFormat, type: HEADING_KEYS.h2, }, { match: '### ', mode: 'block', - preFormat, type: HEADING_KEYS.h3, }, { match: '#### ', mode: 'block', - preFormat, type: HEADING_KEYS.h4, }, { match: '##### ', mode: 'block', - preFormat, type: HEADING_KEYS.h5, }, { match: '###### ', mode: 'block', - preFormat, type: HEADING_KEYS.h6, }, { match: '> ', mode: 'block', - preFormat, type: BlockquotePlugin.key, }, { @@ -211,7 +181,6 @@ export const autoformatBlocks: AutoformatRule[] = [ }, match: '```', mode: 'block', - preFormat, triggerAtBlockStart: false, type: CodeBlockPlugin.key, }, @@ -235,42 +204,6 @@ export const autoformatBlocks: AutoformatRule[] = [ }, ]; -export const autoformatLists: AutoformatRule[] = [ - { - format: (editor) => formatList(editor, BulletedListPlugin.key), - match: ['* ', '- '], - mode: 'block', - preFormat, - type: ListItemPlugin.key, - }, - { - format: (editor) => formatList(editor, NumberedListPlugin.key), - match: [String.raw`^\d+\.$ `, String.raw`^\d+\)$ `], - matchByRegex: true, - mode: 'block', - preFormat, - type: ListItemPlugin.key, - }, - { - match: '[] ', - mode: 'block', - type: TodoListPlugin.key, - }, - { - format: (editor) => - setNodes( - editor, - { checked: true, type: TodoListPlugin.key }, - { - match: (n) => isBlock(editor, n), - } - ), - match: '[x] ', - mode: 'block', - type: TodoListPlugin.key, - }, -]; - export const autoformatIndentLists: AutoformatRule[] = [ { format: (editor) => { @@ -334,7 +267,6 @@ export const autoformatPlugin = AutoformatPlugin.configure({ ...autoformatLegalHtml, ...autoformatArrow, ...autoformatMath, - // Use autoformatLists instead if using ListPlugin ...autoformatIndentLists, ], }, diff --git a/src/components/editor/plugins/basic-nodes-plugins.tsx b/src/components/editor/plugins/basic-nodes-plugins.tsx new file mode 100644 index 0000000..e336e24 --- /dev/null +++ b/src/components/editor/plugins/basic-nodes-plugins.tsx @@ -0,0 +1,14 @@ +'use client'; + +import { BasicMarksPlugin } from '@udecode/plate-basic-marks/react'; +import { BlockquotePlugin } from '@udecode/plate-block-quote/react'; +import { CodeBlockPlugin } from '@udecode/plate-code-block/react'; +import { HeadingPlugin } from '@udecode/plate-heading/react'; +import Prism from 'prismjs'; + +export const basicNodesPlugins = [ + HeadingPlugin.configure({ options: { levels: 3 } }), + BlockquotePlugin, + CodeBlockPlugin.configure({ options: { prism: Prism } }), + BasicMarksPlugin, +] as const; diff --git a/src/components/editor/plugins/block-menu-plugins.ts b/src/components/editor/plugins/block-menu-plugins.ts new file mode 100644 index 0000000..02c7d49 --- /dev/null +++ b/src/components/editor/plugins/block-menu-plugins.ts @@ -0,0 +1,13 @@ +'use client'; + +import { BlockMenuPlugin } from '@udecode/plate-selection/react'; + +import { blockSelectionPlugins } from './block-selection-plugins'; +import { BlockContextMenu } from '@/components/plate-ui/block-context-menu'; + +export const blockMenuPlugins = [ + ...blockSelectionPlugins, + BlockMenuPlugin.configure({ + render: { aboveEditable: BlockContextMenu }, + }), +] as const; diff --git a/src/components/editor/plugins/block-selection-plugins.ts b/src/components/editor/plugins/block-selection-plugins.ts new file mode 100644 index 0000000..78a6a73 --- /dev/null +++ b/src/components/editor/plugins/block-selection-plugins.ts @@ -0,0 +1,23 @@ +'use client'; + +import { BlockSelectionPlugin } from '@udecode/plate-selection/react'; + +export const blockSelectionPlugins = [ + BlockSelectionPlugin.configure({ + options: { + areaOptions: { + behaviour: { + scrolling: { + speedDivider: 1.5, + }, + startThreshold: 10, + }, + boundaries: '#scroll_container', + container: '#scroll_container', + selectables: '#scroll_container .slate-selectable', + selectionAreaClass: 'slate-selection-area', + }, + enableContextMenu: true, + }, + }), +] as const; diff --git a/src/components/editor/plugins/comments-plugin.tsx b/src/components/editor/plugins/comments-plugin.tsx new file mode 100644 index 0000000..b5dec7c --- /dev/null +++ b/src/components/editor/plugins/comments-plugin.tsx @@ -0,0 +1,24 @@ +'use client'; + +import { CommentsPlugin } from '@udecode/plate-comments/react'; + +import { CommentsPopover } from '@/components/plate-ui/comments-popover'; + +export const commentsPlugin = CommentsPlugin.configure({ + options: { + myUserId: '1', + users: { + 1: { + id: '1', + avatarUrl: 'https://avatars.githubusercontent.com/u/19695832?s=96&v=4', + name: 'zbeyens', + }, + 2: { + id: '2', + avatarUrl: 'https://avatars.githubusercontent.com/u/4272090?v=4', + name: '12joan', + }, + }, + }, + render: { afterEditable: () => }, +}); diff --git a/src/components/editor/plugins/copilot-plugins.tsx b/src/components/editor/plugins/copilot-plugins.ts similarity index 95% rename from src/components/editor/plugins/copilot-plugins.tsx rename to src/components/editor/plugins/copilot-plugins.ts index 13186eb..21d7c60 100644 --- a/src/components/editor/plugins/copilot-plugins.tsx +++ b/src/components/editor/plugins/copilot-plugins.ts @@ -28,6 +28,7 @@ export const copilotPlugins = [ - If no context is provided or you can't generate a continuation, return "0" without explanation.`, }, onError: () => { + // Mock the API response. Remove it when you implement the route /api/ai/copilot api.copilot.setBlockSuggestion({ text: stripMarkdown(faker.lorem.sentence()), }); @@ -36,7 +37,6 @@ export const copilotPlugins = [ if (completion === '0') return; api.copilot.setBlockSuggestion({ - //stripMarkdownBlocks in plus GhostText text: stripMarkdown(completion), }); }, diff --git a/src/components/editor/plugins/delete-plugins.ts b/src/components/editor/plugins/delete-plugins.ts new file mode 100644 index 0000000..947137b --- /dev/null +++ b/src/components/editor/plugins/delete-plugins.ts @@ -0,0 +1,20 @@ +'use client'; + +import { HorizontalRulePlugin } from '@udecode/plate-horizontal-rule/react'; +import { ImagePlugin, MediaEmbedPlugin } from '@udecode/plate-media/react'; +import { DeletePlugin, SelectOnBackspacePlugin } from '@udecode/plate-select'; + +export const deletePlugins = [ + SelectOnBackspacePlugin.configure({ + options: { + query: { + allow: [ + ImagePlugin.key, + MediaEmbedPlugin.key, + HorizontalRulePlugin.key, + ], + }, + }, + }), + DeletePlugin, +] as const; diff --git a/src/components/editor/plugins/dnd-plugins.tsx b/src/components/editor/plugins/dnd-plugins.tsx new file mode 100644 index 0000000..6b0db41 --- /dev/null +++ b/src/components/editor/plugins/dnd-plugins.tsx @@ -0,0 +1,22 @@ +'use client'; + +import { DndPlugin } from '@udecode/plate-dnd'; +import { ImagePlugin } from '@udecode/plate-media/react'; +import { NodeIdPlugin } from '@udecode/plate-node-id'; + +export const dndPlugins = [ + NodeIdPlugin, + DndPlugin.configure({ + options: { + enableScroller: true, + onDropFiles: ({ dragItem, editor, target }) => { + editor + .getTransforms(ImagePlugin) + .insert.imageFromFiles(dragItem.files, { + at: target, + nextBlock: false, + }); + }, + }, + }), +] as const; diff --git a/src/components/editor/plugins/editor-plugins.tsx b/src/components/editor/plugins/editor-plugins.tsx new file mode 100644 index 0000000..e5d2098 --- /dev/null +++ b/src/components/editor/plugins/editor-plugins.tsx @@ -0,0 +1,98 @@ +'use client'; + +import { CalloutPlugin } from '@udecode/plate-callout/react'; +import { ParagraphPlugin } from '@udecode/plate-common/react'; +import { DatePlugin } from '@udecode/plate-date/react'; +import { DocxPlugin } from '@udecode/plate-docx'; +import { EmojiPlugin } from '@udecode/plate-emoji/react'; +import { + FontBackgroundColorPlugin, + FontColorPlugin, + FontSizePlugin, +} from '@udecode/plate-font/react'; +import { HighlightPlugin } from '@udecode/plate-highlight/react'; +import { HorizontalRulePlugin } from '@udecode/plate-horizontal-rule/react'; +import { JuicePlugin } from '@udecode/plate-juice'; +import { KbdPlugin } from '@udecode/plate-kbd/react'; +import { ColumnPlugin } from '@udecode/plate-layout/react'; +import { MarkdownPlugin } from '@udecode/plate-markdown'; +import { + EquationPlugin, + InlineEquationPlugin, +} from '@udecode/plate-math/react'; +import { SlashPlugin } from '@udecode/plate-slash-command/react'; +import { TogglePlugin } from '@udecode/plate-toggle/react'; +import { TrailingBlockPlugin } from '@udecode/plate-trailing-block'; + +import { aiPlugins } from './ai-plugins'; +import { alignPlugin } from './align-plugin'; +import { autoformatPlugin } from './autoformat-plugin'; +import { basicNodesPlugins } from './basic-nodes-plugins'; +import { blockMenuPlugins } from './block-menu-plugins'; +import { commentsPlugin } from './comments-plugin'; +import { deletePlugins } from './delete-plugins'; +import { dndPlugins } from './dnd-plugins'; +import { exitBreakPlugin } from './exit-break-plugin'; +import { indentListPlugins } from './indent-list-plugins'; +import { lineHeightPlugin } from './line-height-plugin'; +import { linkPlugin } from './link-plugin'; +import { mediaPlugins } from './media-plugins'; +import { mentionPlugin } from './mention-plugin'; +import { resetBlockTypePlugin } from './reset-block-type-plugin'; +import { softBreakPlugin } from './soft-break-plugin'; +import { tabbablePlugin } from './tabbable-plugin'; +import { tablePlugin } from './table-plugin'; +import { tocPlugin } from './toc-plugin'; + +export const editorPlugins = [ + // AI + ...aiPlugins, + + // Nodes + ...basicNodesPlugins, + HorizontalRulePlugin, + linkPlugin, + DatePlugin, + mentionPlugin, + SlashPlugin, + tablePlugin, + TogglePlugin, + tocPlugin, + ...mediaPlugins, + InlineEquationPlugin, + EquationPlugin, + CalloutPlugin, + ColumnPlugin, + + // Marks + FontColorPlugin, + FontBackgroundColorPlugin, + FontSizePlugin, + HighlightPlugin, + KbdPlugin, + + // Block Style + alignPlugin, + ...indentListPlugins, + lineHeightPlugin, + + // Functionality + autoformatPlugin, + ...blockMenuPlugins, + ...dndPlugins, + EmojiPlugin, + exitBreakPlugin, + resetBlockTypePlugin, + ...deletePlugins, + softBreakPlugin, + tabbablePlugin, + TrailingBlockPlugin.configure({ options: { type: ParagraphPlugin.key } }), + + // Collaboration + commentsPlugin, + + // Deserialization + DocxPlugin, + MarkdownPlugin.configure({ options: { indentList: true } }), + JuicePlugin, +]; diff --git a/src/components/editor/plugins/exit-break-plugin.ts b/src/components/editor/plugins/exit-break-plugin.ts new file mode 100644 index 0000000..038a92b --- /dev/null +++ b/src/components/editor/plugins/exit-break-plugin.ts @@ -0,0 +1,28 @@ +'use client'; + +import { ExitBreakPlugin } from '@udecode/plate-break/react'; +import { HEADING_LEVELS } from '@udecode/plate-heading'; + +export const exitBreakPlugin = ExitBreakPlugin.configure({ + options: { + rules: [ + { + hotkey: 'mod+enter', + }, + { + before: true, + hotkey: 'mod+shift+enter', + }, + { + hotkey: 'enter', + level: 1, + query: { + allow: HEADING_LEVELS, + end: true, + start: true, + }, + relative: true, + }, + ], + }, +}); diff --git a/src/components/editor/plugins/indent-list-plugins.ts b/src/components/editor/plugins/indent-list-plugins.ts new file mode 100644 index 0000000..4f677e5 --- /dev/null +++ b/src/components/editor/plugins/indent-list-plugins.ts @@ -0,0 +1,57 @@ +'use client'; + +import { BlockquotePlugin } from '@udecode/plate-block-quote/react'; +import { CodeBlockPlugin } from '@udecode/plate-code-block/react'; +import { ParagraphPlugin } from '@udecode/plate-common/react'; +import { HEADING_LEVELS } from '@udecode/plate-heading'; +import { IndentPlugin } from '@udecode/plate-indent/react'; +import { IndentListPlugin } from '@udecode/plate-indent-list/react'; +import { TogglePlugin } from '@udecode/plate-toggle/react'; + +import { + FireLiComponent, + FireMarker, +} from '@/components/plate-ui/indent-fire-marker'; +import { + TodoLi, + TodoMarker, +} from '@/components/plate-ui/indent-todo-marker'; + +export const indentListPlugins = [ + IndentPlugin.extend({ + inject: { + targetPlugins: [ + ParagraphPlugin.key, + ...HEADING_LEVELS, + BlockquotePlugin.key, + CodeBlockPlugin.key, + TogglePlugin.key, + ], + }, + }), + IndentListPlugin.extend({ + inject: { + targetPlugins: [ + ParagraphPlugin.key, + ...HEADING_LEVELS, + BlockquotePlugin.key, + CodeBlockPlugin.key, + TogglePlugin.key, + ], + }, + options: { + listStyleTypes: { + fire: { + liComponent: FireLiComponent, + markerComponent: FireMarker, + type: 'fire', + }, + todo: { + liComponent: TodoLi, + markerComponent: TodoMarker, + type: 'todo', + }, + }, + }, + }), +]; diff --git a/src/components/editor/plugins/line-height-plugin.ts b/src/components/editor/plugins/line-height-plugin.ts new file mode 100644 index 0000000..3639cab --- /dev/null +++ b/src/components/editor/plugins/line-height-plugin.ts @@ -0,0 +1,15 @@ +'use client'; + +import { ParagraphPlugin } from '@udecode/plate-common/react'; +import { HEADING_LEVELS } from '@udecode/plate-heading'; +import { LineHeightPlugin } from '@udecode/plate-line-height/react'; + +export const lineHeightPlugin = LineHeightPlugin.configure({ + inject: { + nodeProps: { + defaultNodeValue: 1.5, + validNodeValues: [1, 1.2, 1.5, 2, 3], + }, + targetPlugins: [ParagraphPlugin.key, ...HEADING_LEVELS], + }, +}); diff --git a/src/components/editor/plugins/link-plugin.tsx b/src/components/editor/plugins/link-plugin.tsx new file mode 100644 index 0000000..850ad29 --- /dev/null +++ b/src/components/editor/plugins/link-plugin.tsx @@ -0,0 +1,9 @@ +'use client'; + +import { LinkPlugin } from '@udecode/plate-link/react'; + +import { LinkFloatingToolbar } from '@/components/plate-ui/link-floating-toolbar'; + +export const linkPlugin = LinkPlugin.extend({ + render: { afterEditable: () => }, +}); diff --git a/src/components/editor/plugins/media-plugins.tsx b/src/components/editor/plugins/media-plugins.tsx new file mode 100644 index 0000000..8096cac --- /dev/null +++ b/src/components/editor/plugins/media-plugins.tsx @@ -0,0 +1,29 @@ +'use client'; + +import { CaptionPlugin } from '@udecode/plate-caption/react'; +import { + AudioPlugin, + FilePlugin, + ImagePlugin, + MediaEmbedPlugin, + PlaceholderPlugin, + VideoPlugin, +} from '@udecode/plate-media/react'; + +import { ImagePreview } from '@/components/plate-ui/image-preview'; + +export const mediaPlugins = [ + PlaceholderPlugin, + ImagePlugin.extend({ + options: { + disableUploadInsert: true, + }, + render: { afterEditable: ImagePreview }, + }), + VideoPlugin, + AudioPlugin, + FilePlugin, + CaptionPlugin.configure({ + options: { plugins: [ImagePlugin, MediaEmbedPlugin] }, + }), +] as const; diff --git a/src/components/editor/plugins/mention-plugin.ts b/src/components/editor/plugins/mention-plugin.ts new file mode 100644 index 0000000..0b7421f --- /dev/null +++ b/src/components/editor/plugins/mention-plugin.ts @@ -0,0 +1,7 @@ +'use client'; + +import { MentionPlugin } from '@udecode/plate-mention/react'; + +export const mentionPlugin = MentionPlugin.configure({ + options: { triggerPreviousCharPattern: /^$|^[\s"']$/ }, +}); diff --git a/src/components/editor/plugins/reset-block-type-plugin.ts b/src/components/editor/plugins/reset-block-type-plugin.ts new file mode 100644 index 0000000..61973e9 --- /dev/null +++ b/src/components/editor/plugins/reset-block-type-plugin.ts @@ -0,0 +1,63 @@ +'use client'; + +import { BlockquotePlugin } from '@udecode/plate-block-quote/react'; +import { CalloutPlugin } from '@udecode/plate-callout/react'; +import { + isCodeBlockEmpty, + isSelectionAtCodeBlockStart, + unwrapCodeBlock, +} from '@udecode/plate-code-block'; +import { CodeBlockPlugin } from '@udecode/plate-code-block/react'; +import { + isBlockAboveEmpty, + isSelectionAtBlockStart, +} from '@udecode/plate-common'; +import { ParagraphPlugin } from '@udecode/plate-common/react'; +import { HEADING_LEVELS } from '@udecode/plate-heading'; +import { INDENT_LIST_KEYS, ListStyleType } from '@udecode/plate-indent-list'; +import { ResetNodePlugin } from '@udecode/plate-reset-node/react'; + +const resetBlockTypesCommonRule = { + defaultType: ParagraphPlugin.key, + types: [ + ...HEADING_LEVELS, + BlockquotePlugin.key, + INDENT_LIST_KEYS.todo, + ListStyleType.Disc, + ListStyleType.Decimal, + CalloutPlugin.key, + ], +}; + +const resetBlockTypesCodeBlockRule = { + defaultType: ParagraphPlugin.key, + types: [CodeBlockPlugin.key], + onReset: unwrapCodeBlock, +}; + +export const resetBlockTypePlugin = ResetNodePlugin.configure({ + options: { + rules: [ + { + ...resetBlockTypesCommonRule, + hotkey: 'Enter', + predicate: isBlockAboveEmpty, + }, + { + ...resetBlockTypesCommonRule, + hotkey: 'Backspace', + predicate: isSelectionAtBlockStart, + }, + { + ...resetBlockTypesCodeBlockRule, + hotkey: 'Enter', + predicate: isCodeBlockEmpty, + }, + { + ...resetBlockTypesCodeBlockRule, + hotkey: 'Backspace', + predicate: isSelectionAtCodeBlockStart, + }, + ], + }, +}); diff --git a/src/components/editor/plugins/soft-break-plugin.ts b/src/components/editor/plugins/soft-break-plugin.ts new file mode 100644 index 0000000..a5ed0d4 --- /dev/null +++ b/src/components/editor/plugins/soft-break-plugin.ts @@ -0,0 +1,30 @@ +'use client'; + +import { BlockquotePlugin } from '@udecode/plate-block-quote/react'; +import { SoftBreakPlugin } from '@udecode/plate-break/react'; +import { CalloutPlugin } from '@udecode/plate-callout/react'; +import { CodeBlockPlugin } from '@udecode/plate-code-block/react'; +import { + TableCellHeaderPlugin, + TableCellPlugin, +} from '@udecode/plate-table/react'; + +export const softBreakPlugin = SoftBreakPlugin.configure({ + options: { + rules: [ + { hotkey: 'shift+enter' }, + { + hotkey: 'enter', + query: { + allow: [ + CodeBlockPlugin.key, + BlockquotePlugin.key, + TableCellPlugin.key, + TableCellHeaderPlugin.key, + CalloutPlugin.key, + ], + }, + }, + ], + }, +}); diff --git a/src/components/editor/plugins/tabbable-plugin.ts b/src/components/editor/plugins/tabbable-plugin.ts new file mode 100644 index 0000000..10f89e6 --- /dev/null +++ b/src/components/editor/plugins/tabbable-plugin.ts @@ -0,0 +1,34 @@ +'use client'; + +import { CodeBlockPlugin } from '@udecode/plate-code-block/react'; +import { + isSelectionAtBlockEnd, + isSelectionAtBlockStart, + someNode, +} from '@udecode/plate-common'; +import { TabbablePlugin } from '@udecode/plate-tabbable/react'; +import { TablePlugin } from '@udecode/plate-table/react'; + +export const tabbablePlugin = TabbablePlugin.configure(({ editor }) => ({ + options: { + query: () => { + if (isSelectionAtBlockStart(editor) || isSelectionAtBlockEnd(editor)) + return false; + + return !someNode(editor, { + match: (n) => { + return !!( + n.type && + ([ + CodeBlockPlugin.key, + TablePlugin.key, + 'action_item', + 'li', + ].includes(n.type as string) || + n.listStyleType) + ); + }, + }); + }, + }, +})); diff --git a/src/components/editor/plugins/table-plugin.ts b/src/components/editor/plugins/table-plugin.ts new file mode 100644 index 0000000..82f65ff --- /dev/null +++ b/src/components/editor/plugins/table-plugin.ts @@ -0,0 +1,9 @@ +'use client'; + +import { TablePlugin } from '@udecode/plate-table/react'; + +export const tablePlugin = TablePlugin.configure({ + options: { + enableMerging: true, + }, +}); diff --git a/src/components/editor/plugins/toc-plugin.ts b/src/components/editor/plugins/toc-plugin.ts new file mode 100644 index 0000000..5772674 --- /dev/null +++ b/src/components/editor/plugins/toc-plugin.ts @@ -0,0 +1,11 @@ +'use client'; + +import { TocPlugin } from '@udecode/plate-heading/react'; + +export const tocPlugin = TocPlugin.configure({ + options: { + // isScroll: true, + scrollContainerSelector: '#scroll_container', + topOffset: 80, + }, +}); diff --git a/src/components/editor/use-chat.tsx b/src/components/editor/use-chat.tsx index 9387373..93bbd94 100644 --- a/src/components/editor/use-chat.tsx +++ b/src/components/editor/use-chat.tsx @@ -50,10 +50,10 @@ export const useChat = () => { model: useOpenAI().model.value, }, fetch: async (input, init) => { - try { - return await fetch(input, init); - } catch (error) { - // Mock the API response. Remove it when you implement the route /api/ai + const res = await fetch(input, init); + + if (!res.ok) { + // Mock the API response. Remove it when you implement the route /api/ai/command await new Promise((resolve) => setTimeout(resolve, 400)); const stream = fakeStreamText(); @@ -65,6 +65,8 @@ export const useChat = () => { }, }); } + + return res; }, }); }; diff --git a/src/components/editor/use-create-editor.tsx b/src/components/editor/use-create-editor.tsx index 77f165f..3d0563f 100644 --- a/src/components/editor/use-create-editor.tsx +++ b/src/components/editor/use-create-editor.tsx @@ -1,8 +1,5 @@ -import React from 'react'; - import { withProps } from '@udecode/cn'; import { AIPlugin } from '@udecode/plate-ai/react'; -import { AlignPlugin } from '@udecode/plate-alignment/react'; import { BoldPlugin, CodePlugin, @@ -13,75 +10,33 @@ import { UnderlinePlugin, } from '@udecode/plate-basic-marks/react'; import { BlockquotePlugin } from '@udecode/plate-block-quote/react'; -import { ExitBreakPlugin, SoftBreakPlugin } from '@udecode/plate-break/react'; -import { CaptionPlugin } from '@udecode/plate-caption/react'; -import { - isCodeBlockEmpty, - isSelectionAtCodeBlockStart, - unwrapCodeBlock, -} from '@udecode/plate-code-block'; import { CodeBlockPlugin, CodeLinePlugin, CodeSyntaxPlugin, } from '@udecode/plate-code-block/react'; import { CommentsPlugin } from '@udecode/plate-comments/react'; -import { - isBlockAboveEmpty, - isSelectionAtBlockStart, - someNode, -} from '@udecode/plate-common'; import { ParagraphPlugin, - PlateElement, PlateLeaf, usePlateEditor, } from '@udecode/plate-common/react'; import { DatePlugin } from '@udecode/plate-date/react'; -import { DndPlugin } from '@udecode/plate-dnd'; -import { DocxPlugin } from '@udecode/plate-docx'; -import { EmojiInputPlugin, EmojiPlugin } from '@udecode/plate-emoji/react'; +import { EmojiInputPlugin } from '@udecode/plate-emoji/react'; import { ExcalidrawPlugin } from '@udecode/plate-excalidraw/react'; -import { - FontBackgroundColorPlugin, - FontColorPlugin, - FontSizePlugin, -} from '@udecode/plate-font/react'; -import { HEADING_KEYS, HEADING_LEVELS } from '@udecode/plate-heading'; -import { HeadingPlugin, TocPlugin } from '@udecode/plate-heading/react'; +import { HEADING_KEYS } from '@udecode/plate-heading'; +import { TocPlugin } from '@udecode/plate-heading/react'; import { HighlightPlugin } from '@udecode/plate-highlight/react'; import { HorizontalRulePlugin } from '@udecode/plate-horizontal-rule/react'; -import { IndentPlugin } from '@udecode/plate-indent/react'; -import { IndentListPlugin } from '@udecode/plate-indent-list/react'; -import { JuicePlugin } from '@udecode/plate-juice'; import { KbdPlugin } from '@udecode/plate-kbd/react'; import { ColumnItemPlugin, ColumnPlugin } from '@udecode/plate-layout/react'; -import { LineHeightPlugin } from '@udecode/plate-line-height/react'; import { LinkPlugin } from '@udecode/plate-link/react'; -import { - BulletedListPlugin, - ListItemPlugin, - NumberedListPlugin, - TodoListPlugin, -} from '@udecode/plate-list/react'; -import { MarkdownPlugin } from '@udecode/plate-markdown'; import { ImagePlugin, MediaEmbedPlugin } from '@udecode/plate-media/react'; import { MentionInputPlugin, MentionPlugin, } from '@udecode/plate-mention/react'; -import { NodeIdPlugin } from '@udecode/plate-node-id'; -import { ResetNodePlugin } from '@udecode/plate-reset-node/react'; -import { SelectOnBackspacePlugin } from '@udecode/plate-select'; -import { - BlockMenuPlugin, - BlockSelectionPlugin, -} from '@udecode/plate-selection/react'; -import { - SlashInputPlugin, - SlashPlugin, -} from '@udecode/plate-slash-command/react'; -import { TabbablePlugin } from '@udecode/plate-tabbable/react'; +import { SlashInputPlugin } from '@udecode/plate-slash-command/react'; import { TableCellHeaderPlugin, TableCellPlugin, @@ -89,14 +44,10 @@ import { TableRowPlugin, } from '@udecode/plate-table/react'; import { TogglePlugin } from '@udecode/plate-toggle/react'; -import { TrailingBlockPlugin } from '@udecode/plate-trailing-block'; -import Prism from 'prismjs'; -import { aiPlugins } from '@/components/editor/plugins/ai-plugins'; -import { autoformatPlugin } from '@/components/editor/plugins/autoformat-plugin'; import { copilotPlugins } from '@/components/editor/plugins/copilot-plugins'; +import { editorPlugins } from '@/components/editor/plugins/editor-plugins'; import { AILeaf } from '@/components/plate-ui/ai-leaf'; -import { BlockContextMenu } from '@/components/plate-ui/block-context-menu'; import { BlockquoteElement } from '@/components/plate-ui/blockquote-element'; import { CodeBlockElement } from '@/components/plate-ui/code-block-element'; import { CodeLeaf } from '@/components/plate-ui/code-leaf'; @@ -105,7 +56,6 @@ import { CodeSyntaxLeaf } from '@/components/plate-ui/code-syntax-leaf'; import { ColumnElement } from '@/components/plate-ui/column-element'; import { ColumnGroupElement } from '@/components/plate-ui/column-group-element'; import { CommentLeaf } from '@/components/plate-ui/comment-leaf'; -import { DragOverCursorPlugin } from '@/components/plate-ui/cursor-overlay'; import { DateElement } from '@/components/plate-ui/date-element'; import { EmojiInputElement } from '@/components/plate-ui/emoji-input-element'; import { ExcalidrawElement } from '@/components/plate-ui/excalidraw-element'; @@ -113,15 +63,8 @@ import { HeadingElement } from '@/components/plate-ui/heading-element'; import { HighlightLeaf } from '@/components/plate-ui/highlight-leaf'; import { HrElement } from '@/components/plate-ui/hr-element'; import { ImageElement } from '@/components/plate-ui/image-element'; -import { ImagePreview } from '@/components/plate-ui/image-preview'; -import { - TodoLi, - TodoMarker, -} from '@/components/plate-ui/indent-todo-marker'; import { KbdLeaf } from '@/components/plate-ui/kbd-leaf'; import { LinkElement } from '@/components/plate-ui/link-element'; -import { LinkFloatingToolbar } from '@/components/plate-ui/link-floating-toolbar'; -import { ListElement } from '@/components/plate-ui/list-element'; import { MediaEmbedElement } from '@/components/plate-ui/media-embed-element'; import { MentionElement } from '@/components/plate-ui/mention-element'; import { MentionInputElement } from '@/components/plate-ui/mention-input-element'; @@ -146,7 +89,6 @@ export const useCreateEditor = () => { [AIPlugin.key]: AILeaf, [BlockquotePlugin.key]: BlockquoteElement, [BoldPlugin.key]: withProps(PlateLeaf, { as: 'strong' }), - [BulletedListPlugin.key]: withProps(ListElement, { variant: 'ul' }), [CodeBlockPlugin.key]: CodeBlockElement, [CodeLinePlugin.key]: CodeLineElement, [CodePlugin.key]: CodeLeaf, @@ -169,11 +111,9 @@ export const useCreateEditor = () => { [ItalicPlugin.key]: withProps(PlateLeaf, { as: 'em' }), [KbdPlugin.key]: KbdLeaf, [LinkPlugin.key]: LinkElement, - [ListItemPlugin.key]: withProps(PlateElement, { as: 'li' }), [MediaEmbedPlugin.key]: MediaEmbedElement, [MentionInputPlugin.key]: MentionInputElement, [MentionPlugin.key]: MentionElement, - [NumberedListPlugin.key]: withProps(ListElement, { variant: 'ol' }), [ParagraphPlugin.key]: ParagraphElement, [SlashInputPlugin.key]: SlashInputElement, [StrikethroughPlugin.key]: withProps(PlateLeaf, { as: 's' }), @@ -189,271 +129,7 @@ export const useCreateEditor = () => { }) ), }, - plugins: [ - // AI - ...aiPlugins, - ...copilotPlugins, - // Nodes - HeadingPlugin, - TocPlugin.configure({ - options: { - scrollContainerSelector: `#scroll_container`, - topOffset: 80, - }, - }), - BlockquotePlugin, - CodeBlockPlugin.configure({ - options: { - prism: Prism, - }, - }), - HorizontalRulePlugin, - LinkPlugin.configure({ - render: { afterEditable: () => }, - }), - ImagePlugin.extend({ - render: { afterEditable: ImagePreview }, - }), - MediaEmbedPlugin, - CaptionPlugin.configure({ - options: { plugins: [ImagePlugin, MediaEmbedPlugin] }, - }), - DatePlugin, - MentionPlugin.configure({ - options: { - triggerPreviousCharPattern: /^$|^[\s"']$/, - }, - }), - SlashPlugin, - TablePlugin.configure({ - options: { - enableMerging: true, - }, - }), - ColumnPlugin, - - TodoListPlugin, - TogglePlugin, - ExcalidrawPlugin, - // Marks - BoldPlugin, - ItalicPlugin, - UnderlinePlugin, - StrikethroughPlugin, - CodePlugin, - SubscriptPlugin, - SuperscriptPlugin, - FontColorPlugin, - FontBackgroundColorPlugin, - FontSizePlugin, - HighlightPlugin, - KbdPlugin, - - // Block Style - AlignPlugin.configure({ - inject: { - targetPlugins: [ - ParagraphPlugin.key, - MediaEmbedPlugin.key, - ImagePlugin.key, - ...HEADING_LEVELS, - ], - }, - }), - IndentPlugin.configure({ - inject: { - targetPlugins: [ - ParagraphPlugin.key, - BlockquotePlugin.key, - CodeBlockPlugin.key, - TogglePlugin.key, - ...HEADING_LEVELS, - ], - }, - }), - IndentListPlugin.configure({ - inject: { - targetPlugins: [ - ParagraphPlugin.key, - BlockquotePlugin.key, - CodeBlockPlugin.key, - TogglePlugin.key, - ...HEADING_LEVELS, - ], - }, - options: { - listStyleTypes: { - todo: { - liComponent: TodoLi, - markerComponent: TodoMarker, - type: 'todo', - }, - }, - }, - }), - LineHeightPlugin.configure({ - inject: { - nodeProps: { - defaultNodeValue: 1.5, - validNodeValues: [1, 1.2, 1.5, 2, 3], - }, - targetPlugins: [ParagraphPlugin.key, ...HEADING_LEVELS], - }, - }), - - // Functionality - autoformatPlugin, - BlockSelectionPlugin.configure({ - options: { - areaOptions: { - behaviour: { - scrolling: { - speedDivider: 1.5, - }, - startThreshold: 10, - }, - boundaries: `#scroll_container`, - container: `#scroll_container`, - selectables: [`#scroll_container .slate-selectable`], - selectionAreaClass: 'slate-selection-area', - }, - enableContextMenu: true, - }, - }), - BlockMenuPlugin.configure({ - render: { aboveEditable: BlockContextMenu }, - }), - DndPlugin.configure({ - options: { enableScroller: true }, - }), - EmojiPlugin, - ExitBreakPlugin.configure({ - options: { - rules: [ - { - hotkey: 'mod+enter', - }, - { - before: true, - hotkey: 'mod+shift+enter', - }, - { - hotkey: 'enter', - level: 1, - query: { - allow: HEADING_LEVELS, - end: true, - start: true, - }, - relative: true, - }, - ], - }, - }), - NodeIdPlugin, - ResetNodePlugin.configure({ - options: { - rules: [ - { - defaultType: ParagraphPlugin.key, - hotkey: 'Enter', - predicate: isBlockAboveEmpty, - types: [BlockquotePlugin.key, TodoListPlugin.key], - }, - { - defaultType: ParagraphPlugin.key, - hotkey: 'Backspace', - predicate: isSelectionAtBlockStart, - types: [BlockquotePlugin.key, TodoListPlugin.key], - }, - { - defaultType: ParagraphPlugin.key, - hotkey: 'Enter', - predicate: isCodeBlockEmpty, - types: [CodeBlockPlugin.key], - onReset: unwrapCodeBlock, - }, - { - defaultType: ParagraphPlugin.key, - hotkey: 'Backspace', - predicate: isSelectionAtCodeBlockStart, - types: [CodeBlockPlugin.key], - onReset: unwrapCodeBlock, - }, - ], - }, - }), - SelectOnBackspacePlugin.configure({ - options: { - query: { - allow: [ImagePlugin.key, HorizontalRulePlugin.key], - }, - }, - }), - SoftBreakPlugin.configure({ - options: { - rules: [ - { hotkey: 'shift+enter' }, - { - hotkey: 'enter', - query: { - allow: [ - CodeBlockPlugin.key, - BlockquotePlugin.key, - TableCellPlugin.key, - TableCellHeaderPlugin.key, - ], - }, - }, - ], - }, - }), - TabbablePlugin.configure(({ editor }) => ({ - options: { - query: () => { - if (isSelectionAtBlockStart(editor)) return false; - - return !someNode(editor, { - match: (n) => { - return !!( - n.type && - ([ - CodeBlockPlugin.key, - TablePlugin.key, - TodoListPlugin.key, - ].includes(n.type as string) || - n.listStyleType) - ); - }, - }); - }, - }, - })), - TrailingBlockPlugin.configure({ - options: { type: ParagraphPlugin.key }, - }), - - // Collaboration - DragOverCursorPlugin, - CommentsPlugin.configure({ - options: { - myUserId: '1', - users: { - 1: { - id: '1', - avatarUrl: - 'https://avatars.githubusercontent.com/u/19695832?s=96&v=4', - name: 'zbeyens', - }, - }, - }, - }), - - // Deserialization - DocxPlugin, - MarkdownPlugin.configure({ options: { indentList: true } }), - JuicePlugin, - ], + plugins: [...copilotPlugins, ...editorPlugins], value: [ { id: '1', diff --git a/src/components/plate-ui/fixed-toolbar-buttons.tsx b/src/components/plate-ui/fixed-toolbar-buttons.tsx index 467698d..19f8f00 100644 --- a/src/components/plate-ui/fixed-toolbar-buttons.tsx +++ b/src/components/plate-ui/fixed-toolbar-buttons.tsx @@ -15,10 +15,6 @@ import { FontColorPlugin, } from '@udecode/plate-font/react'; import { ListStyleType } from '@udecode/plate-indent-list'; -import { - BulletedListPlugin, - NumberedListPlugin, -} from '@udecode/plate-list/react'; import { ImagePlugin } from '@udecode/plate-media/react'; import { BaselineIcon, @@ -42,7 +38,6 @@ import { IndentToolbarButton } from './indent-toolbar-button'; import { InsertDropdownMenu } from './insert-dropdown-menu'; import { LineHeightDropdownMenu } from './line-height-dropdown-menu'; import { LinkToolbarButton } from './link-toolbar-button'; -import { ListToolbarButton } from './list-toolbar-button'; import { MarkToolbarButton } from './mark-toolbar-button'; import { MediaToolbarButton } from './media-toolbar-button'; import { ModeDropdownMenu } from './mode-dropdown-menu'; @@ -128,9 +123,6 @@ export function FixedToolbarButtons() { - - - diff --git a/src/components/plate-ui/indent-fire-marker.tsx b/src/components/plate-ui/indent-fire-marker.tsx new file mode 100644 index 0000000..5887dcd --- /dev/null +++ b/src/components/plate-ui/indent-fire-marker.tsx @@ -0,0 +1,22 @@ +import type { PlateRenderElementProps } from '@udecode/plate-common/react'; +import type { TIndentElement } from '@udecode/plate-indent'; + +export const FireMarker = ( + props: Omit +) => { + const { element } = props; + + return ( +
+ + {(element as TIndentElement).indent % 2 === 0 ? '🔥' : '🚀'} + +
+ ); +}; + +export const FireLiComponent = (props: PlateRenderElementProps) => { + const { children } = props; + + return {children}; +}; diff --git a/src/components/plate-ui/list-element.tsx b/src/components/plate-ui/list-element.tsx deleted file mode 100644 index c923432..0000000 --- a/src/components/plate-ui/list-element.tsx +++ /dev/null @@ -1,31 +0,0 @@ -'use client'; - -import React from 'react'; - -import { withRef, withVariants } from '@udecode/cn'; -import { cva } from 'class-variance-authority'; - -import { PlateElement } from './plate-element'; - -const listVariants = cva('m-0 ps-6', { - variants: { - variant: { - ol: 'list-decimal', - ul: 'list-disc [&_ul]:list-[circle] [&_ul_ul]:list-[square]', - }, - }, -}); - -const ListElementVariants = withVariants(PlateElement, listVariants, [ - 'variant', -]); - -export const ListElement = withRef( - ({ children, variant = 'ul', ...props }, ref) => { - return ( - - {children} - - ); - } -); diff --git a/src/components/plate-ui/list-toolbar-button.tsx b/src/components/plate-ui/list-toolbar-button.tsx deleted file mode 100644 index 8b59823..0000000 --- a/src/components/plate-ui/list-toolbar-button.tsx +++ /dev/null @@ -1,36 +0,0 @@ -'use client'; - -import React from 'react'; - -import { withRef } from '@udecode/cn'; -import { - BulletedListPlugin, - useListToolbarButton, - useListToolbarButtonState, -} from '@udecode/plate-list/react'; -import { List, ListOrdered } from 'lucide-react'; - -import { ToolbarButton } from './toolbar'; - -export const ListToolbarButton = withRef< - typeof ToolbarButton, - { - nodeType?: string; - } ->(({ nodeType = BulletedListPlugin.key, ...rest }, ref) => { - const state = useListToolbarButtonState({ nodeType }); - const { props } = useListToolbarButton(state); - - return ( - - {nodeType === BulletedListPlugin.key ? : } - - ); -}); diff --git a/src/components/plate-ui/with-draggables.tsx b/src/components/plate-ui/with-draggables.tsx index e374a36..85f455a 100644 --- a/src/components/plate-ui/with-draggables.tsx +++ b/src/components/plate-ui/with-draggables.tsx @@ -1,3 +1,5 @@ +'use client'; + import type { FC } from 'react'; import { BlockquotePlugin } from '@udecode/plate-block-quote/react'; @@ -13,10 +15,6 @@ import { import { ExcalidrawPlugin } from '@udecode/plate-excalidraw/react'; import { HEADING_KEYS } from '@udecode/plate-heading'; import { ColumnPlugin } from '@udecode/plate-layout/react'; -import { - BulletedListPlugin, - NumberedListPlugin, -} from '@udecode/plate-list/react'; import { ImagePlugin, MediaEmbedPlugin, @@ -40,11 +38,7 @@ export const withDraggablesPrimitive = createNodesWithHOC(withDraggable); export const withDraggables = (components: any) => { return withDraggablesPrimitive(components, [ { - keys: [ - ParagraphPlugin.key, - BulletedListPlugin.key, - NumberedListPlugin.key, - ], + keys: [ParagraphPlugin.key, 'ul', 'ol'], level: 0, }, { @@ -83,7 +77,7 @@ export const withDraggables = (components: any) => { }, }, { - keys: [HEADING_KEYS.h6, BulletedListPlugin.key, NumberedListPlugin.key], + keys: [HEADING_KEYS.h6, 'ul', 'ol'], draggableProps: { className: '[&_.slate-gutterLeft]:px-0 [&_.slate-gutterLeft]:pb-0', },