@webiny/lexical-editor 6.3.0-beta.4 → 6.4.0-beta.0

package/components/ToolbarActions/TypographyAction.js

@@ -1,111 +1,81 @@
-import React, { useCallback, useEffect, useState } from "react";
+import react, { useCallback, useEffect, useState } from "react";
 import { Compose, makeDecoratable } from "@webiny/react-composition";
 import { TypographyActionContext } from "../../context/TypographyActionContext.js";
 import { $isHeadingNode, $isListNode, $isParagraphNode, $isQuoteNode } from "@webiny/lexical-nodes";
 import { useRichTextEditor } from "../../hooks/useRichTextEditor.js";
-import { INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND, INSERT_QUOTE_COMMAND, ADD_TYPOGRAPHY_COMMAND } from "../../commands/index.js";
+import { ADD_TYPOGRAPHY_COMMAND, INSERT_ORDERED_LIST_COMMAND, INSERT_QUOTE_COMMAND, INSERT_UNORDERED_LIST_COMMAND } from "../../commands/index.js";
 import { useCurrentElement } from "../../hooks/useCurrentElement.js";
-
-// Unfortunately, for some time in v5 we had `quoteblock` in our theme, so let's not break it.
-const quoteTagNames = ["blockquote", "quoteblock"];
-
-/*
- * Base composable action component that is mounted on toolbar action as a placeholder for the custom toolbar action.
- * Note: Toa add custom component access trough @see LexicalEditorConfig API
- * */
-export const BaseTypographyActionDropDown = makeDecoratable("BaseTypographyActionDropDown", () => {
-  useEffect(() => {
-    console.log("Default BaseTypographyActionDropDown, please add your own component");
-  }, []);
-  return null;
+const quoteTagNames = [
+    "blockquote",
+    "quoteblock"
+];
+const BaseTypographyActionDropDown = makeDecoratable("BaseTypographyActionDropDown", ()=>{
+    useEffect(()=>{
+        console.log("Default BaseTypographyActionDropDown, please add your own component");
+    }, []);
+    return null;
 });
-const TypographyActionDropDown = ({
-  element
-}) => {
-  return /*#__PURE__*/React.createElement(Compose, {
-    component: BaseTypographyActionDropDown,
-    with: () => () => element
-  });
-};
-export const TypographyAction = () => {
-  const [typography, setTypography] = useState();
-  const {
-    editor,
-    theme
-  } = useRichTextEditor();
-  const {
-    element
-  } = useCurrentElement();
-  const isParagraphSelected = $isParagraphNode(element);
-  const isHeadingSelected = $isHeadingNode(element);
-  const isQuoteSelected = $isQuoteNode(element);
-  const onTypographySelect = useCallback(value => {
-    setTypography(value);
-    if (value.tag.includes("h") || value.tag.includes("p")) {
-      editor.dispatchCommand(ADD_TYPOGRAPHY_COMMAND, {
-        value
-      });
-      return;
-    }
-    if (value.tag === "ol") {
-      editor.dispatchCommand(INSERT_ORDERED_LIST_COMMAND, {
-        themeStyleId: value.id
-      });
-      return;
-    }
-    if (value.tag === "ul") {
-      editor.dispatchCommand(INSERT_UNORDERED_LIST_COMMAND, {
-        themeStyleId: value.id
-      });
-      return;
-    }
-    if (quoteTagNames.includes(value.tag)) {
-      editor.dispatchCommand(INSERT_QUOTE_COMMAND, {
-        themeStyleId: value.id
-      });
-    }
-  }, []);
-  useEffect(() => {
-    if (!element) {
-      return;
-    }
-    if (isParagraphSelected || isHeadingSelected || isQuoteSelected) {
-      const styleId = element.getStyleId();
-      if (!styleId) {
-        return;
-      }
-      const style = theme.getTypographyById(styleId);
-      if (style) {
-        setTypography({
-          id: style.id,
-          label: style.label
+const TypographyActionDropDown = ({ element })=>/*#__PURE__*/ react.createElement(Compose, {
+        component: BaseTypographyActionDropDown,
+        with: ()=>()=>element
+    });
+const TypographyAction = ()=>{
+    const [typography, setTypography] = useState();
+    const { editor, theme } = useRichTextEditor();
+    const { element } = useCurrentElement();
+    const isParagraphSelected = $isParagraphNode(element);
+    const isHeadingSelected = $isHeadingNode(element);
+    const isQuoteSelected = $isQuoteNode(element);
+    const onTypographySelect = useCallback((value)=>{
+        setTypography(value);
+        if (value.tag.includes("h") || value.tag.includes("p")) return void editor.dispatchCommand(ADD_TYPOGRAPHY_COMMAND, {
+            value
         });
-      }
-      return;
-    }
-
-    // list and quote element
-    if ($isListNode(element)) {
-      const styleId = element.getStyleId();
-      if (!styleId) {
-        return;
-      }
-      const style = theme.getTypographyById(styleId);
-      if (style) {
-        setTypography({
-          id: style.id,
-          label: style.label
+        if ("ol" === value.tag) return void editor.dispatchCommand(INSERT_ORDERED_LIST_COMMAND, {
+            themeStyleId: value.id
+        });
+        if ("ul" === value.tag) return void editor.dispatchCommand(INSERT_UNORDERED_LIST_COMMAND, {
+            themeStyleId: value.id
+        });
+        if (quoteTagNames.includes(value.tag)) editor.dispatchCommand(INSERT_QUOTE_COMMAND, {
+            themeStyleId: value.id
         });
-      }
-    }
-  }, [element, isQuoteSelected, isParagraphSelected, isHeadingSelected]);
-  return /*#__PURE__*/React.createElement(TypographyActionContext.Provider, {
-    value: {
-      value: typography,
-      applyTypography: onTypographySelect
-    }
-  }, /*#__PURE__*/React.createElement(BaseTypographyActionDropDown, null));
+    }, []);
+    useEffect(()=>{
+        if (!element) return;
+        if (isParagraphSelected || isHeadingSelected || isQuoteSelected) {
+            const styleId = element.getStyleId();
+            if (!styleId) return;
+            const style = theme.getTypographyById(styleId);
+            if (style) setTypography({
+                id: style.id,
+                label: style.label
+            });
+            return;
+        }
+        if ($isListNode(element)) {
+            const styleId = element.getStyleId();
+            if (!styleId) return;
+            const style = theme.getTypographyById(styleId);
+            if (style) setTypography({
+                id: style.id,
+                label: style.label
+            });
+        }
+    }, [
+        element,
+        isQuoteSelected,
+        isParagraphSelected,
+        isHeadingSelected
+    ]);
+    return /*#__PURE__*/ react.createElement(TypographyActionContext.Provider, {
+        value: {
+            value: typography,
+            applyTypography: onTypographySelect
+        }
+    }, /*#__PURE__*/ react.createElement(BaseTypographyActionDropDown, null));
 };
 TypographyAction.TypographyDropDown = TypographyActionDropDown;
+export { BaseTypographyActionDropDown, TypographyAction };
 
 //# sourceMappingURL=TypographyAction.js.map

package/components/ToolbarActions/TypographyAction.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useEffect","useState","Compose","makeDecoratable","TypographyActionContext","$isHeadingNode","$isListNode","$isParagraphNode","$isQuoteNode","useRichTextEditor","INSERT_ORDERED_LIST_COMMAND","INSERT_UNORDERED_LIST_COMMAND","INSERT_QUOTE_COMMAND","ADD_TYPOGRAPHY_COMMAND","useCurrentElement","quoteTagNames","BaseTypographyActionDropDown","console","log","TypographyActionDropDown","element","createElement","component","with","TypographyAction","typography","setTypography","editor","theme","isParagraphSelected","isHeadingSelected","isQuoteSelected","onTypographySelect","value","tag","includes","dispatchCommand","themeStyleId","id","styleId","getStyleId","style","getTypographyById","label","Provider","applyTypography","TypographyDropDown"],"sources":["TypographyAction.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport type { LexicalCommand } from \"lexical\";\nimport { Compose, makeDecoratable } from \"@webiny/react-composition\";\nimport type { TypographyValue } from \"@webiny/lexical-theme\";\nimport type { ActiveTypography } from \"~/context/TypographyActionContext.js\";\nimport { TypographyActionContext } from \"~/context/TypographyActionContext.js\";\nimport { $isHeadingNode, $isListNode, $isParagraphNode, $isQuoteNode } from \"@webiny/lexical-nodes\";\nimport { useRichTextEditor } from \"~/hooks/useRichTextEditor.js\";\nimport type {\n    ListCommandPayload,\n    QuoteCommandPayload,\n    TypographyPayload\n} from \"~/commands/index.js\";\nimport {\n    INSERT_ORDERED_LIST_COMMAND,\n    INSERT_UNORDERED_LIST_COMMAND,\n    INSERT_QUOTE_COMMAND,\n    ADD_TYPOGRAPHY_COMMAND\n} from \"~/commands/index.js\";\nimport { useCurrentElement } from \"~/hooks/useCurrentElement.js\";\n\n// Unfortunately, for some time in v5 we had `quoteblock` in our theme, so let's not break it.\nconst quoteTagNames = [\"blockquote\", \"quoteblock\"];\n\n/*\n * Base composable action component that is mounted on toolbar action as a placeholder for the custom toolbar action.\n * Note: Toa add custom component access trough @see LexicalEditorConfig API\n * */\nexport const BaseTypographyActionDropDown = makeDecoratable(\n    \"BaseTypographyActionDropDown\",\n    (): React.JSX.Element | null => {\n        useEffect(() => {\n            console.log(\"Default BaseTypographyActionDropDown, please add your own component\");\n        }, []);\n        return null;\n    }\n);\n\ninterface TypographyActionDropdownProps {\n    element: React.JSX.Element;\n}\n\nconst TypographyActionDropDown = ({\n    element\n}: TypographyActionDropdownProps): React.JSX.Element => {\n    return <Compose component={BaseTypographyActionDropDown} with={() => () => element} />;\n};\n\nexport type TypographyAction = React.ComponentType<unknown> & {\n    TypographyDropDown: typeof TypographyActionDropDown;\n};\n\nexport const TypographyAction: TypographyAction = () => {\n    const [typography, setTypography] = useState<ActiveTypography>();\n    const { editor, theme } = useRichTextEditor();\n    const { element } = useCurrentElement();\n    const isParagraphSelected = $isParagraphNode(element);\n    const isHeadingSelected = $isHeadingNode(element);\n    const isQuoteSelected = $isQuoteNode(element);\n\n    const onTypographySelect = useCallback((value: TypographyValue) => {\n        setTypography(value);\n\n        if (value.tag.includes(\"h\") || value.tag.includes(\"p\")) {\n            editor.dispatchCommand<LexicalCommand<TypographyPayload>>(ADD_TYPOGRAPHY_COMMAND, {\n                value\n            });\n            return;\n        }\n\n        if (value.tag === \"ol\") {\n            editor.dispatchCommand<LexicalCommand<ListCommandPayload>>(\n                INSERT_ORDERED_LIST_COMMAND,\n                {\n                    themeStyleId: value.id\n                }\n            );\n            return;\n        }\n\n        if (value.tag === \"ul\") {\n            editor.dispatchCommand<LexicalCommand<ListCommandPayload>>(\n                INSERT_UNORDERED_LIST_COMMAND,\n                {\n                    themeStyleId: value.id\n                }\n            );\n            return;\n        }\n\n        if (quoteTagNames.includes(value.tag)) {\n            editor.dispatchCommand<LexicalCommand<QuoteCommandPayload>>(INSERT_QUOTE_COMMAND, {\n                themeStyleId: value.id\n            });\n        }\n    }, []);\n\n    useEffect(() => {\n        if (!element) {\n            return;\n        }\n\n        if (isParagraphSelected || isHeadingSelected || isQuoteSelected) {\n            const styleId = element.getStyleId();\n            if (!styleId) {\n                return;\n            }\n\n            const style = theme.getTypographyById(styleId);\n            if (style) {\n                setTypography({\n                    id: style.id,\n                    label: style.label\n                });\n            }\n            return;\n        }\n\n        // list and quote element\n        if ($isListNode(element)) {\n            const styleId = element.getStyleId();\n            if (!styleId) {\n                return;\n            }\n\n            const style = theme.getTypographyById(styleId);\n            if (style) {\n                setTypography({\n                    id: style.id,\n                    label: style.label\n                });\n            }\n        }\n    }, [element, isQuoteSelected, isParagraphSelected, isHeadingSelected]);\n\n    return (\n        <TypographyActionContext.Provider\n            value={{\n                value: typography,\n                applyTypography: onTypographySelect\n            }}\n        >\n            <BaseTypographyActionDropDown />\n        </TypographyActionContext.Provider>\n    );\n};\n\nTypographyAction.TypographyDropDown = TypographyActionDropDown;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"components/ToolbarActions/TypographyAction.js","sources":["../../../src/components/ToolbarActions/TypographyAction.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport type { LexicalCommand } from \"lexical\";\nimport { Compose, makeDecoratable } from \"@webiny/react-composition\";\nimport type { TypographyValue } from \"@webiny/lexical-theme\";\nimport type { ActiveTypography } from \"~/context/TypographyActionContext.js\";\nimport { TypographyActionContext } from \"~/context/TypographyActionContext.js\";\nimport { $isHeadingNode, $isListNode, $isParagraphNode, $isQuoteNode } from \"@webiny/lexical-nodes\";\nimport { useRichTextEditor } from \"~/hooks/useRichTextEditor.js\";\nimport type {\n    ListCommandPayload,\n    QuoteCommandPayload,\n    TypographyPayload\n} from \"~/commands/index.js\";\nimport {\n    INSERT_ORDERED_LIST_COMMAND,\n    INSERT_UNORDERED_LIST_COMMAND,\n    INSERT_QUOTE_COMMAND,\n    ADD_TYPOGRAPHY_COMMAND\n} from \"~/commands/index.js\";\nimport { useCurrentElement } from \"~/hooks/useCurrentElement.js\";\n\n// Unfortunately, for some time in v5 we had `quoteblock` in our theme, so let's not break it.\nconst quoteTagNames = [\"blockquote\", \"quoteblock\"];\n\n/*\n * Base composable action component that is mounted on toolbar action as a placeholder for the custom toolbar action.\n * Note: Toa add custom component access trough @see LexicalEditorConfig API\n * */\nexport const BaseTypographyActionDropDown = makeDecoratable(\n    \"BaseTypographyActionDropDown\",\n    (): React.JSX.Element | null => {\n        useEffect(() => {\n            console.log(\"Default BaseTypographyActionDropDown, please add your own component\");\n        }, []);\n        return null;\n    }\n);\n\ninterface TypographyActionDropdownProps {\n    element: React.JSX.Element;\n}\n\nconst TypographyActionDropDown = ({\n    element\n}: TypographyActionDropdownProps): React.JSX.Element => {\n    return <Compose component={BaseTypographyActionDropDown} with={() => () => element} />;\n};\n\nexport type TypographyAction = React.ComponentType<unknown> & {\n    TypographyDropDown: typeof TypographyActionDropDown;\n};\n\nexport const TypographyAction: TypographyAction = () => {\n    const [typography, setTypography] = useState<ActiveTypography>();\n    const { editor, theme } = useRichTextEditor();\n    const { element } = useCurrentElement();\n    const isParagraphSelected = $isParagraphNode(element);\n    const isHeadingSelected = $isHeadingNode(element);\n    const isQuoteSelected = $isQuoteNode(element);\n\n    const onTypographySelect = useCallback((value: TypographyValue) => {\n        setTypography(value);\n\n        if (value.tag.includes(\"h\") || value.tag.includes(\"p\")) {\n            editor.dispatchCommand<LexicalCommand<TypographyPayload>>(ADD_TYPOGRAPHY_COMMAND, {\n                value\n            });\n            return;\n        }\n\n        if (value.tag === \"ol\") {\n            editor.dispatchCommand<LexicalCommand<ListCommandPayload>>(\n                INSERT_ORDERED_LIST_COMMAND,\n                {\n                    themeStyleId: value.id\n                }\n            );\n            return;\n        }\n\n        if (value.tag === \"ul\") {\n            editor.dispatchCommand<LexicalCommand<ListCommandPayload>>(\n                INSERT_UNORDERED_LIST_COMMAND,\n                {\n                    themeStyleId: value.id\n                }\n            );\n            return;\n        }\n\n        if (quoteTagNames.includes(value.tag)) {\n            editor.dispatchCommand<LexicalCommand<QuoteCommandPayload>>(INSERT_QUOTE_COMMAND, {\n                themeStyleId: value.id\n            });\n        }\n    }, []);\n\n    useEffect(() => {\n        if (!element) {\n            return;\n        }\n\n        if (isParagraphSelected || isHeadingSelected || isQuoteSelected) {\n            const styleId = element.getStyleId();\n            if (!styleId) {\n                return;\n            }\n\n            const style = theme.getTypographyById(styleId);\n            if (style) {\n                setTypography({\n                    id: style.id,\n                    label: style.label\n                });\n            }\n            return;\n        }\n\n        // list and quote element\n        if ($isListNode(element)) {\n            const styleId = element.getStyleId();\n            if (!styleId) {\n                return;\n            }\n\n            const style = theme.getTypographyById(styleId);\n            if (style) {\n                setTypography({\n                    id: style.id,\n                    label: style.label\n                });\n            }\n        }\n    }, [element, isQuoteSelected, isParagraphSelected, isHeadingSelected]);\n\n    return (\n        <TypographyActionContext.Provider\n            value={{\n                value: typography,\n                applyTypography: onTypographySelect\n            }}\n        >\n            <BaseTypographyActionDropDown />\n        </TypographyActionContext.Provider>\n    );\n};\n\nTypographyAction.TypographyDropDown = TypographyActionDropDown;\n"],"names":["quoteTagNames","BaseTypographyActionDropDown","makeDecoratable","useEffect","console","TypographyActionDropDown","element","Compose","TypographyAction","typography","setTypography","useState","editor","theme","useRichTextEditor","useCurrentElement","isParagraphSelected","$isParagraphNode","isHeadingSelected","$isHeadingNode","isQuoteSelected","$isQuoteNode","onTypographySelect","useCallback","value","ADD_TYPOGRAPHY_COMMAND","INSERT_ORDERED_LIST_COMMAND","INSERT_UNORDERED_LIST_COMMAND","INSERT_QUOTE_COMMAND","styleId","style","$isListNode","TypographyActionContext"],"mappings":";;;;;;;AAsBA,MAAMA,gBAAgB;IAAC;IAAc;CAAa;AAM3C,MAAMC,+BAA+BC,gBACxC,gCACA;IACIC,UAAU;QACNC,QAAQ,GAAG,CAAC;IAChB,GAAG,EAAE;IACL,OAAO;AACX;AAOJ,MAAMC,2BAA2B,CAAC,EAC9BC,OAAO,EACqB,GACrB,WAAP,GAAO,oBAACC,SAAOA;QAAC,WAAWN;QAA8B,MAAM,IAAM,IAAMK;;AAOxE,MAAME,mBAAqC;IAC9C,MAAM,CAACC,YAAYC,cAAc,GAAGC;IACpC,MAAM,EAAEC,MAAM,EAAEC,KAAK,EAAE,GAAGC;IAC1B,MAAM,EAAER,OAAO,EAAE,GAAGS;IACpB,MAAMC,sBAAsBC,iBAAiBX;IAC7C,MAAMY,oBAAoBC,eAAeb;IACzC,MAAMc,kBAAkBC,aAAaf;IAErC,MAAMgB,qBAAqBC,YAAY,CAACC;QACpCd,cAAcc;QAEd,IAAIA,MAAM,GAAG,CAAC,QAAQ,CAAC,QAAQA,MAAM,GAAG,CAAC,QAAQ,CAAC,MAAM,YACpDZ,OAAO,eAAe,CAAoCa,wBAAwB;YAC9ED;QACJ;QAIJ,IAAIA,AAAc,SAAdA,MAAM,GAAG,EAAW,YACpBZ,OAAO,eAAe,CAClBc,6BACA;YACI,cAAcF,MAAM,EAAE;QAC1B;QAKR,IAAIA,AAAc,SAAdA,MAAM,GAAG,EAAW,YACpBZ,OAAO,eAAe,CAClBe,+BACA;YACI,cAAcH,MAAM,EAAE;QAC1B;QAKR,IAAIxB,cAAc,QAAQ,CAACwB,MAAM,GAAG,GAChCZ,OAAO,eAAe,CAAsCgB,sBAAsB;YAC9E,cAAcJ,MAAM,EAAE;QAC1B;IAER,GAAG,EAAE;IAELrB,UAAU;QACN,IAAI,CAACG,SACD;QAGJ,IAAIU,uBAAuBE,qBAAqBE,iBAAiB;YAC7D,MAAMS,UAAUvB,QAAQ,UAAU;YAClC,IAAI,CAACuB,SACD;YAGJ,MAAMC,QAAQjB,MAAM,iBAAiB,CAACgB;YACtC,IAAIC,OACApB,cAAc;gBACV,IAAIoB,MAAM,EAAE;gBACZ,OAAOA,MAAM,KAAK;YACtB;YAEJ;QACJ;QAGA,IAAIC,YAAYzB,UAAU;YACtB,MAAMuB,UAAUvB,QAAQ,UAAU;YAClC,IAAI,CAACuB,SACD;YAGJ,MAAMC,QAAQjB,MAAM,iBAAiB,CAACgB;YACtC,IAAIC,OACApB,cAAc;gBACV,IAAIoB,MAAM,EAAE;gBACZ,OAAOA,MAAM,KAAK;YACtB;QAER;IACJ,GAAG;QAACxB;QAASc;QAAiBJ;QAAqBE;KAAkB;IAErE,OAAO,WAAP,GACI,oBAACc,wBAAwB,QAAQ;QAC7B,OAAO;YACH,OAAOvB;YACP,iBAAiBa;QACrB;qBAEA,oBAACrB,8BAA4BA;AAGzC;AAEAO,iBAAiB,kBAAkB,GAAGH"}

package/components/ToolbarActions/UnderlineAction.js

@@ -1,24 +1,21 @@
-import React from "react";
+import react from "react";
 import { FORMAT_TEXT_COMMAND } from "lexical";
 import { useCurrentSelection, useRichTextEditor } from "../../hooks/index.js";
-export const UnderlineAction = () => {
-  const {
-    editor
-  } = useRichTextEditor();
-  const {
-    rangeSelection
-  } = useCurrentSelection();
-  const isUnderlineSelected = rangeSelection ? rangeSelection.hasFormat("underline") : false;
-  const handleClick = () => {
-    editor.dispatchCommand(FORMAT_TEXT_COMMAND, "underline");
-  };
-  return /*#__PURE__*/React.createElement("button", {
-    onClick: handleClick,
-    className: "popup-item spaced " + (isUnderlineSelected ? "active" : ""),
-    "aria-label": "Underline text"
-  }, /*#__PURE__*/React.createElement("i", {
-    className: "format underline"
-  }));
+const UnderlineAction = ()=>{
+    const { editor } = useRichTextEditor();
+    const { rangeSelection } = useCurrentSelection();
+    const isUnderlineSelected = rangeSelection ? rangeSelection.hasFormat("underline") : false;
+    const handleClick = ()=>{
+        editor.dispatchCommand(FORMAT_TEXT_COMMAND, "underline");
+    };
+    return /*#__PURE__*/ react.createElement("button", {
+        onClick: handleClick,
+        className: "popup-item spaced " + (isUnderlineSelected ? "active" : ""),
+        "aria-label": "Underline text"
+    }, /*#__PURE__*/ react.createElement("i", {
+        className: "format underline"
+    }));
 };
+export { UnderlineAction };
 
 //# sourceMappingURL=UnderlineAction.js.map

package/components/ToolbarActions/UnderlineAction.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","FORMAT_TEXT_COMMAND","useCurrentSelection","useRichTextEditor","UnderlineAction","editor","rangeSelection","isUnderlineSelected","hasFormat","handleClick","dispatchCommand","createElement","onClick","className"],"sources":["UnderlineAction.tsx"],"sourcesContent":["import React from \"react\";\nimport { FORMAT_TEXT_COMMAND } from \"lexical\";\nimport { useCurrentSelection, useRichTextEditor } from \"~/hooks/index.js\";\n\nexport const UnderlineAction = () => {\n    const { editor } = useRichTextEditor();\n    const { rangeSelection } = useCurrentSelection();\n    const isUnderlineSelected = rangeSelection ? rangeSelection.hasFormat(\"underline\") : false;\n\n    const handleClick = () => {\n        editor.dispatchCommand(FORMAT_TEXT_COMMAND, \"underline\");\n    };\n\n    return (\n        <button\n            onClick={handleClick}\n            className={\"popup-item spaced \" + (isUnderlineSelected ? \"active\" : \"\")}\n            aria-label=\"Underline text\"\n        >\n            <i className=\"format underline\" />\n        </button>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,mBAAmB,QAAQ,SAAS;AAC7C,SAASC,mBAAmB,EAAEC,iBAAiB;AAE/C,OAAO,MAAMC,eAAe,GAAGA,CAAA,KAAM;EACjC,MAAM;IAAEC;EAAO,CAAC,GAAGF,iBAAiB,CAAC,CAAC;EACtC,MAAM;IAAEG;EAAe,CAAC,GAAGJ,mBAAmB,CAAC,CAAC;EAChD,MAAMK,mBAAmB,GAAGD,cAAc,GAAGA,cAAc,CAACE,SAAS,CAAC,WAAW,CAAC,GAAG,KAAK;EAE1F,MAAMC,WAAW,GAAGA,CAAA,KAAM;IACtBJ,MAAM,CAACK,eAAe,CAACT,mBAAmB,EAAE,WAAW,CAAC;EAC5D,CAAC;EAED,oBACID,KAAA,CAAAW,aAAA;IACIC,OAAO,EAAEH,WAAY;IACrBI,SAAS,EAAE,oBAAoB,IAAIN,mBAAmB,GAAG,QAAQ,GAAG,EAAE,CAAE;IACxE,cAAW;EAAgB,gBAE3BP,KAAA,CAAAW,aAAA;IAAGE,SAAS,EAAC;EAAkB,CAAE,CAC7B,CAAC;AAEjB,CAAC","ignoreList":[]}
+{"version":3,"file":"components/ToolbarActions/UnderlineAction.js","sources":["../../../src/components/ToolbarActions/UnderlineAction.tsx"],"sourcesContent":["import React from \"react\";\nimport { FORMAT_TEXT_COMMAND } from \"lexical\";\nimport { useCurrentSelection, useRichTextEditor } from \"~/hooks/index.js\";\n\nexport const UnderlineAction = () => {\n    const { editor } = useRichTextEditor();\n    const { rangeSelection } = useCurrentSelection();\n    const isUnderlineSelected = rangeSelection ? rangeSelection.hasFormat(\"underline\") : false;\n\n    const handleClick = () => {\n        editor.dispatchCommand(FORMAT_TEXT_COMMAND, \"underline\");\n    };\n\n    return (\n        <button\n            onClick={handleClick}\n            className={\"popup-item spaced \" + (isUnderlineSelected ? \"active\" : \"\")}\n            aria-label=\"Underline text\"\n        >\n            <i className=\"format underline\" />\n        </button>\n    );\n};\n"],"names":["UnderlineAction","editor","useRichTextEditor","rangeSelection","useCurrentSelection","isUnderlineSelected","handleClick","FORMAT_TEXT_COMMAND"],"mappings":";;;AAIO,MAAMA,kBAAkB;IAC3B,MAAM,EAAEC,MAAM,EAAE,GAAGC;IACnB,MAAM,EAAEC,cAAc,EAAE,GAAGC;IAC3B,MAAMC,sBAAsBF,iBAAiBA,eAAe,SAAS,CAAC,eAAe;IAErF,MAAMG,cAAc;QAChBL,OAAO,eAAe,CAACM,qBAAqB;IAChD;IAEA,OAAO,WAAP,GACI,oBAAC;QACG,SAASD;QACT,WAAW,uBAAwBD,CAAAA,sBAAsB,WAAW,EAAC;QACrE,cAAW;qBAEX,oBAAC;QAAE,WAAU;;AAGzB"}

package/context/FontColorActionContext.js

@@ -1,4 +1,5 @@
-import React from "react";
-export const FontColorActionContext = /*#__PURE__*/React.createContext(undefined);
+import react from "react";
+const FontColorActionContext = /*#__PURE__*/ react.createContext(void 0);
+export { FontColorActionContext };
 
 //# sourceMappingURL=FontColorActionContext.js.map

package/context/FontColorActionContext.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","FontColorActionContext","createContext","undefined"],"sources":["FontColorActionContext.tsx"],"sourcesContent":["import React from \"react\";\n\nexport interface FontColorActionContext {\n    /*\n     * @desc Current selected color value\n     * */\n    value: string;\n\n    /*\n     * @desc Apply color to selected text.\n     * @params: value\n     */\n    applyColor: (value: string, themeColorName: string | undefined) => void;\n}\n\nexport const FontColorActionContext = React.createContext<FontColorActionContext | undefined>(\n    undefined\n);\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAezB,OAAO,MAAMC,sBAAsB,gBAAGD,KAAK,CAACE,aAAa,CACrDC,SACJ,CAAC","ignoreList":[]}
+{"version":3,"file":"context/FontColorActionContext.js","sources":["../../src/context/FontColorActionContext.tsx"],"sourcesContent":["import React from \"react\";\n\nexport interface FontColorActionContext {\n    /*\n     * @desc Current selected color value\n     * */\n    value: string;\n\n    /*\n     * @desc Apply color to selected text.\n     * @params: value\n     */\n    applyColor: (value: string, themeColorName: string | undefined) => void;\n}\n\nexport const FontColorActionContext = React.createContext<FontColorActionContext | undefined>(\n    undefined\n);\n"],"names":["FontColorActionContext","React","undefined"],"mappings":";AAeO,MAAMA,yBAAyB,WAAHA,GAAGC,MAAAA,aAAmB,CACrDC"}

package/context/RichTextEditorContext.js

@@ -1,34 +1,31 @@
-import React, { createContext, useCallback, useMemo } from "react";
+import react, { createContext, useCallback, useMemo } from "react";
 import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
 import { Theme } from "@webiny/lexical-theme";
-export const RichTextEditorContext = /*#__PURE__*/createContext(undefined);
-export const RichTextEditorProvider = ({
-  theme,
-  toolbarActionPlugins = [],
-  children
-}) => {
-  const [editor] = useLexicalComposerContext();
-  const getOverlaysElement = useCallback(() => {
-    const rootElement = editor.getRootElement();
-    if (!rootElement) {
-      return document.body;
-    }
-    const shell = rootElement.closest(".editor-shell");
-    if (!shell) {
-      return document.body;
-    }
-    const overlays = shell.previousElementSibling;
-    return overlays ?? document.body;
-  }, [editor]);
-  const internalTheme = useMemo(() => new Theme(theme.colors, theme.typography, theme.tokens), [theme]);
-  return /*#__PURE__*/React.createElement(RichTextEditorContext.Provider, {
-    value: {
-      editor,
-      getOverlaysElement,
-      theme: internalTheme,
-      toolbarActionPlugins
-    }
-  }, children);
+const RichTextEditorContext = /*#__PURE__*/ createContext(void 0);
+const RichTextEditorProvider = ({ theme, toolbarActionPlugins = [], children })=>{
+    const [editor] = useLexicalComposerContext();
+    const getOverlaysElement = useCallback(()=>{
+        const rootElement = editor.getRootElement();
+        if (!rootElement) return document.body;
+        const shell = rootElement.closest(".editor-shell");
+        if (!shell) return document.body;
+        const overlays = shell.previousElementSibling;
+        return overlays ?? document.body;
+    }, [
+        editor
+    ]);
+    const internalTheme = useMemo(()=>new Theme(theme.colors, theme.typography, theme.tokens), [
+        theme
+    ]);
+    return /*#__PURE__*/ react.createElement(RichTextEditorContext.Provider, {
+        value: {
+            editor,
+            getOverlaysElement,
+            theme: internalTheme,
+            toolbarActionPlugins
+        }
+    }, children);
 };
+export { RichTextEditorContext, RichTextEditorProvider };
 
 //# sourceMappingURL=RichTextEditorContext.js.map

package/context/RichTextEditorContext.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","createContext","useCallback","useMemo","useLexicalComposerContext","Theme","RichTextEditorContext","undefined","RichTextEditorProvider","theme","toolbarActionPlugins","children","editor","getOverlaysElement","rootElement","getRootElement","document","body","shell","closest","overlays","previousElementSibling","internalTheme","colors","typography","tokens","createElement","Provider","value"],"sources":["RichTextEditorContext.tsx"],"sourcesContent":["import React, { createContext, useCallback, useMemo } from \"react\";\nimport type { LexicalEditor } from \"lexical\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { type EditorTheme, Theme } from \"@webiny/lexical-theme\";\nimport type { ToolbarActionPlugin } from \"~/types.js\";\n\nexport interface RichTextEditorContext {\n    editor: LexicalEditor;\n    getOverlaysElement: () => HTMLElement;\n    toolbarActionPlugins: ToolbarActionPlugin[];\n    theme: Theme;\n}\n\nexport const RichTextEditorContext = createContext<RichTextEditorContext | undefined>(undefined);\n\ninterface RichTextEditorProviderProps {\n    theme: EditorTheme;\n    toolbarActionPlugins?: ToolbarActionPlugin[];\n    children?: React.ReactNode | React.ReactNode[];\n}\n\nexport const RichTextEditorProvider = ({\n    theme,\n    toolbarActionPlugins = [],\n    children\n}: RichTextEditorProviderProps) => {\n    const [editor] = useLexicalComposerContext();\n\n    const getOverlaysElement = useCallback(() => {\n        const rootElement = editor.getRootElement();\n        if (!rootElement) {\n            return document.body;\n        }\n\n        const shell = rootElement.closest(\".editor-shell\");\n        if (!shell) {\n            return document.body;\n        }\n        const overlays = shell.previousElementSibling;\n\n        return (overlays ?? document.body) as HTMLElement;\n    }, [editor]);\n\n    const internalTheme = useMemo(\n        () => new Theme(theme.colors, theme.typography, theme.tokens),\n        [theme]\n    );\n\n    return (\n        <RichTextEditorContext.Provider\n            value={{\n                editor,\n                getOverlaysElement,\n                theme: internalTheme,\n                toolbarActionPlugins\n            }}\n        >\n            {children}\n        </RichTextEditorContext.Provider>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,aAAa,EAAEC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AAElE,SAASC,yBAAyB,QAAQ,uCAAuC;AACjF,SAA2BC,KAAK,QAAQ,uBAAuB;AAU/D,OAAO,MAAMC,qBAAqB,gBAAGL,aAAa,CAAoCM,SAAS,CAAC;AAQhG,OAAO,MAAMC,sBAAsB,GAAGA,CAAC;EACnCC,KAAK;EACLC,oBAAoB,GAAG,EAAE;EACzBC;AACyB,CAAC,KAAK;EAC/B,MAAM,CAACC,MAAM,CAAC,GAAGR,yBAAyB,CAAC,CAAC;EAE5C,MAAMS,kBAAkB,GAAGX,WAAW,CAAC,MAAM;IACzC,MAAMY,WAAW,GAAGF,MAAM,CAACG,cAAc,CAAC,CAAC;IAC3C,IAAI,CAACD,WAAW,EAAE;MACd,OAAOE,QAAQ,CAACC,IAAI;IACxB;IAEA,MAAMC,KAAK,GAAGJ,WAAW,CAACK,OAAO,CAAC,eAAe,CAAC;IAClD,IAAI,CAACD,KAAK,EAAE;MACR,OAAOF,QAAQ,CAACC,IAAI;IACxB;IACA,MAAMG,QAAQ,GAAGF,KAAK,CAACG,sBAAsB;IAE7C,OAAQD,QAAQ,IAAIJ,QAAQ,CAACC,IAAI;EACrC,CAAC,EAAE,CAACL,MAAM,CAAC,CAAC;EAEZ,MAAMU,aAAa,GAAGnB,OAAO,CACzB,MAAM,IAAIE,KAAK,CAACI,KAAK,CAACc,MAAM,EAAEd,KAAK,CAACe,UAAU,EAAEf,KAAK,CAACgB,MAAM,CAAC,EAC7D,CAAChB,KAAK,CACV,CAAC;EAED,oBACIT,KAAA,CAAA0B,aAAA,CAACpB,qBAAqB,CAACqB,QAAQ;IAC3BC,KAAK,EAAE;MACHhB,MAAM;MACNC,kBAAkB;MAClBJ,KAAK,EAAEa,aAAa;MACpBZ;IACJ;EAAE,GAEDC,QAC2B,CAAC;AAEzC,CAAC","ignoreList":[]}
+{"version":3,"file":"context/RichTextEditorContext.js","sources":["../../src/context/RichTextEditorContext.tsx"],"sourcesContent":["import React, { createContext, useCallback, useMemo } from \"react\";\nimport type { LexicalEditor } from \"lexical\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { type EditorTheme, Theme } from \"@webiny/lexical-theme\";\nimport type { ToolbarActionPlugin } from \"~/types.js\";\n\nexport interface RichTextEditorContext {\n    editor: LexicalEditor;\n    getOverlaysElement: () => HTMLElement;\n    toolbarActionPlugins: ToolbarActionPlugin[];\n    theme: Theme;\n}\n\nexport const RichTextEditorContext = createContext<RichTextEditorContext | undefined>(undefined);\n\ninterface RichTextEditorProviderProps {\n    theme: EditorTheme;\n    toolbarActionPlugins?: ToolbarActionPlugin[];\n    children?: React.ReactNode | React.ReactNode[];\n}\n\nexport const RichTextEditorProvider = ({\n    theme,\n    toolbarActionPlugins = [],\n    children\n}: RichTextEditorProviderProps) => {\n    const [editor] = useLexicalComposerContext();\n\n    const getOverlaysElement = useCallback(() => {\n        const rootElement = editor.getRootElement();\n        if (!rootElement) {\n            return document.body;\n        }\n\n        const shell = rootElement.closest(\".editor-shell\");\n        if (!shell) {\n            return document.body;\n        }\n        const overlays = shell.previousElementSibling;\n\n        return (overlays ?? document.body) as HTMLElement;\n    }, [editor]);\n\n    const internalTheme = useMemo(\n        () => new Theme(theme.colors, theme.typography, theme.tokens),\n        [theme]\n    );\n\n    return (\n        <RichTextEditorContext.Provider\n            value={{\n                editor,\n                getOverlaysElement,\n                theme: internalTheme,\n                toolbarActionPlugins\n            }}\n        >\n            {children}\n        </RichTextEditorContext.Provider>\n    );\n};\n"],"names":["RichTextEditorContext","createContext","undefined","RichTextEditorProvider","theme","toolbarActionPlugins","children","editor","useLexicalComposerContext","getOverlaysElement","useCallback","rootElement","document","shell","overlays","internalTheme","useMemo","Theme"],"mappings":";;;AAaO,MAAMA,wBAAwB,WAAHA,GAAGC,cAAiDC;AAQ/E,MAAMC,yBAAyB,CAAC,EACnCC,KAAK,EACLC,uBAAuB,EAAE,EACzBC,QAAQ,EACkB;IAC1B,MAAM,CAACC,OAAO,GAAGC;IAEjB,MAAMC,qBAAqBC,YAAY;QACnC,MAAMC,cAAcJ,OAAO,cAAc;QACzC,IAAI,CAACI,aACD,OAAOC,SAAS,IAAI;QAGxB,MAAMC,QAAQF,YAAY,OAAO,CAAC;QAClC,IAAI,CAACE,OACD,OAAOD,SAAS,IAAI;QAExB,MAAME,WAAWD,MAAM,sBAAsB;QAE7C,OAAQC,YAAYF,SAAS,IAAI;IACrC,GAAG;QAACL;KAAO;IAEX,MAAMQ,gBAAgBC,QAClB,IAAM,IAAIC,MAAMb,MAAM,MAAM,EAAEA,MAAM,UAAU,EAAEA,MAAM,MAAM,GAC5D;QAACA;KAAM;IAGX,OAAO,WAAP,GACI,oBAACJ,sBAAsB,QAAQ;QAC3B,OAAO;YACHO;YACAE;YACA,OAAOM;YACPV;QACJ;OAECC;AAGb"}

package/context/SharedHistoryContext.js

@@ -1,19 +1,15 @@
-import * as React from "react";
-import { createContext, useContext, useMemo } from "react";
 import { createEmptyHistoryState } from "@lexical/history";
-const Context = /*#__PURE__*/createContext({});
-export const SharedHistoryContext = ({
-  children
-}) => {
-  const historyContext = useMemo(() => ({
-    historyState: createEmptyHistoryState()
-  }), []);
-  return /*#__PURE__*/React.createElement(Context.Provider, {
-    value: historyContext
-  }, children);
-};
-export const useSharedHistoryContext = () => {
-  return useContext(Context);
+import * as __rspack_external_react from "react";
+const Context = /*#__PURE__*/ (0, __rspack_external_react.createContext)({});
+const SharedHistoryContext = ({ children })=>{
+    const historyContext = (0, __rspack_external_react.useMemo)(()=>({
+            historyState: createEmptyHistoryState()
+        }), []);
+    return /*#__PURE__*/ __rspack_external_react.createElement(Context.Provider, {
+        value: historyContext
+    }, children);
 };
+const useSharedHistoryContext = ()=>(0, __rspack_external_react.useContext)(Context);
+export { SharedHistoryContext, useSharedHistoryContext };
 
 //# sourceMappingURL=SharedHistoryContext.js.map

package/context/SharedHistoryContext.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","createContext","useContext","useMemo","createEmptyHistoryState","Context","SharedHistoryContext","children","historyContext","historyState","createElement","Provider","value","useSharedHistoryContext"],"sources":["SharedHistoryContext.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\nimport type { HistoryState } from \"@lexical/history\";\nimport { createEmptyHistoryState } from \"@lexical/history\";\n\ntype ContextShape = {\n    historyState?: HistoryState;\n};\n\nconst Context: React.Context<ContextShape> = createContext({});\n\nexport const SharedHistoryContext = ({ children }: { children: ReactNode }): React.JSX.Element => {\n    const historyContext = useMemo(() => ({ historyState: createEmptyHistoryState() }), []);\n    return <Context.Provider value={historyContext}>{children}</Context.Provider>;\n};\n\nexport const useSharedHistoryContext = (): ContextShape => {\n    return useContext(Context);\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,aAAa,EAAEC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAE1D,SAASC,uBAAuB,QAAQ,kBAAkB;AAM1D,MAAMC,OAAoC,gBAAGJ,aAAa,CAAC,CAAC,CAAC,CAAC;AAE9D,OAAO,MAAMK,oBAAoB,GAAGA,CAAC;EAAEC;AAAkC,CAAC,KAAwB;EAC9F,MAAMC,cAAc,GAAGL,OAAO,CAAC,OAAO;IAAEM,YAAY,EAAEL,uBAAuB,CAAC;EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;EACvF,oBAAOJ,KAAA,CAAAU,aAAA,CAACL,OAAO,CAACM,QAAQ;IAACC,KAAK,EAAEJ;EAAe,GAAED,QAA2B,CAAC;AACjF,CAAC;AAED,OAAO,MAAMM,uBAAuB,GAAGA,CAAA,KAAoB;EACvD,OAAOX,UAAU,CAACG,OAAO,CAAC;AAC9B,CAAC","ignoreList":[]}
+{"version":3,"file":"context/SharedHistoryContext.js","sources":["../../src/context/SharedHistoryContext.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\nimport type { HistoryState } from \"@lexical/history\";\nimport { createEmptyHistoryState } from \"@lexical/history\";\n\ntype ContextShape = {\n    historyState?: HistoryState;\n};\n\nconst Context: React.Context<ContextShape> = createContext({});\n\nexport const SharedHistoryContext = ({ children }: { children: ReactNode }): React.JSX.Element => {\n    const historyContext = useMemo(() => ({ historyState: createEmptyHistoryState() }), []);\n    return <Context.Provider value={historyContext}>{children}</Context.Provider>;\n};\n\nexport const useSharedHistoryContext = (): ContextShape => {\n    return useContext(Context);\n};\n"],"names":["Context","createContext","SharedHistoryContext","children","historyContext","useMemo","createEmptyHistoryState","useSharedHistoryContext","useContext"],"mappings":";;AAUA,MAAMA,UAAuCC,AAAhCD,WAAAA,GAAgCC,IAAAA,wBAAAA,aAAAA,AAAAA,EAAc,CAAC;AAErD,MAAMC,uBAAuB,CAAC,EAAEC,QAAQ,EAA2B;IACtE,MAAMC,iBAAiBC,AAAAA,IAAAA,wBAAAA,OAAAA,AAAAA,EAAQ,IAAO;YAAE,cAAcC;QAA0B,IAAI,EAAE;IACtF,OAAO,WAAP,GAAO,sCAACN,QAAQ,QAAQ;QAAC,OAAOI;OAAiBD;AACrD;AAEO,MAAMI,0BAA0B,IAC5BC,AAAAA,IAAAA,wBAAAA,UAAAA,AAAAA,EAAWR"}

package/context/TextAlignmentActionContextProps.js

@@ -1,4 +1,5 @@
-import React from "react";
-export const TextAlignmentActionContext = /*#__PURE__*/React.createContext(undefined);
+import react from "react";
+const TextAlignmentActionContext = /*#__PURE__*/ react.createContext(void 0);
+export { TextAlignmentActionContext };
 
 //# sourceMappingURL=TextAlignmentActionContextProps.js.map

package/context/TextAlignmentActionContextProps.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","TextAlignmentActionContext","createContext","undefined"],"sources":["TextAlignmentActionContextProps.tsx"],"sourcesContent":["import React from \"react\";\nimport type { ElementFormatType } from \"lexical\";\n\nexport interface TextAlignmentActionContextProps {\n    /*\n     * Selected text alignment value\n     * */\n    value: ElementFormatType;\n\n    /*\n     * Apply text alignment to selected text\n     */\n    applyTextAlignment: (value: ElementFormatType) => void;\n\n    outdentText: () => void;\n\n    indentText: () => void;\n}\n\nexport const TextAlignmentActionContext = React.createContext<\n    TextAlignmentActionContextProps | undefined\n>(undefined);\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAmBzB,OAAO,MAAMC,0BAA0B,gBAAGD,KAAK,CAACE,aAAa,CAE3DC,SAAS,CAAC","ignoreList":[]}
+{"version":3,"file":"context/TextAlignmentActionContextProps.js","sources":["../../src/context/TextAlignmentActionContextProps.tsx"],"sourcesContent":["import React from \"react\";\nimport type { ElementFormatType } from \"lexical\";\n\nexport interface TextAlignmentActionContextProps {\n    /*\n     * Selected text alignment value\n     * */\n    value: ElementFormatType;\n\n    /*\n     * Apply text alignment to selected text\n     */\n    applyTextAlignment: (value: ElementFormatType) => void;\n\n    outdentText: () => void;\n\n    indentText: () => void;\n}\n\nexport const TextAlignmentActionContext = React.createContext<\n    TextAlignmentActionContextProps | undefined\n>(undefined);\n"],"names":["TextAlignmentActionContext","React","undefined"],"mappings":";AAmBO,MAAMA,6BAA6B,WAAHA,GAAGC,MAAAA,aAAmB,CAE3DC"}

package/context/TypographyActionContext.js

@@ -1,4 +1,5 @@
-import React from "react";
-export const TypographyActionContext = /*#__PURE__*/React.createContext(undefined);
+import react from "react";
+const TypographyActionContext = /*#__PURE__*/ react.createContext(void 0);
+export { TypographyActionContext };
 
 //# sourceMappingURL=TypographyActionContext.js.map

package/context/TypographyActionContext.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","TypographyActionContext","createContext","undefined"],"sources":["TypographyActionContext.tsx"],"sourcesContent":["import React from \"react\";\nimport type { TypographyValue } from \"@webiny/lexical-theme\";\n\nexport type ActiveTypography = Pick<TypographyValue, \"id\" | \"label\">;\n\nexport interface TypographyActionContextProps {\n    /*\n     * @desc Current selected typography\n     * */\n    value: ActiveTypography | undefined;\n\n    /*\n     * @desc Apply font family to selected text.\n     * @params: value\n     */\n    applyTypography: (value: TypographyValue) => void;\n}\n\nexport const TypographyActionContext = React.createContext<\n    TypographyActionContextProps | undefined\n>(undefined);\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAkBzB,OAAO,MAAMC,uBAAuB,gBAAGD,KAAK,CAACE,aAAa,CAExDC,SAAS,CAAC","ignoreList":[]}
+{"version":3,"file":"context/TypographyActionContext.js","sources":["../../src/context/TypographyActionContext.tsx"],"sourcesContent":["import React from \"react\";\nimport type { TypographyValue } from \"@webiny/lexical-theme\";\n\nexport type ActiveTypography = Pick<TypographyValue, \"id\" | \"label\">;\n\nexport interface TypographyActionContextProps {\n    /*\n     * @desc Current selected typography\n     * */\n    value: ActiveTypography | undefined;\n\n    /*\n     * @desc Apply font family to selected text.\n     * @params: value\n     */\n    applyTypography: (value: TypographyValue) => void;\n}\n\nexport const TypographyActionContext = React.createContext<\n    TypographyActionContextProps | undefined\n>(undefined);\n"],"names":["TypographyActionContext","React","undefined"],"mappings":";AAkBO,MAAMA,0BAA0B,WAAHA,GAAGC,MAAAA,aAAmB,CAExDC"}

package/exports/admin/lexical.js

@@ -1,23 +1,5 @@
-// render
 export { LexicalHtmlRenderer } from "../../components/LexicalHtmlRenderer.js";
-// hooks
-export { getNodeFromSelection } from "../../hooks/index.js";
-export { useCurrentElement } from "../../hooks/index.js";
-export { useCurrentSelection } from "../../hooks/index.js";
-export { useDeriveValueFromSelection } from "../../hooks/index.js";
-export { useRichTextEditor } from "../../hooks/index.js";
-export { useFontColorPicker } from "../../hooks/index.js";
-export { useTextAlignmentAction } from "../../hooks/index.js";
-export { useTypographyAction } from "../../hooks/index.js";
-export { useIsMounted } from "../../hooks/index.js";
-// UI elements
+export { getNodeFromSelection, useCurrentElement, useCurrentSelection, useDeriveValueFromSelection, useFontColorPicker, useIsMounted, useRichTextEditor, useTextAlignmentAction, useTypographyAction } from "../../hooks/index.js";
 export { Divider } from "../../ui/Divider.js";
-export { DropDownItem } from "../../ui/DropDown.js";
-export { DropDown } from "../../ui/DropDown.js";
-
-// types
-
-// config
+export { DropDown, DropDownItem } from "../../ui/DropDown.js";
 export { LexicalEditorConfig, useLexicalEditorConfig } from "../../components/LexicalEditorConfig/LexicalEditorConfig.js";
-
-//# sourceMappingURL=lexical.js.map

package/hooks/index.js

@@ -5,5 +5,3 @@ export * from "./useTextAlignmentAction.js";
 export * from "./useCurrentSelection.js";
 export * from "./useCurrentElement.js";
 export * from "./useIsMounted.js";
-
-//# sourceMappingURL=index.js.map

package/hooks/useCurrentElement.js

@@ -1,26 +1,23 @@
-import { $isRootOrShadowRoot, $findMatchingParent } from "lexical";
+import { $findMatchingParent, $isRootOrShadowRoot } from "lexical";
 import { useDeriveValueFromSelection } from "./useCurrentSelection.js";
-export function useCurrentElement() {
-  return useDeriveValueFromSelection(({
-    rangeSelection
-  }) => {
-    if (!rangeSelection) {
-      return {
-        element: null
-      };
-    }
-    return {
-      element: getNodeFromSelection(rangeSelection)
-    };
-  });
+function useCurrentElement() {
+    return useDeriveValueFromSelection(({ rangeSelection })=>{
+        if (!rangeSelection) return {
+            element: null
+        };
+        return {
+            element: getNodeFromSelection(rangeSelection)
+        };
+    });
 }
-export function getNodeFromSelection(selection) {
-  const anchorNode = selection.anchor.getNode();
-  const element = anchorNode.getKey() === "root" ? anchorNode : $findMatchingParent(anchorNode, e => {
-    const parent = e.getParent();
-    return parent !== null && $isRootOrShadowRoot(parent);
-  });
-  return element || anchorNode.getTopLevelElementOrThrow();
+function getNodeFromSelection(selection) {
+    const anchorNode = selection.anchor.getNode();
+    const element = "root" === anchorNode.getKey() ? anchorNode : $findMatchingParent(anchorNode, (e)=>{
+        const parent = e.getParent();
+        return null !== parent && $isRootOrShadowRoot(parent);
+    });
+    return element || anchorNode.getTopLevelElementOrThrow();
 }
+export { getNodeFromSelection, useCurrentElement };
 
 //# sourceMappingURL=useCurrentElement.js.map

package/hooks/useCurrentElement.js.map

@@ -1 +1 @@
-{"version":3,"names":["$isRootOrShadowRoot","$findMatchingParent","useDeriveValueFromSelection","useCurrentElement","rangeSelection","element","getNodeFromSelection","selection","anchorNode","anchor","getNode","getKey","e","parent","getParent","getTopLevelElementOrThrow"],"sources":["useCurrentElement.ts"],"sourcesContent":["import type { RangeSelection } from \"lexical\";\nimport { $isRootOrShadowRoot, $findMatchingParent } from \"lexical\";\nimport { useDeriveValueFromSelection } from \"~/hooks/useCurrentSelection.js\";\n\nexport function useCurrentElement() {\n    return useDeriveValueFromSelection(({ rangeSelection }) => {\n        if (!rangeSelection) {\n            return { element: null };\n        }\n\n        return { element: getNodeFromSelection(rangeSelection) };\n    });\n}\n\nexport function getNodeFromSelection(selection: RangeSelection) {\n    const anchorNode = selection.anchor.getNode();\n\n    const element =\n        anchorNode.getKey() === \"root\"\n            ? anchorNode\n            : $findMatchingParent(anchorNode, e => {\n                  const parent = e.getParent();\n                  return parent !== null && $isRootOrShadowRoot(parent);\n              });\n\n    return element || anchorNode.getTopLevelElementOrThrow();\n}\n"],"mappings":"AACA,SAASA,mBAAmB,EAAEC,mBAAmB,QAAQ,SAAS;AAClE,SAASC,2BAA2B;AAEpC,OAAO,SAASC,iBAAiBA,CAAA,EAAG;EAChC,OAAOD,2BAA2B,CAAC,CAAC;IAAEE;EAAe,CAAC,KAAK;IACvD,IAAI,CAACA,cAAc,EAAE;MACjB,OAAO;QAAEC,OAAO,EAAE;MAAK,CAAC;IAC5B;IAEA,OAAO;MAAEA,OAAO,EAAEC,oBAAoB,CAACF,cAAc;IAAE,CAAC;EAC5D,CAAC,CAAC;AACN;AAEA,OAAO,SAASE,oBAAoBA,CAACC,SAAyB,EAAE;EAC5D,MAAMC,UAAU,GAAGD,SAAS,CAACE,MAAM,CAACC,OAAO,CAAC,CAAC;EAE7C,MAAML,OAAO,GACTG,UAAU,CAACG,MAAM,CAAC,CAAC,KAAK,MAAM,GACxBH,UAAU,GACVP,mBAAmB,CAACO,UAAU,EAAEI,CAAC,IAAI;IACjC,MAAMC,MAAM,GAAGD,CAAC,CAACE,SAAS,CAAC,CAAC;IAC5B,OAAOD,MAAM,KAAK,IAAI,IAAIb,mBAAmB,CAACa,MAAM,CAAC;EACzD,CAAC,CAAC;EAEZ,OAAOR,OAAO,IAAIG,UAAU,CAACO,yBAAyB,CAAC,CAAC;AAC5D","ignoreList":[]}
+{"version":3,"file":"hooks/useCurrentElement.js","sources":["../../src/hooks/useCurrentElement.ts"],"sourcesContent":["import type { RangeSelection } from \"lexical\";\nimport { $isRootOrShadowRoot, $findMatchingParent } from \"lexical\";\nimport { useDeriveValueFromSelection } from \"~/hooks/useCurrentSelection.js\";\n\nexport function useCurrentElement() {\n    return useDeriveValueFromSelection(({ rangeSelection }) => {\n        if (!rangeSelection) {\n            return { element: null };\n        }\n\n        return { element: getNodeFromSelection(rangeSelection) };\n    });\n}\n\nexport function getNodeFromSelection(selection: RangeSelection) {\n    const anchorNode = selection.anchor.getNode();\n\n    const element =\n        anchorNode.getKey() === \"root\"\n            ? anchorNode\n            : $findMatchingParent(anchorNode, e => {\n                  const parent = e.getParent();\n                  return parent !== null && $isRootOrShadowRoot(parent);\n              });\n\n    return element || anchorNode.getTopLevelElementOrThrow();\n}\n"],"names":["useCurrentElement","useDeriveValueFromSelection","rangeSelection","getNodeFromSelection","selection","anchorNode","element","$findMatchingParent","e","parent","$isRootOrShadowRoot"],"mappings":";;AAIO,SAASA;IACZ,OAAOC,4BAA4B,CAAC,EAAEC,cAAc,EAAE;QAClD,IAAI,CAACA,gBACD,OAAO;YAAE,SAAS;QAAK;QAG3B,OAAO;YAAE,SAASC,qBAAqBD;QAAgB;IAC3D;AACJ;AAEO,SAASC,qBAAqBC,SAAyB;IAC1D,MAAMC,aAAaD,UAAU,MAAM,CAAC,OAAO;IAE3C,MAAME,UACFD,AAAwB,WAAxBA,WAAW,MAAM,KACXA,aACAE,oBAAoBF,YAAYG,CAAAA;QAC5B,MAAMC,SAASD,EAAE,SAAS;QAC1B,OAAOC,AAAW,SAAXA,UAAmBC,oBAAoBD;IAClD;IAEV,OAAOH,WAAWD,WAAW,yBAAyB;AAC1D"}