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

package/components/Editor/RichTextEditor.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_emotion","_LexicalComposer","_LexicalOnChangePlugin","_LexicalAutoFocusPlugin","_LexicalClearEditorPlugin","_LexicalRichTextPlugin","_LexicalErrorBoundary","_interopRequireDefault","_reactComposition","_LexicalHistoryPlugin","_LexicalContentEditable","_RichTextEditorContext","_isValidLexicalData","_LexicalUpdateStatePlugin","_BlurEventPlugin","_Placeholder","_generateInitialLexicalValue","_lexicalTheme","_lexicalNodes","_SharedHistoryContext","_LexicalEditorConfig","_excluded","BaseRichTextEditor","_ref","toolbar","staticToolbar","onChange","value","nodes","placeholder","children","onBlur","focus","styles","width","height","contentEditableStyles","placeholderStyles","props","_objectWithoutProperties2","default","themeEmotionMap","toTypographyEmotionMap","css","theme","themeStylesTransformer","editorTheme","useRef","createTheme","config","useLexicalEditorConfig","_useSharedHistoryCont","useSharedHistoryContext","historyState","placeholderElem","createElement","Placeholder","scrollRef","_useState","useState","undefined","_useState2","_slicedToArray2","floatingAnchorElem","setFloatingAnchorElem","onRef","_floatingAnchorElem","sizeStyle","configNodes","map","node","configPlugins","plugins","plugin","Fragment","key","name","element","editorValue","isValidLexicalData","generateInitialLexicalValue","initialConfig","editorState","namespace","onError","concat","_toConsumableArray2","allNodes","_objectSpread2","current","emotionMap","handleOnChange","editor","read","getEditorState","JSON","stringify","toJSON","SharedHistoryContext","LexicalComposer","length","RichTextEditorProvider","toolbarActionPlugins","className","ref","style","overflow","position","OnChangePlugin","UpdateStatePlugin","ClearEditorPlugin","HistoryPlugin","externalHistoryState","BlurEventPlugin","AutoFocusPlugin","RichTextPlugin","contentEditable","ContentEditable","outline","ErrorBoundary","LexicalErrorBoundary","RichTextEditor","exports","makeDecoratable","LexicalEditorWithConfig"],"sources":["RichTextEditor.tsx"],"sourcesContent":["import React, { Fragment, useRef, useState } from \"react\";\nimport { css } from \"emotion\";\nimport { CSSObject } from \"@emotion/react\";\nimport { Klass, LexicalEditor, LexicalNode } from \"lexical\";\nimport { EditorState } from \"lexical/LexicalEditorState\";\nimport { LexicalComposer } from \"@lexical/react/LexicalComposer\";\nimport { OnChangePlugin } from \"@lexical/react/LexicalOnChangePlugin\";\nimport { AutoFocusPlugin } from \"@lexical/react/LexicalAutoFocusPlugin\";\nimport { ClearEditorPlugin } from \"@lexical/react/LexicalClearEditorPlugin\";\nimport { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\nimport LexicalErrorBoundary from \"@lexical/react/LexicalErrorBoundary\";\nimport { makeDecoratable } from \"@webiny/react-composition\";\nimport { HistoryPlugin } from \"@lexical/react/LexicalHistoryPlugin\";\nimport { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\nimport { RichTextEditorProvider } from \"~/context/RichTextEditorContext\";\nimport { isValidLexicalData } from \"~/utils/isValidLexicalData\";\nimport { UpdateStatePlugin } from \"~/plugins/LexicalUpdateStatePlugin\";\nimport { BlurEventPlugin } from \"~/plugins/BlurEventPlugin/BlurEventPlugin\";\nimport { LexicalValue, ToolbarActionPlugin } from \"~/types\";\nimport { Placeholder } from \"~/ui/Placeholder\";\nimport { generateInitialLexicalValue } from \"~/utils/generateInitialLexicalValue\";\nimport {\n    createTheme,\n    WebinyTheme,\n    ThemeEmotionMap,\n    toTypographyEmotionMap\n} from \"@webiny/lexical-theme\";\nimport { allNodes } from \"@webiny/lexical-nodes\";\nimport { SharedHistoryContext, useSharedHistoryContext } from \"~/context/SharedHistoryContext\";\nimport {\n    LexicalEditorWithConfig,\n    useLexicalEditorConfig\n} from \"~/components/LexicalEditorConfig/LexicalEditorConfig\";\n\nexport interface RichTextEditorProps {\n    children?: React.ReactNode | React.ReactNode[];\n    classes?: string;\n    contentEditableStyles?: React.CSSProperties;\n    focus?: boolean;\n    height?: number | string;\n    nodes?: Klass<LexicalNode>[];\n    onBlur?: (editorState: LexicalValue) => void;\n    onChange?: (json: LexicalValue) => void;\n    placeholder?: string;\n    placeholderStyles?: React.CSSProperties;\n    staticToolbar?: React.ReactNode;\n    styles?: React.CSSProperties;\n    tag?: string;\n    theme: WebinyTheme;\n    themeEmotionMap?: ThemeEmotionMap;\n    toolbarActionPlugins?: ToolbarActionPlugin[];\n    themeStylesTransformer?: (cssObject: Record<string, any>) => CSSObject;\n    toolbar?: React.ReactNode;\n    value: LexicalValue | null;\n    width?: number | string;\n}\n\nconst BaseRichTextEditor = ({\n    toolbar,\n    staticToolbar,\n    onChange,\n    value,\n    nodes,\n    placeholder,\n    children,\n    onBlur,\n    focus,\n    styles,\n    width,\n    height,\n    contentEditableStyles,\n    placeholderStyles,\n    ...props\n}: RichTextEditorProps) => {\n    const themeEmotionMap =\n        props.themeEmotionMap ??\n        toTypographyEmotionMap(css, props.theme, props.themeStylesTransformer);\n\n    const editorTheme = useRef(createTheme());\n    const config = useLexicalEditorConfig();\n    const { historyState } = useSharedHistoryContext();\n    const placeholderElem = (\n        <Placeholder styles={placeholderStyles}>{placeholder || \"Enter text...\"}</Placeholder>\n    );\n    const scrollRef = useRef(null);\n    const [floatingAnchorElem, setFloatingAnchorElem] = useState<HTMLElement | undefined>(\n        undefined\n    );\n    const onRef = (_floatingAnchorElem: HTMLDivElement) => {\n        if (_floatingAnchorElem !== null) {\n            setFloatingAnchorElem(_floatingAnchorElem);\n        }\n    };\n\n    const sizeStyle = {\n        height: height || \"\",\n        width: width || \"\"\n    };\n\n    const configNodes = config.nodes.map(node => node.node);\n    const configPlugins = config.plugins.map(plugin => (\n        <Fragment key={plugin.name}>{plugin.element}</Fragment>\n    ));\n\n    const editorValue = isValidLexicalData(value) ? value : generateInitialLexicalValue();\n\n    const initialConfig = {\n        // We update the state via the `<LexicalUpdateStatePlugin/>`.\n        editorState: null,\n        namespace: \"webiny\",\n        onError: () => {\n            // Ignore errors. We don't want to break the app because of errors caused by config/value updates.\n            // These are usually resolved in the next component render cycle.\n        },\n        nodes: [...allNodes, ...configNodes, ...(nodes || [])],\n        theme: { ...editorTheme.current, emotionMap: themeEmotionMap }\n    };\n\n    function handleOnChange(editorState: EditorState, editor: LexicalEditor) {\n        editorState.read(() => {\n            if (typeof onChange === \"function\") {\n                const editorState = editor.getEditorState();\n                onChange(JSON.stringify(editorState.toJSON()));\n            }\n        });\n    }\n\n    return (\n        /**\n         * Once the LexicalComposer is mounted, it caches the `initialConfig` internally, and all future\n         * updates to the config will be ignored. This is a problem because we pull in Nodes from our config,\n         * and initially, there can be multiple re-renders, while the config object is settled.\n         *\n         * To bypass this issue, we generate a naive `key` based on the number of Nodes.\n         */\n        <SharedHistoryContext>\n            <LexicalComposer initialConfig={initialConfig} key={initialConfig.nodes.length}>\n                <RichTextEditorProvider\n                    theme={props.theme}\n                    themeEmotionMap={themeEmotionMap}\n                    toolbarActionPlugins={props.toolbarActionPlugins}\n                >\n                    {staticToolbar && staticToolbar}\n                    <div\n                        /* This className is necessary for targeting of editor container from CSS files. */\n                        className={\"editor-shell\"}\n                        ref={scrollRef}\n                        style={{ ...styles, ...sizeStyle, overflow: \"auto\", position: \"relative\" }}\n                    >\n                        {/* State plugins. */}\n                        <OnChangePlugin onChange={handleOnChange} />\n                        <UpdateStatePlugin value={editorValue} />\n                        <ClearEditorPlugin />\n                        <HistoryPlugin externalHistoryState={historyState} />\n                        {/* Event plugins. */}\n                        {onBlur && <BlurEventPlugin onBlur={onBlur} />}\n                        {focus && <AutoFocusPlugin />}\n                        {/* External plugins and components. */}\n                        {configPlugins}\n                        {children}\n                        <RichTextPlugin\n                            contentEditable={\n                                <div className=\"editor-scroller\" style={{ ...sizeStyle }}>\n                                    <div className=\"editor\" ref={onRef}>\n                                        <ContentEditable\n                                            style={{ outline: 0, ...contentEditableStyles }}\n                                        />\n                                    </div>\n                                </div>\n                            }\n                            placeholder={placeholderElem}\n                            ErrorBoundary={LexicalErrorBoundary}\n                        />\n                        {/* Toolbar. */}\n                        {floatingAnchorElem && toolbar}\n                    </div>\n                </RichTextEditorProvider>\n            </LexicalComposer>\n        </SharedHistoryContext>\n    );\n};\n\n/**\n * @description Main editor container\n */\nexport const RichTextEditor = makeDecoratable(\"RichTextEditor\", (props: RichTextEditorProps) => {\n    return (\n        <LexicalEditorWithConfig>\n            <BaseRichTextEditor {...props} />\n        </LexicalEditorWithConfig>\n    );\n});\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","Fragment","useId","useRef","useState","LexicalComposer","AutoFocusPlugin","ClearEditorPlugin","RichTextPlugin","LexicalErrorBoundary","makeDecoratable","HistoryPlugin","ContentEditable","allNodes","RichTextEditorProvider","BlurEventPlugin","Placeholder","SharedHistoryContext","useSharedHistoryContext","LexicalEditorWithConfig","useLexicalEditorConfig","StateHandlingPlugin","BaseRichTextEditor","onChange","toolbar","staticToolbar","nodes","placeholder","children","onBlur","focus","styles","width","height","contentEditableStyles","placeholderStyles","props","editorTheme","theme","config","historyState","placeholderElem","createElement","scrollRef","floatingAnchorElem","setFloatingAnchorElem","undefined","onRef","_floatingAnchorElem","sizeStyle","configNodes","map","node","configPlugins","plugins","plugin","key","name","element","initialConfig","editorId","namespace","onError","current","tokens","$colors","colors","$typography","typography","$cacheKey","JSON","stringify","configRef","length","toolbarActionPlugins","className","ref","style","overflow","position","value","externalHistoryState","contentEditable","outline","ErrorBoundary","RichTextEditor"],"sources":["RichTextEditor.tsx"],"sourcesContent":["import React, { Fragment, useId, useRef, useState } from \"react\";\nimport type { Klass, LexicalNode } from \"lexical\";\nimport { LexicalComposer } from \"@lexical/react/LexicalComposer\";\nimport { AutoFocusPlugin } from \"@lexical/react/LexicalAutoFocusPlugin\";\nimport { ClearEditorPlugin } from \"@lexical/react/LexicalClearEditorPlugin\";\nimport { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\nimport { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\nimport { makeDecoratable } from \"@webiny/react-composition\";\nimport { HistoryPlugin } from \"@lexical/react/LexicalHistoryPlugin\";\nimport { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\nimport type { EditorTheme } from \"@webiny/lexical-theme\";\nimport { allNodes } from \"@webiny/lexical-nodes\";\nimport { RichTextEditorProvider } from \"~/context/RichTextEditorContext.js\";\nimport { BlurEventPlugin } from \"~/plugins/BlurEventPlugin/BlurEventPlugin.js\";\nimport type { LexicalValue, ToolbarActionPlugin } from \"~/types.js\";\nimport { Placeholder } from \"~/ui/Placeholder.js\";\nimport { SharedHistoryContext, useSharedHistoryContext } from \"~/context/SharedHistoryContext.js\";\nimport {\n    LexicalEditorWithConfig,\n    useLexicalEditorConfig\n} from \"~/components/LexicalEditorConfig/LexicalEditorConfig.js\";\nimport { StateHandlingPlugin } from \"~/plugins/StateHandlingPlugin.js\";\n\nexport type InitialEditorConfig = React.ComponentProps<typeof LexicalComposer>[\"initialConfig\"] & {\n    editorId: string;\n};\n\nexport interface RichTextEditorProps {\n    children?: React.ReactNode | React.ReactNode[];\n    classes?: string;\n    contentEditableStyles?: React.CSSProperties;\n    focus?: boolean;\n    height?: number | string;\n    nodes?: Klass<LexicalNode>[];\n    onBlur?: (editorState: LexicalValue) => void;\n    onChange?: (value: LexicalValue) => void;\n    placeholder?: string;\n    placeholderStyles?: React.CSSProperties;\n    staticToolbar?: React.ReactNode;\n    styles?: React.CSSProperties;\n    tag?: string;\n    theme: EditorTheme;\n    toolbarActionPlugins?: ToolbarActionPlugin[];\n    toolbar?: React.ReactNode;\n    value: LexicalValue | null | undefined;\n    configRef?: React.MutableRefObject<InitialEditorConfig | undefined>;\n    width?: number | string;\n}\n\nconst BaseRichTextEditor = ({\n    onChange,\n    toolbar,\n    staticToolbar,\n    nodes,\n    placeholder,\n    children,\n    onBlur,\n    focus,\n    styles,\n    width,\n    height,\n    contentEditableStyles,\n    placeholderStyles,\n    ...props\n}: RichTextEditorProps) => {\n    const editorTheme = useRef(props.theme);\n    const config = useLexicalEditorConfig();\n    const { historyState } = useSharedHistoryContext();\n    const placeholderElem = (\n        <Placeholder styles={placeholderStyles}>{placeholder || \"Enter text...\"}</Placeholder>\n    );\n    const scrollRef = useRef(null);\n\n    const [floatingAnchorElem, setFloatingAnchorElem] = useState<HTMLElement | undefined>(\n        undefined\n    );\n    const onRef = (_floatingAnchorElem: HTMLDivElement) => {\n        if (_floatingAnchorElem !== null) {\n            setFloatingAnchorElem(_floatingAnchorElem);\n        }\n    };\n\n    const sizeStyle = {\n        height: height || \"\",\n        width: width || \"\"\n    };\n\n    const configNodes = config.nodes.map(node => node.node);\n    const configPlugins = config.plugins.map(plugin => (\n        <Fragment key={plugin.name}>{plugin.element}</Fragment>\n    ));\n\n    const initialConfig = {\n        editorId: useId(),\n        namespace: \"webiny\",\n        onError: () => {\n            // Ignore errors. We don't want to break the app because of errors caused by config/value updates.\n            // These are usually resolved in the next component render cycle.\n        },\n        nodes: [...allNodes, ...configNodes, ...(nodes || [])],\n        theme: {\n            ...editorTheme.current.tokens,\n            // I'm not aware of a better way to pass custom data to nodes.\n            // For now, we're using Lexical's theme to pass colors and typography.\n            $colors: editorTheme.current.colors,\n            $typography: editorTheme.current.typography,\n            $cacheKey: JSON.stringify(editorTheme.current)\n        }\n    };\n\n    if (props.configRef) {\n        props.configRef.current = initialConfig;\n    }\n\n    return (\n        /**\n         * Once the LexicalComposer is mounted, it caches the `initialConfig` internally, and all future\n         * updates to the config will be ignored. This is a problem because we pull in Nodes from our config,\n         * and initially, there can be multiple re-renders, while the config object is settled.\n         *\n         * To bypass this issue, we generate a naive `key` based on the number of Nodes.\n         */\n        <SharedHistoryContext>\n            <LexicalComposer initialConfig={initialConfig} key={initialConfig.nodes.length}>\n                <RichTextEditorProvider\n                    theme={props.theme}\n                    toolbarActionPlugins={props.toolbarActionPlugins}\n                >\n                    {staticToolbar ? staticToolbar : null}\n                    <div data-role={\"overlays\"} className={\"relative\"}></div>\n                    <div\n                        /* This className is necessary for targeting of editor container from CSS files. */\n                        className={\"editor-shell\"}\n                        ref={scrollRef}\n                        style={{\n                            ...styles,\n                            ...sizeStyle,\n                            overflow: \"auto\",\n                            position: \"relative\"\n                        }}\n                    >\n                        {/* State plugins. */}\n                        <StateHandlingPlugin value={props.value} onChange={onChange} />\n                        <ClearEditorPlugin />\n                        <HistoryPlugin externalHistoryState={historyState} />\n                        {/* Event plugins. */}\n                        {onBlur && <BlurEventPlugin onBlur={onBlur} />}\n                        {focus && <AutoFocusPlugin />}\n                        {/* External plugins and components. */}\n                        {configPlugins}\n                        {children}\n                        <RichTextPlugin\n                            contentEditable={\n                                <div className=\"editor-scroller\" style={{ ...sizeStyle }}>\n                                    <div className=\"editor\" ref={onRef}>\n                                        <ContentEditable\n                                            style={{ outline: 0, ...contentEditableStyles }}\n                                        />\n                                    </div>\n                                </div>\n                            }\n                            placeholder={placeholderElem}\n                            ErrorBoundary={LexicalErrorBoundary}\n                        />\n                        {/* Toolbar. */}\n                        {floatingAnchorElem && toolbar}\n                    </div>\n                </RichTextEditorProvider>\n            </LexicalComposer>\n        </SharedHistoryContext>\n    );\n};\n\n/**\n * @description Main editor container\n */\nexport const RichTextEditor = makeDecoratable(\"RichTextEditor\", (props: RichTextEditorProps) => {\n    return (\n        <LexicalEditorWithConfig>\n            <BaseRichTextEditor {...props} />\n        </LexicalEditorWithConfig>\n    );\n});\n\nexport namespace RichTextEditor {\n    export type InitialConfig = InitialEditorConfig;\n}\n"],"mappings":"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","ignoreList":[]}

