@byline/richtext-lexical 1.11.2 → 1.12.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/field/apply-value-plugin.js +1 -3
- package/dist/field/config/default-extensions.d.ts +32 -0
- package/dist/field/config/default-extensions.js +49 -0
- package/dist/field/config/default.d.ts +8 -0
- package/dist/field/config/default.js +0 -28
- package/dist/field/config/editor-config-context.js +2 -6
- package/dist/field/config/extensions-list.d.ts +44 -0
- package/dist/field/config/extensions-list.js +55 -0
- package/dist/field/config/types.d.ts +28 -1
- package/dist/field/editor-context.d.ts +1 -1
- package/dist/field/editor-context.js +39 -35
- package/dist/field/editor.js +11 -57
- package/dist/field/{plugins/admonition-plugin/index.d.ts → extensions/admonition/admonition-extension.d.ts} +2 -1
- package/dist/field/{plugins/admonition-plugin/index.js → extensions/admonition/admonition-extension.js} +51 -4
- package/dist/field/{nodes/admonition-node → extensions/admonition}/admonition-node-component.d.ts +1 -1
- package/dist/field/{nodes/admonition-node → extensions/admonition}/admonition-node-component.js +1 -1
- package/dist/field/{nodes/admonition-node → extensions/admonition}/admonition-node.d.ts +1 -1
- package/dist/field/{plugins/admonition-plugin → extensions/admonition}/fields.d.ts +1 -1
- package/dist/field/{nodes/admonition-node → extensions/admonition}/index.js +1 -1
- package/dist/field/{plugins/admonition-plugin → extensions/admonition}/types.d.ts +1 -1
- package/dist/field/{plugins/auto-embed-plugin/index.d.ts → extensions/auto-embed/auto-embed-extension.d.ts} +1 -0
- package/dist/field/{plugins/auto-embed-plugin/index.js → extensions/auto-embed/auto-embed-extension.js} +47 -4
- package/dist/field/{plugins/auto-embed-plugin → extensions/auto-embed}/auto-embed-modal.d.ts +1 -1
- package/dist/field/extensions/byline-floating-ui/byline-floating-ui-extension.d.ts +68 -0
- package/dist/field/extensions/byline-floating-ui/byline-floating-ui-extension.js +19 -0
- package/dist/field/{nodes/admonition-node → extensions/byline-floating-ui}/index.d.ts +1 -2
- package/dist/field/extensions/byline-floating-ui/index.js +1 -0
- package/dist/field/extensions/byline-toolbar/byline-toolbar-extension.d.ts +69 -0
- package/dist/field/extensions/byline-toolbar/byline-toolbar-extension.js +19 -0
- package/dist/field/{nodes/inline-image-node → extensions/byline-toolbar}/index.d.ts +1 -2
- package/dist/field/extensions/byline-toolbar/index.js +1 -0
- package/dist/field/extensions/code-highlight/code-highlight-extension.d.ts +10 -0
- package/dist/field/extensions/code-highlight/code-highlight-extension.js +11 -0
- package/dist/field/extensions/floating-text-format/floating-text-format-extension.d.ts +18 -0
- package/dist/field/extensions/floating-text-format/floating-text-format-extension.js +17 -0
- package/dist/field/{plugins/floating-text-format-toolbar-plugin → extensions/floating-text-format}/index.js +1 -1
- package/dist/field/extensions/horizontal-rule/horizontal-rule-extension.d.ts +6 -0
- package/dist/field/extensions/horizontal-rule/horizontal-rule-extension.js +45 -0
- package/dist/field/{nodes/inline-image-node → extensions/inline-image}/index.js +1 -1
- package/dist/field/{plugins/inline-image-plugin/index.d.ts → extensions/inline-image/inline-image-extension.d.ts} +6 -3
- package/dist/field/{plugins/inline-image-plugin/index.js → extensions/inline-image/inline-image-extension.js} +57 -5
- package/dist/field/{nodes/inline-image-node → extensions/inline-image}/inline-image-node-component.d.ts +2 -2
- package/dist/field/{nodes/inline-image-node → extensions/inline-image}/inline-image-node-component.js +4 -4
- package/dist/field/{nodes/inline-image-node → extensions/inline-image}/inline-image-node.d.ts +2 -2
- package/dist/field/{nodes/inline-image-node/types.d.ts → extensions/inline-image/node-types.d.ts} +1 -1
- package/dist/field/{plugins/inline-image-plugin → extensions/inline-image}/types.d.ts +1 -1
- package/dist/field/{plugins/inline-image-plugin → extensions/inline-image}/utils.d.ts +1 -1
- package/dist/field/{plugins/layout-plugin/layout-plugin.d.ts → extensions/layout/layout-extension.d.ts} +1 -0
- package/dist/field/{plugins/layout-plugin/layout-plugin.js → extensions/layout/layout-extension.js} +53 -5
- package/dist/field/extensions/link/auto-link-extension.d.ts +12 -0
- package/dist/field/{plugins/link-plugin/auto-link/index.js → extensions/link/auto-link-extension.js} +14 -2
- package/dist/field/{plugins/link-plugin/auto-link → extensions/link}/auto-link-plugin.d.ts +1 -1
- package/dist/field/{plugins/link-plugin/auto-link → extensions/link}/auto-link-plugin.js +2 -2
- package/dist/field/{plugins/link-plugin → extensions}/link/floating-link-editor.css +2 -2
- package/dist/field/{plugins/link-plugin → extensions}/link/floating-link-editor.js +4 -4
- package/dist/field/extensions/link/index.d.ts +5 -0
- package/dist/field/extensions/link/index.js +5 -0
- package/dist/field/extensions/link/link-extension.d.ts +14 -0
- package/dist/field/extensions/link/link-extension.js +66 -0
- package/dist/field/{plugins/link-plugin/link/types.d.ts → extensions/link/link-modal-types.d.ts} +1 -1
- package/dist/field/{plugins/link-plugin → extensions}/link/link-modal.d.ts +1 -1
- package/dist/field/{plugins/link-plugin → extensions}/link/link-modal.js +3 -3
- package/dist/field/{nodes/link-nodes → extensions/link}/types.d.ts +1 -1
- package/dist/field/extensions/table/table-action-menu-plugin/index.d.ts +4 -0
- package/dist/field/{plugins → extensions/table}/table-action-menu-plugin/index.js +8 -6
- package/dist/field/extensions/table/table-extension.d.ts +17 -0
- package/dist/field/extensions/table/table-extension.js +58 -0
- package/dist/field/extensions/vimeo/vimeo-extension.d.ts +12 -0
- package/dist/field/extensions/vimeo/vimeo-extension.js +16 -0
- package/dist/field/extensions/youtube/youtube-extension.d.ts +12 -0
- package/dist/field/extensions/youtube/youtube-extension.js +16 -0
- package/dist/field/nodes/index.js +7 -7
- package/dist/field/plugins/table-plugin/index.js +5 -6
- package/dist/field/plugins/toolbar-plugin/index.js +40 -114
- package/dist/field/plugins/toolbar-plugin/toolbar-active-editor.d.ts +25 -0
- package/dist/field/plugins/toolbar-plugin/toolbar-active-editor.js +17 -0
- package/dist/field/themes/lexical-editor-theme.css +13 -3
- package/dist/field/themes/lexical-editor-theme.js +1 -0
- package/dist/index.d.ts +17 -1
- package/dist/index.js +16 -0
- package/dist/lexical-editor.d.ts +25 -13
- package/dist/lexical-editor.js +9 -1
- package/dist/richtext-field.js +6 -1
- package/dist/server.d.ts +2 -2
- package/dist/server.js +2 -2
- package/package.json +7 -10
- package/src/field/apply-value-plugin.tsx +6 -6
- package/src/field/config/default-extensions.ts +104 -0
- package/src/field/config/default.ts +8 -28
- package/src/field/config/editor-config-context.tsx +1 -7
- package/src/field/config/extensions-list.ts +107 -0
- package/src/field/config/types.ts +28 -28
- package/src/field/editor-context.tsx +77 -41
- package/src/field/editor.tsx +24 -72
- package/src/field/extensions/README.md +31 -0
- package/src/field/{plugins/admonition-plugin/index.tsx → extensions/admonition/admonition-extension.tsx} +45 -2
- package/src/field/{plugins/admonition-plugin → extensions/admonition}/admonition-modal.tsx +1 -1
- package/src/field/{nodes/admonition-node → extensions/admonition}/admonition-node-component.tsx +5 -5
- package/src/field/{nodes/admonition-node → extensions/admonition}/admonition-node.tsx +1 -1
- package/src/field/{plugins/admonition-plugin → extensions/admonition}/fields.ts +1 -1
- package/src/field/{nodes/admonition-node → extensions/admonition}/index.ts +5 -1
- package/src/field/{plugins/admonition-plugin → extensions/admonition}/types.ts +1 -1
- package/src/field/{plugins/auto-embed-plugin/index.tsx → extensions/auto-embed/auto-embed-extension.tsx} +46 -3
- package/src/field/{plugins/auto-embed-plugin → extensions/auto-embed}/auto-embed-modal.tsx +1 -1
- package/src/field/extensions/byline-floating-ui/byline-floating-ui-extension.ts +90 -0
- package/src/field/extensions/byline-floating-ui/index.ts +15 -0
- package/src/field/extensions/byline-toolbar/byline-toolbar-extension.ts +95 -0
- package/src/field/extensions/byline-toolbar/index.ts +15 -0
- package/src/field/extensions/code-highlight/code-highlight-extension.ts +18 -0
- package/src/field/extensions/floating-text-format/floating-text-format-extension.ts +39 -0
- package/src/field/{plugins/floating-text-format-toolbar-plugin → extensions/floating-text-format}/index.tsx +1 -1
- package/src/field/extensions/horizontal-rule/horizontal-rule-extension.tsx +57 -0
- package/src/field/{nodes/inline-image-node → extensions/inline-image}/index.ts +1 -1
- package/src/field/{plugins/inline-image-plugin/index.tsx → extensions/inline-image/inline-image-extension.tsx} +54 -6
- package/src/field/{plugins/inline-image-plugin → extensions/inline-image}/inline-image-modal.tsx +1 -1
- package/src/field/{nodes/inline-image-node → extensions/inline-image}/inline-image-node-component.tsx +6 -6
- package/src/field/{nodes/inline-image-node → extensions/inline-image}/inline-image-node.tsx +2 -2
- package/src/field/{nodes/inline-image-node/types.ts → extensions/inline-image/node-types.ts} +1 -1
- package/src/field/{plugins/inline-image-plugin → extensions/inline-image}/types.ts +1 -1
- package/src/field/{plugins/inline-image-plugin → extensions/inline-image}/utils.ts +1 -1
- package/src/field/{plugins/layout-plugin/layout-plugin.tsx → extensions/layout/layout-extension.tsx} +47 -8
- package/src/field/{plugins/link-plugin/auto-link/index.tsx → extensions/link/auto-link-extension.tsx} +13 -3
- package/src/field/{plugins/link-plugin/auto-link → extensions/link}/auto-link-plugin.tsx +2 -2
- package/src/field/{plugins/link-plugin → extensions}/link/floating-link-editor.css +2 -2
- package/src/field/{plugins/link-plugin → extensions}/link/floating-link-editor.tsx +5 -5
- package/src/field/extensions/link/index.ts +5 -0
- package/src/field/extensions/link/link-extension.tsx +131 -0
- package/src/field/{plugins/link-plugin/link/types.ts → extensions/link/link-modal-types.ts} +1 -1
- package/src/field/{plugins/link-plugin → extensions}/link/link-modal.tsx +6 -6
- package/src/field/{nodes/link-nodes → extensions/link}/types.ts +1 -1
- package/src/field/{plugins → extensions/table}/table-action-menu-plugin/index.tsx +12 -8
- package/src/field/extensions/table/table-extension.tsx +86 -0
- package/src/field/extensions/vimeo/vimeo-extension.ts +36 -0
- package/src/field/extensions/youtube/youtube-extension.ts +37 -0
- package/src/field/nodes/index.ts +7 -7
- package/src/field/plugins/table-plugin/index.tsx +10 -10
- package/src/field/plugins/toolbar-plugin/index.tsx +59 -122
- package/src/field/plugins/toolbar-plugin/toolbar-active-editor.tsx +48 -0
- package/src/field/themes/lexical-editor-theme.css +18 -3
- package/src/field/themes/lexical-editor-theme.tsx +1 -0
- package/src/index.ts +45 -2
- package/src/lexical-editor.tsx +35 -14
- package/src/richtext-field.tsx +8 -1
- package/src/server.ts +4 -4
- package/dist/field/nodes/link-nodes/index.d.ts +0 -3
- package/dist/field/nodes/link-nodes/index.js +0 -3
- package/dist/field/plugins/code-highlight-plugin/index.d.ts +0 -9
- package/dist/field/plugins/code-highlight-plugin/index.js +0 -11
- package/dist/field/plugins/link-plugin/auto-link/index.d.ts +0 -9
- package/dist/field/plugins/link-plugin/link/index.d.ts +0 -1
- package/dist/field/plugins/link-plugin/link/index.js +0 -43
- package/dist/field/plugins/table-action-menu-plugin/index.d.ts +0 -5
- package/dist/field/plugins/vimeo-plugin/index.d.ts +0 -3
- package/dist/field/plugins/vimeo-plugin/index.js +0 -24
- package/dist/field/plugins/youtube-plugin/index.d.ts +0 -3
- package/dist/field/plugins/youtube-plugin/index.js +0 -24
- package/dist/field/toolbar-extensions.d.ts +0 -31
- package/dist/field/toolbar-extensions.js +0 -56
- package/src/field/nodes/link-nodes/index.ts +0 -3
- package/src/field/plugins/code-highlight-plugin/index.ts +0 -23
- package/src/field/plugins/link-plugin/link/index.tsx +0 -99
- package/src/field/plugins/vimeo-plugin/index.ts +0 -42
- package/src/field/plugins/youtube-plugin/index.ts +0 -43
- package/src/field/themes/lexical-editor-theme.js +0 -104
- package/src/field/toolbar-extensions.tsx +0 -93
- /package/dist/field/{plugins/admonition-plugin → extensions/admonition}/admonition-modal.css +0 -0
- /package/dist/field/{plugins/admonition-plugin → extensions/admonition}/admonition-modal.d.ts +0 -0
- /package/dist/field/{plugins/admonition-plugin → extensions/admonition}/admonition-modal.js +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/admonition-node-component.css +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/admonition-node.js +0 -0
- /package/dist/field/{plugins/admonition-plugin → extensions/admonition}/fields.js +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/danger-icon.css +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/danger-icon.d.ts +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/danger-icon.js +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/index.d.ts +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/index.js +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/note-icon.css +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/note-icon.d.ts +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/note-icon.js +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/tip-icon.css +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/tip-icon.d.ts +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/tip-icon.js +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/warning-icon.css +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/warning-icon.d.ts +0 -0
- /package/dist/field/{nodes/admonition-node → extensions/admonition}/icons/warning-icon.js +0 -0
- /package/dist/field/{nodes/admonition-node/types.d.ts → extensions/admonition/node-types.d.ts} +0 -0
- /package/dist/field/{nodes/admonition-node/types.js → extensions/admonition/node-types.js} +0 -0
- /package/dist/field/{nodes/inline-image-node → extensions/admonition}/types.js +0 -0
- /package/dist/field/{plugins/auto-embed-plugin → extensions/auto-embed}/auto-embed-modal.css +0 -0
- /package/dist/field/{plugins/auto-embed-plugin → extensions/auto-embed}/auto-embed-modal.js +0 -0
- /package/dist/field/{plugins/floating-text-format-toolbar-plugin → extensions/floating-text-format}/index.css +0 -0
- /package/dist/field/{plugins/floating-text-format-toolbar-plugin → extensions/floating-text-format}/index.d.ts +0 -0
- /package/dist/field/{plugins/inline-image-plugin → extensions/inline-image}/fields.d.ts +0 -0
- /package/dist/field/{plugins/inline-image-plugin → extensions/inline-image}/fields.js +0 -0
- /package/dist/field/{plugins/inline-image-plugin → extensions/inline-image}/inline-image-modal.css +0 -0
- /package/dist/field/{plugins/inline-image-plugin → extensions/inline-image}/inline-image-modal.d.ts +0 -0
- /package/dist/field/{plugins/inline-image-plugin → extensions/inline-image}/inline-image-modal.js +0 -0
- /package/dist/field/{nodes/inline-image-node → extensions/inline-image}/inline-image-node-component.css +0 -0
- /package/dist/field/{nodes/inline-image-node → extensions/inline-image}/inline-image-node.js +0 -0
- /package/dist/field/{nodes/link-nodes/types.js → extensions/inline-image/node-types.js} +0 -0
- /package/dist/field/{plugins/inline-image-plugin → extensions/inline-image}/populate.d.ts +0 -0
- /package/dist/field/{plugins/inline-image-plugin → extensions/inline-image}/populate.js +0 -0
- /package/dist/field/{plugins/admonition-plugin → extensions/inline-image}/types.js +0 -0
- /package/dist/field/{plugins/inline-image-plugin → extensions/inline-image}/utils.js +0 -0
- /package/dist/field/{plugins/layout-plugin → extensions/layout}/insert-layout-modal.css +0 -0
- /package/dist/field/{plugins/layout-plugin → extensions/layout}/insert-layout-modal.d.ts +0 -0
- /package/dist/field/{plugins/layout-plugin → extensions/layout}/insert-layout-modal.js +0 -0
- /package/dist/field/{nodes/layout-container-node → extensions/layout}/layout-container-node.d.ts +0 -0
- /package/dist/field/{nodes/layout-container-node → extensions/layout}/layout-container-node.js +0 -0
- /package/dist/field/{nodes/layout-container-node → extensions/layout}/layout-item-node.d.ts +0 -0
- /package/dist/field/{nodes/layout-container-node → extensions/layout}/layout-item-node.js +0 -0
- /package/dist/field/{nodes/link-nodes → extensions/link}/auto-link-node.d.ts +0 -0
- /package/dist/field/{nodes/link-nodes → extensions/link}/auto-link-node.js +0 -0
- /package/dist/field/{plugins/link-plugin → extensions}/link/floating-link-editor.d.ts +0 -0
- /package/dist/field/{plugins/inline-image-plugin/types.js → extensions/link/link-modal-types.js} +0 -0
- /package/dist/field/{nodes/link-nodes → extensions/link}/link-node.d.ts +0 -0
- /package/dist/field/{nodes/link-nodes → extensions/link}/link-node.js +0 -0
- /package/dist/field/{plugins/link-plugin → extensions/link}/populate.d.ts +0 -0
- /package/dist/field/{plugins/link-plugin → extensions/link}/populate.js +0 -0
- /package/dist/field/{plugins/link-plugin → extensions}/link/types.js +0 -0
- /package/dist/field/{nodes/vimeo-node/index.d.ts → extensions/vimeo/vimeo-node.d.ts} +0 -0
- /package/dist/field/{nodes/vimeo-node/index.js → extensions/vimeo/vimeo-node.js} +0 -0
- /package/dist/field/{nodes/youtube-node/index.d.ts → extensions/youtube/youtube-node.d.ts} +0 -0
- /package/dist/field/{nodes/youtube-node/index.js → extensions/youtube/youtube-node.js} +0 -0
- /package/src/field/{plugins/admonition-plugin → extensions/admonition}/admonition-modal.css +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/admonition-node-component.css +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/danger-icon.css +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/danger-icon.js +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/danger-icon.tsx +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/index.js +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/index.ts +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/note-icon.css +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/note-icon.js +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/note-icon.tsx +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/tip-icon.css +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/tip-icon.js +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/tip-icon.tsx +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/warning-icon.css +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/warning-icon.js +0 -0
- /package/src/field/{nodes/admonition-node → extensions/admonition}/icons/warning-icon.tsx +0 -0
- /package/src/field/{nodes/admonition-node/types.ts → extensions/admonition/node-types.ts} +0 -0
- /package/src/field/{plugins/auto-embed-plugin → extensions/auto-embed}/auto-embed-modal.css +0 -0
- /package/src/field/{plugins/floating-text-format-toolbar-plugin → extensions/floating-text-format}/index.css +0 -0
- /package/src/field/{plugins/inline-image-plugin → extensions/inline-image}/fields.ts +0 -0
- /package/src/field/{plugins/inline-image-plugin → extensions/inline-image}/inline-image-modal.css +0 -0
- /package/src/field/{nodes/inline-image-node → extensions/inline-image}/inline-image-node-component.css +0 -0
- /package/src/field/{plugins/inline-image-plugin → extensions/inline-image}/populate.ts +0 -0
- /package/src/field/{plugins/layout-plugin → extensions/layout}/insert-layout-modal.css +0 -0
- /package/src/field/{plugins/layout-plugin → extensions/layout}/insert-layout-modal.tsx +0 -0
- /package/src/field/{nodes/layout-container-node → extensions/layout}/layout-container-node.ts +0 -0
- /package/src/field/{nodes/layout-container-node → extensions/layout}/layout-item-node.ts +0 -0
- /package/src/field/{nodes/link-nodes → extensions/link}/auto-link-node.ts +0 -0
- /package/src/field/{nodes/link-nodes → extensions/link}/link-node.ts +0 -0
- /package/src/field/{plugins/link-plugin → extensions/link}/populate.ts +0 -0
- /package/src/field/{nodes/vimeo-node/index.tsx → extensions/vimeo/vimeo-node.tsx} +0 -0
- /package/src/field/{nodes/youtube-node/index.tsx → extensions/youtube/youtube-node.tsx} +0 -0
|
@@ -27,9 +27,7 @@ function ApplyValuePlugin({ value, incomingHash, lastEmittedHashRef, normalizedI
|
|
|
27
27
|
}
|
|
28
28
|
hasNormalizedBaselineRef.current = false;
|
|
29
29
|
const nextState = editor.parseEditorState(value);
|
|
30
|
-
editor.
|
|
31
|
-
editor.setEditorState(nextState);
|
|
32
|
-
}, {
|
|
30
|
+
editor.setEditorState(nextState, {
|
|
33
31
|
tag: APPLY_VALUE_TAG
|
|
34
32
|
});
|
|
35
33
|
lastAppliedHashRef.current = nextRawHash;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* This Source Code is subject to the terms of the Mozilla Public
|
|
3
|
+
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
4
|
+
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
|
5
|
+
*
|
|
6
|
+
* Copyright (c) Infonomic Company Limited
|
|
7
|
+
*/
|
|
8
|
+
import type { AnyLexicalExtensionArgument } from 'lexical';
|
|
9
|
+
import { ExtensionsList } from './extensions-list';
|
|
10
|
+
import type { EditorConfig } from './types';
|
|
11
|
+
/**
|
|
12
|
+
* Returns a fresh array of every Byline-built-in Lexical extension in
|
|
13
|
+
* their canonical order. Includes the `BylineToolbarExtension` registry
|
|
14
|
+
* itself so contributing extensions can attach their toolbar items via
|
|
15
|
+
* `peerDependencies`.
|
|
16
|
+
*
|
|
17
|
+
* Order matters: stock framework extensions (clear-editor, tab-indent,
|
|
18
|
+
* auto-focus) come first; toolbar contract sits ahead of any
|
|
19
|
+
* contributing extension; relation-bearing extensions (link, image)
|
|
20
|
+
* land near the end.
|
|
21
|
+
*/
|
|
22
|
+
export declare function defaultExtensionsArray(): AnyLexicalExtensionArgument[];
|
|
23
|
+
/** Fresh `ExtensionsList` populated with the built-in extensions. */
|
|
24
|
+
export declare function defaultExtensionsList(): ExtensionsList;
|
|
25
|
+
/**
|
|
26
|
+
* Client-side default editor config — settings + lexical config + the
|
|
27
|
+
* full default extensions list. Used by `lexicalEditor((c) => ...)` as
|
|
28
|
+
* the seed before invoking the configure callback. Server-only modules
|
|
29
|
+
* (e.g. seeds) must import `defaultEditorConfig` from
|
|
30
|
+
* `@byline/richtext-lexical/server` instead.
|
|
31
|
+
*/
|
|
32
|
+
export declare const defaultClientEditorConfig: EditorConfig;
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { AutoFocusExtension, ClearEditorExtension, TabIndentationExtension } from "@lexical/extension";
|
|
2
|
+
import { CheckListExtension, ListExtension } from "@lexical/list";
|
|
3
|
+
import { AdmonitionExtension } from "../extensions/admonition/admonition-extension.js";
|
|
4
|
+
import { AutoEmbedExtension } from "../extensions/auto-embed/auto-embed-extension.js";
|
|
5
|
+
import { BylineFloatingUIExtension } from "../extensions/byline-floating-ui/byline-floating-ui-extension.js";
|
|
6
|
+
import { BylineToolbarExtension } from "../extensions/byline-toolbar/byline-toolbar-extension.js";
|
|
7
|
+
import { CodeHighlightExtension } from "../extensions/code-highlight/code-highlight-extension.js";
|
|
8
|
+
import { FloatingTextFormatExtension } from "../extensions/floating-text-format/floating-text-format-extension.js";
|
|
9
|
+
import { HorizontalRuleExtension } from "../extensions/horizontal-rule/horizontal-rule-extension.js";
|
|
10
|
+
import { InlineImageExtension } from "../extensions/inline-image/inline-image-extension.js";
|
|
11
|
+
import { LayoutExtension } from "../extensions/layout/layout-extension.js";
|
|
12
|
+
import { AutoLinkExtension } from "../extensions/link/auto-link-extension.js";
|
|
13
|
+
import { LinkExtension } from "../extensions/link/link-extension.js";
|
|
14
|
+
import { TableExtension } from "../extensions/table/table-extension.js";
|
|
15
|
+
import { VimeoExtension } from "../extensions/vimeo/vimeo-extension.js";
|
|
16
|
+
import { YouTubeExtension } from "../extensions/youtube/youtube-extension.js";
|
|
17
|
+
import { defaultEditorConfig } from "./default.js";
|
|
18
|
+
import { ExtensionsList } from "./extensions-list.js";
|
|
19
|
+
function defaultExtensionsArray() {
|
|
20
|
+
return [
|
|
21
|
+
ClearEditorExtension,
|
|
22
|
+
TabIndentationExtension,
|
|
23
|
+
AutoFocusExtension,
|
|
24
|
+
BylineToolbarExtension,
|
|
25
|
+
BylineFloatingUIExtension,
|
|
26
|
+
ListExtension,
|
|
27
|
+
CheckListExtension,
|
|
28
|
+
HorizontalRuleExtension,
|
|
29
|
+
LayoutExtension,
|
|
30
|
+
AdmonitionExtension,
|
|
31
|
+
CodeHighlightExtension,
|
|
32
|
+
TableExtension,
|
|
33
|
+
LinkExtension,
|
|
34
|
+
AutoLinkExtension,
|
|
35
|
+
InlineImageExtension,
|
|
36
|
+
YouTubeExtension,
|
|
37
|
+
VimeoExtension,
|
|
38
|
+
AutoEmbedExtension,
|
|
39
|
+
FloatingTextFormatExtension
|
|
40
|
+
];
|
|
41
|
+
}
|
|
42
|
+
function defaultExtensionsList() {
|
|
43
|
+
return new ExtensionsList(defaultExtensionsArray());
|
|
44
|
+
}
|
|
45
|
+
const defaultClientEditorConfig = {
|
|
46
|
+
...defaultEditorConfig,
|
|
47
|
+
extensions: defaultExtensionsList()
|
|
48
|
+
};
|
|
49
|
+
export { defaultClientEditorConfig, defaultExtensionsArray, defaultExtensionsList };
|
|
@@ -2,4 +2,12 @@ import type { EditorConfig as LexicalEditorConfig } from 'lexical';
|
|
|
2
2
|
import type { EditorConfig, EditorSettings } from './types';
|
|
3
3
|
export declare const defaultEditorLexicalConfig: LexicalEditorConfig;
|
|
4
4
|
export declare const DEFAULT_EDITOR_SETTINGS: EditorSettings;
|
|
5
|
+
/**
|
|
6
|
+
* Server-safe editor config — settings + Lexical core config only. The
|
|
7
|
+
* `extensions` field is intentionally omitted because extension entries
|
|
8
|
+
* carry React-bearing decorators that would break tsx-loaded seeds and
|
|
9
|
+
* other server-side schema consumers. The client-side
|
|
10
|
+
* `defaultClientEditorConfig` (in `default-extensions.tsx`) layers the
|
|
11
|
+
* extensions list on top.
|
|
12
|
+
*/
|
|
5
13
|
export declare const defaultEditorConfig: EditorConfig;
|
|
@@ -5,41 +5,13 @@ const defaultEditorLexicalConfig = {
|
|
|
5
5
|
};
|
|
6
6
|
const DEFAULT_EDITOR_SETTINGS = {
|
|
7
7
|
options: {
|
|
8
|
-
disableBeforeInput: false,
|
|
9
|
-
autocomplete: false,
|
|
10
|
-
charLimit: false,
|
|
11
|
-
charLimitUtf8: false,
|
|
12
|
-
collab: false,
|
|
13
|
-
maxLength: false,
|
|
14
8
|
richText: true,
|
|
15
|
-
measureTypingPerf: false,
|
|
16
|
-
showNestedEditorTreeView: false,
|
|
17
|
-
showTableOfContents: false,
|
|
18
9
|
showTreeView: false,
|
|
19
10
|
textAlignment: true,
|
|
20
|
-
tablePlugin: true,
|
|
21
|
-
tableCellBackgroundColor: true,
|
|
22
|
-
tableCellMerge: true,
|
|
23
|
-
tableActionMenuPlugin: true,
|
|
24
|
-
layoutPlugin: true,
|
|
25
|
-
outputHTML: false,
|
|
26
|
-
outputMarkdown: false,
|
|
27
|
-
autoFocusPlugin: false,
|
|
28
|
-
autoLinkPlugin: false,
|
|
29
|
-
inlineImagePlugin: true,
|
|
30
|
-
admonitionPlugin: true,
|
|
31
|
-
checkListPlugin: true,
|
|
32
|
-
listPlugin: true,
|
|
33
|
-
codeHighlightPlugin: true,
|
|
34
|
-
horizontalRulePlugin: true,
|
|
35
11
|
markdownShortcutPlugin: false,
|
|
36
12
|
undoRedo: true,
|
|
37
13
|
textStyle: true,
|
|
38
14
|
inlineCode: true,
|
|
39
|
-
links: true,
|
|
40
|
-
floatingLinkEditorPlugin: true,
|
|
41
|
-
floatingTextFormatToolbarPlugin: false,
|
|
42
|
-
autoEmbedPlugin: true,
|
|
43
15
|
debug: false
|
|
44
16
|
},
|
|
45
17
|
inlineImageUploadCollection: 'media',
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import { createContext, useCallback, useContext, useMemo, useState } from "react";
|
|
4
|
-
import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
|
|
5
4
|
import { DEFAULT_EDITOR_SETTINGS } from "./default.js";
|
|
6
5
|
function generateQuickGuid() {
|
|
7
6
|
return Math.random().toString(36).substring(2, 12) + Math.random().toString(36).substring(2, 12);
|
|
@@ -14,7 +13,6 @@ const Context = /*#__PURE__*/ createContext({
|
|
|
14
13
|
const EditorConfigContext = ({ children, config: configFromProps })=>{
|
|
15
14
|
const [config, setConfig] = useState(configFromProps ?? DEFAULT_EDITOR_SETTINGS);
|
|
16
15
|
const [uuid] = useState(()=>generateQuickGuid());
|
|
17
|
-
const [editor] = useLexicalComposerContext();
|
|
18
16
|
const setOption = useCallback((option, value)=>{
|
|
19
17
|
setConfig((config)=>{
|
|
20
18
|
const options = {
|
|
@@ -30,13 +28,11 @@ const EditorConfigContext = ({ children, config: configFromProps })=>{
|
|
|
30
28
|
const editorContext = useMemo(()=>({
|
|
31
29
|
setOption,
|
|
32
30
|
config,
|
|
33
|
-
uuid
|
|
34
|
-
editor
|
|
31
|
+
uuid
|
|
35
32
|
}), [
|
|
36
33
|
setOption,
|
|
37
34
|
config,
|
|
38
|
-
uuid
|
|
39
|
-
editor
|
|
35
|
+
uuid
|
|
40
36
|
]);
|
|
41
37
|
return /*#__PURE__*/ jsx(Context.Provider, {
|
|
42
38
|
value: editorContext,
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* This Source Code is subject to the terms of the Mozilla Public
|
|
3
|
+
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
4
|
+
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
|
5
|
+
*
|
|
6
|
+
* Copyright (c) Infonomic Company Limited
|
|
7
|
+
*/
|
|
8
|
+
import { type AnyLexicalExtension, type AnyLexicalExtensionArgument, type LexicalExtensionConfig } from 'lexical';
|
|
9
|
+
/**
|
|
10
|
+
* Chainable wrapper around an ordered list of Lexical extensions. Used
|
|
11
|
+
* inside the `lexicalEditor((c) => ...)` configure callback so site
|
|
12
|
+
* authors can add, remove, configure, or reorder extensions before the
|
|
13
|
+
* editor is built.
|
|
14
|
+
*
|
|
15
|
+
* Comparison is by extension `name` so a bare `LinkExtension` and a
|
|
16
|
+
* `configExtension(LinkExtension, {...})` tuple are treated as the same
|
|
17
|
+
* entry.
|
|
18
|
+
*/
|
|
19
|
+
export declare class ExtensionsList {
|
|
20
|
+
private items;
|
|
21
|
+
constructor(items?: ReadonlyArray<AnyLexicalExtensionArgument>);
|
|
22
|
+
/** Append `extension` to the end of the list. */
|
|
23
|
+
add(extension: AnyLexicalExtensionArgument): this;
|
|
24
|
+
/**
|
|
25
|
+
* Remove every entry whose name matches `extension.name`. No-op when
|
|
26
|
+
* the extension isn't present.
|
|
27
|
+
*/
|
|
28
|
+
remove(extension: AnyLexicalExtension): this;
|
|
29
|
+
/** Replace `oldExtension` with `newExtension`, preserving position. */
|
|
30
|
+
replace(oldExtension: AnyLexicalExtension, newExtension: AnyLexicalExtensionArgument): this;
|
|
31
|
+
/**
|
|
32
|
+
* Re-wrap an existing extension entry with a fresh `configExtension`
|
|
33
|
+
* binding the supplied config. If the extension isn't present, it is
|
|
34
|
+
* added. If it was already wrapped with `configExtension`, the wrapper
|
|
35
|
+
* is replaced rather than nested.
|
|
36
|
+
*/
|
|
37
|
+
configure<Extension extends AnyLexicalExtension>(extension: Extension, config: Partial<LexicalExtensionConfig<Extension>>): this;
|
|
38
|
+
/** True when an entry with the same `name` is present. */
|
|
39
|
+
has(extension: AnyLexicalExtension): boolean;
|
|
40
|
+
/** Independent copy — safe to hand to a configure callback. */
|
|
41
|
+
clone(): ExtensionsList;
|
|
42
|
+
/** The list as a plain array, ready for `defineExtension({ dependencies })`. */
|
|
43
|
+
toArray(): AnyLexicalExtensionArgument[];
|
|
44
|
+
}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { configExtension } from "lexical";
|
|
2
|
+
class ExtensionsList {
|
|
3
|
+
add(extension) {
|
|
4
|
+
this.items.push(extension);
|
|
5
|
+
return this;
|
|
6
|
+
}
|
|
7
|
+
remove(extension) {
|
|
8
|
+
const targetName = extension.name;
|
|
9
|
+
this.items = this.items.filter((item)=>extensionName(item) !== targetName);
|
|
10
|
+
return this;
|
|
11
|
+
}
|
|
12
|
+
replace(oldExtension, newExtension) {
|
|
13
|
+
const targetName = oldExtension.name;
|
|
14
|
+
let replaced = false;
|
|
15
|
+
this.items = this.items.map((item)=>{
|
|
16
|
+
if (!replaced && extensionName(item) === targetName) {
|
|
17
|
+
replaced = true;
|
|
18
|
+
return newExtension;
|
|
19
|
+
}
|
|
20
|
+
return item;
|
|
21
|
+
});
|
|
22
|
+
if (!replaced) this.items.push(newExtension);
|
|
23
|
+
return this;
|
|
24
|
+
}
|
|
25
|
+
configure(extension, config) {
|
|
26
|
+
const wrapped = configExtension(extension, config);
|
|
27
|
+
return this.replace(extension, wrapped);
|
|
28
|
+
}
|
|
29
|
+
has(extension) {
|
|
30
|
+
const targetName = extension.name;
|
|
31
|
+
return this.items.some((item)=>extensionName(item) === targetName);
|
|
32
|
+
}
|
|
33
|
+
clone() {
|
|
34
|
+
return new ExtensionsList(this.items);
|
|
35
|
+
}
|
|
36
|
+
toArray() {
|
|
37
|
+
return [
|
|
38
|
+
...this.items
|
|
39
|
+
];
|
|
40
|
+
}
|
|
41
|
+
constructor(items = []){
|
|
42
|
+
this.items = [
|
|
43
|
+
...items
|
|
44
|
+
];
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
function extensionName(item) {
|
|
48
|
+
if (Array.isArray(item)) {
|
|
49
|
+
const head = item[0];
|
|
50
|
+
if (null != head && 'object' == typeof head && 'name' in head) return head.name;
|
|
51
|
+
return;
|
|
52
|
+
}
|
|
53
|
+
if (null != item && 'object' == typeof item && 'name' in item) return item.name;
|
|
54
|
+
}
|
|
55
|
+
export { ExtensionsList };
|
|
@@ -1,7 +1,21 @@
|
|
|
1
1
|
import type { EditorConfig as LexicalEditorConfig } from 'lexical';
|
|
2
|
-
|
|
2
|
+
import type { ExtensionsList } from './extensions-list';
|
|
3
|
+
/**
|
|
4
|
+
* Settings that aren't expressible as "is extension X present in the
|
|
5
|
+
* extensions list?" — toolbar / UI mode toggles, debug switches, the
|
|
6
|
+
* inline-image upload target, etc. Everything else now lives on
|
|
7
|
+
* {@link EditorConfig.extensions} and is manipulated via the chainable
|
|
8
|
+
* `lexicalEditor((c) => c.extensions.add(...).remove(...))` API.
|
|
9
|
+
*/
|
|
10
|
+
export type OptionName = 'richText' | 'showTreeView' | 'textAlignment' | 'markdownShortcutPlugin' | 'undoRedo' | 'textStyle' | 'inlineCode' | 'debug';
|
|
3
11
|
export interface EditorSettings {
|
|
4
12
|
options: Record<OptionName, boolean>;
|
|
13
|
+
/**
|
|
14
|
+
* Upload collection passed to the inline-image picker. Forwarded to
|
|
15
|
+
* `InlineImageExtension`'s config when the extensions list is built;
|
|
16
|
+
* setting it here is equivalent to
|
|
17
|
+
* `c.extensions.configure(InlineImageExtension, { collection })`.
|
|
18
|
+
*/
|
|
5
19
|
inlineImageUploadCollection: string;
|
|
6
20
|
placeholderText: string;
|
|
7
21
|
/**
|
|
@@ -24,4 +38,17 @@ export interface EditorSettingsOverride {
|
|
|
24
38
|
export interface EditorConfig {
|
|
25
39
|
settings: EditorSettings;
|
|
26
40
|
lexical: LexicalEditorConfig;
|
|
41
|
+
/**
|
|
42
|
+
* Manipulable list of Lexical extensions wired into the editor. When
|
|
43
|
+
* omitted (server-safe `defaultEditorConfig` from `/server` does not
|
|
44
|
+
* carry one), the editor falls back to the package's built-in list at
|
|
45
|
+
* render time.
|
|
46
|
+
*
|
|
47
|
+
* Field-level `RichTextField.editorConfig` should not set this
|
|
48
|
+
* directly — extension references are not JSON-safe and would break
|
|
49
|
+
* tsx-loaded seeds. Per-field extension overrides go through a
|
|
50
|
+
* client-side wrapper component registered via
|
|
51
|
+
* `FieldAdminConfig.editor` (see `aiRichTextAdmin()` for the pattern).
|
|
52
|
+
*/
|
|
53
|
+
extensions?: ExtensionsList;
|
|
27
54
|
}
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
* Copyright (c) Infonomic Company Limited
|
|
7
7
|
*/
|
|
8
8
|
import type * as React from 'react';
|
|
9
|
-
import type
|
|
9
|
+
import { type EditorState, type LexicalEditor, type SerializedEditorState } from 'lexical';
|
|
10
10
|
import type { EditorConfig } from './config/types';
|
|
11
11
|
export declare function EditorContext(props: {
|
|
12
12
|
composerKey: string;
|
|
@@ -1,57 +1,61 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { useMemo } from "react";
|
|
4
|
-
import {
|
|
4
|
+
import { LexicalExtensionComposer } from "@lexical/react/LexicalExtensionComposer";
|
|
5
|
+
import { defineExtension } from "lexical";
|
|
6
|
+
import { defaultExtensionsList } from "./config/default-extensions.js";
|
|
5
7
|
import { EditorConfigContext } from "./config/editor-config-context.js";
|
|
6
8
|
import { SharedHistoryContext } from "./context/shared-history-context.js";
|
|
7
9
|
import { SharedOnChangeContext } from "./context/shared-on-change-context.js";
|
|
8
10
|
import { Editor } from "./editor.js";
|
|
11
|
+
import { InlineImageExtension } from "./extensions/inline-image/inline-image-extension.js";
|
|
9
12
|
import { Nodes } from "./nodes/index.js";
|
|
10
|
-
import { ToolbarExtensionsProvider } from "./toolbar-extensions.js";
|
|
11
13
|
function EditorContext(props) {
|
|
12
14
|
const { composerKey, editorConfig, onChange, readOnly, value, beforeEditor, afterEditor, children } = props;
|
|
13
|
-
const
|
|
14
|
-
|
|
15
|
-
|
|
15
|
+
const editable = true !== readOnly;
|
|
16
|
+
const rootExtension = useMemo(()=>{
|
|
17
|
+
const extensionsList = editorConfig.extensions ?? defaultExtensionsList();
|
|
18
|
+
const dependencies = extensionsList.clone().configure(InlineImageExtension, {
|
|
19
|
+
collection: editorConfig.settings.inlineImageUploadCollection
|
|
20
|
+
}).toArray();
|
|
21
|
+
return defineExtension({
|
|
22
|
+
name: '[root]',
|
|
16
23
|
namespace: editorConfig.lexical.namespace,
|
|
17
24
|
nodes: [
|
|
18
25
|
...Nodes
|
|
19
26
|
],
|
|
27
|
+
theme: editorConfig.lexical.theme,
|
|
28
|
+
editable,
|
|
29
|
+
$initialEditorState: null != value ? JSON.stringify(value) : void 0,
|
|
20
30
|
onError: (error)=>{
|
|
21
31
|
throw error;
|
|
22
32
|
},
|
|
23
|
-
|
|
24
|
-
})
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
maxHeight: props.maxHeight
|
|
46
|
-
}),
|
|
47
|
-
afterEditor,
|
|
48
|
-
children
|
|
49
|
-
]
|
|
50
|
-
})
|
|
33
|
+
dependencies
|
|
34
|
+
});
|
|
35
|
+
}, []);
|
|
36
|
+
return /*#__PURE__*/ jsx(EditorConfigContext, {
|
|
37
|
+
config: editorConfig.settings,
|
|
38
|
+
children: /*#__PURE__*/ jsx(SharedOnChangeContext, {
|
|
39
|
+
onChange: onChange,
|
|
40
|
+
children: /*#__PURE__*/ jsx(SharedHistoryContext, {
|
|
41
|
+
children: /*#__PURE__*/ jsx(LexicalExtensionComposer, {
|
|
42
|
+
extension: rootExtension,
|
|
43
|
+
contentEditable: null,
|
|
44
|
+
children: /*#__PURE__*/ jsxs("div", {
|
|
45
|
+
className: "editor-shell",
|
|
46
|
+
children: [
|
|
47
|
+
beforeEditor,
|
|
48
|
+
/*#__PURE__*/ jsx(Editor, {
|
|
49
|
+
minHeight: props.minHeight,
|
|
50
|
+
maxHeight: props.maxHeight
|
|
51
|
+
}),
|
|
52
|
+
afterEditor,
|
|
53
|
+
children
|
|
54
|
+
]
|
|
51
55
|
})
|
|
52
|
-
})
|
|
56
|
+
}, composerKey + editable)
|
|
53
57
|
})
|
|
54
58
|
})
|
|
55
|
-
}
|
|
59
|
+
});
|
|
56
60
|
}
|
|
57
61
|
export { EditorContext };
|
package/dist/field/editor.js
CHANGED
|
@@ -2,39 +2,23 @@
|
|
|
2
2
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { memo, useCallback, useEffect, useMemo, useState } from "react";
|
|
4
4
|
import { TRANSFORMERS } from "@lexical/markdown";
|
|
5
|
-
import { AutoFocusPlugin } from "@lexical/react/LexicalAutoFocusPlugin";
|
|
6
|
-
import { CheckListPlugin } from "@lexical/react/LexicalCheckListPlugin";
|
|
7
|
-
import { ClearEditorPlugin } from "@lexical/react/LexicalClearEditorPlugin";
|
|
8
5
|
import { LexicalErrorBoundary } from "@lexical/react/LexicalErrorBoundary";
|
|
9
6
|
import { HistoryPlugin } from "@lexical/react/LexicalHistoryPlugin";
|
|
10
|
-
import { HorizontalRulePlugin } from "@lexical/react/LexicalHorizontalRulePlugin";
|
|
11
|
-
import { ListPlugin } from "@lexical/react/LexicalListPlugin";
|
|
12
7
|
import { MarkdownShortcutPlugin } from "@lexical/react/LexicalMarkdownShortcutPlugin";
|
|
13
8
|
import { OnChangePlugin } from "@lexical/react/LexicalOnChangePlugin";
|
|
14
9
|
import { PlainTextPlugin } from "@lexical/react/LexicalPlainTextPlugin";
|
|
15
10
|
import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
|
|
16
|
-
import {
|
|
17
|
-
import { TablePlugin } from "@lexical/react/LexicalTablePlugin";
|
|
11
|
+
import { useExtensionDependency, useOptionalExtensionDependency } from "@lexical/react/useExtensionComponent";
|
|
18
12
|
import { useEditorConfig } from "./config/editor-config-context.js";
|
|
19
13
|
import { ContentEditable } from "./content-editable.js";
|
|
20
14
|
import { useSharedHistoryContext } from "./context/shared-history-context.js";
|
|
21
15
|
import { useSharedOnChange } from "./context/shared-on-change-context.js";
|
|
22
16
|
import { Debug } from "./debug.js";
|
|
23
|
-
import {
|
|
24
|
-
import {
|
|
25
|
-
import {
|
|
26
|
-
import { FloatingTextFormatToolbarPlugin } from "./plugins/floating-text-format-toolbar-plugin/index.js";
|
|
27
|
-
import { InlineImagePlugin } from "./plugins/inline-image-plugin/index.js";
|
|
28
|
-
import { LayoutPlugin } from "./plugins/layout-plugin/layout-plugin.js";
|
|
29
|
-
import { AutoLinkPlugin } from "./plugins/link-plugin/auto-link/index.js";
|
|
30
|
-
import { LinkPlugin } from "./plugins/link-plugin/link/index.js";
|
|
31
|
-
import { FloatingLinkEditorPlugin } from "./plugins/link-plugin/link/floating-link-editor.js";
|
|
32
|
-
import { TableActionMenuPlugin } from "./plugins/table-action-menu-plugin/index.js";
|
|
33
|
-
import { TablePlugin as index_js_TablePlugin } from "./plugins/table-plugin/index.js";
|
|
17
|
+
import { BylineFloatingUIExtension, selectFloatingUIItems } from "./extensions/byline-floating-ui/byline-floating-ui-extension.js";
|
|
18
|
+
import { TableExtension } from "./extensions/table/table-extension.js";
|
|
19
|
+
import { TablePlugin } from "./plugins/table-plugin/index.js";
|
|
34
20
|
import { ToolbarPlugin } from "./plugins/toolbar-plugin/index.js";
|
|
35
21
|
import { TreeViewPlugin } from "./plugins/treeview-plugin/index.js";
|
|
36
|
-
import { VimeoPlugin } from "./plugins/vimeo-plugin/index.js";
|
|
37
|
-
import { YouTubePlugin } from "./plugins/youtube-plugin/index.js";
|
|
38
22
|
import { CAN_USE_DOM } from "./shared/canUseDOM.js";
|
|
39
23
|
import { Placeholder } from "./ui/placeholder.js";
|
|
40
24
|
import "./editor.css";
|
|
@@ -47,7 +31,9 @@ const editor_Editor = /*#__PURE__*/ memo(function({ minHeight, maxHeight }) {
|
|
|
47
31
|
}))[0];
|
|
48
32
|
const { onChange } = useSharedOnChange();
|
|
49
33
|
const { historyState } = useSharedHistoryContext();
|
|
50
|
-
const { config: { options: { debug, richText, showTreeView,
|
|
34
|
+
const { config: { options: { debug, richText, showTreeView, markdownShortcutPlugin }, placeholderText } } = useEditorConfig();
|
|
35
|
+
const hasTableExtension = void 0 !== useOptionalExtensionDependency(TableExtension);
|
|
36
|
+
const floatingUIItems = selectFloatingUIItems(useExtensionDependency(BylineFloatingUIExtension).config.items);
|
|
51
37
|
const onRef = useCallback((_floatingAnchorElem)=>{
|
|
52
38
|
if (null != _floatingAnchorElem) setFloatingAnchorElem(_floatingAnchorElem);
|
|
53
39
|
}, []);
|
|
@@ -96,16 +82,11 @@ const editor_Editor = /*#__PURE__*/ memo(function({ minHeight, maxHeight }) {
|
|
|
96
82
|
]);
|
|
97
83
|
const content = /*#__PURE__*/ jsxs(Fragment, {
|
|
98
84
|
children: [
|
|
99
|
-
|
|
85
|
+
hasTableExtension && /*#__PURE__*/ jsx(TablePlugin, {}),
|
|
100
86
|
richText && /*#__PURE__*/ jsx(ToolbarPlugin, {}),
|
|
101
87
|
/*#__PURE__*/ jsxs("div", {
|
|
102
88
|
className: `editor-container ${showTreeView ? 'tree-view' : ''} ${!richText ? 'plain-text' : ''}`,
|
|
103
89
|
children: [
|
|
104
|
-
autoFocusPlugin && /*#__PURE__*/ jsx(AutoFocusPlugin, {}),
|
|
105
|
-
links && /*#__PURE__*/ jsx(LinkPlugin, {}),
|
|
106
|
-
autoEmbedPlugin && /*#__PURE__*/ jsx(AutoEmbedPlugin, {}),
|
|
107
|
-
/*#__PURE__*/ jsx(TabIndentationPlugin, {}),
|
|
108
|
-
autoLinkPlugin && /*#__PURE__*/ jsx(AutoLinkPlugin, {}),
|
|
109
90
|
/*#__PURE__*/ jsx(OnChangePlugin, {
|
|
110
91
|
ignoreSelectionChange: true,
|
|
111
92
|
onChange: (editorState, editor, tags)=>{
|
|
@@ -127,38 +108,12 @@ const editor_Editor = /*#__PURE__*/ memo(function({ minHeight, maxHeight }) {
|
|
|
127
108
|
/*#__PURE__*/ jsx(HistoryPlugin, {
|
|
128
109
|
externalHistoryState: historyState
|
|
129
110
|
}),
|
|
130
|
-
inlineImagePlugin && /*#__PURE__*/ jsx(InlineImagePlugin, {
|
|
131
|
-
collection: inlineImageUploadCollection
|
|
132
|
-
}),
|
|
133
|
-
admonitionPlugin && /*#__PURE__*/ jsx(AdmonitionPlugin, {}),
|
|
134
|
-
checkListPlugin && /*#__PURE__*/ jsx(CheckListPlugin, {}),
|
|
135
|
-
listPlugin && /*#__PURE__*/ jsx(ListPlugin, {}),
|
|
136
|
-
codeHighlightPlugin && /*#__PURE__*/ jsx(CodeHighlightPlugin, {}),
|
|
137
|
-
horizontalRulePlugin && /*#__PURE__*/ jsx(HorizontalRulePlugin, {}),
|
|
138
|
-
layoutPlugin && /*#__PURE__*/ jsx(LayoutPlugin, {}),
|
|
139
|
-
autoEmbedPlugin && /*#__PURE__*/ jsx(YouTubePlugin, {}),
|
|
140
|
-
autoEmbedPlugin && /*#__PURE__*/ jsx(VimeoPlugin, {}),
|
|
141
111
|
markdownShortcutPlugin && /*#__PURE__*/ jsx(MarkdownShortcutPlugin, {
|
|
142
112
|
transformers: TRANSFORMERS
|
|
143
113
|
}),
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
}),
|
|
148
|
-
null != floatingAnchorElem && !isSmallWidthViewport && /*#__PURE__*/ jsxs(Fragment, {
|
|
149
|
-
children: [
|
|
150
|
-
floatingLinkEditorPlugin && /*#__PURE__*/ jsx(FloatingLinkEditorPlugin, {
|
|
151
|
-
anchorElem: floatingAnchorElem
|
|
152
|
-
}),
|
|
153
|
-
tableActionMenuPlugin && /*#__PURE__*/ jsx(TableActionMenuPlugin, {
|
|
154
|
-
anchorElem: floatingAnchorElem,
|
|
155
|
-
cellMerge: false
|
|
156
|
-
}),
|
|
157
|
-
floatingTextFormatToolbarPlugin && /*#__PURE__*/ jsx(FloatingTextFormatToolbarPlugin, {
|
|
158
|
-
anchorElem: floatingAnchorElem
|
|
159
|
-
})
|
|
160
|
-
]
|
|
161
|
-
})
|
|
114
|
+
null != floatingAnchorElem && !isSmallWidthViewport && floatingUIItems.map(({ id, Component })=>/*#__PURE__*/ jsx(Component, {
|
|
115
|
+
anchorElem: floatingAnchorElem
|
|
116
|
+
}, id))
|
|
162
117
|
]
|
|
163
118
|
}) : /*#__PURE__*/ jsxs(Fragment, {
|
|
164
119
|
children: [
|
|
@@ -174,7 +129,6 @@ const editor_Editor = /*#__PURE__*/ memo(function({ minHeight, maxHeight }) {
|
|
|
174
129
|
})
|
|
175
130
|
]
|
|
176
131
|
}),
|
|
177
|
-
/*#__PURE__*/ jsx(ClearEditorPlugin, {}),
|
|
178
132
|
debug && /*#__PURE__*/ jsxs(Fragment, {
|
|
179
133
|
children: [
|
|
180
134
|
/*#__PURE__*/ jsx(Debug, {}),
|
|
@@ -7,8 +7,9 @@
|
|
|
7
7
|
*/
|
|
8
8
|
import * as React from 'react';
|
|
9
9
|
import { type LexicalCommand } from 'lexical';
|
|
10
|
-
import type { AdmonitionAttributes } from '
|
|
10
|
+
import type { AdmonitionAttributes } from './node-types';
|
|
11
11
|
export type InsertAdmonitionPayload = Readonly<AdmonitionAttributes>;
|
|
12
12
|
export declare const OPEN_ADMONITION_MODAL_COMMAND: LexicalCommand<null>;
|
|
13
13
|
export declare const INSERT_ADMONITION_COMMAND: LexicalCommand<AdmonitionAttributes>;
|
|
14
14
|
export declare function AdmonitionPlugin(): React.JSX.Element;
|
|
15
|
+
export declare const AdmonitionExtension: import("lexical").LexicalExtension<import("lexical").ExtensionConfigBase, "@byline/richtext-lexical/Admonition", unknown, unknown>;
|
|
@@ -1,10 +1,14 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
|
|
4
|
+
import { ReactExtension } from "@lexical/react/ReactExtension";
|
|
4
5
|
import { $insertNodeToNearestRoot, mergeRegister } from "@lexical/utils";
|
|
5
|
-
import { $getSelection, $isRangeSelection, COMMAND_PRIORITY_EDITOR, COMMAND_PRIORITY_NORMAL, createCommand } from "lexical";
|
|
6
|
-
import {
|
|
6
|
+
import { $getSelection, $isRangeSelection, COMMAND_PRIORITY_EDITOR, COMMAND_PRIORITY_NORMAL, configExtension, createCommand, declarePeerDependency, defineExtension } from "lexical";
|
|
7
|
+
import { useToolbarActiveEditor } from "../../plugins/toolbar-plugin/toolbar-active-editor.js";
|
|
8
|
+
import { DropDownItem } from "../../ui/dropdown.js";
|
|
9
|
+
import { BylineToolbarExtension } from "../byline-toolbar/byline-toolbar-extension.js";
|
|
7
10
|
import { AdmonitionModal } from "./admonition-modal.js";
|
|
11
|
+
import { $createAdmonitionNode, AdmonitionNode } from "./admonition-node.js";
|
|
8
12
|
import * as __rspack_external_react from "react";
|
|
9
13
|
const OPEN_ADMONITION_MODAL_COMMAND = createCommand('OPEN_ADMONITION_MODAL_COMMAND');
|
|
10
14
|
const INSERT_ADMONITION_COMMAND = createCommand('INSERT_ADMONITION_COMMAND');
|
|
@@ -51,4 +55,47 @@ function AdmonitionPlugin() {
|
|
|
51
55
|
onSubmit: handleInsertAdmonition
|
|
52
56
|
});
|
|
53
57
|
}
|
|
54
|
-
|
|
58
|
+
function AdmonitionInsertItem() {
|
|
59
|
+
const editor = useToolbarActiveEditor();
|
|
60
|
+
return /*#__PURE__*/ jsxs(DropDownItem, {
|
|
61
|
+
onClick: ()=>{
|
|
62
|
+
editor.dispatchCommand(OPEN_ADMONITION_MODAL_COMMAND, null);
|
|
63
|
+
},
|
|
64
|
+
className: "item",
|
|
65
|
+
children: [
|
|
66
|
+
/*#__PURE__*/ jsx("i", {
|
|
67
|
+
className: "icon admonition"
|
|
68
|
+
}),
|
|
69
|
+
/*#__PURE__*/ jsx("span", {
|
|
70
|
+
className: "text",
|
|
71
|
+
children: "Admonition"
|
|
72
|
+
})
|
|
73
|
+
]
|
|
74
|
+
});
|
|
75
|
+
}
|
|
76
|
+
const AdmonitionExtension = defineExtension({
|
|
77
|
+
name: '@byline/richtext-lexical/Admonition',
|
|
78
|
+
nodes: ()=>[
|
|
79
|
+
AdmonitionNode
|
|
80
|
+
],
|
|
81
|
+
dependencies: [
|
|
82
|
+
configExtension(ReactExtension, {
|
|
83
|
+
decorators: [
|
|
84
|
+
/*#__PURE__*/ jsx(AdmonitionPlugin, {}, "d")
|
|
85
|
+
]
|
|
86
|
+
})
|
|
87
|
+
],
|
|
88
|
+
peerDependencies: [
|
|
89
|
+
declarePeerDependency(BylineToolbarExtension.name, {
|
|
90
|
+
items: [
|
|
91
|
+
{
|
|
92
|
+
id: '@byline/richtext-lexical/Admonition/insert',
|
|
93
|
+
placement: 'insert-menu',
|
|
94
|
+
order: 30,
|
|
95
|
+
node: /*#__PURE__*/ jsx(AdmonitionInsertItem, {})
|
|
96
|
+
}
|
|
97
|
+
]
|
|
98
|
+
})
|
|
99
|
+
]
|
|
100
|
+
});
|
|
101
|
+
export { AdmonitionExtension, AdmonitionPlugin, INSERT_ADMONITION_COMMAND, OPEN_ADMONITION_MODAL_COMMAND };
|
package/dist/field/{nodes/admonition-node → extensions/admonition}/admonition-node-component.d.ts
RENAMED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
*/
|
|
8
8
|
import type * as React from 'react';
|
|
9
9
|
import type { LexicalEditor, NodeKey } from 'lexical';
|
|
10
|
-
import type { AdmonitionType } from './types';
|
|
10
|
+
import type { AdmonitionType } from './node-types';
|
|
11
11
|
import './admonition-node-component.css';
|
|
12
12
|
export default function AdmonitionNodeComponent({ admonitionType, title, content, nodeKey, }: {
|
|
13
13
|
admonitionType: AdmonitionType;
|