@payloadcms/richtext-lexical 3.55.0-canary.4 → 3.55.0-internal.d44d1d3

package/dist/features/toolbars/shared/ToolbarButton/index.js

@@ -28,25 +28,23 @@ export const ToolbarButton = t0 => {
   const [_state, setState] = useState(t1);
   const deferredState = useDeferredValue(_state);
   const editorConfigContext = useEditorConfigContext();
-  let t2;
-  const t3 = !deferredState.enabled ? "disabled" : "";
-  const t4 = deferredState.active ? "active" : "";
-  const t5 = item.key ? `${baseClass}-${item.key}` : "";
-  let t6;
-  if ($[1] !== t3 || $[2] !== t4 || $[3] !== t5) {
-    t6 = [baseClass, t3, t4, t5].filter(Boolean);
-    $[1] = t3;
-    $[2] = t4;
-    $[3] = t5;
-    $[4] = t6;
+  const t2 = !deferredState.enabled ? "disabled" : "";
+  const t3 = deferredState.active ? "active" : "";
+  const t4 = item.key ? `${baseClass}-${item.key}` : "";
+  let t5;
+  if ($[1] !== t2 || $[2] !== t3 || $[3] !== t4) {
+    t5 = [baseClass, t2, t3, t4].filter(Boolean);
+    $[1] = t2;
+    $[2] = t3;
+    $[3] = t4;
+    $[4] = t5;
   } else {
-    t6 = $[4];
+    t5 = $[4];
   }
-  t2 = t6.join(" ");
-  const className = t2;
-  let t7;
+  const className = t5.join(" ");
+  let t6;
   if ($[5] !== editor || $[6] !== editorConfigContext || $[7] !== item) {
-    t7 = () => {
+    t6 = () => {
       editor.getEditorState().read(() => {
         const selection = $getSelection();
         if (!selection) {
@@ -76,16 +74,16 @@ export const ToolbarButton = t0 => {
     $[5] = editor;
     $[6] = editorConfigContext;
     $[7] = item;
-    $[8] = t7;
+    $[8] = t6;
   } else {
-    t7 = $[8];
+    t6 = $[8];
   }
-  const updateStates = t7;
+  const updateStates = t6;
   const runDeprioritized = useRunDeprioritized();
+  let t7;
   let t8;
-  let t9;
   if ($[9] !== editor || $[10] !== runDeprioritized || $[11] !== updateStates) {
-    t8 = () => {
+    t7 = () => {
       runDeprioritized(updateStates);
       const listener = () => runDeprioritized(updateStates);
       const cleanup = mergeRegister(editor.registerUpdateListener(listener));
@@ -95,20 +93,20 @@ export const ToolbarButton = t0 => {
         document.removeEventListener("mouseup", listener);
       };
     };
-    t9 = [editor, runDeprioritized, updateStates];
+    t8 = [editor, runDeprioritized, updateStates];
     $[9] = editor;
     $[10] = runDeprioritized;
     $[11] = updateStates;
-    $[12] = t8;
-    $[13] = t9;
+    $[12] = t7;
+    $[13] = t8;
   } else {
-    t8 = $[12];
-    t9 = $[13];
+    t7 = $[12];
+    t8 = $[13];
   }
-  useEffect(t8, t9);
-  let t10;
+  useEffect(t7, t8);
+  let t9;
   if ($[14] !== _state || $[15] !== editor || $[16] !== item) {
-    t10 = () => {
+    t9 = () => {
       if (!_state.enabled) {
         return;
       }
@@ -123,15 +121,15 @@ export const ToolbarButton = t0 => {
     $[14] = _state;
     $[15] = editor;
     $[16] = item;
-    $[17] = t10;
+    $[17] = t9;
   } else {
-    t10 = $[17];
+    t9 = $[17];
   }
-  const handleClick = t10;
+  const handleClick = t9;
   const handleMouseDown = _temp2;
-  let t11;
+  let t10;
   if ($[18] !== children || $[19] !== className || $[20] !== handleClick || $[21] !== item.key) {
-    t11 = _jsx("button", {
+    t10 = _jsx("button", {
       className,
       "data-button-key": item.key,
       onClick: handleClick,
@@ -143,11 +141,11 @@ export const ToolbarButton = t0 => {
     $[19] = className;
     $[20] = handleClick;
     $[21] = item.key;
-    $[22] = t11;
+    $[22] = t10;
   } else {
-    t11 = $[22];
+    t10 = $[22];
   }
-  return t11;
+  return t10;
 };
 function _temp() {
   $addUpdateTag("toolbar");

package/dist/features/toolbars/shared/ToolbarButton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","mergeRegister","$addUpdateTag","$getSelection","React","useCallback","useDeferredValue","useEffect","useMemo","useState","useEditorConfigContext","useRunDeprioritized","baseClass","ToolbarButton","t0","$","children","editor","item","t1","Symbol","for","active","enabled","_state","setState","deferredState","editorConfigContext","t2","t3","t4","t5","key","t6","filter","Boolean","join","className","t7","getEditorState","read","selection","newActive","isActive","newEnabled","isEnabled","prev","updateStates","runDeprioritized","t8","t9","listener","cleanup","registerUpdateListener","document","addEventListener","removeEventListener","t10","focus","update","_temp","onSelect","handleClick","handleMouseDown","_temp2","t11","_jsx","onClick","onMouseDown","type","e","preventDefault"],"sources":["../../../../../src/features/toolbars/shared/ToolbarButton/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { mergeRegister } from '@lexical/utils'\nimport { $addUpdateTag, $getSelection } from 'lexical'\nimport React, { useCallback, useDeferredValue, useEffect, useMemo, useState } from 'react'\n\nimport type { ToolbarGroupItem } from '../../types.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport './index.scss'\nimport { useRunDeprioritized } from '../../../../utilities/useRunDeprioritized.js'\n\nconst baseClass = 'toolbar-popup__button'\n\nexport const ToolbarButton = ({\n  children,\n  editor,\n  item,\n}: {\n  children: React.JSX.Element\n  editor: LexicalEditor\n  item: ToolbarGroupItem\n}) => {\n  const [_state, setState] = useState({ active: false, enabled: true })\n  const deferredState = useDeferredValue(_state)\n\n  const editorConfigContext = useEditorConfigContext()\n\n  const className = useMemo(() => {\n    return [\n      baseClass,\n      !deferredState.enabled ? 'disabled' : '',\n      deferredState.active ? 'active' : '',\n      item.key ? `${baseClass}-${item.key}` : '',\n    ]\n      .filter(Boolean)\n      .join(' ')\n  }, [deferredState, item.key])\n  const updateStates = useCallback(() => {\n    editor.getEditorState().read(() => {\n      const selection = $getSelection()\n      if (!selection) {\n        return\n      }\n      const newActive = item.isActive\n        ? item.isActive({ editor, editorConfigContext, selection })\n        : false\n\n      const newEnabled = item.isEnabled\n        ? item.isEnabled({ editor, editorConfigContext, selection })\n        : true\n\n      setState((prev) => {\n        if (prev.active === newActive && prev.enabled === newEnabled) {\n          return prev\n        }\n        return { active: newActive, enabled: newEnabled }\n      })\n    })\n  }, [editor, editorConfigContext, item])\n\n  const runDeprioritized = useRunDeprioritized()\n\n  useEffect(() => {\n    // Run on mount\n    void runDeprioritized(updateStates)\n\n    const listener = () => runDeprioritized(updateStates)\n\n    const cleanup = mergeRegister(editor.registerUpdateListener(listener))\n    document.addEventListener('mouseup', listener)\n\n    return () => {\n      cleanup()\n      document.removeEventListener('mouseup', listener)\n    }\n  }, [editor, runDeprioritized, updateStates])\n\n  const handleClick = useCallback(() => {\n    if (!_state.enabled) {\n      return\n    }\n\n    editor.focus(() => {\n      editor.update(() => {\n        $addUpdateTag('toolbar')\n      })\n      // We need to wrap the onSelect in the callback, so the editor is properly focused before the onSelect is called.\n      item.onSelect?.({\n        editor,\n        isActive: _state.active,\n      })\n    })\n  }, [editor, item, _state])\n\n  const handleMouseDown = useCallback((e: React.MouseEvent) => {\n    // This fixes a bug where you are unable to click the button if you are in a NESTED editor (editor in blocks field in editor).\n    // Thus only happens if you click on the SVG of the button. Clicking on the outside works. Related issue: https://github.com/payloadcms/payload/issues/4025\n    // TODO: Find out why exactly it happens and why e.preventDefault() on the mouseDown fixes it. Write that down here, or potentially fix a root cause, if there is any.\n    e.preventDefault()\n  }, [])\n\n  return (\n    <button\n      className={className}\n      data-button-key={item.key}\n      onClick={handleClick}\n      onMouseDown={handleMouseDown}\n      type=\"button\"\n    >\n      {children}\n    </button>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","mergeRegister","$addUpdateTag","$getSelection","React","useCallback","useDeferredValue","useEffect","useMemo","useState","useEditorConfigContext","useRunDeprioritized","baseClass","ToolbarButton","t0","$","children","editor","item","t1","Symbol","for","active","enabled","_state","setState","deferredState","editorConfigContext","t2","t3","t4","key","t5","filter","Boolean","className","join","t6","getEditorState","read","selection","newActive","isActive","newEnabled","isEnabled","prev","updateStates","runDeprioritized","t7","t8","listener","cleanup","registerUpdateListener","document","addEventListener","removeEventListener","t9","focus","update","_temp","onSelect","handleClick","handleMouseDown","_temp2","t10","_jsx","onClick","onMouseDown","type","e","preventDefault"],"sources":["../../../../../src/features/toolbars/shared/ToolbarButton/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { mergeRegister } from '@lexical/utils'\nimport { $addUpdateTag, $getSelection } from 'lexical'\nimport React, { useCallback, useDeferredValue, useEffect, useMemo, useState } from 'react'\n\nimport type { ToolbarGroupItem } from '../../types.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport './index.scss'\nimport { useRunDeprioritized } from '../../../../utilities/useRunDeprioritized.js'\n\nconst baseClass = 'toolbar-popup__button'\n\nexport const ToolbarButton = ({\n  children,\n  editor,\n  item,\n}: {\n  children: React.JSX.Element\n  editor: LexicalEditor\n  item: ToolbarGroupItem\n}) => {\n  const [_state, setState] = useState({ active: false, enabled: true })\n  const deferredState = useDeferredValue(_state)\n\n  const editorConfigContext = useEditorConfigContext()\n\n  const className = useMemo(() => {\n    return [\n      baseClass,\n      !deferredState.enabled ? 'disabled' : '',\n      deferredState.active ? 'active' : '',\n      item.key ? `${baseClass}-${item.key}` : '',\n    ]\n      .filter(Boolean)\n      .join(' ')\n  }, [deferredState, item.key])\n  const updateStates = useCallback(() => {\n    editor.getEditorState().read(() => {\n      const selection = $getSelection()\n      if (!selection) {\n        return\n      }\n      const newActive = item.isActive\n        ? item.isActive({ editor, editorConfigContext, selection })\n        : false\n\n      const newEnabled = item.isEnabled\n        ? item.isEnabled({ editor, editorConfigContext, selection })\n        : true\n\n      setState((prev) => {\n        if (prev.active === newActive && prev.enabled === newEnabled) {\n          return prev\n        }\n        return { active: newActive, enabled: newEnabled }\n      })\n    })\n  }, [editor, editorConfigContext, item])\n\n  const runDeprioritized = useRunDeprioritized()\n\n  useEffect(() => {\n    // Run on mount\n    void runDeprioritized(updateStates)\n\n    const listener = () => runDeprioritized(updateStates)\n\n    const cleanup = mergeRegister(editor.registerUpdateListener(listener))\n    document.addEventListener('mouseup', listener)\n\n    return () => {\n      cleanup()\n      document.removeEventListener('mouseup', listener)\n    }\n  }, [editor, runDeprioritized, updateStates])\n\n  const handleClick = useCallback(() => {\n    if (!_state.enabled) {\n      return\n    }\n\n    editor.focus(() => {\n      editor.update(() => {\n        $addUpdateTag('toolbar')\n      })\n      // We need to wrap the onSelect in the callback, so the editor is properly focused before the onSelect is called.\n      item.onSelect?.({\n        editor,\n        isActive: _state.active,\n      })\n    })\n  }, [editor, item, _state])\n\n  const handleMouseDown = useCallback((e: React.MouseEvent) => {\n    // This fixes a bug where you are unable to click the button if you are in a NESTED editor (editor in blocks field in editor).\n    // Thus only happens if you click on the SVG of the button. Clicking on the outside works. Related issue: https://github.com/payloadcms/payload/issues/4025\n    // TODO: Find out why exactly it happens and why e.preventDefault() on the mouseDown fixes it. Write that down here, or potentially fix a root cause, if there is any.\n    e.preventDefault()\n  }, [])\n\n  return (\n    <button\n      className={className}\n      data-button-key={item.key}\n      onClick={handleClick}\n      onMouseDown={handleMouseDown}\n      type=\"button\"\n    >\n      {children}\n    </button>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/toolbars/shared/ToolbarDropdown/index.js

@@ -11,7 +11,7 @@ import { useEditorConfigContext } from '../../../../lexical/config/client/Editor
 import { useRunDeprioritized } from '../../../../utilities/useRunDeprioritized.js';
 import { DropDown, DropDownItem } from './DropDown.js';
 const ToolbarItem = t0 => {
-  const $ = _c(18);
+  const $ = _c(14);
   const {
     active,
     anchorElem,
@@ -50,33 +50,22 @@ const ToolbarItem = t0 => {
     }
     return t2;
   }
-  let title = item.key;
-  let croppedTitle;
-  if (item.label) {
-    let t2;
-    if ($[6] !== featureClientSchemaMap || $[7] !== i18n || $[8] !== item || $[9] !== schemaPath) {
-      t2 = typeof item.label === "function" ? item.label({
+  let t2;
+  if ($[6] !== active || $[7] !== editor || $[8] !== enabled || $[9] !== featureClientSchemaMap || $[10] !== i18n || $[11] !== item || $[12] !== schemaPath) {
+    let title = item.key;
+    let croppedTitle;
+    if (item.label) {
+      title = typeof item.label === "function" ? item.label({
         featureClientSchemaMap,
         i18n,
         schemaPath
       }) : item.label;
-      $[6] = featureClientSchemaMap;
-      $[7] = i18n;
-      $[8] = item;
-      $[9] = schemaPath;
-      $[10] = t2;
+    }
+    if (title.length > 25) {
+      croppedTitle = title.substring(0, 25) + "...";
     } else {
-      t2 = $[10];
+      croppedTitle = title;
     }
-    title = t2;
-  }
-  if (title.length > 25) {
-    croppedTitle = title.substring(0, 25) + "...";
-  } else {
-    croppedTitle = title;
-  }
-  let t2;
-  if ($[11] !== active || $[12] !== croppedTitle || $[13] !== editor || $[14] !== enabled || $[15] !== item || $[16] !== title) {
     t2 = _jsx(DropDownItem, {
       active,
       editor,
@@ -90,15 +79,16 @@ const ToolbarItem = t0 => {
         children: croppedTitle
       })
     }, item.key);
-    $[11] = active;
-    $[12] = croppedTitle;
-    $[13] = editor;
-    $[14] = enabled;
-    $[15] = item;
-    $[16] = title;
-    $[17] = t2;
+    $[6] = active;
+    $[7] = editor;
+    $[8] = enabled;
+    $[9] = featureClientSchemaMap;
+    $[10] = i18n;
+    $[11] = item;
+    $[12] = schemaPath;
+    $[13] = t2;
   } else {
-    t2 = $[17];
+    t2 = $[13];
   }
   return t2;
 };

package/dist/features/toolbars/shared/ToolbarDropdown/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useDeferredValue","useEffect","useMemo","baseClass","mergeRegister","useTranslation","$getSelection","useEditorConfigContext","useRunDeprioritized","DropDown","DropDownItem","ToolbarItem","t0","$","active","anchorElem","editor","enabled","item","i18n","fieldProps","t1","featureClientSchemaMap","schemaPath","Component","t2","_jsx","key","title","croppedTitle","label","length","substring","Icon","ChildComponent","undefined","itemKey","tooltip","children","className","MemoToolbarItem","memo","ToolbarDropdown","classNames","group","itemsContainerClassNames","maxActiveItems","onActiveChange","toolbarState","setToolbarState","useState","activeItemKeys","enabledGroup","enabledItemKeys","deferredToolbarState","editorConfigContext","items","groupKey","runDeprioritized","updateStates","getEditorState","read","selection","_activeItemKeys","_activeItems","_enabledItemKeys","isActive","push","isEnabled","activeItems","registerUpdateListener","renderedItems","map","includes","buttonAriaLabel","buttonClassName","filter","Boolean","join","disabled","dropdownKey"],"sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback, useDeferredValue, useEffect, useMemo } from 'react'\n\nconst baseClass = 'toolbar-popup__dropdown'\n\nimport type { LexicalEditor } from 'lexical'\n\nimport { mergeRegister } from '@lexical/utils'\nimport { useTranslation } from '@payloadcms/ui'\nimport { $getSelection } from 'lexical'\n\nimport type { ToolbarDropdownGroup, ToolbarGroupItem } from '../../types.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { useRunDeprioritized } from '../../../../utilities/useRunDeprioritized.js'\nimport './index.scss'\nimport { DropDown, DropDownItem } from './DropDown.js'\n\nconst ToolbarItem = ({\n  active,\n  anchorElem,\n  editor,\n  enabled,\n  item,\n}: {\n  active?: boolean\n  anchorElem: HTMLElement\n  editor: LexicalEditor\n  enabled?: boolean\n  item: ToolbarGroupItem\n}) => {\n  const { i18n } = useTranslation<{}, string>()\n  const {\n    fieldProps: { featureClientSchemaMap, schemaPath },\n  } = useEditorConfigContext()\n\n  if (item.Component) {\n    return (\n      item?.Component && (\n        <item.Component\n          active={active}\n          anchorElem={anchorElem}\n          editor={editor}\n          enabled={enabled}\n          item={item}\n          key={item.key}\n        />\n      )\n    )\n  }\n\n  let title = item.key\n  let croppedTitle = item.key\n  if (item.label) {\n    title =\n      typeof item.label === 'function'\n        ? item.label({ featureClientSchemaMap, i18n, schemaPath })\n        : item.label\n  }\n  // Crop title to max. 25 characters\n  if (title.length > 25) {\n    croppedTitle = title.substring(0, 25) + '...'\n  } else {\n    croppedTitle = title\n  }\n\n  return (\n    <DropDownItem\n      active={active}\n      editor={editor}\n      enabled={enabled}\n      Icon={item?.ChildComponent ? <item.ChildComponent /> : undefined}\n      item={item}\n      itemKey={item.key}\n      key={item.key}\n      tooltip={title}\n    >\n      <span className=\"text\">{croppedTitle}</span>\n    </DropDownItem>\n  )\n}\n\nconst MemoToolbarItem = React.memo(ToolbarItem)\n\nexport const ToolbarDropdown = ({\n  anchorElem,\n  classNames,\n  editor,\n  group,\n  Icon,\n  itemsContainerClassNames,\n  label,\n  maxActiveItems,\n  onActiveChange,\n}: {\n  anchorElem: HTMLElement\n  classNames?: string[]\n  editor: LexicalEditor\n  group: ToolbarDropdownGroup\n  Icon?: React.FC\n  itemsContainerClassNames?: string[]\n  label?: string\n  /**\n   * Maximum number of active items allowed. This is a performance optimization to prevent\n   * unnecessary item active checks when the maximum number of active items is reached.\n   */\n  maxActiveItems?: number\n  onActiveChange?: ({ activeItems }: { activeItems: ToolbarGroupItem[] }) => void\n}) => {\n  const [toolbarState, setToolbarState] = React.useState<{\n    activeItemKeys: string[]\n    enabledGroup: boolean\n    enabledItemKeys: string[]\n  }>({\n    activeItemKeys: [],\n    enabledGroup: true,\n    enabledItemKeys: [],\n  })\n  const deferredToolbarState = useDeferredValue(toolbarState)\n\n  const editorConfigContext = useEditorConfigContext()\n  const { items, key: groupKey } = group\n\n  const runDeprioritized = useRunDeprioritized()\n\n  const updateStates = useCallback(() => {\n    editor.getEditorState().read(() => {\n      const selection = $getSelection()\n      if (!selection) {\n        return\n      }\n\n      const _activeItemKeys: string[] = []\n      const _activeItems: ToolbarGroupItem[] = []\n      const _enabledItemKeys: string[] = []\n\n      for (const item of items) {\n        if (item.isActive && (!maxActiveItems || _activeItemKeys.length < maxActiveItems)) {\n          const isActive = item.isActive({ editor, editorConfigContext, selection })\n          if (isActive) {\n            _activeItemKeys.push(item.key)\n            _activeItems.push(item)\n          }\n        }\n        if (item.isEnabled) {\n          const isEnabled = item.isEnabled({ editor, editorConfigContext, selection })\n          if (isEnabled) {\n            _enabledItemKeys.push(item.key)\n          }\n        } else {\n          _enabledItemKeys.push(item.key)\n        }\n      }\n\n      setToolbarState({\n        activeItemKeys: _activeItemKeys,\n        enabledGroup: group.isEnabled\n          ? group.isEnabled({ editor, editorConfigContext, selection })\n          : true,\n        enabledItemKeys: _enabledItemKeys,\n      })\n\n      if (onActiveChange) {\n        onActiveChange({ activeItems: _activeItems })\n      }\n    })\n  }, [editor, editorConfigContext, group, items, maxActiveItems, onActiveChange])\n\n  useEffect(() => {\n    // Run on mount in order to update states when dropdown is opened\n    void runDeprioritized(updateStates)\n\n    return mergeRegister(\n      editor.registerUpdateListener(async () => {\n        await runDeprioritized(updateStates)\n      }),\n    )\n  }, [editor, runDeprioritized, updateStates])\n\n  const renderedItems = useMemo(() => {\n    return items?.length\n      ? items.map((item) => (\n          <MemoToolbarItem\n            active={deferredToolbarState.activeItemKeys.includes(item.key)}\n            anchorElem={anchorElem}\n            editor={editor}\n            enabled={deferredToolbarState.enabledItemKeys.includes(item.key)}\n            item={item}\n            key={item.key}\n          />\n        ))\n      : null\n  }, [items, deferredToolbarState, anchorElem, editor])\n\n  return (\n    <DropDown\n      buttonAriaLabel={`${groupKey} dropdown`}\n      buttonClassName={[baseClass, `${baseClass}-${groupKey}`, ...(classNames || [])]\n        .filter(Boolean)\n        .join(' ')}\n      disabled={!deferredToolbarState.enabledGroup}\n      dropdownKey={groupKey}\n      Icon={Icon}\n      itemsContainerClassNames={[`${baseClass}-items`, ...(itemsContainerClassNames || [])]}\n      key={groupKey}\n      label={label}\n    >\n      {renderedItems}\n    </DropDown>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useDeferredValue","useEffect","useMemo","baseClass","mergeRegister","useTranslation","$getSelection","useEditorConfigContext","useRunDeprioritized","DropDown","DropDownItem","ToolbarItem","t0","$","active","anchorElem","editor","enabled","item","i18n","fieldProps","t1","featureClientSchemaMap","schemaPath","Component","t2","_jsx","key","title","croppedTitle","label","length","substring","Icon","ChildComponent","undefined","itemKey","tooltip","children","className","MemoToolbarItem","memo","ToolbarDropdown","classNames","group","itemsContainerClassNames","maxActiveItems","onActiveChange","toolbarState","setToolbarState","useState","activeItemKeys","enabledGroup","enabledItemKeys","deferredToolbarState","editorConfigContext","items","groupKey","runDeprioritized","updateStates","getEditorState","read","selection","_activeItemKeys","_activeItems","_enabledItemKeys","isActive","push","isEnabled","activeItems","registerUpdateListener","renderedItems","map","includes","buttonAriaLabel","buttonClassName","filter","Boolean","join","disabled","dropdownKey"],"sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback, useDeferredValue, useEffect, useMemo } from 'react'\n\nconst baseClass = 'toolbar-popup__dropdown'\n\nimport type { LexicalEditor } from 'lexical'\n\nimport { mergeRegister } from '@lexical/utils'\nimport { useTranslation } from '@payloadcms/ui'\nimport { $getSelection } from 'lexical'\n\nimport type { ToolbarDropdownGroup, ToolbarGroupItem } from '../../types.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { useRunDeprioritized } from '../../../../utilities/useRunDeprioritized.js'\nimport './index.scss'\nimport { DropDown, DropDownItem } from './DropDown.js'\n\nconst ToolbarItem = ({\n  active,\n  anchorElem,\n  editor,\n  enabled,\n  item,\n}: {\n  active?: boolean\n  anchorElem: HTMLElement\n  editor: LexicalEditor\n  enabled?: boolean\n  item: ToolbarGroupItem\n}) => {\n  const { i18n } = useTranslation<{}, string>()\n  const {\n    fieldProps: { featureClientSchemaMap, schemaPath },\n  } = useEditorConfigContext()\n\n  if (item.Component) {\n    return (\n      item?.Component && (\n        <item.Component\n          active={active}\n          anchorElem={anchorElem}\n          editor={editor}\n          enabled={enabled}\n          item={item}\n          key={item.key}\n        />\n      )\n    )\n  }\n\n  let title = item.key\n  let croppedTitle = item.key\n  if (item.label) {\n    title =\n      typeof item.label === 'function'\n        ? item.label({ featureClientSchemaMap, i18n, schemaPath })\n        : item.label\n  }\n  // Crop title to max. 25 characters\n  if (title.length > 25) {\n    croppedTitle = title.substring(0, 25) + '...'\n  } else {\n    croppedTitle = title\n  }\n\n  return (\n    <DropDownItem\n      active={active}\n      editor={editor}\n      enabled={enabled}\n      Icon={item?.ChildComponent ? <item.ChildComponent /> : undefined}\n      item={item}\n      itemKey={item.key}\n      key={item.key}\n      tooltip={title}\n    >\n      <span className=\"text\">{croppedTitle}</span>\n    </DropDownItem>\n  )\n}\n\nconst MemoToolbarItem = React.memo(ToolbarItem)\n\nexport const ToolbarDropdown = ({\n  anchorElem,\n  classNames,\n  editor,\n  group,\n  Icon,\n  itemsContainerClassNames,\n  label,\n  maxActiveItems,\n  onActiveChange,\n}: {\n  anchorElem: HTMLElement\n  classNames?: string[]\n  editor: LexicalEditor\n  group: ToolbarDropdownGroup\n  Icon?: React.FC\n  itemsContainerClassNames?: string[]\n  label?: string\n  /**\n   * Maximum number of active items allowed. This is a performance optimization to prevent\n   * unnecessary item active checks when the maximum number of active items is reached.\n   */\n  maxActiveItems?: number\n  onActiveChange?: ({ activeItems }: { activeItems: ToolbarGroupItem[] }) => void\n}) => {\n  const [toolbarState, setToolbarState] = React.useState<{\n    activeItemKeys: string[]\n    enabledGroup: boolean\n    enabledItemKeys: string[]\n  }>({\n    activeItemKeys: [],\n    enabledGroup: true,\n    enabledItemKeys: [],\n  })\n  const deferredToolbarState = useDeferredValue(toolbarState)\n\n  const editorConfigContext = useEditorConfigContext()\n  const { items, key: groupKey } = group\n\n  const runDeprioritized = useRunDeprioritized()\n\n  const updateStates = useCallback(() => {\n    editor.getEditorState().read(() => {\n      const selection = $getSelection()\n      if (!selection) {\n        return\n      }\n\n      const _activeItemKeys: string[] = []\n      const _activeItems: ToolbarGroupItem[] = []\n      const _enabledItemKeys: string[] = []\n\n      for (const item of items) {\n        if (item.isActive && (!maxActiveItems || _activeItemKeys.length < maxActiveItems)) {\n          const isActive = item.isActive({ editor, editorConfigContext, selection })\n          if (isActive) {\n            _activeItemKeys.push(item.key)\n            _activeItems.push(item)\n          }\n        }\n        if (item.isEnabled) {\n          const isEnabled = item.isEnabled({ editor, editorConfigContext, selection })\n          if (isEnabled) {\n            _enabledItemKeys.push(item.key)\n          }\n        } else {\n          _enabledItemKeys.push(item.key)\n        }\n      }\n\n      setToolbarState({\n        activeItemKeys: _activeItemKeys,\n        enabledGroup: group.isEnabled\n          ? group.isEnabled({ editor, editorConfigContext, selection })\n          : true,\n        enabledItemKeys: _enabledItemKeys,\n      })\n\n      if (onActiveChange) {\n        onActiveChange({ activeItems: _activeItems })\n      }\n    })\n  }, [editor, editorConfigContext, group, items, maxActiveItems, onActiveChange])\n\n  useEffect(() => {\n    // Run on mount in order to update states when dropdown is opened\n    void runDeprioritized(updateStates)\n\n    return mergeRegister(\n      editor.registerUpdateListener(async () => {\n        await runDeprioritized(updateStates)\n      }),\n    )\n  }, [editor, runDeprioritized, updateStates])\n\n  const renderedItems = useMemo(() => {\n    return items?.length\n      ? items.map((item) => (\n          <MemoToolbarItem\n            active={deferredToolbarState.activeItemKeys.includes(item.key)}\n            anchorElem={anchorElem}\n            editor={editor}\n            enabled={deferredToolbarState.enabledItemKeys.includes(item.key)}\n            item={item}\n            key={item.key}\n          />\n        ))\n      : null\n  }, [items, deferredToolbarState, anchorElem, editor])\n\n  return (\n    <DropDown\n      buttonAriaLabel={`${groupKey} dropdown`}\n      buttonClassName={[baseClass, `${baseClass}-${groupKey}`, ...(classNames || [])]\n        .filter(Boolean)\n        .join(' ')}\n      disabled={!deferredToolbarState.enabledGroup}\n      dropdownKey={groupKey}\n      Icon={Icon}\n      itemsContainerClassNames={[`${baseClass}-items`, ...(itemsContainerClassNames || [])]}\n      key={groupKey}\n      label={label}\n    >\n      {renderedItems}\n    </DropDown>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/field/RenderLexical/renderLexical.d.ts

@@ -0,0 +1,38 @@
+import { type ServerFunction } from 'payload';
+import { type DefaultTypedEditorState, type LexicalFieldAdminProps } from '../../index.js';
+export type RenderLexicalServerFunctionArgs = {
+    admin?: LexicalFieldAdminProps;
+    /**
+     * {global|collection}.entitySlug.fieldSchemaPath
+     *
+     * @example collection.posts.richText
+     */
+    editorTarget: string;
+    /**
+     * Pass the value this richtext field will receive when rendering it on the server.
+     * This helps provide initial state for sub-fields that are immediately rendered (like blocks)
+     * so that we can avoid multiple waterfall requests for each block that renders on the client.
+     */
+    initialValue?: DefaultTypedEditorState;
+    /**
+     * Name of the field to render
+     */
+    name: string;
+    /**
+     * Path to the field to render
+     * @default field name
+     */
+    path?: string;
+    /**
+     * Schema path to the field to render.
+     */
+    schemaPath: string;
+};
+export type RenderLexicalServerFunctionReturnType = {
+    Component: React.ReactNode;
+};
+/**
+ * @experimental - may break in minor releases
+ */
+export declare const _internal_renderLexical: ServerFunction<RenderLexicalServerFunctionArgs, Promise<RenderLexicalServerFunctionReturnType>>;
+//# sourceMappingURL=renderLexical.d.ts.map

package/dist/field/RenderLexical/renderLexical.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderLexical.d.ts","sourceRoot":"","sources":["../../../src/field/RenderLexical/renderLexical.tsx"],"names":[],"mappings":"AAIA,OAAO,EAKL,KAAK,cAAc,EACpB,MAAM,SAAS,CAAA;AAEhB,OAAO,EACL,KAAK,uBAAuB,EAC5B,KAAK,sBAAsB,EAG5B,MAAM,gBAAgB,CAAA;AAEvB,MAAM,MAAM,+BAA+B,GAAG;IAC5C,KAAK,CAAC,EAAE,sBAAsB,CAAA;IAC9B;;;;OAIG;IACH,YAAY,EAAE,MAAM,CAAA;IACpB;;;;OAIG;IACH,YAAY,CAAC,EAAE,uBAAuB,CAAA;IACtC;;OAEG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AACD,MAAM,MAAM,qCAAqC,GAAG;IAAE,SAAS,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CAAA;AAElF;;GAEG;AACH,eAAO,MAAM,uBAAuB,EAAE,cAAc,CAClD,+BAA+B,EAC/B,OAAO,CAAC,qCAAqC,CAAC,CAgG/C,CAAA"}

package/dist/field/RenderLexical/renderLexical.js

@@ -0,0 +1,96 @@
+import { RenderServerComponent } from '@payloadcms/ui/elements/RenderServerComponent';
+import { getClientConfig } from '@payloadcms/ui/utilities/getClientConfig';
+import { getClientSchemaMap } from '@payloadcms/ui/utilities/getClientSchemaMap';
+import { getSchemaMap } from '@payloadcms/ui/utilities/getSchemaMap';
+import { createClientField } from 'payload';
+/**
+ * @experimental - may break in minor releases
+ */
+export const _internal_renderLexical = async ({
+  name,
+  admin,
+  editorTarget,
+  importMap,
+  initialValue,
+  path,
+  req,
+  schemaPath
+}) => {
+  if (!req.user) {
+    throw new Error('Unauthorized');
+  }
+  const [entityType, entitySlug, ...fieldPath] = editorTarget.split('.');
+  const schemaMap = getSchemaMap({
+    collectionSlug: entityType === 'collection' ? entitySlug : undefined,
+    config: req.payload.config,
+    globalSlug: entityType === 'global' ? entitySlug : undefined,
+    i18n: req.i18n
+  });
+  const targetField = schemaMap.get(`${entitySlug}.${fieldPath.join('.')}`);
+  if (!targetField?.editor || typeof targetField.editor === 'function') {
+    throw new Error(`No editor found for target: ${editorTarget}`);
+  }
+  const sanitizedEditor = targetField.editor;
+  if (!sanitizedEditor) {
+    throw new Error(`No editor found for target: ${editorTarget}`);
+  }
+  const field = {
+    name,
+    type: 'richText',
+    editor: sanitizedEditor
+  };
+  // Provide client schema map as it would have been provided if the target editor field would have been rendered.
+  // Only then will it contain all the lexical-internal entries
+  const clientSchemaMap = getClientSchemaMap({
+    collectionSlug: entityType === 'collection' ? entitySlug : undefined,
+    config: getClientConfig({
+      config: req.payload.config,
+      i18n: req.i18n,
+      importMap: req.payload.importMap
+    }),
+    globalSlug: entityType === 'global' ? entitySlug : undefined,
+    i18n: req.i18n,
+    payload: req.payload,
+    schemaMap
+  });
+  const FieldComponent = RenderServerComponent({
+    Component: sanitizedEditor.FieldComponent,
+    importMap,
+    serverProps: {
+      admin: admin ?? {},
+      clientField: createClientField({
+        defaultIDType: req.payload.db.defaultIDType,
+        field,
+        i18n: req.i18n,
+        importMap
+      }),
+      clientFieldSchemaMap: clientSchemaMap,
+      // collectionSlug is typed incorrectly - @todo make it accept undefined in 4.0
+      collectionSlug: entityType === 'collection' && entitySlug ? entitySlug : '-',
+      data: {},
+      field,
+      fieldSchemaMap: schemaMap,
+      forceRender: true,
+      formState: {},
+      i18n: req.i18n,
+      operation: 'create',
+      path: path ?? name,
+      payload: req.payload,
+      permissions: true,
+      preferences: {
+        fields: {}
+      },
+      req,
+      sanitizedEditorConfig: sanitizedEditor.editorConfig,
+      schemaPath: schemaPath ?? name,
+      siblingData: initialValue ? {
+        [name]: initialValue
+      } : {},
+      user: req.user
+    }
+  });
+  return {
+    Component: FieldComponent
+  };
+};
+//# sourceMappingURL=renderLexical.js.map

package/dist/field/RenderLexical/renderLexical.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderLexical.js","names":["RenderServerComponent","getClientConfig","getClientSchemaMap","getSchemaMap","createClientField","_internal_renderLexical","name","admin","editorTarget","importMap","initialValue","path","req","schemaPath","user","Error","entityType","entitySlug","fieldPath","split","schemaMap","collectionSlug","undefined","config","payload","globalSlug","i18n","targetField","get","join","editor","sanitizedEditor","field","type","clientSchemaMap","FieldComponent","Component","serverProps","clientField","defaultIDType","db","clientFieldSchemaMap","data","fieldSchemaMap","forceRender","formState","operation","permissions","preferences","fields","sanitizedEditorConfig","editorConfig","siblingData"],"sources":["../../../src/field/RenderLexical/renderLexical.tsx"],"sourcesContent":["import { RenderServerComponent } from '@payloadcms/ui/elements/RenderServerComponent'\nimport { getClientConfig } from '@payloadcms/ui/utilities/getClientConfig'\nimport { getClientSchemaMap } from '@payloadcms/ui/utilities/getClientSchemaMap'\nimport { getSchemaMap } from '@payloadcms/ui/utilities/getSchemaMap'\nimport {\n  createClientField,\n  type RichTextField,\n  type RichTextFieldClient,\n  type RichTextFieldServerProps,\n  type ServerFunction,\n} from 'payload'\n\nimport {\n  type DefaultTypedEditorState,\n  type LexicalFieldAdminProps,\n  type LexicalRichTextAdapter,\n  type SanitizedServerEditorConfig,\n} from '../../index.js'\n\nexport type RenderLexicalServerFunctionArgs = {\n  admin?: LexicalFieldAdminProps\n  /**\n   * {global|collection}.entitySlug.fieldSchemaPath\n   *\n   * @example collection.posts.richText\n   */\n  editorTarget: string\n  /**\n   * Pass the value this richtext field will receive when rendering it on the server.\n   * This helps provide initial state for sub-fields that are immediately rendered (like blocks)\n   * so that we can avoid multiple waterfall requests for each block that renders on the client.\n   */\n  initialValue?: DefaultTypedEditorState\n  /**\n   * Name of the field to render\n   */\n  name: string\n  /**\n   * Path to the field to render\n   * @default field name\n   */\n  path?: string\n  /**\n   * Schema path to the field to render.\n   */\n  schemaPath: string\n}\nexport type RenderLexicalServerFunctionReturnType = { Component: React.ReactNode }\n\n/**\n * @experimental - may break in minor releases\n */\nexport const _internal_renderLexical: ServerFunction<\n  RenderLexicalServerFunctionArgs,\n  Promise<RenderLexicalServerFunctionReturnType>\n  // eslint-disable-next-line @typescript-eslint/require-await\n> = async ({ name, admin, editorTarget, importMap, initialValue, path, req, schemaPath }) => {\n  if (!req.user) {\n    throw new Error('Unauthorized')\n  }\n\n  const [entityType, entitySlug, ...fieldPath] = editorTarget.split('.')\n\n  const schemaMap = getSchemaMap({\n    collectionSlug: entityType === 'collection' ? entitySlug : undefined,\n    config: req.payload.config,\n    globalSlug: entityType === 'global' ? entitySlug : undefined,\n    i18n: req.i18n,\n  })\n\n  const targetField = schemaMap.get(`${entitySlug}.${fieldPath.join('.')}`) as\n    | RichTextField\n    | undefined\n\n  if (!targetField?.editor || typeof targetField.editor === 'function') {\n    throw new Error(`No editor found for target: ${editorTarget}`)\n  }\n\n  const sanitizedEditor = targetField.editor as LexicalRichTextAdapter\n\n  if (!sanitizedEditor) {\n    throw new Error(`No editor found for target: ${editorTarget}`)\n  }\n\n  const field: RichTextField = {\n    name,\n    type: 'richText',\n    editor: sanitizedEditor,\n  }\n\n  // Provide client schema map as it would have been provided if the target editor field would have been rendered.\n  // Only then will it contain all the lexical-internal entries\n  const clientSchemaMap = getClientSchemaMap({\n    collectionSlug: entityType === 'collection' ? entitySlug : undefined,\n    config: getClientConfig({\n      config: req.payload.config,\n      i18n: req.i18n,\n      importMap: req.payload.importMap,\n    }),\n    globalSlug: entityType === 'global' ? entitySlug : undefined,\n    i18n: req.i18n,\n    payload: req.payload,\n    schemaMap,\n  })\n\n  const FieldComponent = RenderServerComponent({\n    Component: sanitizedEditor.FieldComponent,\n    importMap,\n    serverProps: {\n      admin: admin ?? {},\n      clientField: createClientField({\n        defaultIDType: req.payload.db.defaultIDType,\n        field,\n        i18n: req.i18n,\n        importMap,\n      }) as RichTextFieldClient,\n      clientFieldSchemaMap: clientSchemaMap,\n      // collectionSlug is typed incorrectly - @todo make it accept undefined in 4.0\n      collectionSlug: entityType === 'collection' && entitySlug ? entitySlug : '-',\n      data: {},\n      field,\n      fieldSchemaMap: schemaMap,\n      forceRender: true,\n      formState: {},\n      i18n: req.i18n,\n      operation: 'create',\n      path: path ?? name,\n      payload: req.payload,\n      permissions: true,\n      preferences: {\n        fields: {},\n      },\n      req,\n      sanitizedEditorConfig: sanitizedEditor.editorConfig,\n      schemaPath: schemaPath ?? name,\n      siblingData: initialValue\n        ? {\n            [name]: initialValue,\n          }\n        : {},\n      user: req.user,\n    } satisfies {\n      admin: LexicalFieldAdminProps // <= new in 3.26.0\n      sanitizedEditorConfig: SanitizedServerEditorConfig\n    } & RichTextFieldServerProps,\n  })\n\n  return {\n    Component: FieldComponent,\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/field/RenderLexical/useRenderEditor.d.ts

@@ -0,0 +1,15 @@
+import { type FieldType } from '@payloadcms/ui';
+import React from 'react';
+import type { DefaultTypedEditorState } from '../../nodeTypes.js';
+import type { RenderLexicalServerFunctionArgs } from './renderLexical.js';
+/**
+ * @experimental - may break in minor releases
+ */
+export declare const useRenderEditor_internal_: (args: Omit<RenderLexicalServerFunctionArgs, "initialValue" | "schemaPath">) => {
+    Component: ({ setValue, value, }: {
+        setValue?: FieldType<DefaultTypedEditorState | undefined>["setValue"];
+        value?: FieldType<DefaultTypedEditorState | undefined>["value"];
+    }) => React.JSX.Element | null;
+    renderLexical: (args?: Pick<RenderLexicalServerFunctionArgs, "initialValue">) => void;
+};
+//# sourceMappingURL=useRenderEditor.d.ts.map

package/dist/field/RenderLexical/useRenderEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRenderEditor.d.ts","sourceRoot":"","sources":["../../../src/field/RenderLexical/useRenderEditor.tsx"],"names":[],"mappings":"AACA,OAAO,EAGL,KAAK,SAAS,EAIf,MAAM,gBAAgB,CAAA;AACvB,OAAO,KAAsB,MAAM,OAAO,CAAA;AAE1C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,oBAAoB,CAAA;AACjE,OAAO,KAAK,EACV,+BAA+B,EAEhC,MAAM,oBAAoB,CAAA;AAE3B;;GAEG;AACH,eAAO,MAAM,yBAAyB,SAC9B,IAAI,CAAC,+BAA+B,EAAE,cAAc,GAAG,YAAY,CAAC;sCAuCxE;QACE,QAAQ,CAAC,EAAE,SAAS,CAAC,uBAAuB,GAAG,SAAS,CAAC,CAAC,UAAU,CAAC,CAAA;QAErE,KAAK,CAAC,EAAE,SAAS,CAAC,uBAAuB,GAAG,SAAS,CAAC,CAAC,OAAO,CAAC,CAAA;KAChE;2BAjCO,IAAI,CAAC,+BAA+B,EAAE,cAAc,CAAC;CA2FhE,CAAA"}

package/dist/field/RenderLexical/useRenderEditor.js

@@ -0,0 +1,159 @@
+'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FieldContext, FieldPathContext, ServerFunctionsContext, useServerFunctions } from '@payloadcms/ui';
+import React, { useCallback } from 'react';
+/**
+ * @experimental - may break in minor releases
+ */
+export const useRenderEditor_internal_ = args => {
+  const $ = _c(24);
+  const {
+    name,
+    admin,
+    editorTarget,
+    path
+  } = args;
+  const [Component, setComponent] = React.useState(null);
+  const serverFunctionContext = useServerFunctions();
+  const {
+    serverFunction
+  } = serverFunctionContext;
+  let t0;
+  if ($[0] !== editorTarget) {
+    t0 = editorTarget.split(".");
+    $[0] = editorTarget;
+    $[1] = t0;
+  } else {
+    t0 = $[1];
+  }
+  let entitySlug;
+  let entityType;
+  let fieldPath;
+  if ($[2] !== t0) {
+    [entityType, entitySlug, ...fieldPath] = t0;
+    $[2] = t0;
+    $[3] = entitySlug;
+    $[4] = entityType;
+    $[5] = fieldPath;
+  } else {
+    entitySlug = $[3];
+    entityType = $[4];
+    fieldPath = $[5];
+  }
+  let t1;
+  if ($[6] !== admin || $[7] !== editorTarget || $[8] !== entitySlug || $[9] !== fieldPath || $[10] !== name || $[11] !== path || $[12] !== serverFunction) {
+    t1 = args_0 => {
+      const render = async function render() {
+        const {
+          Component: Component_0
+        } = await serverFunction({
+          name: "render-lexical",
+          args: {
+            name,
+            admin,
+            editorTarget,
+            initialValue: args_0?.initialValue ?? undefined,
+            path,
+            schemaPath: `${entitySlug}.${fieldPath.join(".")}`
+          }
+        });
+        setComponent(Component_0);
+      };
+      render();
+    };
+    $[6] = admin;
+    $[7] = editorTarget;
+    $[8] = entitySlug;
+    $[9] = fieldPath;
+    $[10] = name;
+    $[11] = path;
+    $[12] = serverFunction;
+    $[13] = t1;
+  } else {
+    t1 = $[13];
+  }
+  const renderLexical = t1;
+  let t2;
+  if ($[14] !== Component || $[15] !== entitySlug || $[16] !== entityType || $[17] !== name || $[18] !== path || $[19] !== serverFunctionContext) {
+    t2 = function Memoized(t3) {
+      const {
+        setValue,
+        value
+      } = t3;
+      if (!Component) {
+        return null;
+      }
+      const adjustedServerFunctionContext = {
+        ...serverFunctionContext,
+        getFormState: async getFormStateArgs => serverFunctionContext.getFormState({
+          ...getFormStateArgs,
+          collectionSlug: entityType === "collection" ? entitySlug : undefined,
+          globalSlug: entityType === "global" ? entitySlug : undefined
+        })
+      };
+      const fieldPath_0 = path ?? name;
+      if (typeof value === "undefined" && !setValue) {
+        return _jsx(ServerFunctionsContext, {
+          value: {
+            ...adjustedServerFunctionContext
+          },
+          children: _jsx(FieldPathContext, {
+            value: fieldPath_0,
+            children: Component
+          }, fieldPath_0)
+        });
+      }
+      const fieldValue = {
+        disabled: false,
+        formInitializing: false,
+        formProcessing: false,
+        formSubmitted: false,
+        initialValue: value,
+        path: fieldPath_0,
+        setValue: setValue ?? _temp,
+        showError: false,
+        value
+      };
+      return _jsx(ServerFunctionsContext, {
+        value: {
+          ...adjustedServerFunctionContext
+        },
+        children: _jsx(FieldPathContext, {
+          value: fieldPath_0,
+          children: _jsx(FieldContext, {
+            value: fieldValue,
+            children: Component
+          })
+        }, fieldPath_0)
+      });
+    };
+    $[14] = Component;
+    $[15] = entitySlug;
+    $[16] = entityType;
+    $[17] = name;
+    $[18] = path;
+    $[19] = serverFunctionContext;
+    $[20] = t2;
+  } else {
+    t2 = $[20];
+  }
+  const Memoized = t2;
+  const WrappedComponent = Memoized;
+  let t3;
+  if ($[21] !== WrappedComponent || $[22] !== renderLexical) {
+    t3 = {
+      Component: WrappedComponent,
+      renderLexical
+    };
+    $[21] = WrappedComponent;
+    $[22] = renderLexical;
+    $[23] = t3;
+  } else {
+    t3 = $[23];
+  }
+  return t3;
+};
+function _temp() {}
+//# sourceMappingURL=useRenderEditor.js.map