package/components/Editor/normalizeInputValue.d.ts

@@ -0,0 +1,6 @@
+import type { LexicalValue, NormalizedInputValue } from "../../types.js";
+/**
+ * Value passed to the `RichTextEditor` component can be anything. This function normalizes some of the more common shapes
+ * of input into a value that is either a `null` or a `LexicalValue`.
+ */
+export declare function normalizeInputValue(value: LexicalValue | null | undefined): NormalizedInputValue;

package/components/Editor/normalizeInputValue.js

@@ -0,0 +1,16 @@
+const isValueEmpty = value => {
+  return [undefined, null, "", '""', "null"].includes(value);
+};
+
+/**
+ * Value passed to the `RichTextEditor` component can be anything. This function normalizes some of the more common shapes
+ * of input into a value that is either a `null` or a `LexicalValue`.
+ */
+export function normalizeInputValue(value) {
+  if (isValueEmpty(value)) {
+    return null;
+  }
+  return value;
+}
+
+//# sourceMappingURL=normalizeInputValue.js.map

package/components/Editor/normalizeInputValue.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["isValueEmpty","value","undefined","includes","normalizeInputValue"],"sources":["normalizeInputValue.ts"],"sourcesContent":["import type { LexicalValue, NormalizedInputValue } from \"~/types.js\";\n\nconst isValueEmpty = (value: any) => {\n    return [undefined, null, \"\", '\"\"', \"null\"].includes(value);\n};\n\n/**\n * Value passed to the `RichTextEditor` component can be anything. This function normalizes some of the more common shapes\n * of input into a value that is either a `null` or a `LexicalValue`.\n */\nexport function normalizeInputValue(value: LexicalValue | null | undefined) {\n    if (isValueEmpty(value)) {\n        return null;\n    }\n\n    return value as NormalizedInputValue;\n}\n"],"mappings":"AAEA,MAAMA,YAAY,GAAIC,KAAU,IAAK;EACjC,OAAO,CAACC,SAAS,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,EAAE,MAAM,CAAC,CAACC,QAAQ,CAACF,KAAK,CAAC;AAC9D,CAAC;;AAED;AACA;AACA;AACA;AACA,OAAO,SAASG,mBAAmBA,CAACH,KAAsC,EAAE;EACxE,IAAID,YAAY,CAACC,KAAK,CAAC,EAAE;IACrB,OAAO,IAAI;EACf;EAEA,OAAOA,KAAK;AAChB","ignoreList":[]}

