@payloadcms/richtext-lexical 3.0.0-beta.35 → 3.0.0-beta.36

package/dist/field/index.scss

@@ -23,22 +23,3 @@
   }
 }
 
-html[data-theme='light'] {
-  .rich-text-lexical {
-    &.error {
-      .editor-container {
-        @include lightInputError;
-      }
-    }
-  }
-}
-
-html[data-theme='dark'] {
-  .rich-text-lexical {
-    &.error {
-      .editor-container {
-        @include darkInputError;
-      }
-    }
-  }
-}

package/dist/field/lexical/EditorFocusProvider.d.ts

@@ -1,5 +1,4 @@
 import type { LexicalEditor } from 'lexical';
-import React from 'react';
 import type { EditorConfigContextType } from './config/client/EditorConfigProvider.js';
 export type EditorFocusContextType = {
     blurEditor: () => void;
@@ -16,5 +15,5 @@ export type EditorFocusContextType = {
 export declare const useEditorFocus: () => EditorFocusContextType;
 export declare const EditorFocusProvider: ({ children }: {
     children: any;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=EditorFocusProvider.d.ts.map

package/dist/field/lexical/EditorFocusProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditorFocusProvider.d.ts","sourceRoot":"","sources":["../../../src/field/lexical/EditorFocusProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAG5C,OAAO,KAA2D,MAAM,OAAO,CAAA;AAE/E,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,yCAAyC,CAAA;AAItF,MAAM,MAAM,sBAAsB,GAAG;IACnC,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,MAAM,EAAE,aAAa,CAAA;IACrB,WAAW,EAAE,CAAC,OAAO,CAAC,EAAE,aAAa,EAAE,oBAAoB,CAAC,EAAE,uBAAuB,KAAK,IAAI,CAAA;IAC9F,aAAa,EAAE,aAAa,GAAG,IAAI,CAAA;IACnC,0BAA0B,EAAE,uBAAuB,CAAA;IACnD,oBAAoB,EAAE,MAAM,OAAO,CAAA;IACnC,eAAe,EAAE,MAAM,OAAO,CAAA;IAC9B,qBAAqB,EAAE,MAAM,OAAO,CAAA;IACpC,yBAAyB,EAAE,uBAAuB,CAAA;IAClD,iBAAiB,EAAE,sBAAsB,CAAA;CAC1C,CAAA;AAeD,eAAO,MAAM,cAAc,QAAO,sBAEjC,CAAA;AAED,eAAO,MAAM,mBAAmB;;uBA4D/B,CAAA"}
+{"version":3,"file":"EditorFocusProvider.d.ts","sourceRoot":"","sources":["../../../src/field/lexical/EditorFocusProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAK5C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,yCAAyC,CAAA;AAItF,MAAM,MAAM,sBAAsB,GAAG;IACnC,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,MAAM,EAAE,aAAa,CAAA;IACrB,WAAW,EAAE,CAAC,OAAO,CAAC,EAAE,aAAa,EAAE,oBAAoB,CAAC,EAAE,uBAAuB,KAAK,IAAI,CAAA;IAC9F,aAAa,EAAE,aAAa,GAAG,IAAI,CAAA;IACnC,0BAA0B,EAAE,uBAAuB,CAAA;IACnD,oBAAoB,EAAE,MAAM,OAAO,CAAA;IACnC,eAAe,EAAE,MAAM,OAAO,CAAA;IAC9B,qBAAqB,EAAE,MAAM,OAAO,CAAA;IACpC,yBAAyB,EAAE,uBAAuB,CAAA;IAClD,iBAAiB,EAAE,sBAAsB,CAAA;CAC1C,CAAA;AAeD,eAAO,MAAM,cAAc,QAAO,sBAEjC,CAAA;AAED,eAAO,MAAM,mBAAmB;;6CA4D/B,CAAA"}

package/dist/field/lexical/EditorFocusProvider.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
 import React, { createContext, useCallback, useContext, useState } from 'react';
 import { useEditorConfigContext } from './config/client/EditorConfigProvider.js';
@@ -59,7 +60,7 @@ export const EditorFocusProvider = ({ children })=>{
         editor,
         focusedEditor
     ]);
-    return /*#__PURE__*/ React.createElement(EditorFocusContext.Provider, {
+    return /*#__PURE__*/ _jsx(EditorFocusContext.Provider, {
         value: {
             blurEditor,
             editor,
@@ -71,8 +72,9 @@ export const EditorFocusProvider = ({ children })=>{
             isParentEditorFocused,
             parentEditorConfigContext,
             parentEditorFocus
-        }
-    }, children);
+        },
+        children: children
+    });
 };
 
 //# sourceMappingURL=EditorFocusProvider.js.map

package/dist/field/lexical/EditorFocusProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/field/lexical/EditorFocusProvider.tsx"],"sourcesContent":["import type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport React, { createContext, useCallback, useContext, useState } from 'react'\n\nimport type { EditorConfigContextType } from './config/client/EditorConfigProvider.js'\n\nimport { useEditorConfigContext } from './config/client/EditorConfigProvider.js'\n\nexport type EditorFocusContextType = {\n  blurEditor: () => void\n  editor: LexicalEditor\n  focusEditor: (_editor?: LexicalEditor, _editorConfigContext?: EditorConfigContextType) => void\n  focusedEditor: LexicalEditor | null\n  focusedEditorConfigContext: EditorConfigContextType\n  isChildEditorFocused: () => boolean\n  isEditorFocused: () => boolean\n  isParentEditorFocused: () => boolean\n  parentEditorConfigContext: EditorConfigContextType\n  parentEditorFocus: EditorFocusContextType\n}\n\nconst EditorFocusContext = createContext<EditorFocusContextType>({\n  blurEditor: null,\n  editor: null,\n  focusEditor: null,\n  focusedEditor: null,\n  focusedEditorConfigContext: null,\n  isChildEditorFocused: null,\n  isEditorFocused: null,\n  isParentEditorFocused: null,\n  parentEditorConfigContext: null,\n  parentEditorFocus: null,\n})\n\nexport const useEditorFocus = (): EditorFocusContextType => {\n  return useContext(EditorFocusContext)\n}\n\nexport const EditorFocusProvider = ({ children }) => {\n  const parentEditorFocus = useEditorFocus()\n  const parentEditorConfigContext = useEditorConfigContext() // Is parent, as this EditorFocusProvider sits outside the EditorConfigProvider\n  const [editor] = useLexicalComposerContext()\n\n  const [focusedEditor, setFocusedEditor] = useState<LexicalEditor | null>(null)\n  const [focusedEditorConfigContext, setFocusedEditorConfigContext] =\n    useState<EditorConfigContextType | null>(null)\n\n  const focusEditor = useCallback(\n    (_editor: LexicalEditor, _editorConfigContext: EditorConfigContextType) => {\n      setFocusedEditor(_editor !== undefined ? _editor : editor)\n      setFocusedEditorConfigContext(_editorConfigContext)\n      if (parentEditorFocus.focusEditor) {\n        parentEditorFocus.focusEditor(\n          _editor !== undefined ? _editor : editor,\n          _editorConfigContext,\n        )\n      }\n    },\n    [editor, parentEditorFocus],\n  )\n\n  const blurEditor = useCallback(() => {\n    if (focusedEditor === editor) {\n      setFocusedEditor(null)\n      setFocusedEditorConfigContext(null)\n    }\n  }, [editor, focusedEditor])\n\n  const isEditorFocused = useCallback(() => {\n    return focusedEditor === editor\n  }, [editor, focusedEditor])\n\n  const isParentEditorFocused = useCallback(() => {\n    return parentEditorFocus?.isEditorFocused ? parentEditorFocus.isEditorFocused() : false\n  }, [parentEditorFocus])\n\n  const isChildEditorFocused = useCallback(() => {\n    return focusedEditor !== editor && !!focusedEditor\n  }, [editor, focusedEditor])\n\n  return (\n    <EditorFocusContext.Provider\n      value={{\n        blurEditor,\n        editor,\n        focusEditor,\n        focusedEditor,\n        focusedEditorConfigContext,\n        isChildEditorFocused,\n        isEditorFocused,\n        isParentEditorFocused,\n        parentEditorConfigContext,\n        parentEditorFocus,\n      }}\n    >\n      {children}\n    </EditorFocusContext.Provider>\n  )\n}\n"],"names":["useLexicalComposerContext","React","createContext","useCallback","useContext","useState","useEditorConfigContext","EditorFocusContext","blurEditor","editor","focusEditor","focusedEditor","focusedEditorConfigContext","isChildEditorFocused","isEditorFocused","isParentEditorFocused","parentEditorConfigContext","parentEditorFocus","useEditorFocus","EditorFocusProvider","children","setFocusedEditor","setFocusedEditorConfigContext","_editor","_editorConfigContext","undefined","Provider","value"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAEA,SAASA,yBAAyB,QAAQ,2CAA0C;AACpF,OAAOC,SAASC,aAAa,EAAEC,WAAW,EAAEC,UAAU,EAAEC,QAAQ,QAAQ,QAAO;AAI/E,SAASC,sBAAsB,QAAQ,0CAAyC;AAehF,MAAMC,mCAAqBL,cAAsC;IAC/DM,YAAY;IACZC,QAAQ;IACRC,aAAa;IACbC,eAAe;IACfC,4BAA4B;IAC5BC,sBAAsB;IACtBC,iBAAiB;IACjBC,uBAAuB;IACvBC,2BAA2B;IAC3BC,mBAAmB;AACrB;AAEA,OAAO,MAAMC,iBAAiB;IAC5B,OAAOd,WAAWG;AACpB,EAAC;AAED,OAAO,MAAMY,sBAAsB,CAAC,EAAEC,QAAQ,EAAE;IAC9C,MAAMH,oBAAoBC;IAC1B,MAAMF,4BAA4BV,yBAAyB,+EAA+E;;IAC1I,MAAM,CAACG,OAAO,GAAGT;IAEjB,MAAM,CAACW,eAAeU,iBAAiB,GAAGhB,SAA+B;IACzE,MAAM,CAACO,4BAA4BU,8BAA8B,GAC/DjB,SAAyC;IAE3C,MAAMK,cAAcP,YAClB,CAACoB,SAAwBC;QACvBH,iBAAiBE,YAAYE,YAAYF,UAAUd;QACnDa,8BAA8BE;QAC9B,IAAIP,kBAAkBP,WAAW,EAAE;YACjCO,kBAAkBP,WAAW,CAC3Ba,YAAYE,YAAYF,UAAUd,QAClCe;QAEJ;IACF,GACA;QAACf;QAAQQ;KAAkB;IAG7B,MAAMT,aAAaL,YAAY;QAC7B,IAAIQ,kBAAkBF,QAAQ;YAC5BY,iBAAiB;YACjBC,8BAA8B;QAChC;IACF,GAAG;QAACb;QAAQE;KAAc;IAE1B,MAAMG,kBAAkBX,YAAY;QAClC,OAAOQ,kBAAkBF;IAC3B,GAAG;QAACA;QAAQE;KAAc;IAE1B,MAAMI,wBAAwBZ,YAAY;QACxC,OAAOc,mBAAmBH,kBAAkBG,kBAAkBH,eAAe,KAAK;IACpF,GAAG;QAACG;KAAkB;IAEtB,MAAMJ,uBAAuBV,YAAY;QACvC,OAAOQ,kBAAkBF,UAAU,CAAC,CAACE;IACvC,GAAG;QAACF;QAAQE;KAAc;IAE1B,qBACE,oBAACJ,mBAAmBmB,QAAQ;QAC1BC,OAAO;YACLnB;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;QACF;OAECG;AAGP,EAAC"}
+{"version":3,"sources":["../../../src/field/lexical/EditorFocusProvider.tsx"],"sourcesContent":["import type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport React, { createContext, useCallback, useContext, useState } from 'react'\n\nimport type { EditorConfigContextType } from './config/client/EditorConfigProvider.js'\n\nimport { useEditorConfigContext } from './config/client/EditorConfigProvider.js'\n\nexport type EditorFocusContextType = {\n  blurEditor: () => void\n  editor: LexicalEditor\n  focusEditor: (_editor?: LexicalEditor, _editorConfigContext?: EditorConfigContextType) => void\n  focusedEditor: LexicalEditor | null\n  focusedEditorConfigContext: EditorConfigContextType\n  isChildEditorFocused: () => boolean\n  isEditorFocused: () => boolean\n  isParentEditorFocused: () => boolean\n  parentEditorConfigContext: EditorConfigContextType\n  parentEditorFocus: EditorFocusContextType\n}\n\nconst EditorFocusContext = createContext<EditorFocusContextType>({\n  blurEditor: null,\n  editor: null,\n  focusEditor: null,\n  focusedEditor: null,\n  focusedEditorConfigContext: null,\n  isChildEditorFocused: null,\n  isEditorFocused: null,\n  isParentEditorFocused: null,\n  parentEditorConfigContext: null,\n  parentEditorFocus: null,\n})\n\nexport const useEditorFocus = (): EditorFocusContextType => {\n  return useContext(EditorFocusContext)\n}\n\nexport const EditorFocusProvider = ({ children }) => {\n  const parentEditorFocus = useEditorFocus()\n  const parentEditorConfigContext = useEditorConfigContext() // Is parent, as this EditorFocusProvider sits outside the EditorConfigProvider\n  const [editor] = useLexicalComposerContext()\n\n  const [focusedEditor, setFocusedEditor] = useState<LexicalEditor | null>(null)\n  const [focusedEditorConfigContext, setFocusedEditorConfigContext] =\n    useState<EditorConfigContextType | null>(null)\n\n  const focusEditor = useCallback(\n    (_editor: LexicalEditor, _editorConfigContext: EditorConfigContextType) => {\n      setFocusedEditor(_editor !== undefined ? _editor : editor)\n      setFocusedEditorConfigContext(_editorConfigContext)\n      if (parentEditorFocus.focusEditor) {\n        parentEditorFocus.focusEditor(\n          _editor !== undefined ? _editor : editor,\n          _editorConfigContext,\n        )\n      }\n    },\n    [editor, parentEditorFocus],\n  )\n\n  const blurEditor = useCallback(() => {\n    if (focusedEditor === editor) {\n      setFocusedEditor(null)\n      setFocusedEditorConfigContext(null)\n    }\n  }, [editor, focusedEditor])\n\n  const isEditorFocused = useCallback(() => {\n    return focusedEditor === editor\n  }, [editor, focusedEditor])\n\n  const isParentEditorFocused = useCallback(() => {\n    return parentEditorFocus?.isEditorFocused ? parentEditorFocus.isEditorFocused() : false\n  }, [parentEditorFocus])\n\n  const isChildEditorFocused = useCallback(() => {\n    return focusedEditor !== editor && !!focusedEditor\n  }, [editor, focusedEditor])\n\n  return (\n    <EditorFocusContext.Provider\n      value={{\n        blurEditor,\n        editor,\n        focusEditor,\n        focusedEditor,\n        focusedEditorConfigContext,\n        isChildEditorFocused,\n        isEditorFocused,\n        isParentEditorFocused,\n        parentEditorConfigContext,\n        parentEditorFocus,\n      }}\n    >\n      {children}\n    </EditorFocusContext.Provider>\n  )\n}\n"],"names":["useLexicalComposerContext","React","createContext","useCallback","useContext","useState","useEditorConfigContext","EditorFocusContext","blurEditor","editor","focusEditor","focusedEditor","focusedEditorConfigContext","isChildEditorFocused","isEditorFocused","isParentEditorFocused","parentEditorConfigContext","parentEditorFocus","useEditorFocus","EditorFocusProvider","children","setFocusedEditor","setFocusedEditorConfigContext","_editor","_editorConfigContext","undefined","Provider","value"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAEA,SAASA,yBAAyB,QAAQ,2CAA0C;AACpF,OAAOC,SAASC,aAAa,EAAEC,WAAW,EAAEC,UAAU,EAAEC,QAAQ,QAAQ,QAAO;AAI/E,SAASC,sBAAsB,QAAQ,0CAAyC;AAehF,MAAMC,mCAAqBL,cAAsC;IAC/DM,YAAY;IACZC,QAAQ;IACRC,aAAa;IACbC,eAAe;IACfC,4BAA4B;IAC5BC,sBAAsB;IACtBC,iBAAiB;IACjBC,uBAAuB;IACvBC,2BAA2B;IAC3BC,mBAAmB;AACrB;AAEA,OAAO,MAAMC,iBAAiB;IAC5B,OAAOd,WAAWG;AACpB,EAAC;AAED,OAAO,MAAMY,sBAAsB,CAAC,EAAEC,QAAQ,EAAE;IAC9C,MAAMH,oBAAoBC;IAC1B,MAAMF,4BAA4BV,yBAAyB,+EAA+E;;IAC1I,MAAM,CAACG,OAAO,GAAGT;IAEjB,MAAM,CAACW,eAAeU,iBAAiB,GAAGhB,SAA+B;IACzE,MAAM,CAACO,4BAA4BU,8BAA8B,GAC/DjB,SAAyC;IAE3C,MAAMK,cAAcP,YAClB,CAACoB,SAAwBC;QACvBH,iBAAiBE,YAAYE,YAAYF,UAAUd;QACnDa,8BAA8BE;QAC9B,IAAIP,kBAAkBP,WAAW,EAAE;YACjCO,kBAAkBP,WAAW,CAC3Ba,YAAYE,YAAYF,UAAUd,QAClCe;QAEJ;IACF,GACA;QAACf;QAAQQ;KAAkB;IAG7B,MAAMT,aAAaL,YAAY;QAC7B,IAAIQ,kBAAkBF,QAAQ;YAC5BY,iBAAiB;YACjBC,8BAA8B;QAChC;IACF,GAAG;QAACb;QAAQE;KAAc;IAE1B,MAAMG,kBAAkBX,YAAY;QAClC,OAAOQ,kBAAkBF;IAC3B,GAAG;QAACA;QAAQE;KAAc;IAE1B,MAAMI,wBAAwBZ,YAAY;QACxC,OAAOc,mBAAmBH,kBAAkBG,kBAAkBH,eAAe,KAAK;IACpF,GAAG;QAACG;KAAkB;IAEtB,MAAMJ,uBAAuBV,YAAY;QACvC,OAAOQ,kBAAkBF,UAAU,CAAC,CAACE;IACvC,GAAG;QAACF;QAAQE;KAAc;IAE1B,qBACE,KAACJ,mBAAmBmB,QAAQ;QAC1BC,OAAO;YACLnB;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;QACF;kBAECG;;AAGP,EAAC"}

package/dist/field/lexical/EditorPlugin.js

@@ -1,12 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 export const EditorPlugin = ({ anchorElem, clientProps, plugin })=>{
     if (plugin.position === 'floatingAnchorElem') {
-        return plugin.Component && /*#__PURE__*/ React.createElement(plugin.Component, {
+        return plugin.Component && /*#__PURE__*/ _jsx(plugin.Component, {
             anchorElem: anchorElem,
             clientProps: clientProps
         });
     }
-    return plugin.Component && /*#__PURE__*/ React.createElement(plugin.Component, {
+    return plugin.Component && /*#__PURE__*/ _jsx(plugin.Component, {
         clientProps: clientProps
     });
 };

package/dist/field/lexical/EditorPlugin.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/field/lexical/EditorPlugin.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport type { SanitizedPlugin } from '../features/types.js'\n\nexport const EditorPlugin: React.FC<{\n  anchorElem?: HTMLDivElement\n  clientProps: any\n  plugin: SanitizedPlugin\n}> = ({ anchorElem, clientProps, plugin }) => {\n  if (plugin.position === 'floatingAnchorElem') {\n    return (\n      plugin.Component && <plugin.Component anchorElem={anchorElem} clientProps={clientProps} />\n    )\n  }\n\n  return plugin.Component && <plugin.Component clientProps={clientProps} />\n}\n"],"names":["React","EditorPlugin","anchorElem","clientProps","plugin","position","Component"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAO;AAI9B,OAAO,MAAMC,eAIR,CAAC,EAAEC,UAAU,EAAEC,WAAW,EAAEC,MAAM,EAAE;IACvC,IAAIA,OAAOC,QAAQ,KAAK,sBAAsB;QAC5C,OACED,OAAOE,SAAS,kBAAI,oBAACF,OAAOE,SAAS;YAACJ,YAAYA;YAAYC,aAAaA;;IAE/E;IAEA,OAAOC,OAAOE,SAAS,kBAAI,oBAACF,OAAOE,SAAS;QAACH,aAAaA;;AAC5D,EAAC"}
+{"version":3,"sources":["../../../src/field/lexical/EditorPlugin.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport type { SanitizedPlugin } from '../features/types.js'\n\nexport const EditorPlugin: React.FC<{\n  anchorElem?: HTMLDivElement\n  clientProps: any\n  plugin: SanitizedPlugin\n}> = ({ anchorElem, clientProps, plugin }) => {\n  if (plugin.position === 'floatingAnchorElem') {\n    return (\n      plugin.Component && <plugin.Component anchorElem={anchorElem} clientProps={clientProps} />\n    )\n  }\n\n  return plugin.Component && <plugin.Component clientProps={clientProps} />\n}\n"],"names":["React","EditorPlugin","anchorElem","clientProps","plugin","position","Component"],"rangeMappings":";;;;;;;;;;;;","mappings":";AAAA,YAAYA,WAAW,QAAO;AAI9B,OAAO,MAAMC,eAIR,CAAC,EAAEC,UAAU,EAAEC,WAAW,EAAEC,MAAM,EAAE;IACvC,IAAIA,OAAOC,QAAQ,KAAK,sBAAsB;QAC5C,OACED,OAAOE,SAAS,kBAAI,KAACF,OAAOE,SAAS;YAACJ,YAAYA;YAAYC,aAAaA;;IAE/E;IAEA,OAAOC,OAAOE,SAAS,kBAAI,KAACF,OAAOE,SAAS;QAACH,aAAaA;;AAC5D,EAAC"}

package/dist/field/lexical/LexicalEditor.js

@@ -1,4 +1,5 @@
 'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
 import LexicalErrorBoundary from '@lexical/react/LexicalErrorBoundary.js';
 import { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin.js';
@@ -60,87 +61,118 @@ export const LexicalEditor = (props)=>{
         isSmallWidthViewport
     ]);
     const ErrorBoundaryComponent = LexicalErrorBoundary.default || LexicalErrorBoundary;
-    return /*#__PURE__*/ React.createElement(React.Fragment, null, editorConfig.features.plugins.map((plugin)=>{
-        if (plugin.position === 'aboveContainer') {
-            return /*#__PURE__*/ React.createElement(EditorPlugin, {
-                clientProps: plugin.clientProps,
-                key: plugin.key,
-                plugin: plugin
-            });
-        }
-    }), /*#__PURE__*/ React.createElement("div", {
-        className: "editor-container"
-    }, editorConfig.features.plugins.map((plugin)=>{
-        if (plugin.position === 'top') {
-            return /*#__PURE__*/ React.createElement(EditorPlugin, {
-                clientProps: plugin.clientProps,
-                key: plugin.key,
-                plugin: plugin
-            });
-        }
-    }), /*#__PURE__*/ React.createElement(RichTextPlugin, {
-        //@ts-expect-error ts being dumb
-        ErrorBoundary: ErrorBoundaryComponent,
-        contentEditable: /*#__PURE__*/ React.createElement("div", {
-            className: "editor-scroller"
-        }, /*#__PURE__*/ React.createElement("div", {
-            className: "editor",
-            ref: onRef
-        }, /*#__PURE__*/ React.createElement(LexicalContentEditable, null))),
-        placeholder: /*#__PURE__*/ React.createElement("p", {
-            className: "editor-placeholder"
-        }, "Start typing, or press '/' for commands...")
-    }), /*#__PURE__*/ React.createElement(OnChangePlugin, {
-        // Selection changes can be ignored here, reducing the
-        // frequency that the FieldComponent and Payload receive updates.
-        // Selection changes are only needed if you are saving selection state
-        ignoreSelectionChange: true,
-        onChange: (editorState, editor, tags)=>{
-            // Ignore any onChange event triggered by focus only
-            if (!tags.has('focus') || tags.size > 1) {
-                if (onChange != null) onChange(editorState, editor, tags);
-            }
-        }
-    }), floatingAnchorElem && /*#__PURE__*/ React.createElement(React.Fragment, null, !isSmallWidthViewport && editor.isEditable() && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(DraggableBlockPlugin, {
-        anchorElem: floatingAnchorElem
-    }), /*#__PURE__*/ React.createElement(AddBlockHandlePlugin, {
-        anchorElem: floatingAnchorElem
-    })), editorConfig.features.plugins.map((plugin)=>{
-        if (plugin.position === 'floatingAnchorElem' && !(plugin.desktopOnly === true && isSmallWidthViewport)) {
-            return /*#__PURE__*/ React.createElement(EditorPlugin, {
-                anchorElem: floatingAnchorElem,
-                clientProps: plugin.clientProps,
-                key: plugin.key,
-                plugin: plugin
-            });
-        }
-    }), editor.isEditable() && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(SlashMenuPlugin, {
-        anchorElem: floatingAnchorElem
-    }))), editor.isEditable() && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(HistoryPlugin, null), editorConfig?.features?.markdownTransformers?.length > 0 && /*#__PURE__*/ React.createElement(MarkdownShortcutPlugin, null)), /*#__PURE__*/ React.createElement(TabIndentationPlugin, null), editorConfig.features.plugins.map((plugin)=>{
-        if (plugin.position === 'normal') {
-            return /*#__PURE__*/ React.createElement(EditorPlugin, {
-                clientProps: plugin.clientProps,
-                key: plugin.key,
-                plugin: plugin
-            });
-        }
-    }), editorConfig.features.plugins.map((plugin)=>{
-        if (plugin.position === 'bottom') {
-            return /*#__PURE__*/ React.createElement(EditorPlugin, {
-                clientProps: plugin.clientProps,
-                key: plugin.key,
-                plugin: plugin
-            });
-        }
-    })), editorConfig.features.plugins.map((plugin)=>{
-        if (plugin.position === 'belowContainer') {
-            return /*#__PURE__*/ React.createElement(EditorPlugin, {
-                clientProps: plugin.clientProps,
-                key: plugin.key,
-                plugin: plugin
-            });
-        }
-    }));
+    return /*#__PURE__*/ _jsxs(React.Fragment, {
+        children: [
+            editorConfig.features.plugins.map((plugin)=>{
+                if (plugin.position === 'aboveContainer') {
+                    return /*#__PURE__*/ _jsx(EditorPlugin, {
+                        clientProps: plugin.clientProps,
+                        plugin: plugin
+                    }, plugin.key);
+                }
+            }),
+            /*#__PURE__*/ _jsxs("div", {
+                className: "editor-container",
+                children: [
+                    editorConfig.features.plugins.map((plugin)=>{
+                        if (plugin.position === 'top') {
+                            return /*#__PURE__*/ _jsx(EditorPlugin, {
+                                clientProps: plugin.clientProps,
+                                plugin: plugin
+                            }, plugin.key);
+                        }
+                    }),
+                    /*#__PURE__*/ _jsx(RichTextPlugin, {
+                        //@ts-expect-error ts being dumb
+                        ErrorBoundary: ErrorBoundaryComponent,
+                        contentEditable: /*#__PURE__*/ _jsx("div", {
+                            className: "editor-scroller",
+                            children: /*#__PURE__*/ _jsx("div", {
+                                className: "editor",
+                                ref: onRef,
+                                children: /*#__PURE__*/ _jsx(LexicalContentEditable, {})
+                            })
+                        }),
+                        placeholder: /*#__PURE__*/ _jsx("p", {
+                            className: "editor-placeholder",
+                            children: "Start typing, or press '/' for commands..."
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(OnChangePlugin, {
+                        // Selection changes can be ignored here, reducing the
+                        // frequency that the FieldComponent and Payload receive updates.
+                        // Selection changes are only needed if you are saving selection state
+                        ignoreSelectionChange: true,
+                        onChange: (editorState, editor, tags)=>{
+                            // Ignore any onChange event triggered by focus only
+                            if (!tags.has('focus') || tags.size > 1) {
+                                if (onChange != null) onChange(editorState, editor, tags);
+                            }
+                        }
+                    }),
+                    floatingAnchorElem && /*#__PURE__*/ _jsxs(React.Fragment, {
+                        children: [
+                            !isSmallWidthViewport && editor.isEditable() && /*#__PURE__*/ _jsxs(React.Fragment, {
+                                children: [
+                                    /*#__PURE__*/ _jsx(DraggableBlockPlugin, {
+                                        anchorElem: floatingAnchorElem
+                                    }),
+                                    /*#__PURE__*/ _jsx(AddBlockHandlePlugin, {
+                                        anchorElem: floatingAnchorElem
+                                    })
+                                ]
+                            }),
+                            editorConfig.features.plugins.map((plugin)=>{
+                                if (plugin.position === 'floatingAnchorElem' && !(plugin.desktopOnly === true && isSmallWidthViewport)) {
+                                    return /*#__PURE__*/ _jsx(EditorPlugin, {
+                                        anchorElem: floatingAnchorElem,
+                                        clientProps: plugin.clientProps,
+                                        plugin: plugin
+                                    }, plugin.key);
+                                }
+                            }),
+                            editor.isEditable() && /*#__PURE__*/ _jsx(React.Fragment, {
+                                children: /*#__PURE__*/ _jsx(SlashMenuPlugin, {
+                                    anchorElem: floatingAnchorElem
+                                })
+                            })
+                        ]
+                    }),
+                    editor.isEditable() && /*#__PURE__*/ _jsxs(React.Fragment, {
+                        children: [
+                            /*#__PURE__*/ _jsx(HistoryPlugin, {}),
+                            editorConfig?.features?.markdownTransformers?.length > 0 && /*#__PURE__*/ _jsx(MarkdownShortcutPlugin, {})
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsx(TabIndentationPlugin, {}),
+                    editorConfig.features.plugins.map((plugin)=>{
+                        if (plugin.position === 'normal') {
+                            return /*#__PURE__*/ _jsx(EditorPlugin, {
+                                clientProps: plugin.clientProps,
+                                plugin: plugin
+                            }, plugin.key);
+                        }
+                    }),
+                    editorConfig.features.plugins.map((plugin)=>{
+                        if (plugin.position === 'bottom') {
+                            return /*#__PURE__*/ _jsx(EditorPlugin, {
+                                clientProps: plugin.clientProps,
+                                plugin: plugin
+                            }, plugin.key);
+                        }
+                    })
+                ]
+            }),
+            editorConfig.features.plugins.map((plugin)=>{
+                if (plugin.position === 'belowContainer') {
+                    return /*#__PURE__*/ _jsx(EditorPlugin, {
+                        clientProps: plugin.clientProps,
+                        plugin: plugin
+                    }, plugin.key);
+                }
+            })
+        ]
+    });
 };
 
 //# sourceMappingURL=LexicalEditor.js.map

package/dist/field/lexical/LexicalEditor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/field/lexical/LexicalEditor.tsx"],"sourcesContent":["'use client'\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport LexicalErrorBoundary from '@lexical/react/LexicalErrorBoundary.js'\nimport { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin.js'\nimport { OnChangePlugin } from '@lexical/react/LexicalOnChangePlugin.js'\nimport { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin.js'\nimport { TabIndentationPlugin } from '@lexical/react/LexicalTabIndentationPlugin.js'\nimport { mergeRegister } from '@lexical/utils'\nimport { BLUR_COMMAND, COMMAND_PRIORITY_LOW, FOCUS_COMMAND } from 'lexical'\nimport * as React from 'react'\nimport { useEffect, useState } from 'react'\n\nimport type { LexicalProviderProps } from './LexicalProvider.js'\n\nimport { useEditorFocus } from './EditorFocusProvider.js'\nimport { EditorPlugin } from './EditorPlugin.js'\nimport './LexicalEditor.scss'\nimport { useEditorConfigContext } from './config/client/EditorConfigProvider.js'\nimport { MarkdownShortcutPlugin } from './plugins/MarkdownShortcut/index.js'\nimport { SlashMenuPlugin } from './plugins/SlashMenu/index.js'\nimport { AddBlockHandlePlugin } from './plugins/handles/AddBlockHandlePlugin/index.js'\nimport { DraggableBlockPlugin } from './plugins/handles/DraggableBlockPlugin/index.js'\nimport { LexicalContentEditable } from './ui/ContentEditable.js'\n\nexport const LexicalEditor: React.FC<Pick<LexicalProviderProps, 'editorConfig' | 'onChange'>> = (\n  props,\n) => {\n  const { editorConfig, onChange } = props\n  const editorConfigContext = useEditorConfigContext()\n  const [editor] = useLexicalComposerContext()\n  const editorFocus = useEditorFocus()\n\n  const [floatingAnchorElem, setFloatingAnchorElem] = useState<HTMLDivElement | null>(null)\n  const onRef = (_floatingAnchorElem: HTMLDivElement) => {\n    if (_floatingAnchorElem !== null) {\n      setFloatingAnchorElem(_floatingAnchorElem)\n    }\n  }\n\n  useEffect(() => {\n    return mergeRegister(\n      editor.registerCommand<MouseEvent>(\n        FOCUS_COMMAND,\n        () => {\n          editorFocus.focusEditor(editor, editorConfigContext)\n          return true\n        },\n\n        COMMAND_PRIORITY_LOW,\n      ),\n      editor.registerCommand<MouseEvent>(\n        BLUR_COMMAND,\n        () => {\n          editorFocus.blurEditor()\n          return true\n        },\n\n        COMMAND_PRIORITY_LOW,\n      ),\n    )\n  }, [editor, editorConfig, editorConfigContext, editorFocus])\n\n  const [isSmallWidthViewport, setIsSmallWidthViewport] = useState<boolean>(false)\n\n  useEffect(() => {\n    const updateViewPortWidth = () => {\n      const isNextSmallWidthViewport = window.matchMedia('(max-width: 768px)').matches\n\n      if (isNextSmallWidthViewport !== isSmallWidthViewport) {\n        setIsSmallWidthViewport(isNextSmallWidthViewport)\n      }\n    }\n    updateViewPortWidth()\n    window.addEventListener('resize', updateViewPortWidth)\n\n    return () => {\n      window.removeEventListener('resize', updateViewPortWidth)\n    }\n  }, [isSmallWidthViewport])\n\n  const ErrorBoundaryComponent = LexicalErrorBoundary.default || LexicalErrorBoundary\n\n  return (\n    <React.Fragment>\n      {editorConfig.features.plugins.map((plugin) => {\n        if (plugin.position === 'aboveContainer') {\n          return <EditorPlugin clientProps={plugin.clientProps} key={plugin.key} plugin={plugin} />\n        }\n      })}\n      <div className=\"editor-container\">\n        {editorConfig.features.plugins.map((plugin) => {\n          if (plugin.position === 'top') {\n            return (\n              <EditorPlugin clientProps={plugin.clientProps} key={plugin.key} plugin={plugin} />\n            )\n          }\n        })}\n        <RichTextPlugin\n          //@ts-expect-error ts being dumb\n          ErrorBoundary={ErrorBoundaryComponent}\n          contentEditable={\n            <div className=\"editor-scroller\">\n              <div className=\"editor\" ref={onRef}>\n                <LexicalContentEditable />\n              </div>\n            </div>\n          }\n          placeholder={\n            <p className=\"editor-placeholder\">\n              Start typing, or press &apos;/&apos; for commands...\n            </p>\n          }\n        />\n        <OnChangePlugin\n          // Selection changes can be ignored here, reducing the\n          // frequency that the FieldComponent and Payload receive updates.\n          // Selection changes are only needed if you are saving selection state\n          ignoreSelectionChange\n          onChange={(editorState, editor, tags) => {\n            // Ignore any onChange event triggered by focus only\n            if (!tags.has('focus') || tags.size > 1) {\n              if (onChange != null) onChange(editorState, editor, tags)\n            }\n          }}\n        />\n        {floatingAnchorElem && (\n          <React.Fragment>\n            {!isSmallWidthViewport && editor.isEditable() && (\n              <React.Fragment>\n                <DraggableBlockPlugin anchorElem={floatingAnchorElem} />\n                <AddBlockHandlePlugin anchorElem={floatingAnchorElem} />\n              </React.Fragment>\n            )}\n            {editorConfig.features.plugins.map((plugin) => {\n              if (\n                plugin.position === 'floatingAnchorElem' &&\n                !(plugin.desktopOnly === true && isSmallWidthViewport)\n              ) {\n                return (\n                  <EditorPlugin\n                    anchorElem={floatingAnchorElem}\n                    clientProps={plugin.clientProps}\n                    key={plugin.key}\n                    plugin={plugin}\n                  />\n                )\n              }\n            })}\n            {editor.isEditable() && (\n              <React.Fragment>\n                <SlashMenuPlugin anchorElem={floatingAnchorElem} />\n              </React.Fragment>\n            )}\n          </React.Fragment>\n        )}\n        {editor.isEditable() && (\n          <React.Fragment>\n            <HistoryPlugin />\n            {editorConfig?.features?.markdownTransformers?.length > 0 && <MarkdownShortcutPlugin />}\n          </React.Fragment>\n        )}\n\n        <TabIndentationPlugin />\n        {editorConfig.features.plugins.map((plugin) => {\n          if (plugin.position === 'normal') {\n            return (\n              <EditorPlugin clientProps={plugin.clientProps} key={plugin.key} plugin={plugin} />\n            )\n          }\n        })}\n        {editorConfig.features.plugins.map((plugin) => {\n          if (plugin.position === 'bottom') {\n            return (\n              <EditorPlugin clientProps={plugin.clientProps} key={plugin.key} plugin={plugin} />\n            )\n          }\n        })}\n      </div>\n      {editorConfig.features.plugins.map((plugin) => {\n        if (plugin.position === 'belowContainer') {\n          return <EditorPlugin clientProps={plugin.clientProps} key={plugin.key} plugin={plugin} />\n        }\n      })}\n    </React.Fragment>\n  )\n}\n"],"names":["useLexicalComposerContext","LexicalErrorBoundary","HistoryPlugin","OnChangePlugin","RichTextPlugin","TabIndentationPlugin","mergeRegister","BLUR_COMMAND","COMMAND_PRIORITY_LOW","FOCUS_COMMAND","React","useEffect","useState","useEditorFocus","EditorPlugin","useEditorConfigContext","MarkdownShortcutPlugin","SlashMenuPlugin","AddBlockHandlePlugin","DraggableBlockPlugin","LexicalContentEditable","LexicalEditor","props","editorConfig","onChange","editorConfigContext","editor","editorFocus","floatingAnchorElem","setFloatingAnchorElem","onRef","_floatingAnchorElem","registerCommand","focusEditor","blurEditor","isSmallWidthViewport","setIsSmallWidthViewport","updateViewPortWidth","isNextSmallWidthViewport","window","matchMedia","matches","addEventListener","removeEventListener","ErrorBoundaryComponent","default","Fragment","features","plugins","map","plugin","position","clientProps","key","div","className","ErrorBoundary","contentEditable","ref","placeholder","p","ignoreSelectionChange","editorState","tags","has","size","isEditable","anchorElem","desktopOnly","markdownTransformers","length"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/field/lexical/LexicalEditor.tsx"],"sourcesContent":["'use client'\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport LexicalErrorBoundary from '@lexical/react/LexicalErrorBoundary.js'\nimport { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin.js'\nimport { OnChangePlugin } from '@lexical/react/LexicalOnChangePlugin.js'\nimport { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin.js'\nimport { TabIndentationPlugin } from '@lexical/react/LexicalTabIndentationPlugin.js'\nimport { mergeRegister } from '@lexical/utils'\nimport { BLUR_COMMAND, COMMAND_PRIORITY_LOW, FOCUS_COMMAND } from 'lexical'\nimport * as React from 'react'\nimport { useEffect, useState } from 'react'\n\nimport type { LexicalProviderProps } from './LexicalProvider.js'\n\nimport { useEditorFocus } from './EditorFocusProvider.js'\nimport { EditorPlugin } from './EditorPlugin.js'\nimport './LexicalEditor.scss'\nimport { useEditorConfigContext } from './config/client/EditorConfigProvider.js'\nimport { MarkdownShortcutPlugin } from './plugins/MarkdownShortcut/index.js'\nimport { SlashMenuPlugin } from './plugins/SlashMenu/index.js'\nimport { AddBlockHandlePlugin } from './plugins/handles/AddBlockHandlePlugin/index.js'\nimport { DraggableBlockPlugin } from './plugins/handles/DraggableBlockPlugin/index.js'\nimport { LexicalContentEditable } from './ui/ContentEditable.js'\n\nexport const LexicalEditor: React.FC<Pick<LexicalProviderProps, 'editorConfig' | 'onChange'>> = (\n  props,\n) => {\n  const { editorConfig, onChange } = props\n  const editorConfigContext = useEditorConfigContext()\n  const [editor] = useLexicalComposerContext()\n  const editorFocus = useEditorFocus()\n\n  const [floatingAnchorElem, setFloatingAnchorElem] = useState<HTMLDivElement | null>(null)\n  const onRef = (_floatingAnchorElem: HTMLDivElement) => {\n    if (_floatingAnchorElem !== null) {\n      setFloatingAnchorElem(_floatingAnchorElem)\n    }\n  }\n\n  useEffect(() => {\n    return mergeRegister(\n      editor.registerCommand<MouseEvent>(\n        FOCUS_COMMAND,\n        () => {\n          editorFocus.focusEditor(editor, editorConfigContext)\n          return true\n        },\n\n        COMMAND_PRIORITY_LOW,\n      ),\n      editor.registerCommand<MouseEvent>(\n        BLUR_COMMAND,\n        () => {\n          editorFocus.blurEditor()\n          return true\n        },\n\n        COMMAND_PRIORITY_LOW,\n      ),\n    )\n  }, [editor, editorConfig, editorConfigContext, editorFocus])\n\n  const [isSmallWidthViewport, setIsSmallWidthViewport] = useState<boolean>(false)\n\n  useEffect(() => {\n    const updateViewPortWidth = () => {\n      const isNextSmallWidthViewport = window.matchMedia('(max-width: 768px)').matches\n\n      if (isNextSmallWidthViewport !== isSmallWidthViewport) {\n        setIsSmallWidthViewport(isNextSmallWidthViewport)\n      }\n    }\n    updateViewPortWidth()\n    window.addEventListener('resize', updateViewPortWidth)\n\n    return () => {\n      window.removeEventListener('resize', updateViewPortWidth)\n    }\n  }, [isSmallWidthViewport])\n\n  const ErrorBoundaryComponent = LexicalErrorBoundary.default || LexicalErrorBoundary\n\n  return (\n    <React.Fragment>\n      {editorConfig.features.plugins.map((plugin) => {\n        if (plugin.position === 'aboveContainer') {\n          return <EditorPlugin clientProps={plugin.clientProps} key={plugin.key} plugin={plugin} />\n        }\n      })}\n      <div className=\"editor-container\">\n        {editorConfig.features.plugins.map((plugin) => {\n          if (plugin.position === 'top') {\n            return (\n              <EditorPlugin clientProps={plugin.clientProps} key={plugin.key} plugin={plugin} />\n            )\n          }\n        })}\n        <RichTextPlugin\n          //@ts-expect-error ts being dumb\n          ErrorBoundary={ErrorBoundaryComponent}\n          contentEditable={\n            <div className=\"editor-scroller\">\n              <div className=\"editor\" ref={onRef}>\n                <LexicalContentEditable />\n              </div>\n            </div>\n          }\n          placeholder={\n            <p className=\"editor-placeholder\">\n              Start typing, or press &apos;/&apos; for commands...\n            </p>\n          }\n        />\n        <OnChangePlugin\n          // Selection changes can be ignored here, reducing the\n          // frequency that the FieldComponent and Payload receive updates.\n          // Selection changes are only needed if you are saving selection state\n          ignoreSelectionChange\n          onChange={(editorState, editor, tags) => {\n            // Ignore any onChange event triggered by focus only\n            if (!tags.has('focus') || tags.size > 1) {\n              if (onChange != null) onChange(editorState, editor, tags)\n            }\n          }}\n        />\n        {floatingAnchorElem && (\n          <React.Fragment>\n            {!isSmallWidthViewport && editor.isEditable() && (\n              <React.Fragment>\n                <DraggableBlockPlugin anchorElem={floatingAnchorElem} />\n                <AddBlockHandlePlugin anchorElem={floatingAnchorElem} />\n              </React.Fragment>\n            )}\n            {editorConfig.features.plugins.map((plugin) => {\n              if (\n                plugin.position === 'floatingAnchorElem' &&\n                !(plugin.desktopOnly === true && isSmallWidthViewport)\n              ) {\n                return (\n                  <EditorPlugin\n                    anchorElem={floatingAnchorElem}\n                    clientProps={plugin.clientProps}\n                    key={plugin.key}\n                    plugin={plugin}\n                  />\n                )\n              }\n            })}\n            {editor.isEditable() && (\n              <React.Fragment>\n                <SlashMenuPlugin anchorElem={floatingAnchorElem} />\n              </React.Fragment>\n            )}\n          </React.Fragment>\n        )}\n        {editor.isEditable() && (\n          <React.Fragment>\n            <HistoryPlugin />\n            {editorConfig?.features?.markdownTransformers?.length > 0 && <MarkdownShortcutPlugin />}\n          </React.Fragment>\n        )}\n\n        <TabIndentationPlugin />\n        {editorConfig.features.plugins.map((plugin) => {\n          if (plugin.position === 'normal') {\n            return (\n              <EditorPlugin clientProps={plugin.clientProps} key={plugin.key} plugin={plugin} />\n            )\n          }\n        })}\n        {editorConfig.features.plugins.map((plugin) => {\n          if (plugin.position === 'bottom') {\n            return (\n              <EditorPlugin clientProps={plugin.clientProps} key={plugin.key} plugin={plugin} />\n            )\n          }\n        })}\n      </div>\n      {editorConfig.features.plugins.map((plugin) => {\n        if (plugin.position === 'belowContainer') {\n          return <EditorPlugin clientProps={plugin.clientProps} key={plugin.key} plugin={plugin} />\n        }\n      })}\n    </React.Fragment>\n  )\n}\n"],"names":["useLexicalComposerContext","LexicalErrorBoundary","HistoryPlugin","OnChangePlugin","RichTextPlugin","TabIndentationPlugin","mergeRegister","BLUR_COMMAND","COMMAND_PRIORITY_LOW","FOCUS_COMMAND","React","useEffect","useState","useEditorFocus","EditorPlugin","useEditorConfigContext","MarkdownShortcutPlugin","SlashMenuPlugin","AddBlockHandlePlugin","DraggableBlockPlugin","LexicalContentEditable","LexicalEditor","props","editorConfig","onChange","editorConfigContext","editor","editorFocus","floatingAnchorElem","setFloatingAnchorElem","onRef","_floatingAnchorElem","registerCommand","focusEditor","blurEditor","isSmallWidthViewport","setIsSmallWidthViewport","updateViewPortWidth","isNextSmallWidthViewport","window","matchMedia","matches","addEventListener","removeEventListener","ErrorBoundaryComponent","default","Fragment","features","plugins","map","plugin","position","clientProps","key","div","className","ErrorBoundary","contentEditable","ref","placeholder","p","ignoreSelectionChange","editorState","tags","has","size","isEditable","anchorElem","desktopOnly","markdownTransformers","length"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/dist/field/lexical/LexicalEditor.scss

@@ -22,10 +22,19 @@
     }
   }
 
+  &--show-gutter  {
+    > .rich-text-lexical__wrap > .editor-container > .editor-placeholder {
+      left: 3rem;
+    }
+  }
+
+  &:not(&--show-gutter) > .rich-text-lexical__wrap > .editor-container > .editor-placeholder {
+    left: 0;
+  }
+
   .editor-placeholder {
     position: absolute;
     top: 8px;
-    left: 0;
     font-size: 15px;
     color: var(--theme-elevation-500);
     /* Prevent text selection */

package/dist/field/lexical/LexicalProvider.js

@@ -1,4 +1,5 @@
 'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { LexicalComposer } from '@lexical/react/LexicalComposer.js';
 import * as React from 'react';
 import { EditorFocusProvider } from './EditorFocusProvider.js';
@@ -48,18 +49,23 @@ export const LexicalProvider = (props)=>{
         throw new Error('You have tried to pass in data from payload-plugin-lexical. This is not supported. The data structure has changed in this editor, compared to the plugin, and there is no automatic conversion available yet (coming soon). Please remove the data from the field and start again.');
     }
     if (!initialConfig) {
-        return /*#__PURE__*/ React.createElement("p", null, "Loading...");
+        return /*#__PURE__*/ _jsx("p", {
+            children: "Loading..."
+        });
     }
-    return /*#__PURE__*/ React.createElement(LexicalComposer, {
+    return /*#__PURE__*/ _jsx(LexicalComposer, {
         initialConfig: initialConfig,
-        key: path
-    }, /*#__PURE__*/ React.createElement(EditorFocusProvider, null, /*#__PURE__*/ React.createElement(EditorConfigProvider, {
-        editorConfig: editorConfig,
-        fieldProps: fieldProps
-    }, /*#__PURE__*/ React.createElement(LexicalEditorComponent, {
-        editorConfig: editorConfig,
-        onChange: onChange
-    }))));
+        children: /*#__PURE__*/ _jsx(EditorFocusProvider, {
+            children: /*#__PURE__*/ _jsx(EditorConfigProvider, {
+                editorConfig: editorConfig,
+                fieldProps: fieldProps,
+                children: /*#__PURE__*/ _jsx(LexicalEditorComponent, {
+                    editorConfig: editorConfig,
+                    onChange: onChange
+                })
+            })
+        })
+    }, path);
 };
 
 //# sourceMappingURL=LexicalProvider.js.map

package/dist/field/lexical/LexicalProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/field/lexical/LexicalProvider.tsx"],"sourcesContent":["'use client'\nimport type { InitialConfigType } from '@lexical/react/LexicalComposer.js'\nimport type { FormFieldBase } from '@payloadcms/ui/fields/shared'\nimport type { EditorState, SerializedEditorState } from 'lexical'\nimport type { LexicalEditor } from 'lexical'\n\nimport { LexicalComposer } from '@lexical/react/LexicalComposer.js'\nimport * as React from 'react'\n\nimport type { SanitizedClientEditorConfig } from './config/types.js'\n\nimport { EditorFocusProvider } from './EditorFocusProvider.js'\nimport { LexicalEditor as LexicalEditorComponent } from './LexicalEditor.js'\nimport { EditorConfigProvider } from './config/client/EditorConfigProvider.js'\nimport { getEnabledNodes } from './nodes/index.js'\n\nexport type LexicalProviderProps = {\n  editorConfig: SanitizedClientEditorConfig\n  fieldProps: FormFieldBase & {\n    editorConfig: SanitizedClientEditorConfig // With rendered features n stuff\n    name: string\n    richTextComponentMap: Map<string, React.ReactNode>\n  }\n  onChange: (editorState: EditorState, editor: LexicalEditor, tags: Set<string>) => void\n  path: string\n  readOnly: boolean\n  value: SerializedEditorState\n}\nexport const LexicalProvider: React.FC<LexicalProviderProps> = (props) => {\n  const { editorConfig, fieldProps, onChange, path, readOnly } = props\n  let { value } = props\n\n  const [initialConfig, setInitialConfig] = React.useState<InitialConfigType | null>(null)\n\n  // set lexical config in useEffect: // TODO: Is this the most performant way to do this? Prob not\n  React.useEffect(() => {\n    const newInitialConfig: InitialConfigType = {\n      editable: readOnly !== true,\n      editorState: value != null ? JSON.stringify(value) : undefined,\n      namespace: editorConfig.lexical.namespace,\n      nodes: [...getEnabledNodes({ editorConfig })],\n      onError: (error: Error) => {\n        throw error\n      },\n      theme: editorConfig.lexical.theme,\n    }\n    setInitialConfig(newInitialConfig)\n  }, [editorConfig, readOnly, value])\n\n  if (editorConfig?.features?.hooks?.load?.length) {\n    editorConfig.features.hooks.load.forEach((hook) => {\n      value = hook({ incomingEditorState: value })\n    })\n  }\n\n  if (value && typeof value !== 'object') {\n    throw new Error(\n      'The value passed to the Lexical editor is not an object. This is not supported. Please remove the data from the field and start again. This is the value that was passed in: ' +\n        JSON.stringify(value),\n    )\n  }\n\n  if (value && Array.isArray(value) && !('root' in value)) {\n    throw new Error(\n      'You have tried to pass in data from the old, Slate editor, to the new, Lexical editor. This is not supported. There is no automatic conversion from Slate to Lexical data available yet (coming soon). Please remove the data from the field and start again.',\n    )\n  }\n\n  if (value && 'jsonContent' in value) {\n    throw new Error(\n      'You have tried to pass in data from payload-plugin-lexical. This is not supported. The data structure has changed in this editor, compared to the plugin, and there is no automatic conversion available yet (coming soon). Please remove the data from the field and start again.',\n    )\n  }\n\n  if (!initialConfig) {\n    return <p>Loading...</p>\n  }\n\n  return (\n    <LexicalComposer initialConfig={initialConfig} key={path}>\n      <EditorFocusProvider>\n        <EditorConfigProvider editorConfig={editorConfig} fieldProps={fieldProps}>\n          <LexicalEditorComponent editorConfig={editorConfig} onChange={onChange} />\n        </EditorConfigProvider>\n      </EditorFocusProvider>\n    </LexicalComposer>\n  )\n}\n"],"names":["LexicalComposer","React","EditorFocusProvider","LexicalEditor","LexicalEditorComponent","EditorConfigProvider","getEnabledNodes","LexicalProvider","props","editorConfig","fieldProps","onChange","path","readOnly","value","initialConfig","setInitialConfig","useState","useEffect","newInitialConfig","editable","editorState","JSON","stringify","undefined","namespace","lexical","nodes","onError","error","theme","features","hooks","load","length","forEach","hook","incomingEditorState","Error","Array","isArray","p","key"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;AAMA,SAASA,eAAe,QAAQ,oCAAmC;AACnE,YAAYC,WAAW,QAAO;AAI9B,SAASC,mBAAmB,QAAQ,2BAA0B;AAC9D,SAASC,iBAAiBC,sBAAsB,QAAQ,qBAAoB;AAC5E,SAASC,oBAAoB,QAAQ,0CAAyC;AAC9E,SAASC,eAAe,QAAQ,mBAAkB;AAclD,OAAO,MAAMC,kBAAkD,CAACC;IAC9D,MAAM,EAAEC,YAAY,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,IAAI,EAAEC,QAAQ,EAAE,GAAGL;IAC/D,IAAI,EAAEM,KAAK,EAAE,GAAGN;IAEhB,MAAM,CAACO,eAAeC,iBAAiB,GAAGf,MAAMgB,QAAQ,CAA2B;IAEnF,iGAAiG;IACjGhB,MAAMiB,SAAS,CAAC;QACd,MAAMC,mBAAsC;YAC1CC,UAAUP,aAAa;YACvBQ,aAAaP,SAAS,OAAOQ,KAAKC,SAAS,CAACT,SAASU;YACrDC,WAAWhB,aAAaiB,OAAO,CAACD,SAAS;YACzCE,OAAO;mBAAIrB,gBAAgB;oBAAEG;gBAAa;aAAG;YAC7CmB,SAAS,CAACC;gBACR,MAAMA;YACR;YACAC,OAAOrB,aAAaiB,OAAO,CAACI,KAAK;QACnC;QACAd,iBAAiBG;IACnB,GAAG;QAACV;QAAcI;QAAUC;KAAM;IAElC,IAAIL,cAAcsB,UAAUC,OAAOC,MAAMC,QAAQ;QAC/CzB,aAAasB,QAAQ,CAACC,KAAK,CAACC,IAAI,CAACE,OAAO,CAAC,CAACC;YACxCtB,QAAQsB,KAAK;gBAAEC,qBAAqBvB;YAAM;QAC5C;IACF;IAEA,IAAIA,SAAS,OAAOA,UAAU,UAAU;QACtC,MAAM,IAAIwB,MACR,kLACEhB,KAAKC,SAAS,CAACT;IAErB;IAEA,IAAIA,SAASyB,MAAMC,OAAO,CAAC1B,UAAU,CAAE,CAAA,UAAUA,KAAI,GAAI;QACvD,MAAM,IAAIwB,MACR;IAEJ;IAEA,IAAIxB,SAAS,iBAAiBA,OAAO;QACnC,MAAM,IAAIwB,MACR;IAEJ;IAEA,IAAI,CAACvB,eAAe;QAClB,qBAAO,oBAAC0B,WAAE;IACZ;IAEA,qBACE,oBAACzC;QAAgBe,eAAeA;QAAe2B,KAAK9B;qBAClD,oBAACV,yCACC,oBAACG;QAAqBI,cAAcA;QAAcC,YAAYA;qBAC5D,oBAACN;QAAuBK,cAAcA;QAAcE,UAAUA;;AAKxE,EAAC"}
+{"version":3,"sources":["../../../src/field/lexical/LexicalProvider.tsx"],"sourcesContent":["'use client'\nimport type { InitialConfigType } from '@lexical/react/LexicalComposer.js'\nimport type { FormFieldBase } from '@payloadcms/ui/fields/shared'\nimport type { EditorState, SerializedEditorState } from 'lexical'\nimport type { LexicalEditor } from 'lexical'\n\nimport { LexicalComposer } from '@lexical/react/LexicalComposer.js'\nimport * as React from 'react'\n\nimport type { SanitizedClientEditorConfig } from './config/types.js'\n\nimport { EditorFocusProvider } from './EditorFocusProvider.js'\nimport { LexicalEditor as LexicalEditorComponent } from './LexicalEditor.js'\nimport { EditorConfigProvider } from './config/client/EditorConfigProvider.js'\nimport { getEnabledNodes } from './nodes/index.js'\n\nexport type LexicalProviderProps = {\n  editorConfig: SanitizedClientEditorConfig\n  fieldProps: FormFieldBase & {\n    editorConfig: SanitizedClientEditorConfig // With rendered features n stuff\n    name: string\n    richTextComponentMap: Map<string, React.ReactNode>\n  }\n  onChange: (editorState: EditorState, editor: LexicalEditor, tags: Set<string>) => void\n  path: string\n  readOnly: boolean\n  value: SerializedEditorState\n}\nexport const LexicalProvider: React.FC<LexicalProviderProps> = (props) => {\n  const { editorConfig, fieldProps, onChange, path, readOnly } = props\n  let { value } = props\n\n  const [initialConfig, setInitialConfig] = React.useState<InitialConfigType | null>(null)\n\n  // set lexical config in useEffect: // TODO: Is this the most performant way to do this? Prob not\n  React.useEffect(() => {\n    const newInitialConfig: InitialConfigType = {\n      editable: readOnly !== true,\n      editorState: value != null ? JSON.stringify(value) : undefined,\n      namespace: editorConfig.lexical.namespace,\n      nodes: [...getEnabledNodes({ editorConfig })],\n      onError: (error: Error) => {\n        throw error\n      },\n      theme: editorConfig.lexical.theme,\n    }\n    setInitialConfig(newInitialConfig)\n  }, [editorConfig, readOnly, value])\n\n  if (editorConfig?.features?.hooks?.load?.length) {\n    editorConfig.features.hooks.load.forEach((hook) => {\n      value = hook({ incomingEditorState: value })\n    })\n  }\n\n  if (value && typeof value !== 'object') {\n    throw new Error(\n      'The value passed to the Lexical editor is not an object. This is not supported. Please remove the data from the field and start again. This is the value that was passed in: ' +\n        JSON.stringify(value),\n    )\n  }\n\n  if (value && Array.isArray(value) && !('root' in value)) {\n    throw new Error(\n      'You have tried to pass in data from the old, Slate editor, to the new, Lexical editor. This is not supported. There is no automatic conversion from Slate to Lexical data available yet (coming soon). Please remove the data from the field and start again.',\n    )\n  }\n\n  if (value && 'jsonContent' in value) {\n    throw new Error(\n      'You have tried to pass in data from payload-plugin-lexical. This is not supported. The data structure has changed in this editor, compared to the plugin, and there is no automatic conversion available yet (coming soon). Please remove the data from the field and start again.',\n    )\n  }\n\n  if (!initialConfig) {\n    return <p>Loading...</p>\n  }\n\n  return (\n    <LexicalComposer initialConfig={initialConfig} key={path}>\n      <EditorFocusProvider>\n        <EditorConfigProvider editorConfig={editorConfig} fieldProps={fieldProps}>\n          <LexicalEditorComponent editorConfig={editorConfig} onChange={onChange} />\n        </EditorConfigProvider>\n      </EditorFocusProvider>\n    </LexicalComposer>\n  )\n}\n"],"names":["LexicalComposer","React","EditorFocusProvider","LexicalEditor","LexicalEditorComponent","EditorConfigProvider","getEnabledNodes","LexicalProvider","props","editorConfig","fieldProps","onChange","path","readOnly","value","initialConfig","setInitialConfig","useState","useEffect","newInitialConfig","editable","editorState","JSON","stringify","undefined","namespace","lexical","nodes","onError","error","theme","features","hooks","load","length","forEach","hook","incomingEditorState","Error","Array","isArray","p"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAMA,SAASA,eAAe,QAAQ,oCAAmC;AACnE,YAAYC,WAAW,QAAO;AAI9B,SAASC,mBAAmB,QAAQ,2BAA0B;AAC9D,SAASC,iBAAiBC,sBAAsB,QAAQ,qBAAoB;AAC5E,SAASC,oBAAoB,QAAQ,0CAAyC;AAC9E,SAASC,eAAe,QAAQ,mBAAkB;AAclD,OAAO,MAAMC,kBAAkD,CAACC;IAC9D,MAAM,EAAEC,YAAY,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,IAAI,EAAEC,QAAQ,EAAE,GAAGL;IAC/D,IAAI,EAAEM,KAAK,EAAE,GAAGN;IAEhB,MAAM,CAACO,eAAeC,iBAAiB,GAAGf,MAAMgB,QAAQ,CAA2B;IAEnF,iGAAiG;IACjGhB,MAAMiB,SAAS,CAAC;QACd,MAAMC,mBAAsC;YAC1CC,UAAUP,aAAa;YACvBQ,aAAaP,SAAS,OAAOQ,KAAKC,SAAS,CAACT,SAASU;YACrDC,WAAWhB,aAAaiB,OAAO,CAACD,SAAS;YACzCE,OAAO;mBAAIrB,gBAAgB;oBAAEG;gBAAa;aAAG;YAC7CmB,SAAS,CAACC;gBACR,MAAMA;YACR;YACAC,OAAOrB,aAAaiB,OAAO,CAACI,KAAK;QACnC;QACAd,iBAAiBG;IACnB,GAAG;QAACV;QAAcI;QAAUC;KAAM;IAElC,IAAIL,cAAcsB,UAAUC,OAAOC,MAAMC,QAAQ;QAC/CzB,aAAasB,QAAQ,CAACC,KAAK,CAACC,IAAI,CAACE,OAAO,CAAC,CAACC;YACxCtB,QAAQsB,KAAK;gBAAEC,qBAAqBvB;YAAM;QAC5C;IACF;IAEA,IAAIA,SAAS,OAAOA,UAAU,UAAU;QACtC,MAAM,IAAIwB,MACR,kLACEhB,KAAKC,SAAS,CAACT;IAErB;IAEA,IAAIA,SAASyB,MAAMC,OAAO,CAAC1B,UAAU,CAAE,CAAA,UAAUA,KAAI,GAAI;QACvD,MAAM,IAAIwB,MACR;IAEJ;IAEA,IAAIxB,SAAS,iBAAiBA,OAAO;QACnC,MAAM,IAAIwB,MACR;IAEJ;IAEA,IAAI,CAACvB,eAAe;QAClB,qBAAO,KAAC0B;sBAAE;;IACZ;IAEA,qBACE,KAACzC;QAAgBe,eAAeA;kBAC9B,cAAA,KAACb;sBACC,cAAA,KAACG;gBAAqBI,cAAcA;gBAAcC,YAAYA;0BAC5D,cAAA,KAACN;oBAAuBK,cAAcA;oBAAcE,UAAUA;;;;OAHhBC;AAQxD,EAAC"}

package/dist/field/lexical/config/client/EditorConfigProvider.js

@@ -1,4 +1,5 @@
 'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { createContext, useContext, useEffect, useMemo, useState } from 'react';
 // Should always produce a 20 character pseudo-random string
@@ -26,9 +27,10 @@ export const EditorConfigProvider = ({ children, editorConfig, fieldProps })=>{
         fieldProps,
         uuid
     ]);
-    return /*#__PURE__*/ React.createElement(Context.Provider, {
-        value: editorContext
-    }, children);
+    return /*#__PURE__*/ _jsx(Context.Provider, {
+        value: editorContext,
+        children: children
+    });
 };
 export const useEditorConfigContext = ()=>{
     const context = useContext(Context);

package/dist/field/lexical/config/client/EditorConfigProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/field/lexical/config/client/EditorConfigProvider.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '@payloadcms/ui/fields/shared'\n\nimport * as React from 'react'\nimport { createContext, useContext, useEffect, useMemo, useState } from 'react'\n\nimport type { SanitizedClientEditorConfig } from '../types.js'\n\n// Should always produce a 20 character pseudo-random string\nfunction generateQuickGuid(): string {\n  return Math.random().toString(36).substring(2, 12) + Math.random().toString(36).substring(2, 12)\n}\nexport interface EditorConfigContextType {\n  editorConfig: SanitizedClientEditorConfig\n  field: FormFieldBase & {\n    editorConfig: SanitizedClientEditorConfig // With rendered features n stuff\n    name: string\n    richTextComponentMap: Map<string, React.ReactNode>\n  }\n  uuid: string\n}\n\nconst Context: React.Context<EditorConfigContextType> = createContext({\n  editorConfig: null,\n  field: null,\n  uuid: generateQuickGuid(),\n})\n\nexport const EditorConfigProvider = ({\n  children,\n  editorConfig,\n  fieldProps,\n}: {\n  children: React.ReactNode\n  editorConfig: SanitizedClientEditorConfig\n  fieldProps: FormFieldBase & {\n    editorConfig: SanitizedClientEditorConfig // With rendered features n stuff\n    name: string\n    richTextComponentMap: Map<string, React.ReactNode>\n  }\n}): React.ReactNode => {\n  // State to store the UUID\n  const [uuid, setUuid] = useState(generateQuickGuid())\n\n  // When the component mounts, generate a new UUID only once\n  useEffect(() => {\n    setUuid(generateQuickGuid())\n  }, [])\n\n  const editorContext = useMemo(\n    () => ({ editorConfig, field: fieldProps, uuid }),\n    [editorConfig, fieldProps, uuid],\n  )\n\n  return <Context.Provider value={editorContext}>{children}</Context.Provider>\n}\n\nexport const useEditorConfigContext = (): EditorConfigContextType => {\n  const context = useContext(Context)\n  if (context === undefined) {\n    throw new Error('useEditorConfigContext must be used within an EditorConfigProvider')\n  }\n  return context\n}\n"],"names":["React","createContext","useContext","useEffect","useMemo","useState","generateQuickGuid","Math","random","toString","substring","Context","editorConfig","field","uuid","EditorConfigProvider","children","fieldProps","setUuid","editorContext","Provider","value","useEditorConfigContext","context","undefined","Error"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;AAIA,YAAYA,WAAW,QAAO;AAC9B,SAASC,aAAa,EAAEC,UAAU,EAAEC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,QAAO;AAI/E,4DAA4D;AAC5D,SAASC;IACP,OAAOC,KAAKC,MAAM,GAAGC,QAAQ,CAAC,IAAIC,SAAS,CAAC,GAAG,MAAMH,KAAKC,MAAM,GAAGC,QAAQ,CAAC,IAAIC,SAAS,CAAC,GAAG;AAC/F;AAWA,MAAMC,wBAAkDV,cAAc;IACpEW,cAAc;IACdC,OAAO;IACPC,MAAMR;AACR;AAEA,OAAO,MAAMS,uBAAuB,CAAC,EACnCC,QAAQ,EACRJ,YAAY,EACZK,UAAU,EASX;IACC,0BAA0B;IAC1B,MAAM,CAACH,MAAMI,QAAQ,GAAGb,SAASC;IAEjC,2DAA2D;IAC3DH,UAAU;QACRe,QAAQZ;IACV,GAAG,EAAE;IAEL,MAAMa,gBAAgBf,QACpB,IAAO,CAAA;YAAEQ;YAAcC,OAAOI;YAAYH;QAAK,CAAA,GAC/C;QAACF;QAAcK;QAAYH;KAAK;IAGlC,qBAAO,oBAACH,QAAQS,QAAQ;QAACC,OAAOF;OAAgBH;AAClD,EAAC;AAED,OAAO,MAAMM,yBAAyB;IACpC,MAAMC,UAAUrB,WAAWS;IAC3B,IAAIY,YAAYC,WAAW;QACzB,MAAM,IAAIC,MAAM;IAClB;IACA,OAAOF;AACT,EAAC"}
+{"version":3,"sources":["../../../../../src/field/lexical/config/client/EditorConfigProvider.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '@payloadcms/ui/fields/shared'\n\nimport * as React from 'react'\nimport { createContext, useContext, useEffect, useMemo, useState } from 'react'\n\nimport type { SanitizedClientEditorConfig } from '../types.js'\n\n// Should always produce a 20 character pseudo-random string\nfunction generateQuickGuid(): string {\n  return Math.random().toString(36).substring(2, 12) + Math.random().toString(36).substring(2, 12)\n}\nexport interface EditorConfigContextType {\n  editorConfig: SanitizedClientEditorConfig\n  field: FormFieldBase & {\n    editorConfig: SanitizedClientEditorConfig // With rendered features n stuff\n    name: string\n    richTextComponentMap: Map<string, React.ReactNode>\n  }\n  uuid: string\n}\n\nconst Context: React.Context<EditorConfigContextType> = createContext({\n  editorConfig: null,\n  field: null,\n  uuid: generateQuickGuid(),\n})\n\nexport const EditorConfigProvider = ({\n  children,\n  editorConfig,\n  fieldProps,\n}: {\n  children: React.ReactNode\n  editorConfig: SanitizedClientEditorConfig\n  fieldProps: FormFieldBase & {\n    editorConfig: SanitizedClientEditorConfig // With rendered features n stuff\n    name: string\n    richTextComponentMap: Map<string, React.ReactNode>\n  }\n}): React.ReactNode => {\n  // State to store the UUID\n  const [uuid, setUuid] = useState(generateQuickGuid())\n\n  // When the component mounts, generate a new UUID only once\n  useEffect(() => {\n    setUuid(generateQuickGuid())\n  }, [])\n\n  const editorContext = useMemo(\n    () => ({ editorConfig, field: fieldProps, uuid }),\n    [editorConfig, fieldProps, uuid],\n  )\n\n  return <Context.Provider value={editorContext}>{children}</Context.Provider>\n}\n\nexport const useEditorConfigContext = (): EditorConfigContextType => {\n  const context = useContext(Context)\n  if (context === undefined) {\n    throw new Error('useEditorConfigContext must be used within an EditorConfigProvider')\n  }\n  return context\n}\n"],"names":["React","createContext","useContext","useEffect","useMemo","useState","generateQuickGuid","Math","random","toString","substring","Context","editorConfig","field","uuid","EditorConfigProvider","children","fieldProps","setUuid","editorContext","Provider","value","useEditorConfigContext","context","undefined","Error"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAIA,YAAYA,WAAW,QAAO;AAC9B,SAASC,aAAa,EAAEC,UAAU,EAAEC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,QAAO;AAI/E,4DAA4D;AAC5D,SAASC;IACP,OAAOC,KAAKC,MAAM,GAAGC,QAAQ,CAAC,IAAIC,SAAS,CAAC,GAAG,MAAMH,KAAKC,MAAM,GAAGC,QAAQ,CAAC,IAAIC,SAAS,CAAC,GAAG;AAC/F;AAWA,MAAMC,wBAAkDV,cAAc;IACpEW,cAAc;IACdC,OAAO;IACPC,MAAMR;AACR;AAEA,OAAO,MAAMS,uBAAuB,CAAC,EACnCC,QAAQ,EACRJ,YAAY,EACZK,UAAU,EASX;IACC,0BAA0B;IAC1B,MAAM,CAACH,MAAMI,QAAQ,GAAGb,SAASC;IAEjC,2DAA2D;IAC3DH,UAAU;QACRe,QAAQZ;IACV,GAAG,EAAE;IAEL,MAAMa,gBAAgBf,QACpB,IAAO,CAAA;YAAEQ;YAAcC,OAAOI;YAAYH;QAAK,CAAA,GAC/C;QAACF;QAAcK;QAAYH;KAAK;IAGlC,qBAAO,KAACH,QAAQS,QAAQ;QAACC,OAAOF;kBAAgBH;;AAClD,EAAC;AAED,OAAO,MAAMM,yBAAyB;IACpC,MAAMC,UAAUrB,WAAWS;IAC3B,IAAIY,YAAYC,WAAW;QACzB,MAAM,IAAIC,MAAM;IAClB;IACA,OAAOF;AACT,EAAC"}

package/dist/field/lexical/config/client/sanitize.d.ts

@@ -1,6 +1,7 @@
 import type { EditorConfig as LexicalEditorConfig } from 'lexical';
+import type { LexicalFieldAdminProps } from '../../../../types.js';
 import type { ResolvedClientFeatureMap, SanitizedClientFeatures } from '../../../features/types.js';
 import type { SanitizedClientEditorConfig } from '../types.js';
 export declare const sanitizeClientFeatures: (features: ResolvedClientFeatureMap) => SanitizedClientFeatures;
-export declare function sanitizeClientEditorConfig(lexical: LexicalEditorConfig, resolvedClientFeatureMap: ResolvedClientFeatureMap): SanitizedClientEditorConfig;
+export declare function sanitizeClientEditorConfig(lexical: LexicalEditorConfig, resolvedClientFeatureMap: ResolvedClientFeatureMap, admin?: LexicalFieldAdminProps): SanitizedClientEditorConfig;
 //# sourceMappingURL=sanitize.d.ts.map

package/dist/field/lexical/config/client/sanitize.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sanitize.d.ts","sourceRoot":"","sources":["../../../../../src/field/lexical/config/client/sanitize.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,IAAI,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAElE,OAAO,KAAK,EAAE,wBAAwB,EAAE,uBAAuB,EAAE,MAAM,4BAA4B,CAAA;AACnG,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,aAAa,CAAA;AAE9D,eAAO,MAAM,sBAAsB,0CAEhC,uBAiMF,CAAA;AAED,wBAAgB,0BAA0B,CACxC,OAAO,EAAE,mBAAmB,EAC5B,wBAAwB,EAAE,wBAAwB,GACjD,2BAA2B,CAM7B"}
+{"version":3,"file":"sanitize.d.ts","sourceRoot":"","sources":["../../../../../src/field/lexical/config/client/sanitize.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,IAAI,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAElE,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAA;AAClE,OAAO,KAAK,EAAE,wBAAwB,EAAE,uBAAuB,EAAE,MAAM,4BAA4B,CAAA;AACnG,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,aAAa,CAAA;AAE9D,eAAO,MAAM,sBAAsB,0CAEhC,uBAiMF,CAAA;AAED,wBAAgB,0BAA0B,CACxC,OAAO,EAAE,mBAAmB,EAC5B,wBAAwB,EAAE,wBAAwB,EAClD,KAAK,CAAC,EAAE,sBAAsB,GAC7B,2BAA2B,CAO7B"}

package/dist/field/lexical/config/client/sanitize.js

@@ -164,8 +164,9 @@ export const sanitizeClientFeatures = (features)=>{
     }
     return sanitized;
 };
-export function sanitizeClientEditorConfig(lexical, resolvedClientFeatureMap) {
+export function sanitizeClientEditorConfig(lexical, resolvedClientFeatureMap, admin) {
     return {
+        admin,
         features: sanitizeClientFeatures(resolvedClientFeatureMap),
         lexical,
         resolvedFeatureMap: resolvedClientFeatureMap