@webiny/lexical-editor 6.0.0-rc.2 → 6.0.0-rc.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/components/Editor/RichTextEditor.d.ts +1 -0
  2. package/components/Editor/RichTextEditor.js +6 -3
  3. package/components/Editor/RichTextEditor.js.map +1 -1
  4. package/package.json +7 -7
package/components/Editor/RichTextEditor.d.ts CHANGED
@@ -9,6 +9,7 @@ export type InitialEditorConfig = React.ComponentProps<typeof LexicalComposer>["
9
9
  export interface RichTextEditorProps {
10
10
  children?: React.ReactNode | React.ReactNode[];
11
11
  classes?: string;
12
+ disabled?: boolean;
12
13
  contentEditableStyles?: React.CSSProperties;
13
14
  focus?: boolean;
14
15
  height?: number | string;
package/components/Editor/RichTextEditor.js CHANGED
@@ -25,6 +25,7 @@ const BaseRichTextEditor = ({
25
25
  focus,
26
26
  styles,
27
27
  width,
28
+ disabled = false,
28
29
  height,
29
30
  contentEditableStyles,
30
31
  placeholderStyles,
@@ -55,6 +56,7 @@ const BaseRichTextEditor = ({
55
56
  }, plugin.element));
56
57
  const initialConfig = {
57
58
  editorId: useId(),
59
+ editable: !disabled,
58
60
  namespace: "webiny",
59
61
  onError: () => {
60
62
  // Ignore errors. We don't want to break the app because of errors caused by config/value updates.
@@ -88,7 +90,7 @@ const BaseRichTextEditor = ({
88
90
  }, /*#__PURE__*/React.createElement(RichTextEditorProvider, {
89
91
  theme: props.theme,
90
92
  toolbarActionPlugins: props.toolbarActionPlugins
91
- }, staticToolbar ? staticToolbar : null, /*#__PURE__*/React.createElement("div", {
93
+ }, staticToolbar && !disabled ? staticToolbar : null, /*#__PURE__*/React.createElement("div", {
92
94
  "data-role": "overlays",
93
95
  className: "relative"
94
96
  }), /*#__PURE__*/React.createElement("div", {
@@ -103,7 +105,7 @@ const BaseRichTextEditor = ({
103
105
  }
104
106
  }, /*#__PURE__*/React.createElement(StateHandlingPlugin, {
105
107
  value: props.value,
106
- onChange: onChange
108
+ onChange: disabled ? undefined : onChange
107
109
  }), /*#__PURE__*/React.createElement(ClearEditorPlugin, null), /*#__PURE__*/React.createElement(HistoryPlugin, {
108
110
  externalHistoryState: historyState
109
111
  }), onBlur && /*#__PURE__*/React.createElement(BlurEventPlugin, {
@@ -118,6 +120,7 @@ const BaseRichTextEditor = ({
118
120
  className: "editor",
119
121
  ref: onRef
120
122
  }, /*#__PURE__*/React.createElement(ContentEditable, {
123
+ disabled: disabled,
121
124
  style: {
122
125
  outline: 0,
123
126
  ...contentEditableStyles
@@ -125,7 +128,7 @@ const BaseRichTextEditor = ({
125
128
  }))),
126
129
  placeholder: placeholderElem,
127
130
  ErrorBoundary: LexicalErrorBoundary
128
- }), floatingAnchorElem && toolbar))))
131
+ }), disabled ? null : floatingAnchorElem && toolbar))))
129
132
  );
130
133
  };
131
134
 
package/components/Editor/RichTextEditor.js.map CHANGED
@@ -1 +1 @@
1
- {"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":[]}
1
+ {"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","disabled","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","editable","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 disabled?: boolean;\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 disabled = false,\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 editable: !disabled,\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 && !disabled ? 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\n value={props.value}\n onChange={disabled ? undefined : onChange}\n />\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 disabled={disabled}\n style={{ outline: 0, ...contentEditableStyles }}\n />\n </div>\n </div>\n }\n placeholder={placeholderElem}\n ErrorBoundary={LexicalErrorBoundary}\n />\n {/* Toolbar. */}\n {disabled ? null : 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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webiny/lexical-editor",
3
- "version": "6.0.0-rc.2",
3
+ "version": "6.0.0-rc.3",
4
4
  "type": "module",
5
5
  "repository": {
6
6
  "type": "git",
@@ -16,21 +16,21 @@
16
16
  "@lexical/selection": "0.40.0",
17
17
  "@lexical/text": "0.40.0",
18
18
  "@lexical/utils": "0.40.0",
19
- "@webiny/lexical-nodes": "6.0.0-rc.2",
20
- "@webiny/lexical-theme": "6.0.0-rc.2",
21
- "@webiny/react-composition": "6.0.0-rc.2",
22
- "@webiny/react-properties": "6.0.0-rc.2",
19
+ "@webiny/lexical-nodes": "6.0.0-rc.3",
20
+ "@webiny/lexical-theme": "6.0.0-rc.3",
21
+ "@webiny/react-composition": "6.0.0-rc.3",
22
+ "@webiny/react-properties": "6.0.0-rc.3",
23
23
  "lexical": "0.40.0",
24
24
  "lodash": "4.17.23",
25
25
  "react": "18.2.0",
26
26
  "react-dom": "18.2.0"
27
27
  },
28
28
  "devDependencies": {
29
- "@webiny/build-tools": "6.0.0-rc.2"
29
+ "@webiny/build-tools": "6.0.0-rc.3"
30
30
  },
31
31
  "publishConfig": {
32
32
  "access": "public",
33
33
  "directory": "dist"
34
34
  },
35
- "gitHead": "5facada4cbb8617cc60e3c98be0f1839f44be38e"
35
+ "gitHead": "228fe25e1a17f248d566bce1c33d11c291955513"
36
36
  }