package/components/LexicalEditorConfig/LexicalEditorConfig.d.ts

@@ -1,20 +1,18 @@
-import React from "react";
-import { ToolbarElementConfig } from "./components/ToolbarElement";
-import { PluginConfig } from "./components/Plugin";
-import { NodeConfig } from "./components/Node";
-export declare const LexicalEditorConfig: {
-    ({ children }: {
-        children: React.ReactNode;
-    }): React.JSX.Element;
-    ToolbarElement: ({ name, element, after, before, remove }: import("./components/ToolbarElement").ToolbarElementProps) => React.JSX.Element;
-    Plugin: ({ name, element, after, before, remove }: import("./components/Plugin").PluginProps) => React.JSX.Element;
-    Node: ({ name, node, after, before, remove }: import("./components/Node").NodeProps) => React.JSX.Element;
+import type { ToolbarElementConfig } from "./components/ToolbarElement.js";
+import type { PluginConfig } from "./components/Plugin.js";
+import type { NodeConfig } from "./components/Node.js";
+export type { ToolbarElementConfig } from "./components/ToolbarElement.js";
+export type { PluginConfig } from "./components/Plugin.js";
+export type { NodeConfig } from "./components/Node.js";
+export declare const LexicalEditorConfig: (({ priority, children }: import("@webiny/react-properties").ConfigProps) => React.JSX.Element) & {
+    ToolbarElement: ({ name, element, after, before, remove }: import("./components/ToolbarElement.js").ToolbarElementProps) => import("react").JSX.Element;
+    Plugin: ({ name, element, after, before, remove }: import("./components/Plugin.js").PluginProps) => import("react").JSX.Element;
+    Node: ({ name, node, after, before, remove }: import("./components/Node.js").NodeProps) => import("react").JSX.Element;
 };
-export declare const LexicalEditorWithConfig: ({ children }: {
-    children: React.ReactNode;
-}) => React.JSX.Element;
-export declare function useLexicalEditorConfig(): {
+export declare const LexicalEditorWithConfig: ({ onProperties, children }: import("@webiny/react-properties").WithConfigProps) => React.JSX.Element;
+interface LexicalEditorConfigData {
     toolbarElements: ToolbarElementConfig[];
     plugins: PluginConfig[];
     nodes: NodeConfig[];
-};
+}
+export declare function useLexicalEditorConfig(): LexicalEditorConfigData;

package/components/LexicalEditorConfig/LexicalEditorConfig.js

@@ -1,73 +1,25 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.LexicalEditorWithConfig = exports.LexicalEditorConfig = void 0;
-exports.useLexicalEditorConfig = useLexicalEditorConfig;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactComposition = require("@webiny/react-composition");
-var _reactProperties = require("@webiny/react-properties");
-var _ToolbarElement = require("./components/ToolbarElement");
-var _Plugin = require("./components/Plugin");
-var _Node = require("./components/Node");
-var LexicalEditorConfigApply = (0, _reactComposition.makeDecoratable)("LexicalEditorConfigApply", function (_ref) {
-  var children = _ref.children;
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children);
-});
-var createHOC = function createHOC(newChildren) {
-  return function (BaseComponent) {
-    return function ConfigHOC(_ref2) {
-      var children = _ref2.children;
-      return /*#__PURE__*/_react.default.createElement(BaseComponent, null, newChildren, children);
-    };
-  };
-};
-var LexicalEditorConfig = exports.LexicalEditorConfig = function LexicalEditorConfig(_ref3) {
-  var children = _ref3.children;
-  return /*#__PURE__*/_react.default.createElement(_reactComposition.Compose, {
-    component: LexicalEditorConfigApply,
-    with: createHOC(children)
-  });
-};
-LexicalEditorConfig.ToolbarElement = _ToolbarElement.ToolbarElement;
-LexicalEditorConfig.Plugin = _Plugin.Plugin;
-LexicalEditorConfig.Node = _Node.Node;
-var ViewContext = /*#__PURE__*/_react.default.createContext({
-  properties: []
+import { useMemo } from "react";
+import { createConfigurableComponent } from "@webiny/react-properties";
+import { ToolbarElement } from "./components/ToolbarElement.js";
+import { Plugin } from "./components/Plugin.js";
+import { Node } from "./components/Node.js";
+const base = createConfigurableComponent("LexicalEditor");
+export const LexicalEditorConfig = Object.assign(base.Config, {
+  ToolbarElement,
+  Plugin,
+  Node
 });
-var LexicalEditorWithConfig = exports.LexicalEditorWithConfig = function LexicalEditorWithConfig(_ref4) {
-  var children = _ref4.children;
-  var _useState = (0, _react.useState)([]),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    properties = _useState2[0],
-    setProperties = _useState2[1];
-  var context = {
-    properties: properties
-  };
-  var stateUpdater = function stateUpdater(properties) {
-    setProperties(properties);
-  };
-  return /*#__PURE__*/_react.default.createElement(ViewContext.Provider, {
-    value: context
-  }, /*#__PURE__*/_react.default.createElement(_reactProperties.Properties, {
-    onChange: stateUpdater
-  }, /*#__PURE__*/_react.default.createElement(LexicalEditorConfigApply, null), children));
-};
-function useLexicalEditorConfig() {
-  var _useContext = (0, _react.useContext)(ViewContext),
-    properties = _useContext.properties;
-  var config = (0, _react.useMemo)(function () {
-    return (0, _reactProperties.toObject)(properties);
-  }, [properties]);
-  return {
-    toolbarElements: config.toolbarElements || [],
-    plugins: config.plugins || [],
-    nodes: config.nodes || []
-  };
+export const LexicalEditorWithConfig = base.WithConfig;
+export function useLexicalEditorConfig() {
+  const config = base.useConfig();
+  const toolbarElements = config.toolbarElements || [];
+  const plugins = config.plugins || [];
+  const nodes = config.nodes || [];
+  return useMemo(() => ({
+    toolbarElements: [...toolbarElements],
+    plugins: [...plugins],
+    nodes: [...nodes]
+  }), [config]);
 }
 
 //# sourceMappingURL=LexicalEditorConfig.js.map

package/components/LexicalEditorConfig/LexicalEditorConfig.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_reactComposition","_reactProperties","_ToolbarElement","_Plugin","_Node","LexicalEditorConfigApply","makeDecoratable","_ref","children","default","createElement","Fragment","createHOC","newChildren","BaseComponent","ConfigHOC","_ref2","LexicalEditorConfig","exports","_ref3","Compose","component","with","ToolbarElement","Plugin","Node","ViewContext","React","createContext","properties","LexicalEditorWithConfig","_ref4","_useState","useState","_useState2","_slicedToArray2","setProperties","context","stateUpdater","Provider","value","Properties","onChange","useLexicalEditorConfig","_useContext","useContext","config","useMemo","toObject","toolbarElements","plugins","nodes"],"sources":["LexicalEditorConfig.tsx"],"sourcesContent":["import React, { useContext, useMemo, useState } from \"react\";\nimport { makeDecoratable, Compose, Decorator, GenericComponent } from \"@webiny/react-composition\";\nimport { Property, Properties, toObject } from \"@webiny/react-properties\";\nimport { ToolbarElement, ToolbarElementConfig } from \"./components/ToolbarElement\";\nimport { Plugin, PluginConfig } from \"./components/Plugin\";\nimport { Node, NodeConfig } from \"./components/Node\";\n\nconst LexicalEditorConfigApply = makeDecoratable(\"LexicalEditorConfigApply\", ({ children }) => {\n    return <>{children}</>;\n});\n\nconst createHOC =\n    (newChildren: React.ReactNode): Decorator<GenericComponent> =>\n    BaseComponent => {\n        return function ConfigHOC({ children }) {\n            return (\n                <BaseComponent>\n                    {newChildren}\n                    {children}\n                </BaseComponent>\n            );\n        };\n    };\n\nexport const LexicalEditorConfig = ({ children }: { children: React.ReactNode }) => {\n    return <Compose component={LexicalEditorConfigApply} with={createHOC(children)} />;\n};\n\nLexicalEditorConfig.ToolbarElement = ToolbarElement;\nLexicalEditorConfig.Plugin = Plugin;\nLexicalEditorConfig.Node = Node;\n\ninterface ViewContext {\n    properties: Property[];\n}\n\nconst ViewContext = React.createContext<ViewContext>({ properties: [] });\n\nexport const LexicalEditorWithConfig = ({ children }: { children: React.ReactNode }) => {\n    const [properties, setProperties] = useState<Property[]>([]);\n    const context = { properties };\n\n    const stateUpdater = (properties: Property[]) => {\n        setProperties(properties);\n    };\n\n    return (\n        <ViewContext.Provider value={context}>\n            <Properties onChange={stateUpdater}>\n                <LexicalEditorConfigApply />\n                {children}\n            </Properties>\n        </ViewContext.Provider>\n    );\n};\n\ninterface LexicalEditorConfigData {\n    toolbarElements: ToolbarElementConfig[];\n    plugins: PluginConfig[];\n    nodes: NodeConfig[];\n}\n\nexport function useLexicalEditorConfig() {\n    const { properties } = useContext(ViewContext);\n\n    const config = useMemo(() => {\n        return toObject<LexicalEditorConfigData>(properties);\n    }, [properties]);\n\n    return {\n        toolbarElements: config.toolbarElements || [],\n        plugins: config.plugins || [],\n        nodes: config.nodes || []\n    };\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useMemo","createConfigurableComponent","ToolbarElement","Plugin","Node","base","LexicalEditorConfig","Object","assign","Config","LexicalEditorWithConfig","WithConfig","useLexicalEditorConfig","config","useConfig","toolbarElements","plugins","nodes"],"sources":["LexicalEditorConfig.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport { createConfigurableComponent } from \"@webiny/react-properties\";\nimport type { ToolbarElementConfig } from \"./components/ToolbarElement.js\";\nimport { ToolbarElement } from \"./components/ToolbarElement.js\";\nimport type { PluginConfig } from \"./components/Plugin.js\";\nimport { Plugin } from \"./components/Plugin.js\";\nimport type { NodeConfig } from \"./components/Node.js\";\nimport { Node } from \"./components/Node.js\";\n\nexport type { ToolbarElementConfig } from \"./components/ToolbarElement.js\";\nexport type { PluginConfig } from \"./components/Plugin.js\";\nexport type { NodeConfig } from \"./components/Node.js\";\n\nconst base = createConfigurableComponent<LexicalEditorConfigData>(\"LexicalEditor\");\n\nexport const LexicalEditorConfig = Object.assign(base.Config, {\n    ToolbarElement,\n    Plugin,\n    Node\n});\n\nexport const LexicalEditorWithConfig = base.WithConfig;\n\ninterface LexicalEditorConfigData {\n    toolbarElements: ToolbarElementConfig[];\n    plugins: PluginConfig[];\n    nodes: NodeConfig[];\n}\n\nexport function useLexicalEditorConfig(): LexicalEditorConfigData {\n    const config = base.useConfig();\n    const toolbarElements = config.toolbarElements || [];\n    const plugins = config.plugins || [];\n    const nodes = config.nodes || [];\n\n    return useMemo(\n        () => ({\n            toolbarElements: [...toolbarElements],\n            plugins: [...plugins],\n            nodes: [...nodes]\n        }),\n        [config]\n    );\n}\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,OAAO;AAC/B,SAASC,2BAA2B,QAAQ,0BAA0B;AAEtE,SAASC,cAAc;AAEvB,SAASC,MAAM;AAEf,SAASC,IAAI;AAMb,MAAMC,IAAI,GAAGJ,2BAA2B,CAA0B,eAAe,CAAC;AAElF,OAAO,MAAMK,mBAAmB,GAAGC,MAAM,CAACC,MAAM,CAACH,IAAI,CAACI,MAAM,EAAE;EAC1DP,cAAc;EACdC,MAAM;EACNC;AACJ,CAAC,CAAC;AAEF,OAAO,MAAMM,uBAAuB,GAAGL,IAAI,CAACM,UAAU;AAQtD,OAAO,SAASC,sBAAsBA,CAAA,EAA4B;EAC9D,MAAMC,MAAM,GAAGR,IAAI,CAACS,SAAS,CAAC,CAAC;EAC/B,MAAMC,eAAe,GAAGF,MAAM,CAACE,eAAe,IAAI,EAAE;EACpD,MAAMC,OAAO,GAAGH,MAAM,CAACG,OAAO,IAAI,EAAE;EACpC,MAAMC,KAAK,GAAGJ,MAAM,CAACI,KAAK,IAAI,EAAE;EAEhC,OAAOjB,OAAO,CACV,OAAO;IACHe,eAAe,EAAE,CAAC,GAAGA,eAAe,CAAC;IACrCC,OAAO,EAAE,CAAC,GAAGA,OAAO,CAAC;IACrBC,KAAK,EAAE,CAAC,GAAGA,KAAK;EACpB,CAAC,CAAC,EACF,CAACJ,MAAM,CACX,CAAC;AACL","ignoreList":[]}

package/components/LexicalEditorConfig/components/Node.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { Klass, LexicalNode } from "lexical";
+import type { Klass, LexicalNode } from "lexical";
 export interface NodeConfig {
     name: string;
     node: Klass<LexicalNode>;

package/components/LexicalEditorConfig/components/Node.js

@@ -1,36 +1,27 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Node = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _reactProperties = require("@webiny/react-properties");
-var Node = exports.Node = function Node(_ref) {
-  var name = _ref.name,
-    node = _ref.node,
-    _ref$after = _ref.after,
-    after = _ref$after === void 0 ? undefined : _ref$after,
-    _ref$before = _ref.before,
-    before = _ref$before === void 0 ? undefined : _ref$before,
-    _ref$remove = _ref.remove,
-    remove = _ref$remove === void 0 ? false : _ref$remove;
-  var placeBefore = before !== undefined ? "node:".concat(before) : undefined;
-  var placeAfter = after !== undefined ? "node:".concat(after) : undefined;
-  return /*#__PURE__*/_react.default.createElement(_reactProperties.Property, {
-    id: "nodes:".concat(name),
+import React from "react";
+import { Property } from "@webiny/react-properties";
+export const Node = ({
+  name,
+  node,
+  after = undefined,
+  before = undefined,
+  remove = false
+}) => {
+  const placeBefore = before !== undefined ? `node:${before}` : undefined;
+  const placeAfter = after !== undefined ? `node:${after}` : undefined;
+  return /*#__PURE__*/React.createElement(Property, {
+    id: `nodes:${name}`,
     name: "nodes",
     array: true,
     before: placeBefore,
     after: placeAfter,
     remove: remove
-  }, /*#__PURE__*/_react.default.createElement(_reactProperties.Property, {
-    id: "node:".concat(name, ":name"),
+  }, /*#__PURE__*/React.createElement(Property, {
+    id: `node:${name}:name`,
     name: "name",
     value: name
-  }), node ? /*#__PURE__*/_react.default.createElement(_reactProperties.Property, {
-    id: "node:".concat(name, ":node"),
+  }), node ? /*#__PURE__*/React.createElement(Property, {
+    id: `node:${name}:node`,
     name: "node",
     value: node
   }) : null);

package/components/LexicalEditorConfig/components/Node.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactProperties","Node","exports","_ref","name","node","_ref$after","after","undefined","_ref$before","before","_ref$remove","remove","placeBefore","concat","placeAfter","default","createElement","Property","id","array","value"],"sources":["Node.tsx"],"sourcesContent":["import React from \"react\";\nimport { Property } from \"@webiny/react-properties\";\nimport { Klass, LexicalNode } from \"lexical\";\n\nexport interface NodeConfig {\n    name: string;\n    node: Klass<LexicalNode>;\n}\n\nexport interface NodeProps {\n    name: string;\n    node?: Klass<LexicalNode>;\n    remove?: boolean;\n    before?: string;\n    after?: string;\n}\n\nexport const Node = ({\n    name,\n    node,\n    after = undefined,\n    before = undefined,\n    remove = false\n}: NodeProps) => {\n    const placeBefore = before !== undefined ? `node:${before}` : undefined;\n    const placeAfter = after !== undefined ? `node:${after}` : undefined;\n\n    return (\n        <Property\n            id={`nodes:${name}`}\n            name={\"nodes\"}\n            array={true}\n            before={placeBefore}\n            after={placeAfter}\n            remove={remove}\n        >\n            <Property id={`node:${name}:name`} name={\"name\"} value={name} />\n            {node ? <Property id={`node:${name}:node`} name={\"node\"} value={node} /> : null}\n        </Property>\n    );\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,gBAAA,GAAAD,OAAA;AAgBO,IAAME,IAAI,GAAAC,OAAA,CAAAD,IAAA,GAAG,SAAPA,IAAIA,CAAAE,IAAA,EAMA;EAAA,IALbC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IACJC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IAAAC,UAAA,GAAAH,IAAA,CACJI,KAAK;IAALA,KAAK,GAAAD,UAAA,cAAGE,SAAS,GAAAF,UAAA;IAAAG,WAAA,GAAAN,IAAA,CACjBO,MAAM;IAANA,MAAM,GAAAD,WAAA,cAAGD,SAAS,GAAAC,WAAA;IAAAE,WAAA,GAAAR,IAAA,CAClBS,MAAM;IAANA,MAAM,GAAAD,WAAA,cAAG,KAAK,GAAAA,WAAA;EAEd,IAAME,WAAW,GAAGH,MAAM,KAAKF,SAAS,WAAAM,MAAA,CAAWJ,MAAM,IAAKF,SAAS;EACvE,IAAMO,UAAU,GAAGR,KAAK,KAAKC,SAAS,WAAAM,MAAA,CAAWP,KAAK,IAAKC,SAAS;EAEpE,oBACIX,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACjB,gBAAA,CAAAkB,QAAQ;IACLC,EAAE,WAAAL,MAAA,CAAWV,IAAI,CAAG;IACpBA,IAAI,EAAE,OAAQ;IACdgB,KAAK,EAAE,IAAK;IACZV,MAAM,EAAEG,WAAY;IACpBN,KAAK,EAAEQ,UAAW;IAClBH,MAAM,EAAEA;EAAO,gBAEff,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACjB,gBAAA,CAAAkB,QAAQ;IAACC,EAAE,UAAAL,MAAA,CAAUV,IAAI,UAAQ;IAACA,IAAI,EAAE,MAAO;IAACiB,KAAK,EAAEjB;EAAK,CAAE,CAAC,EAC/DC,IAAI,gBAAGR,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACjB,gBAAA,CAAAkB,QAAQ;IAACC,EAAE,UAAAL,MAAA,CAAUV,IAAI,UAAQ;IAACA,IAAI,EAAE,MAAO;IAACiB,KAAK,EAAEhB;EAAK,CAAE,CAAC,GAAG,IACrE,CAAC;AAEnB,CAAC","ignoreList":[]}
+{"version":3,"names":["React","Property","Node","name","node","after","undefined","before","remove","placeBefore","placeAfter","createElement","id","array","value"],"sources":["Node.tsx"],"sourcesContent":["import React from \"react\";\nimport { Property } from \"@webiny/react-properties\";\nimport type { Klass, LexicalNode } from \"lexical\";\n\nexport interface NodeConfig {\n    name: string;\n    node: Klass<LexicalNode>;\n}\n\nexport interface NodeProps {\n    name: string;\n    node?: Klass<LexicalNode>;\n    remove?: boolean;\n    before?: string;\n    after?: string;\n}\n\nexport const Node = ({\n    name,\n    node,\n    after = undefined,\n    before = undefined,\n    remove = false\n}: NodeProps) => {\n    const placeBefore = before !== undefined ? `node:${before}` : undefined;\n    const placeAfter = after !== undefined ? `node:${after}` : undefined;\n\n    return (\n        <Property\n            id={`nodes:${name}`}\n            name={\"nodes\"}\n            array={true}\n            before={placeBefore}\n            after={placeAfter}\n            remove={remove}\n        >\n            <Property id={`node:${name}:name`} name={\"name\"} value={name} />\n            {node ? <Property id={`node:${name}:node`} name={\"node\"} value={node} /> : null}\n        </Property>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAAQ,0BAA0B;AAgBnD,OAAO,MAAMC,IAAI,GAAGA,CAAC;EACjBC,IAAI;EACJC,IAAI;EACJC,KAAK,GAAGC,SAAS;EACjBC,MAAM,GAAGD,SAAS;EAClBE,MAAM,GAAG;AACF,CAAC,KAAK;EACb,MAAMC,WAAW,GAAGF,MAAM,KAAKD,SAAS,GAAG,QAAQC,MAAM,EAAE,GAAGD,SAAS;EACvE,MAAMI,UAAU,GAAGL,KAAK,KAAKC,SAAS,GAAG,QAAQD,KAAK,EAAE,GAAGC,SAAS;EAEpE,oBACIN,KAAA,CAAAW,aAAA,CAACV,QAAQ;IACLW,EAAE,EAAE,SAAST,IAAI,EAAG;IACpBA,IAAI,EAAE,OAAQ;IACdU,KAAK,EAAE,IAAK;IACZN,MAAM,EAAEE,WAAY;IACpBJ,KAAK,EAAEK,UAAW;IAClBF,MAAM,EAAEA;EAAO,gBAEfR,KAAA,CAAAW,aAAA,CAACV,QAAQ;IAACW,EAAE,EAAE,QAAQT,IAAI,OAAQ;IAACA,IAAI,EAAE,MAAO;IAACW,KAAK,EAAEX;EAAK,CAAE,CAAC,EAC/DC,IAAI,gBAAGJ,KAAA,CAAAW,aAAA,CAACV,QAAQ;IAACW,EAAE,EAAE,QAAQT,IAAI,OAAQ;IAACA,IAAI,EAAE,MAAO;IAACW,KAAK,EAAEV;EAAK,CAAE,CAAC,GAAG,IACrE,CAAC;AAEnB,CAAC","ignoreList":[]}

package/components/LexicalEditorConfig/components/Plugin.js

@@ -1,36 +1,27 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Plugin = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _reactProperties = require("@webiny/react-properties");
-var Plugin = exports.Plugin = function Plugin(_ref) {
-  var name = _ref.name,
-    element = _ref.element,
-    _ref$after = _ref.after,
-    after = _ref$after === void 0 ? undefined : _ref$after,
-    _ref$before = _ref.before,
-    before = _ref$before === void 0 ? undefined : _ref$before,
-    _ref$remove = _ref.remove,
-    remove = _ref$remove === void 0 ? false : _ref$remove;
-  var placeBefore = before !== undefined ? "plugin:".concat(before) : undefined;
-  var placeAfter = after !== undefined ? "plugin:".concat(after) : undefined;
-  return /*#__PURE__*/_react.default.createElement(_reactProperties.Property, {
-    id: "plugins:".concat(name),
+import React from "react";
+import { Property } from "@webiny/react-properties";
+export const Plugin = ({
+  name,
+  element,
+  after = undefined,
+  before = undefined,
+  remove = false
+}) => {
+  const placeBefore = before !== undefined ? `plugin:${before}` : undefined;
+  const placeAfter = after !== undefined ? `plugin:${after}` : undefined;
+  return /*#__PURE__*/React.createElement(Property, {
+    id: `plugins:${name}`,
     name: "plugins",
     array: true,
     before: placeBefore,
     after: placeAfter,
     remove: remove
-  }, /*#__PURE__*/_react.default.createElement(_reactProperties.Property, {
-    id: "plugin:".concat(name, ":name"),
+  }, /*#__PURE__*/React.createElement(Property, {
+    id: `plugin:${name}:name`,
     name: "name",
     value: name
-  }), element ? /*#__PURE__*/_react.default.createElement(_reactProperties.Property, {
-    id: "plugin:".concat(name, ":element"),
+  }), element ? /*#__PURE__*/React.createElement(Property, {
+    id: `plugin:${name}:element`,
     name: "element",
     value: element
   }) : null);

package/components/LexicalEditorConfig/components/Plugin.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactProperties","Plugin","exports","_ref","name","element","_ref$after","after","undefined","_ref$before","before","_ref$remove","remove","placeBefore","concat","placeAfter","default","createElement","Property","id","array","value"],"sources":["Plugin.tsx"],"sourcesContent":["import React from \"react\";\nimport { Property } from \"@webiny/react-properties\";\n\nexport interface PluginConfig {\n    name: string;\n    element: React.ReactElement;\n}\n\nexport interface PluginProps {\n    name: string;\n    element?: React.ReactElement<unknown>;\n    remove?: boolean;\n    before?: string;\n    after?: string;\n}\n\nexport const Plugin = ({\n    name,\n    element,\n    after = undefined,\n    before = undefined,\n    remove = false\n}: PluginProps) => {\n    const placeBefore = before !== undefined ? `plugin:${before}` : undefined;\n    const placeAfter = after !== undefined ? `plugin:${after}` : undefined;\n\n    return (\n        <Property\n            id={`plugins:${name}`}\n            name={\"plugins\"}\n            array={true}\n            before={placeBefore}\n            after={placeAfter}\n            remove={remove}\n        >\n            <Property id={`plugin:${name}:name`} name={\"name\"} value={name} />\n            {element ? (\n                <Property id={`plugin:${name}:element`} name={\"element\"} value={element} />\n            ) : null}\n        </Property>\n    );\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,gBAAA,GAAAD,OAAA;AAeO,IAAME,MAAM,GAAAC,OAAA,CAAAD,MAAA,GAAG,SAATA,MAAMA,CAAAE,IAAA,EAMA;EAAA,IALfC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IACJC,OAAO,GAAAF,IAAA,CAAPE,OAAO;IAAAC,UAAA,GAAAH,IAAA,CACPI,KAAK;IAALA,KAAK,GAAAD,UAAA,cAAGE,SAAS,GAAAF,UAAA;IAAAG,WAAA,GAAAN,IAAA,CACjBO,MAAM;IAANA,MAAM,GAAAD,WAAA,cAAGD,SAAS,GAAAC,WAAA;IAAAE,WAAA,GAAAR,IAAA,CAClBS,MAAM;IAANA,MAAM,GAAAD,WAAA,cAAG,KAAK,GAAAA,WAAA;EAEd,IAAME,WAAW,GAAGH,MAAM,KAAKF,SAAS,aAAAM,MAAA,CAAaJ,MAAM,IAAKF,SAAS;EACzE,IAAMO,UAAU,GAAGR,KAAK,KAAKC,SAAS,aAAAM,MAAA,CAAaP,KAAK,IAAKC,SAAS;EAEtE,oBACIX,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACjB,gBAAA,CAAAkB,QAAQ;IACLC,EAAE,aAAAL,MAAA,CAAaV,IAAI,CAAG;IACtBA,IAAI,EAAE,SAAU;IAChBgB,KAAK,EAAE,IAAK;IACZV,MAAM,EAAEG,WAAY;IACpBN,KAAK,EAAEQ,UAAW;IAClBH,MAAM,EAAEA;EAAO,gBAEff,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACjB,gBAAA,CAAAkB,QAAQ;IAACC,EAAE,YAAAL,MAAA,CAAYV,IAAI,UAAQ;IAACA,IAAI,EAAE,MAAO;IAACiB,KAAK,EAAEjB;EAAK,CAAE,CAAC,EACjEC,OAAO,gBACJR,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACjB,gBAAA,CAAAkB,QAAQ;IAACC,EAAE,YAAAL,MAAA,CAAYV,IAAI,aAAW;IAACA,IAAI,EAAE,SAAU;IAACiB,KAAK,EAAEhB;EAAQ,CAAE,CAAC,GAC3E,IACE,CAAC;AAEnB,CAAC","ignoreList":[]}
+{"version":3,"names":["React","Property","Plugin","name","element","after","undefined","before","remove","placeBefore","placeAfter","createElement","id","array","value"],"sources":["Plugin.tsx"],"sourcesContent":["import React from \"react\";\nimport { Property } from \"@webiny/react-properties\";\n\nexport interface PluginConfig {\n    name: string;\n    element: React.ReactElement;\n}\n\nexport interface PluginProps {\n    name: string;\n    element?: React.ReactElement<unknown>;\n    remove?: boolean;\n    before?: string;\n    after?: string;\n}\n\nexport const Plugin = ({\n    name,\n    element,\n    after = undefined,\n    before = undefined,\n    remove = false\n}: PluginProps) => {\n    const placeBefore = before !== undefined ? `plugin:${before}` : undefined;\n    const placeAfter = after !== undefined ? `plugin:${after}` : undefined;\n\n    return (\n        <Property\n            id={`plugins:${name}`}\n            name={\"plugins\"}\n            array={true}\n            before={placeBefore}\n            after={placeAfter}\n            remove={remove}\n        >\n            <Property id={`plugin:${name}:name`} name={\"name\"} value={name} />\n            {element ? (\n                <Property id={`plugin:${name}:element`} name={\"element\"} value={element} />\n            ) : null}\n        </Property>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAAQ,0BAA0B;AAenD,OAAO,MAAMC,MAAM,GAAGA,CAAC;EACnBC,IAAI;EACJC,OAAO;EACPC,KAAK,GAAGC,SAAS;EACjBC,MAAM,GAAGD,SAAS;EAClBE,MAAM,GAAG;AACA,CAAC,KAAK;EACf,MAAMC,WAAW,GAAGF,MAAM,KAAKD,SAAS,GAAG,UAAUC,MAAM,EAAE,GAAGD,SAAS;EACzE,MAAMI,UAAU,GAAGL,KAAK,KAAKC,SAAS,GAAG,UAAUD,KAAK,EAAE,GAAGC,SAAS;EAEtE,oBACIN,KAAA,CAAAW,aAAA,CAACV,QAAQ;IACLW,EAAE,EAAE,WAAWT,IAAI,EAAG;IACtBA,IAAI,EAAE,SAAU;IAChBU,KAAK,EAAE,IAAK;IACZN,MAAM,EAAEE,WAAY;IACpBJ,KAAK,EAAEK,UAAW;IAClBF,MAAM,EAAEA;EAAO,gBAEfR,KAAA,CAAAW,aAAA,CAACV,QAAQ;IAACW,EAAE,EAAE,UAAUT,IAAI,OAAQ;IAACA,IAAI,EAAE,MAAO;IAACW,KAAK,EAAEX;EAAK,CAAE,CAAC,EACjEC,OAAO,gBACJJ,KAAA,CAAAW,aAAA,CAACV,QAAQ;IAACW,EAAE,EAAE,UAAUT,IAAI,UAAW;IAACA,IAAI,EAAE,SAAU;IAACW,KAAK,EAAEV;EAAQ,CAAE,CAAC,GAC3E,IACE,CAAC;AAEnB,CAAC","ignoreList":[]}

package/components/LexicalEditorConfig/components/ToolbarElement.js

@@ -1,36 +1,27 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ToolbarElement = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _reactProperties = require("@webiny/react-properties");
-var ToolbarElement = exports.ToolbarElement = function ToolbarElement(_ref) {
-  var name = _ref.name,
-    element = _ref.element,
-    _ref$after = _ref.after,
-    after = _ref$after === void 0 ? undefined : _ref$after,
-    _ref$before = _ref.before,
-    before = _ref$before === void 0 ? undefined : _ref$before,
-    _ref$remove = _ref.remove,
-    remove = _ref$remove === void 0 ? false : _ref$remove;
-  var placeBefore = before !== undefined ? "element:".concat(before) : undefined;
-  var placeAfter = after !== undefined ? "element:".concat(after) : undefined;
-  return /*#__PURE__*/_react.default.createElement(_reactProperties.Property, {
-    id: "element:".concat(name),
+import React from "react";
+import { Property } from "@webiny/react-properties";
+export const ToolbarElement = ({
+  name,
+  element,
+  after = undefined,
+  before = undefined,
+  remove = false
+}) => {
+  const placeBefore = before !== undefined ? `element:${before}` : undefined;
+  const placeAfter = after !== undefined ? `element:${after}` : undefined;
+  return /*#__PURE__*/React.createElement(Property, {
+    id: `element:${name}`,
     name: "toolbarElements",
     array: true,
     before: placeBefore,
     after: placeAfter,
     remove: remove
-  }, /*#__PURE__*/_react.default.createElement(_reactProperties.Property, {
-    id: "element:".concat(name, ":name"),
+  }, /*#__PURE__*/React.createElement(Property, {
+    id: `element:${name}:name`,
     name: "name",
     value: name
-  }), element ? /*#__PURE__*/_react.default.createElement(_reactProperties.Property, {
-    id: "element:".concat(name, ":element"),
+  }), element ? /*#__PURE__*/React.createElement(Property, {
+    id: `element:${name}:element`,
     name: "element",
     value: element
   }) : null);

package/components/LexicalEditorConfig/components/ToolbarElement.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactProperties","ToolbarElement","exports","_ref","name","element","_ref$after","after","undefined","_ref$before","before","_ref$remove","remove","placeBefore","concat","placeAfter","default","createElement","Property","id","array","value"],"sources":["ToolbarElement.tsx"],"sourcesContent":["import React from \"react\";\nimport { Property } from \"@webiny/react-properties\";\n\nexport interface ToolbarElementConfig {\n    name: string;\n    element: React.ReactElement;\n}\n\nexport interface ToolbarElementProps {\n    name: string;\n    element?: React.ReactElement<unknown>;\n    remove?: boolean;\n    before?: string;\n    after?: string;\n}\n\nexport const ToolbarElement = ({\n    name,\n    element,\n    after = undefined,\n    before = undefined,\n    remove = false\n}: ToolbarElementProps) => {\n    const placeBefore = before !== undefined ? `element:${before}` : undefined;\n    const placeAfter = after !== undefined ? `element:${after}` : undefined;\n\n    return (\n        <Property\n            id={`element:${name}`}\n            name={\"toolbarElements\"}\n            array={true}\n            before={placeBefore}\n            after={placeAfter}\n            remove={remove}\n        >\n            <Property id={`element:${name}:name`} name={\"name\"} value={name} />\n            {element ? (\n                <Property id={`element:${name}:element`} name={\"element\"} value={element} />\n            ) : null}\n        </Property>\n    );\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,gBAAA,GAAAD,OAAA;AAeO,IAAME,cAAc,GAAAC,OAAA,CAAAD,cAAA,GAAG,SAAjBA,cAAcA,CAAAE,IAAA,EAMA;EAAA,IALvBC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IACJC,OAAO,GAAAF,IAAA,CAAPE,OAAO;IAAAC,UAAA,GAAAH,IAAA,CACPI,KAAK;IAALA,KAAK,GAAAD,UAAA,cAAGE,SAAS,GAAAF,UAAA;IAAAG,WAAA,GAAAN,IAAA,CACjBO,MAAM;IAANA,MAAM,GAAAD,WAAA,cAAGD,SAAS,GAAAC,WAAA;IAAAE,WAAA,GAAAR,IAAA,CAClBS,MAAM;IAANA,MAAM,GAAAD,WAAA,cAAG,KAAK,GAAAA,WAAA;EAEd,IAAME,WAAW,GAAGH,MAAM,KAAKF,SAAS,cAAAM,MAAA,CAAcJ,MAAM,IAAKF,SAAS;EAC1E,IAAMO,UAAU,GAAGR,KAAK,KAAKC,SAAS,cAAAM,MAAA,CAAcP,KAAK,IAAKC,SAAS;EAEvE,oBACIX,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACjB,gBAAA,CAAAkB,QAAQ;IACLC,EAAE,aAAAL,MAAA,CAAaV,IAAI,CAAG;IACtBA,IAAI,EAAE,iBAAkB;IACxBgB,KAAK,EAAE,IAAK;IACZV,MAAM,EAAEG,WAAY;IACpBN,KAAK,EAAEQ,UAAW;IAClBH,MAAM,EAAEA;EAAO,gBAEff,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACjB,gBAAA,CAAAkB,QAAQ;IAACC,EAAE,aAAAL,MAAA,CAAaV,IAAI,UAAQ;IAACA,IAAI,EAAE,MAAO;IAACiB,KAAK,EAAEjB;EAAK,CAAE,CAAC,EAClEC,OAAO,gBACJR,MAAA,CAAAmB,OAAA,CAAAC,aAAA,CAACjB,gBAAA,CAAAkB,QAAQ;IAACC,EAAE,aAAAL,MAAA,CAAaV,IAAI,aAAW;IAACA,IAAI,EAAE,SAAU;IAACiB,KAAK,EAAEhB;EAAQ,CAAE,CAAC,GAC5E,IACE,CAAC;AAEnB,CAAC","ignoreList":[]}
+{"version":3,"names":["React","Property","ToolbarElement","name","element","after","undefined","before","remove","placeBefore","placeAfter","createElement","id","array","value"],"sources":["ToolbarElement.tsx"],"sourcesContent":["import React from \"react\";\nimport { Property } from \"@webiny/react-properties\";\n\nexport interface ToolbarElementConfig {\n    name: string;\n    element: React.ReactElement;\n}\n\nexport interface ToolbarElementProps {\n    name: string;\n    element?: React.ReactElement<unknown>;\n    remove?: boolean;\n    before?: string;\n    after?: string;\n}\n\nexport const ToolbarElement = ({\n    name,\n    element,\n    after = undefined,\n    before = undefined,\n    remove = false\n}: ToolbarElementProps) => {\n    const placeBefore = before !== undefined ? `element:${before}` : undefined;\n    const placeAfter = after !== undefined ? `element:${after}` : undefined;\n\n    return (\n        <Property\n            id={`element:${name}`}\n            name={\"toolbarElements\"}\n            array={true}\n            before={placeBefore}\n            after={placeAfter}\n            remove={remove}\n        >\n            <Property id={`element:${name}:name`} name={\"name\"} value={name} />\n            {element ? (\n                <Property id={`element:${name}:element`} name={\"element\"} value={element} />\n            ) : null}\n        </Property>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAAQ,0BAA0B;AAenD,OAAO,MAAMC,cAAc,GAAGA,CAAC;EAC3BC,IAAI;EACJC,OAAO;EACPC,KAAK,GAAGC,SAAS;EACjBC,MAAM,GAAGD,SAAS;EAClBE,MAAM,GAAG;AACQ,CAAC,KAAK;EACvB,MAAMC,WAAW,GAAGF,MAAM,KAAKD,SAAS,GAAG,WAAWC,MAAM,EAAE,GAAGD,SAAS;EAC1E,MAAMI,UAAU,GAAGL,KAAK,KAAKC,SAAS,GAAG,WAAWD,KAAK,EAAE,GAAGC,SAAS;EAEvE,oBACIN,KAAA,CAAAW,aAAA,CAACV,QAAQ;IACLW,EAAE,EAAE,WAAWT,IAAI,EAAG;IACtBA,IAAI,EAAE,iBAAkB;IACxBU,KAAK,EAAE,IAAK;IACZN,MAAM,EAAEE,WAAY;IACpBJ,KAAK,EAAEK,UAAW;IAClBF,MAAM,EAAEA;EAAO,gBAEfR,KAAA,CAAAW,aAAA,CAACV,QAAQ;IAACW,EAAE,EAAE,WAAWT,IAAI,OAAQ;IAACA,IAAI,EAAE,MAAO;IAACW,KAAK,EAAEX;EAAK,CAAE,CAAC,EAClEC,OAAO,gBACJJ,KAAA,CAAAW,aAAA,CAACV,QAAQ;IAACW,EAAE,EAAE,WAAWT,IAAI,UAAW;IAACA,IAAI,EAAE,SAAU;IAACW,KAAK,EAAEV;EAAQ,CAAE,CAAC,GAC5E,IACE,CAAC;AAEnB,CAAC","ignoreList":[]}

package/components/LexicalHtmlRenderer.d.ts

@@ -1,14 +1,11 @@
 import React from "react";
-import { Klass, LexicalNode } from "lexical";
-import { CSSObject } from "@emotion/react";
-import { WebinyTheme, ThemeEmotionMap } from "@webiny/lexical-theme";
-import { LexicalValue } from "../types";
+import type { Klass, LexicalNode } from "lexical";
+import type { EditorTheme } from "@webiny/lexical-theme";
+import type { LexicalValue } from "../types.js";
 interface LexicalHtmlRendererProps {
     nodes?: Klass<LexicalNode>[];
     value: LexicalValue | null;
-    theme: WebinyTheme;
-    themeEmotionMap?: ThemeEmotionMap;
-    themeStylesTransformer?: (cssObject: Record<string, any>) => CSSObject;
+    theme: EditorTheme;
 }
-export declare const LexicalHtmlRenderer: ({ nodes, value, theme, ...props }: LexicalHtmlRendererProps) => React.JSX.Element;
+export declare const LexicalHtmlRenderer: ({ nodes, value, ...props }: LexicalHtmlRendererProps) => React.JSX.Element;
 export {};