@webiny/lexical-editor 6.0.0-beta.0 → 6.0.0-rc.0

package/plugins/ImagesPlugin/ImagesPlugin.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","_utils","_lexical","_lexicalNodes","_commands","_canUseDOM","_insertImage","_hooks","getDOMSelection","targetWindow","CAN_USE_DOM","window","getSelection","ImagesPlugin","_ref","captionsEnabled","_useRichTextEditor","useRichTextEditor","editor","useEffect","hasNodes","ImageNode","Error","mergeRegister","registerCommand","INSERT_IMAGE_COMMAND","payload","insertImage","COMMAND_PRIORITY_EDITOR","DRAGSTART_COMMAND","event","onDragStart","COMMAND_PRIORITY_HIGH","DRAGOVER_COMMAND","onDragover","COMMAND_PRIORITY_LOW","DROP_COMMAND","onDrop","TRANSPARENT_IMAGE","img","document","createElement","src","node","getImageNodeInSelection","dataTransfer","setData","setDragImage","JSON","stringify","data","id","__id","altText","__altText","caption","__caption","height","__height","key","getKey","maxWidth","__maxWidth","showCaption","__showCaption","__src","width","__width","type","canDropImage","preventDefault","getDragImageData","range","getDragSelection","remove","rangeSelection","$createRangeSelection","undefined","applyDOMRange","$setSelection","dispatchCommand","selection","$getSelection","$isNodeSelection","nodes","getNodes","$isImageNode","dragData","getData","_JSON$parse","parse","target","HTMLElement","closest","parentElement","nodeType","defaultView","ownerDocument","domSelection","caretRangeFromPoint","clientX","clientY","rangeParent","collapse","rangeOffset","getRangeAt"],"sources":["ImagesPlugin.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\nimport { useEffect } from \"react\";\nimport { mergeRegister } from \"@lexical/utils\";\nimport {\n    $createRangeSelection,\n    $getSelection,\n    $isNodeSelection,\n    $setSelection,\n    COMMAND_PRIORITY_EDITOR,\n    COMMAND_PRIORITY_HIGH,\n    COMMAND_PRIORITY_LOW,\n    DRAGOVER_COMMAND,\n    DRAGSTART_COMMAND,\n    DROP_COMMAND,\n    LexicalEditor\n} from \"lexical\";\nimport { $isImageNode, ImageNode } from \"@webiny/lexical-nodes\";\nimport { ImagePayload, INSERT_IMAGE_COMMAND } from \"~/commands\";\nimport { CAN_USE_DOM } from \"~/utils/canUseDOM\";\nimport { insertImage } from \"~/utils/insertImage\";\nimport { useRichTextEditor } from \"~/hooks\";\n\nexport type InsertImagePayload = Readonly<ImagePayload>;\n\nconst getDOMSelection = (targetWindow: Window | null): Selection | null =>\n    CAN_USE_DOM ? (targetWindow || window).getSelection() : null;\n\nexport function ImagesPlugin({\n    captionsEnabled\n}: {\n    captionsEnabled?: boolean;\n}): JSX.Element | null {\n    const { editor } = useRichTextEditor();\n\n    useEffect(() => {\n        if (!editor.hasNodes([ImageNode])) {\n            throw new Error(\"ImagesPlugin: ImageNode not registered in the editor!\");\n        }\n\n        return mergeRegister(\n            editor.registerCommand<InsertImagePayload>(\n                INSERT_IMAGE_COMMAND,\n                payload => insertImage(payload),\n                COMMAND_PRIORITY_EDITOR\n            ),\n            editor.registerCommand<DragEvent>(\n                DRAGSTART_COMMAND,\n                event => {\n                    return onDragStart(event);\n                },\n                COMMAND_PRIORITY_HIGH\n            ),\n            editor.registerCommand<DragEvent>(\n                DRAGOVER_COMMAND,\n                event => {\n                    return onDragover(event);\n                },\n                COMMAND_PRIORITY_LOW\n            ),\n            editor.registerCommand<DragEvent>(\n                DROP_COMMAND,\n                event => {\n                    return onDrop(event, editor);\n                },\n                COMMAND_PRIORITY_HIGH\n            )\n        );\n    }, [captionsEnabled, editor]);\n\n    return null;\n}\n\nconst TRANSPARENT_IMAGE =\n    \"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\";\nconst img = document.createElement(\"img\");\nimg.src = TRANSPARENT_IMAGE;\n\nfunction onDragStart(event: DragEvent): boolean {\n    const node = getImageNodeInSelection();\n    if (!node) {\n        return false;\n    }\n    const dataTransfer = event.dataTransfer;\n    if (!dataTransfer) {\n        return false;\n    }\n    dataTransfer.setData(\"text/plain\", \"_\");\n    dataTransfer.setDragImage(img, 0, 0);\n    dataTransfer.setData(\n        \"application/x-lexical-drag\",\n        JSON.stringify({\n            data: {\n                id: node.__id,\n                altText: node.__altText,\n                caption: node.__caption,\n                height: node.__height,\n                key: node.getKey(),\n                maxWidth: node.__maxWidth,\n                showCaption: node.__showCaption,\n                src: node.__src,\n                width: node.__width\n            },\n            type: \"image\"\n        })\n    );\n\n    return true;\n}\n\nfunction onDragover(event: DragEvent): boolean {\n    const node = getImageNodeInSelection();\n    if (!node) {\n        return false;\n    }\n    if (!canDropImage(event)) {\n        event.preventDefault();\n    }\n    return true;\n}\n\nfunction onDrop(event: DragEvent, editor: LexicalEditor): boolean {\n    const node = getImageNodeInSelection();\n    if (!node) {\n        return false;\n    }\n    const data = getDragImageData(event);\n    if (!data) {\n        return false;\n    }\n    event.preventDefault();\n    if (canDropImage(event)) {\n        const range = getDragSelection(event);\n        node.remove();\n        const rangeSelection = $createRangeSelection();\n        if (range !== null && range !== undefined) {\n            rangeSelection.applyDOMRange(range);\n        }\n        $setSelection(rangeSelection);\n        editor.dispatchCommand(INSERT_IMAGE_COMMAND, data);\n    }\n    return true;\n}\n\nfunction getImageNodeInSelection(): ImageNode | null {\n    const selection = $getSelection();\n    if (!$isNodeSelection(selection)) {\n        return null;\n    }\n    const nodes = selection.getNodes();\n    const node = nodes[0];\n    return $isImageNode(node) ? node : null;\n}\n\nfunction getDragImageData(event: DragEvent): null | InsertImagePayload {\n    const dragData = event.dataTransfer?.getData(\"application/x-lexical-drag\");\n    if (!dragData) {\n        return null;\n    }\n    const { type, data } = JSON.parse(dragData);\n    if (type !== \"image\") {\n        return null;\n    }\n\n    return data;\n}\n\ndeclare global {\n    interface DragEvent {\n        rangeOffset?: number;\n        rangeParent?: Node;\n    }\n}\n\nfunction canDropImage(event: DragEvent): boolean {\n    const target = event.target;\n    return !!(\n        target &&\n        target instanceof HTMLElement &&\n        !target.closest(\"code, span.editor-image\") &&\n        target.parentElement &&\n        target.parentElement.closest(\"div.ContentEditable__root\")\n    );\n}\n\nfunction getDragSelection(event: DragEvent): Range | null | undefined {\n    let range;\n    const target = event.target as null | Element | Document;\n    const targetWindow =\n        target == null\n            ? null\n            : target.nodeType === 9\n            ? (target as Document).defaultView\n            : (target as Element).ownerDocument.defaultView;\n    const domSelection = getDOMSelection(targetWindow);\n    if (document.caretRangeFromPoint) {\n        range = document.caretRangeFromPoint(event.clientX, event.clientY);\n    } else if (event.rangeParent && domSelection !== null) {\n        domSelection.collapse(event.rangeParent, event.rangeOffset || 0);\n        range = domSelection.getRangeAt(0);\n    } else {\n        throw Error(`Cannot get the selection when dragging`);\n    }\n\n    return range;\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useEffect","$createRangeSelection","$getSelection","$isNodeSelection","$setSelection","mergeRegister","COMMAND_PRIORITY_EDITOR","COMMAND_PRIORITY_HIGH","COMMAND_PRIORITY_LOW","DRAGOVER_COMMAND","DRAGSTART_COMMAND","DROP_COMMAND","$isImageNode","ImageNode","INSERT_IMAGE_COMMAND","CAN_USE_DOM","insertImage","useRichTextEditor","getDOMSelection","targetWindow","window","getSelection","ImagesPlugin","captionsEnabled","editor","hasNodes","Error","registerCommand","payload","event","onDragStart","onDragover","onDrop","getDragImage","document","undefined","TRANSPARENT_IMAGE","img","createElement","src","node","getImageNodeInSelection","dataTransfer","dragImage","setData","setDragImage","JSON","stringify","data","id","__id","altText","__altText","height","__height","key","getKey","maxWidth","__maxWidth","__src","width","__width","type","canDropImage","preventDefault","getDragImageData","range","getDragSelection","remove","rangeSelection","applyDOMRange","dispatchCommand","selection","nodes","getNodes","dragData","getData","parse","target","HTMLElement","closest","parentElement","nodeType","defaultView","ownerDocument","domSelection","caretRangeFromPoint","clientX","clientY","rangeParent","collapse","rangeOffset","getRangeAt"],"sources":["ImagesPlugin.tsx"],"sourcesContent":["\"use client\";\n/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\nimport { useEffect } from \"react\";\nimport type { LexicalEditor } from \"lexical\";\nimport {\n    $createRangeSelection,\n    $getSelection,\n    $isNodeSelection,\n    $setSelection,\n    mergeRegister,\n    COMMAND_PRIORITY_EDITOR,\n    COMMAND_PRIORITY_HIGH,\n    COMMAND_PRIORITY_LOW,\n    DRAGOVER_COMMAND,\n    DRAGSTART_COMMAND,\n    DROP_COMMAND\n} from \"lexical\";\nimport { $isImageNode, ImageNode } from \"@webiny/lexical-nodes\";\nimport type { ImagePayload } from \"~/commands/index.js\";\nimport { INSERT_IMAGE_COMMAND } from \"~/commands/index.js\";\nimport { CAN_USE_DOM } from \"~/utils/canUseDOM.js\";\nimport { insertImage } from \"~/utils/insertImage.js\";\nimport { useRichTextEditor } from \"~/hooks/index.js\";\n\nexport type InsertImagePayload = Readonly<ImagePayload>;\n\nconst getDOMSelection = (targetWindow: Window | null): Selection | null =>\n    CAN_USE_DOM ? (targetWindow || window).getSelection() : null;\n\nexport function ImagesPlugin({\n    captionsEnabled\n}: {\n    captionsEnabled?: boolean;\n}): JSX.Element | null {\n    const { editor } = useRichTextEditor();\n\n    useEffect(() => {\n        if (!editor.hasNodes([ImageNode])) {\n            throw new Error(\"ImagesPlugin: ImageNode not registered in the editor!\");\n        }\n\n        return mergeRegister(\n            editor.registerCommand<InsertImagePayload>(\n                INSERT_IMAGE_COMMAND,\n                payload => insertImage(payload),\n                COMMAND_PRIORITY_EDITOR\n            ),\n            editor.registerCommand<DragEvent>(\n                DRAGSTART_COMMAND,\n                event => {\n                    return onDragStart(event);\n                },\n                COMMAND_PRIORITY_HIGH\n            ),\n            editor.registerCommand<DragEvent>(\n                DRAGOVER_COMMAND,\n                event => {\n                    return onDragover(event);\n                },\n                COMMAND_PRIORITY_LOW\n            ),\n            editor.registerCommand<DragEvent>(\n                DROP_COMMAND,\n                event => {\n                    return onDrop(event, editor);\n                },\n                COMMAND_PRIORITY_HIGH\n            )\n        );\n    }, [captionsEnabled, editor]);\n\n    return null;\n}\n\nfunction getDragImage() {\n    if (!document) {\n        return undefined;\n    }\n\n    const TRANSPARENT_IMAGE =\n        \"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\";\n    const img = document.createElement(\"img\");\n    img.src = TRANSPARENT_IMAGE;\n    return img;\n}\n\nfunction onDragStart(event: DragEvent): boolean {\n    const node = getImageNodeInSelection();\n    if (!node) {\n        return false;\n    }\n    const dataTransfer = event.dataTransfer;\n    const dragImage = getDragImage();\n    if (!dataTransfer || !dragImage) {\n        return false;\n    }\n    dataTransfer.setData(\"text/plain\", \"_\");\n    dataTransfer.setDragImage(dragImage, 0, 0);\n    dataTransfer.setData(\n        \"application/x-lexical-drag\",\n        JSON.stringify({\n            data: {\n                id: node.__id,\n                altText: node.__altText,\n                height: node.__height,\n                key: node.getKey(),\n                maxWidth: node.__maxWidth,\n                src: node.__src,\n                width: node.__width\n            },\n            type: \"image\"\n        })\n    );\n\n    return true;\n}\n\nfunction onDragover(event: DragEvent): boolean {\n    const node = getImageNodeInSelection();\n    if (!node) {\n        return false;\n    }\n    if (!canDropImage(event)) {\n        event.preventDefault();\n    }\n    return true;\n}\n\nfunction onDrop(event: DragEvent, editor: LexicalEditor): boolean {\n    const node = getImageNodeInSelection();\n    if (!node) {\n        return false;\n    }\n    const data = getDragImageData(event);\n    if (!data) {\n        return false;\n    }\n    event.preventDefault();\n    if (canDropImage(event)) {\n        const range = getDragSelection(event);\n        node.remove();\n        const rangeSelection = $createRangeSelection();\n        if (range !== null && range !== undefined) {\n            rangeSelection.applyDOMRange(range);\n        }\n        $setSelection(rangeSelection);\n        editor.dispatchCommand(INSERT_IMAGE_COMMAND, data);\n    }\n    return true;\n}\n\nfunction getImageNodeInSelection(): ImageNode | null {\n    const selection = $getSelection();\n    if (!$isNodeSelection(selection)) {\n        return null;\n    }\n    const nodes = selection.getNodes();\n    const node = nodes[0];\n    return $isImageNode(node) ? node : null;\n}\n\nfunction getDragImageData(event: DragEvent): null | InsertImagePayload {\n    const dragData = event.dataTransfer?.getData(\"application/x-lexical-drag\");\n    if (!dragData) {\n        return null;\n    }\n    const { type, data } = JSON.parse(dragData);\n    if (type !== \"image\") {\n        return null;\n    }\n\n    return data;\n}\n\ndeclare global {\n    interface DragEvent {\n        rangeOffset?: number;\n        rangeParent?: Node;\n    }\n}\n\nfunction canDropImage(event: DragEvent): boolean {\n    const target = event.target;\n    return !!(\n        target &&\n        target instanceof HTMLElement &&\n        !target.closest(\"code, span.editor-image\") &&\n        target.parentElement &&\n        target.parentElement.closest(\"div.ContentEditable__root\")\n    );\n}\n\nfunction getDragSelection(event: DragEvent): Range | null | undefined {\n    let range;\n    const target = event.target as null | Element | Document;\n    const targetWindow =\n        target == null\n            ? null\n            : target.nodeType === 9\n              ? (target as Document).defaultView\n              : (target as Element).ownerDocument.defaultView;\n    const domSelection = getDOMSelection(targetWindow);\n    if (document.caretRangeFromPoint) {\n        range = document.caretRangeFromPoint(event.clientX, event.clientY);\n    } else if (event.rangeParent && domSelection !== null) {\n        domSelection.collapse(event.rangeParent, event.rangeOffset || 0);\n        range = domSelection.getRangeAt(0);\n    } else {\n        throw Error(`Cannot get the selection when dragging`);\n    }\n\n    return range;\n}\n"],"mappings":"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","ignoreList":[]}

package/plugins/LinkPlugin/LinkPlugin.d.ts

@@ -1,4 +1,4 @@
-declare type Props = {
+type Props = {
     validateUrl?: (url: string) => boolean;
 };
 export declare function LinkPlugin({ validateUrl }: Props): null;

package/plugins/LinkPlugin/LinkPlugin.js

@@ -1,64 +1,56 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.LinkPlugin = LinkPlugin;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = require("react");
-var _utils = require("@lexical/utils");
-var _lexical = require("lexical");
-var _lexicalNodes = require("@webiny/lexical-nodes");
-var _hooks = require("../../hooks");
-var _excluded = ["url"];
-function LinkPlugin(_ref) {
-  var validateUrl = _ref.validateUrl;
-  var _useRichTextEditor = (0, _hooks.useRichTextEditor)(),
-    editor = _useRichTextEditor.editor;
-  (0, _react.useEffect)(function () {
-    if (!editor.hasNodes([_lexicalNodes.LinkNode])) {
+import { useEffect } from "react";
+import { $getSelection, $isElementNode, $isRangeSelection, mergeRegister, COMMAND_PRIORITY_LOW, PASTE_COMMAND } from "lexical";
+import { LinkNode, TOGGLE_LINK_COMMAND, toggleLink } from "@webiny/lexical-nodes";
+import { useRichTextEditor } from "../../hooks/index.js";
+export function LinkPlugin({
+  validateUrl
+}) {
+  const {
+    editor
+  } = useRichTextEditor();
+  useEffect(() => {
+    if (!editor.hasNodes([LinkNode])) {
       throw new Error("LinkPlugin: LinkNode not registered in the editor!");
     }
-    var commands = [editor.registerCommand(_lexicalNodes.TOGGLE_LINK_COMMAND, function (payload) {
+    const commands = [editor.registerCommand(TOGGLE_LINK_COMMAND, payload => {
       if (payload === null) {
-        (0, _lexicalNodes.toggleLink)(payload);
+        toggleLink(payload);
         return true;
       } else if (typeof payload === "string") {
         if (validateUrl === undefined || validateUrl(payload)) {
-          (0, _lexicalNodes.toggleLink)(payload);
+          toggleLink(payload);
           return true;
         }
         return false;
       } else {
-        var _url = payload.url,
-          attrs = (0, _objectWithoutProperties2.default)(payload, _excluded);
-        (0, _lexicalNodes.toggleLink)(_url, attrs);
+        const {
+          url,
+          ...attrs
+        } = payload;
+        toggleLink(url, attrs);
         return true;
       }
-    }, _lexical.COMMAND_PRIORITY_LOW)];
+    }, COMMAND_PRIORITY_LOW)];
     if (validateUrl !== undefined) {
-      commands.push(editor.registerCommand(_lexical.PASTE_COMMAND, function (event) {
-        var selection = (0, _lexical.$getSelection)();
-        if (!(0, _lexical.$isRangeSelection)(selection) || selection.isCollapsed() || !(event instanceof ClipboardEvent) || event.clipboardData == null) {
+      commands.push(editor.registerCommand(PASTE_COMMAND, event => {
+        const selection = $getSelection();
+        if (!$isRangeSelection(selection) || selection.isCollapsed() || !(event instanceof ClipboardEvent) || event.clipboardData == null) {
           return false;
         }
-        var clipboardText = event.clipboardData.getData("text");
+        const clipboardText = event.clipboardData.getData("text");
         if (!validateUrl(clipboardText)) {
           return false;
         }
         // If we select nodes that are elements then avoid applying the link.
-        if (!selection.getNodes().some(function (node) {
-          return (0, _lexical.$isElementNode)(node);
-        })) {
-          editor.dispatchCommand(_lexicalNodes.TOGGLE_LINK_COMMAND, clipboardText);
+        if (!selection.getNodes().some(node => $isElementNode(node))) {
+          editor.dispatchCommand(TOGGLE_LINK_COMMAND, clipboardText);
           event.preventDefault();
           return true;
         }
         return false;
-      }, _lexical.COMMAND_PRIORITY_LOW));
+      }, COMMAND_PRIORITY_LOW));
     }
-    return _utils.mergeRegister.apply(void 0, commands);
+    return mergeRegister(...commands);
   }, [editor, validateUrl]);
   return null;
 }

package/plugins/LinkPlugin/LinkPlugin.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","_utils","_lexical","_lexicalNodes","_hooks","_excluded","LinkPlugin","_ref","validateUrl","_useRichTextEditor","useRichTextEditor","editor","useEffect","hasNodes","LinkNode","Error","commands","registerCommand","TOGGLE_LINK_COMMAND","payload","toggleLink","undefined","url","attrs","_objectWithoutProperties2","default","COMMAND_PRIORITY_LOW","push","PASTE_COMMAND","event","selection","$getSelection","$isRangeSelection","isCollapsed","ClipboardEvent","clipboardData","clipboardText","getData","getNodes","some","node","$isElementNode","dispatchCommand","preventDefault","mergeRegister","apply"],"sources":["LinkPlugin.ts"],"sourcesContent":["import { useEffect } from \"react\";\nimport { mergeRegister } from \"@lexical/utils\";\nimport {\n    $getSelection,\n    $isElementNode,\n    $isRangeSelection,\n    COMMAND_PRIORITY_LOW,\n    PASTE_COMMAND\n} from \"lexical\";\nimport { LinkNode, TOGGLE_LINK_COMMAND, toggleLink } from \"@webiny/lexical-nodes\";\nimport { useRichTextEditor } from \"~/hooks\";\n\ntype Props = {\n    validateUrl?: (url: string) => boolean;\n};\n\nexport function LinkPlugin({ validateUrl }: Props): null {\n    const { editor } = useRichTextEditor();\n\n    useEffect(() => {\n        if (!editor.hasNodes([LinkNode])) {\n            throw new Error(\"LinkPlugin: LinkNode not registered in the editor!\");\n        }\n\n        const commands = [\n            editor.registerCommand(\n                TOGGLE_LINK_COMMAND,\n                payload => {\n                    if (payload === null) {\n                        toggleLink(payload);\n                        return true;\n                    } else if (typeof payload === \"string\") {\n                        if (validateUrl === undefined || validateUrl(payload)) {\n                            toggleLink(payload);\n                            return true;\n                        }\n                        return false;\n                    } else {\n                        const { url, ...attrs } = payload;\n                        toggleLink(url, attrs);\n                        return true;\n                    }\n                },\n                COMMAND_PRIORITY_LOW\n            )\n        ];\n\n        if (validateUrl !== undefined) {\n            commands.push(\n                editor.registerCommand(\n                    PASTE_COMMAND,\n                    event => {\n                        const selection = $getSelection();\n                        if (\n                            !$isRangeSelection(selection) ||\n                            selection.isCollapsed() ||\n                            !(event instanceof ClipboardEvent) ||\n                            event.clipboardData == null\n                        ) {\n                            return false;\n                        }\n                        const clipboardText = event.clipboardData.getData(\"text\");\n                        if (!validateUrl(clipboardText)) {\n                            return false;\n                        }\n                        // If we select nodes that are elements then avoid applying the link.\n                        if (!selection.getNodes().some(node => $isElementNode(node))) {\n                            editor.dispatchCommand(TOGGLE_LINK_COMMAND, clipboardText);\n                            event.preventDefault();\n                            return true;\n                        }\n                        return false;\n                    },\n                    COMMAND_PRIORITY_LOW\n                )\n            );\n        }\n\n        return mergeRegister(...commands);\n    }, [editor, validateUrl]);\n\n    return null;\n}\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AAOA,IAAAG,aAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AAA4C,IAAAK,SAAA;AAMrC,SAASC,UAAUA,CAAAC,IAAA,EAA+B;EAAA,IAA5BC,WAAW,GAAAD,IAAA,CAAXC,WAAW;EACpC,IAAAC,kBAAA,GAAmB,IAAAC,wBAAiB,EAAC,CAAC;IAA9BC,MAAM,GAAAF,kBAAA,CAANE,MAAM;EAEd,IAAAC,gBAAS,EAAC,YAAM;IACZ,IAAI,CAACD,MAAM,CAACE,QAAQ,CAAC,CAACC,sBAAQ,CAAC,CAAC,EAAE;MAC9B,MAAM,IAAIC,KAAK,CAAC,oDAAoD,CAAC;IACzE;IAEA,IAAMC,QAAQ,GAAG,CACbL,MAAM,CAACM,eAAe,CAClBC,iCAAmB,EACnB,UAAAC,OAAO,EAAI;MACP,IAAIA,OAAO,KAAK,IAAI,EAAE;QAClB,IAAAC,wBAAU,EAACD,OAAO,CAAC;QACnB,OAAO,IAAI;MACf,CAAC,MAAM,IAAI,OAAOA,OAAO,KAAK,QAAQ,EAAE;QACpC,IAAIX,WAAW,KAAKa,SAAS,IAAIb,WAAW,CAACW,OAAO,CAAC,EAAE;UACnD,IAAAC,wBAAU,EAACD,OAAO,CAAC;UACnB,OAAO,IAAI;QACf;QACA,OAAO,KAAK;MAChB,CAAC,MAAM;QACH,IAAQG,IAAG,GAAeH,OAAO,CAAzBG,GAAG;UAAKC,KAAK,OAAAC,yBAAA,CAAAC,OAAA,EAAKN,OAAO,EAAAd,SAAA;QACjC,IAAAe,wBAAU,EAACE,IAAG,EAAEC,KAAK,CAAC;QACtB,OAAO,IAAI;MACf;IACJ,CAAC,EACDG,6BACJ,CAAC,CACJ;IAED,IAAIlB,WAAW,KAAKa,SAAS,EAAE;MAC3BL,QAAQ,CAACW,IAAI,CACThB,MAAM,CAACM,eAAe,CAClBW,sBAAa,EACb,UAAAC,KAAK,EAAI;QACL,IAAMC,SAAS,GAAG,IAAAC,sBAAa,EAAC,CAAC;QACjC,IACI,CAAC,IAAAC,0BAAiB,EAACF,SAAS,CAAC,IAC7BA,SAAS,CAACG,WAAW,CAAC,CAAC,IACvB,EAAEJ,KAAK,YAAYK,cAAc,CAAC,IAClCL,KAAK,CAACM,aAAa,IAAI,IAAI,EAC7B;UACE,OAAO,KAAK;QAChB;QACA,IAAMC,aAAa,GAAGP,KAAK,CAACM,aAAa,CAACE,OAAO,CAAC,MAAM,CAAC;QACzD,IAAI,CAAC7B,WAAW,CAAC4B,aAAa,CAAC,EAAE;UAC7B,OAAO,KAAK;QAChB;QACA;QACA,IAAI,CAACN,SAAS,CAACQ,QAAQ,CAAC,CAAC,CAACC,IAAI,CAAC,UAAAC,IAAI;UAAA,OAAI,IAAAC,uBAAc,EAACD,IAAI,CAAC;QAAA,EAAC,EAAE;UAC1D7B,MAAM,CAAC+B,eAAe,CAACxB,iCAAmB,EAAEkB,aAAa,CAAC;UAC1DP,KAAK,CAACc,cAAc,CAAC,CAAC;UACtB,OAAO,IAAI;QACf;QACA,OAAO,KAAK;MAChB,CAAC,EACDjB,6BACJ,CACJ,CAAC;IACL;IAEA,OAAOkB,oBAAa,CAAAC,KAAA,SAAI7B,QAAQ,CAAC;EACrC,CAAC,EAAE,CAACL,MAAM,EAAEH,WAAW,CAAC,CAAC;EAEzB,OAAO,IAAI;AACf","ignoreList":[]}
+{"version":3,"names":["useEffect","$getSelection","$isElementNode","$isRangeSelection","mergeRegister","COMMAND_PRIORITY_LOW","PASTE_COMMAND","LinkNode","TOGGLE_LINK_COMMAND","toggleLink","useRichTextEditor","LinkPlugin","validateUrl","editor","hasNodes","Error","commands","registerCommand","payload","undefined","url","attrs","push","event","selection","isCollapsed","ClipboardEvent","clipboardData","clipboardText","getData","getNodes","some","node","dispatchCommand","preventDefault"],"sources":["LinkPlugin.ts"],"sourcesContent":["import { useEffect } from \"react\";\nimport {\n    $getSelection,\n    $isElementNode,\n    $isRangeSelection,\n    mergeRegister,\n    COMMAND_PRIORITY_LOW,\n    PASTE_COMMAND\n} from \"lexical\";\nimport { LinkNode, TOGGLE_LINK_COMMAND, toggleLink } from \"@webiny/lexical-nodes\";\nimport { useRichTextEditor } from \"~/hooks/index.js\";\n\ntype Props = {\n    validateUrl?: (url: string) => boolean;\n};\n\nexport function LinkPlugin({ validateUrl }: Props): null {\n    const { editor } = useRichTextEditor();\n\n    useEffect(() => {\n        if (!editor.hasNodes([LinkNode])) {\n            throw new Error(\"LinkPlugin: LinkNode not registered in the editor!\");\n        }\n\n        const commands = [\n            editor.registerCommand(\n                TOGGLE_LINK_COMMAND,\n                payload => {\n                    if (payload === null) {\n                        toggleLink(payload);\n                        return true;\n                    } else if (typeof payload === \"string\") {\n                        if (validateUrl === undefined || validateUrl(payload)) {\n                            toggleLink(payload);\n                            return true;\n                        }\n                        return false;\n                    } else {\n                        const { url, ...attrs } = payload;\n                        toggleLink(url, attrs);\n                        return true;\n                    }\n                },\n                COMMAND_PRIORITY_LOW\n            )\n        ];\n\n        if (validateUrl !== undefined) {\n            commands.push(\n                editor.registerCommand(\n                    PASTE_COMMAND,\n                    event => {\n                        const selection = $getSelection();\n                        if (\n                            !$isRangeSelection(selection) ||\n                            selection.isCollapsed() ||\n                            !(event instanceof ClipboardEvent) ||\n                            event.clipboardData == null\n                        ) {\n                            return false;\n                        }\n                        const clipboardText = event.clipboardData.getData(\"text\");\n                        if (!validateUrl(clipboardText)) {\n                            return false;\n                        }\n                        // If we select nodes that are elements then avoid applying the link.\n                        if (!selection.getNodes().some(node => $isElementNode(node))) {\n                            editor.dispatchCommand(TOGGLE_LINK_COMMAND, clipboardText);\n                            event.preventDefault();\n                            return true;\n                        }\n                        return false;\n                    },\n                    COMMAND_PRIORITY_LOW\n                )\n            );\n        }\n\n        return mergeRegister(...commands);\n    }, [editor, validateUrl]);\n\n    return null;\n}\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,OAAO;AACjC,SACIC,aAAa,EACbC,cAAc,EACdC,iBAAiB,EACjBC,aAAa,EACbC,oBAAoB,EACpBC,aAAa,QACV,SAAS;AAChB,SAASC,QAAQ,EAAEC,mBAAmB,EAAEC,UAAU,QAAQ,uBAAuB;AACjF,SAASC,iBAAiB;AAM1B,OAAO,SAASC,UAAUA,CAAC;EAAEC;AAAmB,CAAC,EAAQ;EACrD,MAAM;IAAEC;EAAO,CAAC,GAAGH,iBAAiB,CAAC,CAAC;EAEtCV,SAAS,CAAC,MAAM;IACZ,IAAI,CAACa,MAAM,CAACC,QAAQ,CAAC,CAACP,QAAQ,CAAC,CAAC,EAAE;MAC9B,MAAM,IAAIQ,KAAK,CAAC,oDAAoD,CAAC;IACzE;IAEA,MAAMC,QAAQ,GAAG,CACbH,MAAM,CAACI,eAAe,CAClBT,mBAAmB,EACnBU,OAAO,IAAI;MACP,IAAIA,OAAO,KAAK,IAAI,EAAE;QAClBT,UAAU,CAACS,OAAO,CAAC;QACnB,OAAO,IAAI;MACf,CAAC,MAAM,IAAI,OAAOA,OAAO,KAAK,QAAQ,EAAE;QACpC,IAAIN,WAAW,KAAKO,SAAS,IAAIP,WAAW,CAACM,OAAO,CAAC,EAAE;UACnDT,UAAU,CAACS,OAAO,CAAC;UACnB,OAAO,IAAI;QACf;QACA,OAAO,KAAK;MAChB,CAAC,MAAM;QACH,MAAM;UAAEE,GAAG;UAAE,GAAGC;QAAM,CAAC,GAAGH,OAAO;QACjCT,UAAU,CAACW,GAAG,EAAEC,KAAK,CAAC;QACtB,OAAO,IAAI;MACf;IACJ,CAAC,EACDhB,oBACJ,CAAC,CACJ;IAED,IAAIO,WAAW,KAAKO,SAAS,EAAE;MAC3BH,QAAQ,CAACM,IAAI,CACTT,MAAM,CAACI,eAAe,CAClBX,aAAa,EACbiB,KAAK,IAAI;QACL,MAAMC,SAAS,GAAGvB,aAAa,CAAC,CAAC;QACjC,IACI,CAACE,iBAAiB,CAACqB,SAAS,CAAC,IAC7BA,SAAS,CAACC,WAAW,CAAC,CAAC,IACvB,EAAEF,KAAK,YAAYG,cAAc,CAAC,IAClCH,KAAK,CAACI,aAAa,IAAI,IAAI,EAC7B;UACE,OAAO,KAAK;QAChB;QACA,MAAMC,aAAa,GAAGL,KAAK,CAACI,aAAa,CAACE,OAAO,CAAC,MAAM,CAAC;QACzD,IAAI,CAACjB,WAAW,CAACgB,aAAa,CAAC,EAAE;UAC7B,OAAO,KAAK;QAChB;QACA;QACA,IAAI,CAACJ,SAAS,CAACM,QAAQ,CAAC,CAAC,CAACC,IAAI,CAACC,IAAI,IAAI9B,cAAc,CAAC8B,IAAI,CAAC,CAAC,EAAE;UAC1DnB,MAAM,CAACoB,eAAe,CAACzB,mBAAmB,EAAEoB,aAAa,CAAC;UAC1DL,KAAK,CAACW,cAAc,CAAC,CAAC;UACtB,OAAO,IAAI;QACf;QACA,OAAO,KAAK;MAChB,CAAC,EACD7B,oBACJ,CACJ,CAAC;IACL;IAEA,OAAOD,aAAa,CAAC,GAAGY,QAAQ,CAAC;EACrC,CAAC,EAAE,CAACH,MAAM,EAAED,WAAW,CAAC,CAAC;EAEzB,OAAO,IAAI;AACf","ignoreList":[]}

package/plugins/ListPLugin/ListPlugin.js

@@ -1,21 +1,58 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ListPlugin = ListPlugin;
-var _react = require("react");
-var _lexicalNodes = require("@webiny/lexical-nodes");
-var _hooks = require("../../hooks");
-function ListPlugin() {
-  var _useRichTextEditor = (0, _hooks.useRichTextEditor)(),
-    editor = _useRichTextEditor.editor;
-  (0, _react.useEffect)(function () {
-    if (!editor.hasNodes([_lexicalNodes.ListNode, _lexicalNodes.ListItemNode])) {
+import { useEffect } from "react";
+import { $getSelection, $isRangeSelection, mergeRegister, COMMAND_PRIORITY_LOW, INDENT_CONTENT_COMMAND, INSERT_PARAGRAPH_COMMAND, KEY_BACKSPACE_COMMAND, OUTDENT_CONTENT_COMMAND } from "lexical";
+import { $handleListInsertParagraph, indentList, insertList, outdentList, removeList, $isListNode, ListNode, ListItemNode } from "@webiny/lexical-nodes";
+import { INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND, REMOVE_LIST_COMMAND } from "../../commands/index.js";
+import { useRichTextEditor } from "../../hooks/index.js";
+import { getNodeFromSelection } from "../../hooks/useCurrentElement.js";
+export function ListPlugin() {
+  const {
+    editor
+  } = useRichTextEditor();
+  useEffect(() => {
+    if (!editor.hasNodes([ListNode, ListItemNode])) {
       throw new Error("ListPlugin: ListNode and/or ListItemNode not registered in the editor!");
     }
   }, [editor]);
-  (0, _hooks.useList)(editor);
+  useEffect(() => {
+    return mergeRegister(editor.registerCommand(INDENT_CONTENT_COMMAND, () => {
+      indentList();
+      return false;
+    }, COMMAND_PRIORITY_LOW), editor.registerCommand(OUTDENT_CONTENT_COMMAND, () => {
+      outdentList();
+      return false;
+    }, COMMAND_PRIORITY_LOW), editor.registerCommand(INSERT_ORDERED_LIST_COMMAND, ({
+      themeStyleId
+    }) => {
+      insertList(editor, "number", themeStyleId);
+      return true;
+    }, COMMAND_PRIORITY_LOW), editor.registerCommand(INSERT_UNORDERED_LIST_COMMAND, ({
+      themeStyleId
+    }) => {
+      insertList(editor, "bullet", themeStyleId);
+      return true;
+    }, COMMAND_PRIORITY_LOW), editor.registerCommand(KEY_BACKSPACE_COMMAND, event => {
+      const selection = $getSelection();
+      if ($isRangeSelection(selection)) {
+        const node = getNodeFromSelection(selection);
+        if (!$isListNode(node)) {
+          return false;
+        }
+
+        // Check if list have one list item remain, without text.
+        if (node.getChildren().length === 1 && !node.getTextContent()) {
+          event.preventDefault();
+          removeList(editor);
+          return true;
+        }
+      }
+      return false;
+    }, COMMAND_PRIORITY_LOW), editor.registerCommand(REMOVE_LIST_COMMAND, () => {
+      removeList(editor);
+      return true;
+    }, COMMAND_PRIORITY_LOW), editor.registerCommand(INSERT_PARAGRAPH_COMMAND, () => {
+      return $handleListInsertParagraph();
+    }, COMMAND_PRIORITY_LOW));
+  }, [editor]);
   return null;
 }
 

package/plugins/ListPLugin/ListPlugin.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","_lexicalNodes","_hooks","ListPlugin","_useRichTextEditor","useRichTextEditor","editor","useEffect","hasNodes","ListNode","ListItemNode","Error","useList"],"sources":["ListPlugin.ts"],"sourcesContent":["import { useEffect } from \"react\";\nimport { ListNode, ListItemNode } from \"@webiny/lexical-nodes\";\nimport { useList, useRichTextEditor } from \"~/hooks\";\n\nexport function ListPlugin(): null {\n    const { editor } = useRichTextEditor();\n\n    useEffect(() => {\n        if (!editor.hasNodes([ListNode, ListItemNode])) {\n            throw new Error(\n                \"ListPlugin: ListNode and/or ListItemNode not registered in the editor!\"\n            );\n        }\n    }, [editor]);\n\n    useList(editor);\n\n    return null;\n}\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AAEO,SAASG,UAAUA,CAAA,EAAS;EAC/B,IAAAC,kBAAA,GAAmB,IAAAC,wBAAiB,EAAC,CAAC;IAA9BC,MAAM,GAAAF,kBAAA,CAANE,MAAM;EAEd,IAAAC,gBAAS,EAAC,YAAM;IACZ,IAAI,CAACD,MAAM,CAACE,QAAQ,CAAC,CAACC,sBAAQ,EAAEC,0BAAY,CAAC,CAAC,EAAE;MAC5C,MAAM,IAAIC,KAAK,CACX,wEACJ,CAAC;IACL;EACJ,CAAC,EAAE,CAACL,MAAM,CAAC,CAAC;EAEZ,IAAAM,cAAO,EAACN,MAAM,CAAC;EAEf,OAAO,IAAI;AACf","ignoreList":[]}
+{"version":3,"names":["useEffect","$getSelection","$isRangeSelection","mergeRegister","COMMAND_PRIORITY_LOW","INDENT_CONTENT_COMMAND","INSERT_PARAGRAPH_COMMAND","KEY_BACKSPACE_COMMAND","OUTDENT_CONTENT_COMMAND","$handleListInsertParagraph","indentList","insertList","outdentList","removeList","$isListNode","ListNode","ListItemNode","INSERT_ORDERED_LIST_COMMAND","INSERT_UNORDERED_LIST_COMMAND","REMOVE_LIST_COMMAND","useRichTextEditor","getNodeFromSelection","ListPlugin","editor","hasNodes","Error","registerCommand","themeStyleId","event","selection","node","getChildren","length","getTextContent","preventDefault"],"sources":["ListPlugin.ts"],"sourcesContent":["import { useEffect } from \"react\";\nimport {\n    $getSelection,\n    $isRangeSelection,\n    mergeRegister,\n    COMMAND_PRIORITY_LOW,\n    INDENT_CONTENT_COMMAND,\n    INSERT_PARAGRAPH_COMMAND,\n    KEY_BACKSPACE_COMMAND,\n    OUTDENT_CONTENT_COMMAND\n} from \"lexical\";\nimport {\n    $handleListInsertParagraph,\n    indentList,\n    insertList,\n    outdentList,\n    removeList,\n    $isListNode,\n    ListNode,\n    ListItemNode\n} from \"@webiny/lexical-nodes\";\nimport {\n    INSERT_ORDERED_LIST_COMMAND,\n    INSERT_UNORDERED_LIST_COMMAND,\n    REMOVE_LIST_COMMAND\n} from \"~/commands/index.js\";\nimport { useRichTextEditor } from \"~/hooks/index.js\";\nimport { getNodeFromSelection } from \"~/hooks/useCurrentElement.js\";\n\nexport function ListPlugin(): null {\n    const { editor } = useRichTextEditor();\n\n    useEffect(() => {\n        if (!editor.hasNodes([ListNode, ListItemNode])) {\n            throw new Error(\n                \"ListPlugin: ListNode and/or ListItemNode not registered in the editor!\"\n            );\n        }\n    }, [editor]);\n\n    useEffect(() => {\n        return mergeRegister(\n            editor.registerCommand(\n                INDENT_CONTENT_COMMAND,\n                () => {\n                    indentList();\n                    return false;\n                },\n                COMMAND_PRIORITY_LOW\n            ),\n            editor.registerCommand(\n                OUTDENT_CONTENT_COMMAND,\n                () => {\n                    outdentList();\n                    return false;\n                },\n                COMMAND_PRIORITY_LOW\n            ),\n            editor.registerCommand(\n                INSERT_ORDERED_LIST_COMMAND,\n                ({ themeStyleId }) => {\n                    insertList(editor, \"number\", themeStyleId);\n                    return true;\n                },\n                COMMAND_PRIORITY_LOW\n            ),\n            editor.registerCommand(\n                INSERT_UNORDERED_LIST_COMMAND,\n                ({ themeStyleId }) => {\n                    insertList(editor, \"bullet\", themeStyleId);\n                    return true;\n                },\n                COMMAND_PRIORITY_LOW\n            ),\n            editor.registerCommand(\n                KEY_BACKSPACE_COMMAND,\n                (event: KeyboardEvent) => {\n                    const selection = $getSelection();\n                    if ($isRangeSelection(selection)) {\n                        const node = getNodeFromSelection(selection);\n                        if (!$isListNode(node)) {\n                            return false;\n                        }\n\n                        // Check if list have one list item remain, without text.\n                        if (node.getChildren().length === 1 && !node.getTextContent()) {\n                            event.preventDefault();\n                            removeList(editor);\n                            return true;\n                        }\n                    }\n                    return false;\n                },\n                COMMAND_PRIORITY_LOW\n            ),\n            editor.registerCommand(\n                REMOVE_LIST_COMMAND,\n                () => {\n                    removeList(editor);\n                    return true;\n                },\n                COMMAND_PRIORITY_LOW\n            ),\n            editor.registerCommand(\n                INSERT_PARAGRAPH_COMMAND,\n                () => {\n                    return $handleListInsertParagraph();\n                },\n                COMMAND_PRIORITY_LOW\n            )\n        );\n    }, [editor]);\n\n    return null;\n}\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,OAAO;AACjC,SACIC,aAAa,EACbC,iBAAiB,EACjBC,aAAa,EACbC,oBAAoB,EACpBC,sBAAsB,EACtBC,wBAAwB,EACxBC,qBAAqB,EACrBC,uBAAuB,QACpB,SAAS;AAChB,SACIC,0BAA0B,EAC1BC,UAAU,EACVC,UAAU,EACVC,WAAW,EACXC,UAAU,EACVC,WAAW,EACXC,QAAQ,EACRC,YAAY,QACT,uBAAuB;AAC9B,SACIC,2BAA2B,EAC3BC,6BAA6B,EAC7BC,mBAAmB;AAEvB,SAASC,iBAAiB;AAC1B,SAASC,oBAAoB;AAE7B,OAAO,SAASC,UAAUA,CAAA,EAAS;EAC/B,MAAM;IAAEC;EAAO,CAAC,GAAGH,iBAAiB,CAAC,CAAC;EAEtCpB,SAAS,CAAC,MAAM;IACZ,IAAI,CAACuB,MAAM,CAACC,QAAQ,CAAC,CAACT,QAAQ,EAAEC,YAAY,CAAC,CAAC,EAAE;MAC5C,MAAM,IAAIS,KAAK,CACX,wEACJ,CAAC;IACL;EACJ,CAAC,EAAE,CAACF,MAAM,CAAC,CAAC;EAEZvB,SAAS,CAAC,MAAM;IACZ,OAAOG,aAAa,CAChBoB,MAAM,CAACG,eAAe,CAClBrB,sBAAsB,EACtB,MAAM;MACFK,UAAU,CAAC,CAAC;MACZ,OAAO,KAAK;IAChB,CAAC,EACDN,oBACJ,CAAC,EACDmB,MAAM,CAACG,eAAe,CAClBlB,uBAAuB,EACvB,MAAM;MACFI,WAAW,CAAC,CAAC;MACb,OAAO,KAAK;IAChB,CAAC,EACDR,oBACJ,CAAC,EACDmB,MAAM,CAACG,eAAe,CAClBT,2BAA2B,EAC3B,CAAC;MAAEU;IAAa,CAAC,KAAK;MAClBhB,UAAU,CAACY,MAAM,EAAE,QAAQ,EAAEI,YAAY,CAAC;MAC1C,OAAO,IAAI;IACf,CAAC,EACDvB,oBACJ,CAAC,EACDmB,MAAM,CAACG,eAAe,CAClBR,6BAA6B,EAC7B,CAAC;MAAES;IAAa,CAAC,KAAK;MAClBhB,UAAU,CAACY,MAAM,EAAE,QAAQ,EAAEI,YAAY,CAAC;MAC1C,OAAO,IAAI;IACf,CAAC,EACDvB,oBACJ,CAAC,EACDmB,MAAM,CAACG,eAAe,CAClBnB,qBAAqB,EACpBqB,KAAoB,IAAK;MACtB,MAAMC,SAAS,GAAG5B,aAAa,CAAC,CAAC;MACjC,IAAIC,iBAAiB,CAAC2B,SAAS,CAAC,EAAE;QAC9B,MAAMC,IAAI,GAAGT,oBAAoB,CAACQ,SAAS,CAAC;QAC5C,IAAI,CAACf,WAAW,CAACgB,IAAI,CAAC,EAAE;UACpB,OAAO,KAAK;QAChB;;QAEA;QACA,IAAIA,IAAI,CAACC,WAAW,CAAC,CAAC,CAACC,MAAM,KAAK,CAAC,IAAI,CAACF,IAAI,CAACG,cAAc,CAAC,CAAC,EAAE;UAC3DL,KAAK,CAACM,cAAc,CAAC,CAAC;UACtBrB,UAAU,CAACU,MAAM,CAAC;UAClB,OAAO,IAAI;QACf;MACJ;MACA,OAAO,KAAK;IAChB,CAAC,EACDnB,oBACJ,CAAC,EACDmB,MAAM,CAACG,eAAe,CAClBP,mBAAmB,EACnB,MAAM;MACFN,UAAU,CAACU,MAAM,CAAC;MAClB,OAAO,IAAI;IACf,CAAC,EACDnB,oBACJ,CAAC,EACDmB,MAAM,CAACG,eAAe,CAClBpB,wBAAwB,EACxB,MAAM;MACF,OAAOG,0BAA0B,CAAC,CAAC;IACvC,CAAC,EACDL,oBACJ,CACJ,CAAC;EACL,CAAC,EAAE,CAACmB,MAAM,CAAC,CAAC;EAEZ,OAAO,IAAI;AACf","ignoreList":[]}

package/plugins/QuoteNodePlugin/QuoteNodePlugin.js

@@ -1,22 +1,25 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.QuotePlugin = QuotePlugin;
-var _react = require("react");
-var _lexicalNodes = require("@webiny/lexical-nodes");
-var _useQuote = require("../../hooks/useQuote");
-var _hooks = require("../../hooks");
-function QuotePlugin() {
-  var _useRichTextEditor = (0, _hooks.useRichTextEditor)(),
-    editor = _useRichTextEditor.editor;
-  (0, _useQuote.useQuote)(editor);
-  (0, _react.useEffect)(function () {
-    if (!editor.hasNodes([_lexicalNodes.QuoteNode])) {
+import { useEffect } from "react";
+import { formatToQuote, QuoteNode } from "@webiny/lexical-nodes";
+import { COMMAND_PRIORITY_LOW, mergeRegister } from "lexical";
+import { useRichTextEditor } from "../../hooks/index.js";
+import { INSERT_QUOTE_COMMAND } from "../../commands/index.js";
+export function QuotePlugin() {
+  const {
+    editor
+  } = useRichTextEditor();
+  useEffect(() => {
+    if (!editor.hasNodes([QuoteNode])) {
       throw new Error("QuoteNodePlugin: QuoteNode is not registered in the editor!");
     }
   }, [editor]);
+  useEffect(() => {
+    return mergeRegister(editor.registerCommand(INSERT_QUOTE_COMMAND, ({
+      themeStyleId
+    }) => {
+      formatToQuote(editor, themeStyleId);
+      return false;
+    }, COMMAND_PRIORITY_LOW));
+  }, [editor]);
   return null;
 }
 

package/plugins/QuoteNodePlugin/QuoteNodePlugin.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","_lexicalNodes","_useQuote","_hooks","QuotePlugin","_useRichTextEditor","useRichTextEditor","editor","useQuote","useEffect","hasNodes","QuoteNode","Error"],"sources":["QuoteNodePlugin.ts"],"sourcesContent":["import { useEffect } from \"react\";\nimport { QuoteNode } from \"@webiny/lexical-nodes\";\nimport { useQuote } from \"~/hooks/useQuote\";\nimport { useRichTextEditor } from \"~/hooks\";\n\nexport function QuotePlugin() {\n    const { editor } = useRichTextEditor();\n    useQuote(editor);\n\n    useEffect(() => {\n        if (!editor.hasNodes([QuoteNode])) {\n            throw new Error(\"QuoteNodePlugin: QuoteNode is not registered in the editor!\");\n        }\n    }, [editor]);\n\n    return null;\n}\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,SAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AAEO,SAASI,WAAWA,CAAA,EAAG;EAC1B,IAAAC,kBAAA,GAAmB,IAAAC,wBAAiB,EAAC,CAAC;IAA9BC,MAAM,GAAAF,kBAAA,CAANE,MAAM;EACd,IAAAC,kBAAQ,EAACD,MAAM,CAAC;EAEhB,IAAAE,gBAAS,EAAC,YAAM;IACZ,IAAI,CAACF,MAAM,CAACG,QAAQ,CAAC,CAACC,uBAAS,CAAC,CAAC,EAAE;MAC/B,MAAM,IAAIC,KAAK,CAAC,6DAA6D,CAAC;IAClF;EACJ,CAAC,EAAE,CAACL,MAAM,CAAC,CAAC;EAEZ,OAAO,IAAI;AACf","ignoreList":[]}
+{"version":3,"names":["useEffect","formatToQuote","QuoteNode","COMMAND_PRIORITY_LOW","mergeRegister","useRichTextEditor","INSERT_QUOTE_COMMAND","QuotePlugin","editor","hasNodes","Error","registerCommand","themeStyleId"],"sources":["QuoteNodePlugin.ts"],"sourcesContent":["import { useEffect } from \"react\";\nimport { formatToQuote, QuoteNode } from \"@webiny/lexical-nodes\";\nimport { COMMAND_PRIORITY_LOW, mergeRegister } from \"lexical\";\nimport { useRichTextEditor } from \"~/hooks/index.js\";\nimport { INSERT_QUOTE_COMMAND } from \"~/commands/index.js\";\n\nexport function QuotePlugin() {\n    const { editor } = useRichTextEditor();\n\n    useEffect(() => {\n        if (!editor.hasNodes([QuoteNode])) {\n            throw new Error(\"QuoteNodePlugin: QuoteNode is not registered in the editor!\");\n        }\n    }, [editor]);\n\n    useEffect(() => {\n        return mergeRegister(\n            editor.registerCommand(\n                INSERT_QUOTE_COMMAND,\n                ({ themeStyleId }) => {\n                    formatToQuote(editor, themeStyleId);\n                    return false;\n                },\n                COMMAND_PRIORITY_LOW\n            )\n        );\n    }, [editor]);\n\n    return null;\n}\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,OAAO;AACjC,SAASC,aAAa,EAAEC,SAAS,QAAQ,uBAAuB;AAChE,SAASC,oBAAoB,EAAEC,aAAa,QAAQ,SAAS;AAC7D,SAASC,iBAAiB;AAC1B,SAASC,oBAAoB;AAE7B,OAAO,SAASC,WAAWA,CAAA,EAAG;EAC1B,MAAM;IAAEC;EAAO,CAAC,GAAGH,iBAAiB,CAAC,CAAC;EAEtCL,SAAS,CAAC,MAAM;IACZ,IAAI,CAACQ,MAAM,CAACC,QAAQ,CAAC,CAACP,SAAS,CAAC,CAAC,EAAE;MAC/B,MAAM,IAAIQ,KAAK,CAAC,6DAA6D,CAAC;IAClF;EACJ,CAAC,EAAE,CAACF,MAAM,CAAC,CAAC;EAEZR,SAAS,CAAC,MAAM;IACZ,OAAOI,aAAa,CAChBI,MAAM,CAACG,eAAe,CAClBL,oBAAoB,EACpB,CAAC;MAAEM;IAAa,CAAC,KAAK;MAClBX,aAAa,CAACO,MAAM,EAAEI,YAAY,CAAC;MACnC,OAAO,KAAK;IAChB,CAAC,EACDT,oBACJ,CACJ,CAAC;EACL,CAAC,EAAE,CAACK,MAAM,CAAC,CAAC;EAEZ,OAAO,IAAI;AACf","ignoreList":[]}

package/plugins/StateHandlingPlugin.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { LexicalValue } from "../types.js";
+interface OnChangeProps {
+    value: string | null | undefined;
+    onChange?: (value: LexicalValue) => void;
+}
+export declare const StateHandlingPlugin: (props: OnChangeProps) => React.JSX.Element;
+export {};

package/plugins/StateHandlingPlugin.js

@@ -0,0 +1,75 @@
+import React, { useEffect, useRef, useMemo } from "react";
+import debounce from "lodash/debounce.js";
+import { OnChangePlugin as BaseOnChangePlugin } from "@lexical/react/LexicalOnChangePlugin";
+import { $isRootTextContentEmpty } from "@lexical/text";
+import { generateInitialLexicalValue, prepareLexicalState } from "@webiny/lexical-nodes";
+import { normalizeInputValue } from "../components/Editor/normalizeInputValue.js";
+import { useRichTextEditor } from "../hooks/index.js";
+import { parseLexicalState } from "../utils/isValidLexicalData.js";
+export const StateHandlingPlugin = props => {
+  const {
+    editor
+  } = useRichTextEditor();
+  const lastEmittedRef = useRef("");
+  const lastOnChangeTimestampRef = useRef(0);
+  const value = normalizeInputValue(props.value);
+  const editorInputValue = prepareLexicalState(value);
+  const handleOnChange = useMemo(() => {
+    return debounce((editorState, editor) => {
+      editorState.read(() => {
+        if (typeof props.onChange === "function") {
+          const editorState = editor.getEditorState();
+          const isEditorEmpty = $isRootTextContentEmpty(editor.isComposing(), true);
+          if (!value && isEditorEmpty) {
+            return;
+          }
+          const newValue = JSON.stringify(editorState.toJSON());
+          if (newValue !== lastEmittedRef.current) {
+            lastEmittedRef.current = newValue;
+            lastOnChangeTimestampRef.current = Date.now();
+            props.onChange(newValue);
+          }
+        }
+      });
+    }, 300);
+  }, [props.onChange, editor]);
+  useEffect(() => {
+    if (!value || !editor || value === lastEmittedRef.current) {
+      return;
+    }
+    const now = Date.now();
+    if (now - lastOnChangeTimestampRef.current < 500) {
+      return;
+    }
+    const parsedState = parseLexicalState(editorInputValue);
+    let newState;
+    const currentSerialized = JSON.stringify(editor.getEditorState().toJSON());
+    if (currentSerialized === editorInputValue) {
+      return;
+    }
+    try {
+      newState = editor.parseEditorState(parsedState || generateInitialLexicalValue());
+    } catch {
+      // Ignore errors
+    }
+
+    // We must set the state outside the `editor.update()` callback to prevent freezing.
+    // https://lexical.dev/docs/api/classes/lexical.LexicalEditor#seteditorstate
+    if (newState) {
+      const state = newState;
+      queueMicrotask(() => {
+        try {
+          editor.setEditorState(state);
+        } catch (e) {
+          console.error(e);
+        }
+      });
+    }
+  }, [value, editor, editorInputValue]);
+  return /*#__PURE__*/React.createElement(BaseOnChangePlugin, {
+    onChange: handleOnChange,
+    ignoreSelectionChange: true
+  });
+};
+
+//# sourceMappingURL=StateHandlingPlugin.js.map

package/plugins/StateHandlingPlugin.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","useRef","useMemo","debounce","OnChangePlugin","BaseOnChangePlugin","$isRootTextContentEmpty","generateInitialLexicalValue","prepareLexicalState","normalizeInputValue","useRichTextEditor","parseLexicalState","StateHandlingPlugin","props","editor","lastEmittedRef","lastOnChangeTimestampRef","value","editorInputValue","handleOnChange","editorState","read","onChange","getEditorState","isEditorEmpty","isComposing","newValue","JSON","stringify","toJSON","current","Date","now","parsedState","newState","currentSerialized","parseEditorState","state","queueMicrotask","setEditorState","e","console","error","createElement","ignoreSelectionChange"],"sources":["StateHandlingPlugin.tsx"],"sourcesContent":["import React, { useEffect, useRef, useMemo } from \"react\";\nimport debounce from \"lodash/debounce.js\";\nimport { OnChangePlugin as BaseOnChangePlugin } from \"@lexical/react/LexicalOnChangePlugin\";\nimport type { EditorState, LexicalEditor } from \"lexical\";\nimport { $isRootTextContentEmpty } from \"@lexical/text\";\nimport { generateInitialLexicalValue, prepareLexicalState } from \"@webiny/lexical-nodes\";\nimport { normalizeInputValue } from \"~/components/Editor/normalizeInputValue.js\";\nimport type { LexicalValue } from \"~/types.js\";\nimport { useRichTextEditor } from \"~/hooks/index.js\";\nimport { parseLexicalState } from \"~/utils/isValidLexicalData.js\";\n\ninterface OnChangeProps {\n    value: string | null | undefined;\n    onChange?: (value: LexicalValue) => void;\n}\n\nexport const StateHandlingPlugin = (props: OnChangeProps) => {\n    const { editor } = useRichTextEditor();\n    const lastEmittedRef = useRef(\"\");\n    const lastOnChangeTimestampRef = useRef(0);\n\n    const value = normalizeInputValue(props.value);\n    const editorInputValue = prepareLexicalState(value);\n\n    const handleOnChange = useMemo(() => {\n        return debounce((editorState: EditorState, editor: LexicalEditor) => {\n            editorState.read(() => {\n                if (typeof props.onChange === \"function\") {\n                    const editorState = editor.getEditorState();\n                    const isEditorEmpty = $isRootTextContentEmpty(editor.isComposing(), true);\n\n                    if (!value && isEditorEmpty) {\n                        return;\n                    }\n\n                    const newValue = JSON.stringify(editorState.toJSON());\n\n                    if (newValue !== lastEmittedRef.current) {\n                        lastEmittedRef.current = newValue;\n                        lastOnChangeTimestampRef.current = Date.now();\n                        props.onChange(newValue);\n                    }\n                }\n            });\n        }, 300);\n    }, [props.onChange, editor]);\n\n    useEffect(() => {\n        if (!value || !editor || value === lastEmittedRef.current) {\n            return;\n        }\n\n        const now = Date.now();\n        if (now - lastOnChangeTimestampRef.current < 500) {\n            return;\n        }\n\n        const parsedState = parseLexicalState(editorInputValue);\n\n        let newState: EditorState | undefined;\n\n        const currentSerialized = JSON.stringify(editor.getEditorState().toJSON());\n\n        if (currentSerialized === editorInputValue) {\n            return;\n        }\n\n        try {\n            newState = editor.parseEditorState(parsedState || generateInitialLexicalValue());\n        } catch {\n            // Ignore errors\n        }\n\n        // We must set the state outside the `editor.update()` callback to prevent freezing.\n        // https://lexical.dev/docs/api/classes/lexical.LexicalEditor#seteditorstate\n        if (newState) {\n            const state = newState;\n            queueMicrotask(() => {\n                try {\n                    editor.setEditorState(state);\n                } catch (e) {\n                    console.error(e);\n                }\n            });\n        }\n    }, [value, editor, editorInputValue]);\n\n    return <BaseOnChangePlugin onChange={handleOnChange} ignoreSelectionChange={true} />;\n};\n"],"mappings":"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","ignoreList":[]}

package/plugins/TypographyPlugin/TypographyPlugin.js

@@ -1,29 +1,25 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TypographyPlugin = void 0;
-var _react = require("react");
-var _lexical = require("lexical");
-var _lexicalNodes = require("@webiny/lexical-nodes");
-var _hooks = require("../../hooks");
-var TypographyPlugin = exports.TypographyPlugin = function TypographyPlugin() {
-  var _useRichTextEditor = (0, _hooks.useRichTextEditor)(),
-    editor = _useRichTextEditor.editor;
-  (0, _react.useEffect)(function () {
-    return editor.registerCommand(_lexicalNodes.ADD_TYPOGRAPHY_COMMAND, function (payload) {
-      var selection = (0, _lexical.$getSelection)();
+import { useEffect } from "react";
+import { $getSelection, $isRangeSelection, COMMAND_PRIORITY_EDITOR } from "lexical";
+import { formatToParagraph, formatToHeading } from "@webiny/lexical-nodes";
+import { useRichTextEditor } from "../../hooks/index.js";
+import { ADD_TYPOGRAPHY_COMMAND } from "../../commands/index.js";
+export const TypographyPlugin = () => {
+  const {
+    editor
+  } = useRichTextEditor();
+  useEffect(() => {
+    return editor.registerCommand(ADD_TYPOGRAPHY_COMMAND, payload => {
+      const selection = $getSelection();
       // paragraph
-      if ((0, _lexical.$isRangeSelection)(selection) && payload.value.id && payload.value.tag === "p") {
-        (0, _lexicalNodes.formatToParagraph)(editor, payload.value.id);
+      if ($isRangeSelection(selection) && payload.value.id && payload.value.tag === "p") {
+        formatToParagraph(editor, payload.value.id);
       }
       // heading
-      if ((0, _lexical.$isRangeSelection)(selection) && payload.value.id && payload.value.tag.includes("h")) {
-        (0, _lexicalNodes.formatToHeading)(editor, payload.value.tag, payload.value.id);
+      if ($isRangeSelection(selection) && payload.value.id && payload.value.tag.includes("h")) {
+        formatToHeading(editor, payload.value.tag, payload.value.id);
       }
       return true;
-    }, _lexical.COMMAND_PRIORITY_EDITOR);
+    }, COMMAND_PRIORITY_EDITOR);
   }, [editor]);
   return null;
 };

package/plugins/TypographyPlugin/TypographyPlugin.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","_lexical","_lexicalNodes","_hooks","TypographyPlugin","exports","_useRichTextEditor","useRichTextEditor","editor","useEffect","registerCommand","ADD_TYPOGRAPHY_COMMAND","payload","selection","$getSelection","$isRangeSelection","value","id","tag","formatToParagraph","includes","formatToHeading","COMMAND_PRIORITY_EDITOR"],"sources":["TypographyPlugin.tsx"],"sourcesContent":["import { useEffect } from \"react\";\nimport { $getSelection, $isRangeSelection, COMMAND_PRIORITY_EDITOR } from \"lexical\";\nimport {\n    ADD_TYPOGRAPHY_COMMAND,\n    TypographyPayload,\n    formatToParagraph,\n    formatToHeading\n} from \"@webiny/lexical-nodes\";\nimport { HeadingTagType } from \"@lexical/rich-text\";\nimport { useRichTextEditor } from \"~/hooks\";\n\nexport const TypographyPlugin = () => {\n    const { editor } = useRichTextEditor();\n\n    useEffect(() => {\n        return editor.registerCommand<TypographyPayload>(\n            ADD_TYPOGRAPHY_COMMAND,\n            payload => {\n                const selection = $getSelection();\n                // paragraph\n                if ($isRangeSelection(selection) && payload.value.id && payload.value.tag === \"p\") {\n                    formatToParagraph(editor, payload.value.id);\n                }\n                // heading\n                if (\n                    $isRangeSelection(selection) &&\n                    payload.value.id &&\n                    payload.value.tag.includes(\"h\")\n                ) {\n                    formatToHeading(editor, payload.value.tag as HeadingTagType, payload.value.id);\n                }\n                return true;\n            },\n            COMMAND_PRIORITY_EDITOR\n        );\n    }, [editor]);\n\n    return null;\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,aAAA,GAAAF,OAAA;AAOA,IAAAG,MAAA,GAAAH,OAAA;AAEO,IAAMI,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAG,SAAnBA,gBAAgBA,CAAA,EAAS;EAClC,IAAAE,kBAAA,GAAmB,IAAAC,wBAAiB,EAAC,CAAC;IAA9BC,MAAM,GAAAF,kBAAA,CAANE,MAAM;EAEd,IAAAC,gBAAS,EAAC,YAAM;IACZ,OAAOD,MAAM,CAACE,eAAe,CACzBC,oCAAsB,EACtB,UAAAC,OAAO,EAAI;MACP,IAAMC,SAAS,GAAG,IAAAC,sBAAa,EAAC,CAAC;MACjC;MACA,IAAI,IAAAC,0BAAiB,EAACF,SAAS,CAAC,IAAID,OAAO,CAACI,KAAK,CAACC,EAAE,IAAIL,OAAO,CAACI,KAAK,CAACE,GAAG,KAAK,GAAG,EAAE;QAC/E,IAAAC,+BAAiB,EAACX,MAAM,EAAEI,OAAO,CAACI,KAAK,CAACC,EAAE,CAAC;MAC/C;MACA;MACA,IACI,IAAAF,0BAAiB,EAACF,SAAS,CAAC,IAC5BD,OAAO,CAACI,KAAK,CAACC,EAAE,IAChBL,OAAO,CAACI,KAAK,CAACE,GAAG,CAACE,QAAQ,CAAC,GAAG,CAAC,EACjC;QACE,IAAAC,6BAAe,EAACb,MAAM,EAAEI,OAAO,CAACI,KAAK,CAACE,GAAG,EAAoBN,OAAO,CAACI,KAAK,CAACC,EAAE,CAAC;MAClF;MACA,OAAO,IAAI;IACf,CAAC,EACDK,gCACJ,CAAC;EACL,CAAC,EAAE,CAACd,MAAM,CAAC,CAAC;EAEZ,OAAO,IAAI;AACf,CAAC","ignoreList":[]}
+{"version":3,"names":["useEffect","$getSelection","$isRangeSelection","COMMAND_PRIORITY_EDITOR","formatToParagraph","formatToHeading","useRichTextEditor","ADD_TYPOGRAPHY_COMMAND","TypographyPlugin","editor","registerCommand","payload","selection","value","id","tag","includes"],"sources":["TypographyPlugin.tsx"],"sourcesContent":["import { useEffect } from \"react\";\nimport { $getSelection, $isRangeSelection, COMMAND_PRIORITY_EDITOR } from \"lexical\";\nimport { formatToParagraph, formatToHeading } from \"@webiny/lexical-nodes\";\nimport type { HeadingTagType } from \"@lexical/rich-text\";\nimport { useRichTextEditor } from \"~/hooks/index.js\";\nimport type { TypographyPayload } from \"~/commands/index.js\";\nimport { ADD_TYPOGRAPHY_COMMAND } from \"~/commands/index.js\";\n\nexport const TypographyPlugin = () => {\n    const { editor } = useRichTextEditor();\n\n    useEffect(() => {\n        return editor.registerCommand<TypographyPayload>(\n            ADD_TYPOGRAPHY_COMMAND,\n            payload => {\n                const selection = $getSelection();\n                // paragraph\n                if ($isRangeSelection(selection) && payload.value.id && payload.value.tag === \"p\") {\n                    formatToParagraph(editor, payload.value.id);\n                }\n                // heading\n                if (\n                    $isRangeSelection(selection) &&\n                    payload.value.id &&\n                    payload.value.tag.includes(\"h\")\n                ) {\n                    formatToHeading(editor, payload.value.tag as HeadingTagType, payload.value.id);\n                }\n                return true;\n            },\n            COMMAND_PRIORITY_EDITOR\n        );\n    }, [editor]);\n\n    return null;\n};\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,OAAO;AACjC,SAASC,aAAa,EAAEC,iBAAiB,EAAEC,uBAAuB,QAAQ,SAAS;AACnF,SAASC,iBAAiB,EAAEC,eAAe,QAAQ,uBAAuB;AAE1E,SAASC,iBAAiB;AAE1B,SAASC,sBAAsB;AAE/B,OAAO,MAAMC,gBAAgB,GAAGA,CAAA,KAAM;EAClC,MAAM;IAAEC;EAAO,CAAC,GAAGH,iBAAiB,CAAC,CAAC;EAEtCN,SAAS,CAAC,MAAM;IACZ,OAAOS,MAAM,CAACC,eAAe,CACzBH,sBAAsB,EACtBI,OAAO,IAAI;MACP,MAAMC,SAAS,GAAGX,aAAa,CAAC,CAAC;MACjC;MACA,IAAIC,iBAAiB,CAACU,SAAS,CAAC,IAAID,OAAO,CAACE,KAAK,CAACC,EAAE,IAAIH,OAAO,CAACE,KAAK,CAACE,GAAG,KAAK,GAAG,EAAE;QAC/EX,iBAAiB,CAACK,MAAM,EAAEE,OAAO,CAACE,KAAK,CAACC,EAAE,CAAC;MAC/C;MACA;MACA,IACIZ,iBAAiB,CAACU,SAAS,CAAC,IAC5BD,OAAO,CAACE,KAAK,CAACC,EAAE,IAChBH,OAAO,CAACE,KAAK,CAACE,GAAG,CAACC,QAAQ,CAAC,GAAG,CAAC,EACjC;QACEX,eAAe,CAACI,MAAM,EAAEE,OAAO,CAACE,KAAK,CAACE,GAAG,EAAoBJ,OAAO,CAACE,KAAK,CAACC,EAAE,CAAC;MAClF;MACA,OAAO,IAAI;IACf,CAAC,EACDX,uBACJ,CAAC;EACL,CAAC,EAAE,CAACM,MAAM,CAAC,CAAC;EAEZ,OAAO,IAAI;AACf,CAAC","ignoreList":[]}

package/types.d.ts

@@ -1,12 +1,12 @@
-export declare type ToolbarType = "heading" | "paragraph" | string;
-export declare type LexicalValue = string;
-export { FontColorPicker } from "./components/ToolbarActions/FontColorAction";
-export declare type ImageActionType = "image-action";
-export declare type ToolbarActionType = ImageActionType | string;
+export type LexicalValue = string;
+export type NormalizedInputValue = LexicalValue | null;
+export { FontColorPicker } from "./components/ToolbarActions/FontColorAction.js";
+export type ImageActionType = "image-action";
+export type ToolbarActionType = ImageActionType | string;
 export interface ToolbarActionPlugin {
     targetAction: ToolbarActionType;
     plugin: Record<string, any> | ((cb: (value: any) => void) => any) | undefined;
 }
-export { ImagePayload } from "./commands";
-export { RichTextEditorProps } from "./components/Editor/RichTextEditor";
-export { Klass, LexicalNode } from "lexical";
+export { type ImagePayload } from "./commands/index.js";
+export { type RichTextEditorProps } from "./components/Editor/RichTextEditor.js";
+export type { Klass, LexicalNode } from "lexical";

package/types.js

@@ -1,41 +1,9 @@
-"use strict";
+export { FontColorPicker } from "./components/ToolbarActions/FontColorAction.js";
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "FontColorPicker", {
-  enumerable: true,
-  get: function get() {
-    return _FontColorAction.FontColorPicker;
-  }
-});
-Object.defineProperty(exports, "ImagePayload", {
-  enumerable: true,
-  get: function get() {
-    return _commands.ImagePayload;
-  }
-});
-Object.defineProperty(exports, "Klass", {
-  enumerable: true,
-  get: function get() {
-    return _lexical.Klass;
-  }
-});
-Object.defineProperty(exports, "LexicalNode", {
-  enumerable: true,
-  get: function get() {
-    return _lexical.LexicalNode;
-  }
-});
-Object.defineProperty(exports, "RichTextEditorProps", {
-  enumerable: true,
-  get: function get() {
-    return _RichTextEditor.RichTextEditorProps;
-  }
-});
-var _FontColorAction = require("./components/ToolbarActions/FontColorAction");
-var _commands = require("./commands");
-var _RichTextEditor = require("./components/Editor/RichTextEditor");
-var _lexical = require("lexical");
+/* Commands payload types */
+
+/* Lexical editor interfaces */
+
+// lexical types
 
 //# sourceMappingURL=types.js.map

package/types.js.map

@@ -1 +1 @@
-{"version":3,"names":["_FontColorAction","require","_commands","_RichTextEditor","_lexical"],"sources":["types.ts"],"sourcesContent":["export type ToolbarType = \"heading\" | \"paragraph\" | string;\nexport type LexicalValue = string;\nexport { FontColorPicker } from \"~/components/ToolbarActions/FontColorAction\";\n\nexport type ImageActionType = \"image-action\";\nexport type ToolbarActionType = ImageActionType | string;\nexport interface ToolbarActionPlugin {\n    targetAction: ToolbarActionType;\n    plugin: Record<string, any> | ((cb: (value: any) => void) => any) | undefined;\n}\n\n/* Commands payload types */\nexport { ImagePayload } from \"~/commands\";\n\n/* Lexical editor interfaces */\nexport { RichTextEditorProps } from \"~/components/Editor/RichTextEditor\";\n\n// lexical types\nexport { Klass, LexicalNode } from \"lexical\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,IAAAA,gBAAA,GAAAC,OAAA;AAUA,IAAAC,SAAA,GAAAD,OAAA;AAGA,IAAAE,eAAA,GAAAF,OAAA;AAGA,IAAAG,QAAA,GAAAH,OAAA","ignoreList":[]}
+{"version":3,"names":["FontColorPicker"],"sources":["types.ts"],"sourcesContent":["export type LexicalValue = string;\n\nexport type NormalizedInputValue = LexicalValue | null;\n\nexport { FontColorPicker } from \"~/components/ToolbarActions/FontColorAction.js\";\n\nexport type ImageActionType = \"image-action\";\nexport type ToolbarActionType = ImageActionType | string;\nexport interface ToolbarActionPlugin {\n    targetAction: ToolbarActionType;\n    plugin: Record<string, any> | ((cb: (value: any) => void) => any) | undefined;\n}\n\n/* Commands payload types */\nexport { type ImagePayload } from \"~/commands/index.js\";\n\n/* Lexical editor interfaces */\nexport { type RichTextEditorProps } from \"~/components/Editor/RichTextEditor.js\";\n\n// lexical types\nexport type { Klass, LexicalNode } from \"lexical\";\n"],"mappings":"AAIA,SAASA,eAAe;;AASxB;;AAGA;;AAGA","ignoreList":[]}

package/ui/ContentEditable.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 /**
  * Copyright (c) Meta Platforms, Inc. and affiliates.
  *