npm - @payloadcms/richtext-lexical - Versions diffs - 3.59.0-internal.929dda3 → 3.59.0-internal.b804ca6 - Mend

@payloadcms/richtext-lexical 3.59.0-internal.929dda3 → 3.59.0-internal.b804ca6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (205) hide show

package/dist/features/blocks/client/component/index.js CHANGED Viewed

@@ -7,6 +7,7 @@ import { deepCopyObjectSimpleWithoutReactComponents, reduceFieldsToValues } from
 import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 const baseClass = 'lexical-block';
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { useLexicalEditable } from '@lexical/react/useLexicalEditable';
 import { getTranslation } from '@payloadcms/translations';
 import { $getNodeByKey } from 'lexical';
 import { v4 as uuid } from 'uuid';
@@ -32,8 +33,6 @@ export const BlockComponent = props => {
       featureClientSchemaMap,
       field: parentLexicalRichTextField,
       initialLexicalFormState,
-      permissions,
-      readOnly,
       schemaPath
     },
     uuid: uuidFromContext
@@ -62,10 +61,12 @@ export const BlockComponent = props => {
     setDocFieldPreferences
   } = useDocumentInfo();
   const [editor] = useLexicalComposerContext();
+  const isEditable = useLexicalEditable();
+  const blockType = formData.blockType;
   const {
     getFormState
   } = useServerFunctions();
-  const schemaFieldsPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.${formData.blockType}.fields`;
+  const schemaFieldsPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.${blockType}.fields`;
   const [initialState, setInitialState] = React.useState(() => {
     return initialLexicalFormState?.[formData.id]?.formState ? {
       ...initialLexicalFormState?.[formData.id]?.formState,
@@ -91,10 +92,10 @@ export const BlockComponent = props => {
   }, [cacheBuster]);
   const [CustomLabel, setCustomLabel] = React.useState(
   // @ts-expect-error - vestiges of when tsconfig was not strict. Feel free to improve
-  initialState?.['_components']?.customComponents?.BlockLabel);
+  initialState?.['_components']?.customComponents?.BlockLabel ?? undefined);
   const [CustomBlock, setCustomBlock] = React.useState(
   // @ts-expect-error - vestiges of when tsconfig was not strict. Feel free to improve
-  initialState?.['_components']?.customComponents?.Block);
+  initialState?.['_components']?.customComponents?.Block ?? undefined);
   // Initial state for newly created blocks
   useEffect(() => {
     const abortController = new AbortController();
@@ -118,6 +119,7 @@ export const BlockComponent = props => {
         globalSlug,
         initialBlockData: formData,
         operation: 'update',
+        readOnly: !isEditable,
         renderAllFields: true,
         schemaPath: schemaFieldsPath,
         signal: abortController.signal
@@ -135,13 +137,13 @@ export const BlockComponent = props => {
           const node = $getNodeByKey(nodeKey);
           if (node && $isBlockNode(node)) {
             const newData = newFormStateData;
-            newData.blockType = formData.blockType;
+            newData.blockType = blockType;
             node.setFields(newData, true);
           }
         });
         setInitialState(state);
-        setCustomLabel(state._components?.customComponents?.BlockLabel);
-        setCustomBlock(state._components?.customComponents?.Block);
+        setCustomLabel(state._components?.customComponents?.BlockLabel ?? undefined);
+        setCustomBlock(state._components?.customComponents?.Block ?? undefined);
       }
     };
     if (formData && !initialState) {
@@ -150,9 +152,9 @@ export const BlockComponent = props => {
     return () => {
       abortAndIgnore(abortController);
     };
-  }, [getFormState, schemaFieldsPath, id, formData, editor, nodeKey, initialState, collectionSlug, globalSlug, getDocPreferences, parentDocumentFields]);
+  }, [getFormState, schemaFieldsPath, isEditable, id, formData, editor, nodeKey, initialState, collectionSlug, globalSlug, getDocPreferences, parentDocumentFields, blockType]);
   const [isCollapsed, setIsCollapsed] = React.useState(initialLexicalFormState?.[formData.id]?.collapsed ?? false);
-  const componentMapRenderedBlockPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.${formData.blockType}`;
+  const componentMapRenderedBlockPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.${blockType}`;
   const clientSchemaMap = featureClientSchemaMap['blocks'];
   const blocksField = clientSchemaMap?.[componentMapRenderedBlockPath]?.[0];
   const clientBlock = blocksField.blockReferences ? typeof blocksField?.blockReferences?.[0] === 'string' ? config.blocksMap[blocksField?.blockReferences?.[0]] : blocksField?.blockReferences?.[0] : blocksField?.blocks?.[0];
@@ -181,6 +183,7 @@ export const BlockComponent = props => {
       globalSlug,
       initialBlockFormState: prevFormState,
       operation: 'update',
+      readOnly: !isEditable,
       renderAllFields: submit ? true : false,
       schemaPath: schemaFieldsPath,
       signal: controller.signal
@@ -199,14 +202,14 @@ export const BlockComponent = props => {
         const node_0 = $getNodeByKey(nodeKey);
         if (node_0 && $isBlockNode(node_0)) {
           const newData_0 = newFormStateData_0;
-          newData_0.blockType = formData.blockType;
+          newData_0.blockType = blockType;
           node_0.setFields(newData_0, true);
         }
       });
     }, 0);
     if (submit) {
-      setCustomLabel(newFormState._components?.customComponents?.BlockLabel);
-      setCustomBlock(newFormState._components?.customComponents?.Block);
+      setCustomLabel(newFormState._components?.customComponents?.BlockLabel ?? undefined);
+      setCustomBlock(newFormState._components?.customComponents?.Block ?? undefined);
       let rowErrorCount = 0;
       for (const formField of Object.values(newFormState)) {
         if (formField?.valid === false) {
@@ -216,7 +219,7 @@ export const BlockComponent = props => {
       setErrorCount(rowErrorCount);
     }
     return newFormState;
-  }, [getFormState, id, collectionSlug, getDocPreferences, globalSlug, schemaFieldsPath, formData.blockType, parentDocumentFields, editor, nodeKey]);
+  }, [getFormState, id, collectionSlug, getDocPreferences, globalSlug, schemaFieldsPath, blockType, parentDocumentFields, isEditable, editor, nodeKey]);
   useEffect(() => {
     return () => {
       abortAndIgnore(onChangeAbortControllerRef.current);
@@ -251,7 +254,7 @@ export const BlockComponent = props => {
   const EditButton = useMemo(() => () => /*#__PURE__*/_jsx(Button, {
     buttonStyle: "icon-label",
     className: `${baseClass}__editButton`,
-    disabled: readOnly,
+    disabled: !isEditable,
     el: "button",
     icon: "edit",
     onClick: e => {
@@ -270,11 +273,11 @@ export const BlockComponent = props => {
     tooltip: t('lexical:blocks:inlineBlocks:edit', {
       label: blockDisplayName
     })
-  }), [blockDisplayName, readOnly, t, toggleDrawer]);
+  }), [blockDisplayName, t, isEditable, toggleDrawer]);
   const RemoveButton = useMemo(() => () => /*#__PURE__*/_jsx(Button, {
     buttonStyle: "icon-label",
     className: `${baseClass}__removeButton`,
-    disabled: parentLexicalRichTextField?.admin?.readOnly || false,
+    disabled: !isEditable,
     icon: "x",
     onClick: e_1 => {
       e_1.preventDefault();
@@ -282,53 +285,65 @@ export const BlockComponent = props => {
     },
     round: true,
     tooltip: "Remove Block"
-  }), [parentLexicalRichTextField?.admin?.readOnly, removeBlock]);
+  }), [isEditable, removeBlock]);
   const BlockCollapsible = useMemo(() => ({
+    Actions,
     children,
+    className,
+    collapsibleProps,
     disableBlockName,
     editButton,
     errorCount: errorCount_0,
     fieldHasErrors,
     Label,
+    Pill: CustomPill,
     removeButton
-  }) => /*#__PURE__*/_jsx("div", {
-    className: baseClass + ' ' + baseClass + '-' + formData.blockType,
-    children: /*#__PURE__*/_jsx(Collapsible, {
-      className: [`${baseClass}__row`, fieldHasErrors ? `${baseClass}__row--has-errors` : `${baseClass}__row--no-errors`].join(' '),
-      collapsibleStyle: fieldHasErrors ? 'error' : 'default',
-      header: /*#__PURE__*/_jsxs("div", {
-        className: `${baseClass}__block-header`,
-        children: [Label ?? CustomLabel ? Label ?? CustomLabel : /*#__PURE__*/_jsxs("div", {
-          children: [/*#__PURE__*/_jsx(Pill, {
-            className: `${baseClass}__block-pill ${baseClass}__block-pill-${formData?.blockType}`,
-            pillStyle: "white",
-            size: "small",
-            children: blockDisplayName ?? formData?.blockType
-          }), !disableBlockName && !clientBlock?.admin?.disableBlockName && /*#__PURE__*/_jsx(SectionTitle, {
-            path: "blockName",
-            readOnly: parentLexicalRichTextField?.admin?.readOnly || false
-          }), fieldHasErrors && /*#__PURE__*/_jsx(ErrorPill, {
-            count: errorCount_0 ?? 0,
-            i18n: i18n,
-            withMessage: true
+  }) => {
+    return /*#__PURE__*/_jsx("div", {
+      className: baseClass + ' ' + baseClass + '-' + blockType,
+      children: /*#__PURE__*/_jsx(Collapsible, {
+        className: [`${baseClass}__row`, fieldHasErrors ? `${baseClass}__row--has-errors` : `${baseClass}__row--no-errors`, className].filter(Boolean).join(' '),
+        collapsibleStyle: fieldHasErrors ? 'error' : 'default',
+        header: /*#__PURE__*/_jsxs("div", {
+          className: `${baseClass}__block-header`,
+          children: [typeof Label !== 'undefined' ? Label : typeof CustomLabel !== 'undefined' ? CustomLabel : /*#__PURE__*/_jsxs("div", {
+            className: `${baseClass}__block-label`,
+            children: [typeof CustomPill !== 'undefined' ? CustomPill : /*#__PURE__*/_jsx(Pill, {
+              className: `${baseClass}__block-pill ${baseClass}__block-pill-${blockType}`,
+              pillStyle: "white",
+              size: "small",
+              children: blockDisplayName ?? blockType
+            }), !disableBlockName && !clientBlock?.admin?.disableBlockName && /*#__PURE__*/_jsx(SectionTitle, {
+              path: "blockName",
+              readOnly: !isEditable
+            }), fieldHasErrors && /*#__PURE__*/_jsx(ErrorPill, {
+              count: errorCount_0 ?? 0,
+              i18n: i18n,
+              withMessage: true
+            })]
+          }), /*#__PURE__*/_jsx("div", {
+            className: `${baseClass}__block-actions`,
+            children: typeof Actions !== 'undefined' ? Actions : /*#__PURE__*/_jsxs(_Fragment, {
+              children: [CustomBlock && editButton !== false || !CustomBlock && editButton ? /*#__PURE__*/_jsx(EditButton, {}) : null, removeButton !== false && isEditable ? /*#__PURE__*/_jsx(RemoveButton, {}) : null]
+            })
           })]
-        }), /*#__PURE__*/_jsxs("div", {
-          children: [CustomBlock && editButton !== false || !CustomBlock && editButton ? /*#__PURE__*/_jsx(EditButton, {}) : null, removeButton !== false && editor.isEditable() ? /*#__PURE__*/_jsx(RemoveButton, {}) : null]
-        })]
-      }),
-      isCollapsed: isCollapsed,
-      onToggle: incomingCollapsedState => {
-        onCollapsedChange(incomingCollapsedState);
-        setIsCollapsed(incomingCollapsedState);
-      },
-      children: children
-    }, 0)
-  }), [CustomBlock, CustomLabel, EditButton, RemoveButton, blockDisplayName, clientBlock?.admin?.disableBlockName, editor, formData.blockType, i18n, isCollapsed, onCollapsedChange, parentLexicalRichTextField?.admin?.readOnly]);
+        }),
+        isCollapsed: isCollapsed,
+        onToggle: incomingCollapsedState => {
+          onCollapsedChange(incomingCollapsedState);
+          setIsCollapsed(incomingCollapsedState);
+        },
+        ...(collapsibleProps || {}),
+        children: children
+      }, 0)
+    });
+  }, [CustomBlock, CustomLabel, EditButton, RemoveButton, blockDisplayName, clientBlock?.admin?.disableBlockName, blockType, i18n, isCollapsed, onCollapsedChange, isEditable]);
+  const blockID = formData?.id;
   const BlockDrawer = useMemo(() => () => /*#__PURE__*/_jsx(EditDepthProvider, {
     children: /*#__PURE__*/_jsx(Drawer, {
       className: '',
       slug: drawerSlug,
-      title: t(`lexical:blocks:inlineBlocks:${formData?.id ? 'edit' : 'create'}`, {
+      title: t(`lexical:blocks:inlineBlocks:${blockID ? 'edit' : 'create'}`, {
         label: blockDisplayName ?? t('lexical:blocks:inlineBlocks:label')
       }),
       children: initialState ? /*#__PURE__*/_jsxs(_Fragment, {
@@ -341,14 +356,14 @@ export const BlockComponent = props => {
           parentSchemaPath: schemaFieldsPath,
           permissions: true,
-          readOnly: false
+          readOnly: !isEditable
         }), /*#__PURE__*/_jsx(FormSubmit, {
           programmaticSubmit: true,
           children: t('fields:saveChanges')
         })]
       }) : null
     })
-  }), [initialState, drawerSlug, blockDisplayName, t, clientBlock?.fields, schemaFieldsPath, permissions]);
+  }), [initialState, drawerSlug, blockID, blockDisplayName, t, isEditable, clientBlock?.fields, schemaFieldsPath]);
   // Memoized Form JSX
   const Block = useMemo(() => {
     if (!initialState) {
@@ -370,7 +385,7 @@ export const BlockComponent = props => {
       onChange: [onChange],
       onSubmit: (formState_0, newData_1) => {
         // This is only called when form is submitted from drawer - usually only the case if the block has a custom Block component
-        newData_1.blockType = formData.blockType;
+        newData_1.blockType = blockType;
         editor.update(() => {
           const node_1 = $getNodeByKey(nodeKey);
           if (node_1 && $isBlockNode(node_1)) {
@@ -394,7 +409,7 @@ export const BlockComponent = props => {
         RemoveButton: RemoveButton
       })
     });
-  }, [BlockCollapsible, BlockDrawer, CustomBlock, clientBlock?.fields, RemoveButton, EditButton, editor, errorCount, toggleDrawer, clientBlock?.fields,
+  }, [BlockCollapsible, BlockDrawer, CustomBlock, blockType, RemoveButton, EditButton, editor, errorCount, toggleDrawer, clientBlock?.fields,
   // DO NOT ADD FORMDATA HERE! Adding formData will kick you out of sub block editors while writing.
   initialState, nodeKey, onChange, submitted]);
   if (!clientBlock) {
@@ -403,7 +418,7 @@ export const BlockComponent = props => {
       fieldHasErrors: true,
       children: /*#__PURE__*/_jsxs("div", {
         className: "lexical-block-not-found",
-        children: ["Error: Block '", formData.blockType, "' not found in the config but exists in the lexical data"]
+        children: ["Error: Block '", blockType, "' not found in the config but exists in the lexical data"]
       })
     });
   }

package/dist/features/blocks/client/component/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":["Button","Collapsible","Drawer","EditDepthProvider","ErrorPill","Form","formatDrawerSlug","FormSubmit","Pill","RenderFields","SectionTitle","useConfig","useDocumentForm","useDocumentInfo","useEditDepth","useFormSubmitted","useServerFunctions","useTranslation","abortAndIgnore","deepCopyObjectSimpleWithoutReactComponents","reduceFieldsToValues","React","useCallback","useEffect","useMemo","useRef","baseClass","useLexicalComposerContext","getTranslation","$getNodeByKey","v4","uuid","useEditorConfigContext","useLexicalDrawer","$isBlockNode","BlockContent","removeEmptyArrayValues","BlockComponent","props","cacheBuster","formData","nodeKey","submitted","id","collectionSlug","globalSlug","fieldProps","featureClientSchemaMap","field","parentLexicalRichTextField","initialLexicalFormState","permissions","readOnly","schemaPath","uuidFromContext","fields","parentDocumentFields","onChangeAbortControllerRef","AbortController","editDepth","errorCount","setErrorCount","useState","config","drawerSlug","slug","depth","toggleDrawer","getDocPreferences","setDocFieldPreferences","editor","getFormState","schemaFieldsPath","blockType","initialState","setInitialState","formState","blockName","initialValue","passesCondition","valid","value","hasMounted","prevCacheBuster","current","CustomLabel","setCustomLabel","customComponents","BlockLabel","CustomBlock","setCustomBlock","Block","abortController","awaitInitialState","state","data","docPermissions","docPreferences","documentFormState","initialBlockData","operation","renderAllFields","signal","newFormStateData","update","node","newData","setFields","_components","isCollapsed","setIsCollapsed","collapsed","componentMapRenderedBlockPath","clientSchemaMap","blocksField","clientBlock","blockReferences","blocksMap","blocks","i18n","t","onChange","prevFormState","submit","controller","newFormState","initialBlockFormState","setTimeout","rowErrorCount","formField","Object","values","removeBlock","remove","blockDisplayName","labels","singular","onCollapsedChange","changedCollapsed","then","currentDocPreferences","currentFieldPreferences","name","collapsedArray","newCollapsed","length","includes","push","splice","indexOf","hello","EditButton","_jsx","buttonStyle","className","disabled","el","icon","onClick","e","preventDefault","stopPropagation","onMouseDown","round","size","tooltip","label","RemoveButton","admin","BlockCollapsible","children","disableBlockName","editButton","fieldHasErrors","Label","removeButton","join","collapsibleStyle","header","_jsxs","pillStyle","path","count","withMessage","isEditable","onToggle","incomingCollapsedState","BlockDrawer","title","_Fragment","forceRender","parentIndexPath","parentPath","parentSchemaPath","programmaticSubmit","beforeSubmit","onSubmit","formSchema"],"sources":["../../../../../src/features/blocks/client/component/index.tsx"],"sourcesContent":["'use client'\n\nimport {\n Button,\n Collapsible,\n Drawer,\n EditDepthProvider,\n ErrorPill,\n Form,\n formatDrawerSlug,\n FormSubmit,\n Pill,\n RenderFields,\n SectionTitle,\n useConfig,\n useDocumentForm,\n useDocumentInfo,\n useEditDepth,\n useFormSubmitted,\n useServerFunctions,\n useTranslation,\n} from '@payloadcms/ui'\nimport { abortAndIgnore } from '@payloadcms/ui/shared'\nimport { deepCopyObjectSimpleWithoutReactComponents, reduceFieldsToValues } from 'payload/shared'\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react'\n\nconst baseClass = 'lexical-block'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { getTranslation } from '@payloadcms/translations'\nimport { $getNodeByKey } from 'lexical'\nimport {\n type BlocksFieldClient,\n type ClientBlock,\n type CollapsedPreferences,\n type FormState,\n} from 'payload'\nimport { v4 as uuid } from 'uuid'\n\nimport type { BlockFields } from '../../server/nodes/BlocksNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { useLexicalDrawer } from '../../../../utilities/fieldsDrawer/useLexicalDrawer.js'\nimport './index.scss'\nimport { $isBlockNode } from '../nodes/BlocksNode.js'\nimport { BlockContent } from './BlockContent.js'\nimport { removeEmptyArrayValues } from './removeEmptyArrayValues.js'\n\ntype Props = {\n /*\n Can be modified by the node in order to trigger the re-fetch of the initial state based on the\n * formData. This is useful when node.setFields() is explicitly called from outside of the form - in\n * this case, the new field state is likely not reflected in the form state, so we need to re-fetch\n /\n readonly cacheBuster: number\n readonly formData: BlockFields\n readonly nodeKey: string\n}\n\nexport const BlockComponent: React.FC<Props> = (props) => {\n const { cacheBuster, formData, nodeKey } = props\n const submitted = useFormSubmitted()\n const { id, collectionSlug, globalSlug } = useDocumentInfo()\n const {\n fieldProps: {\n featureClientSchemaMap,\n field: parentLexicalRichTextField,\n initialLexicalFormState,\n permissions,\n readOnly,\n schemaPath,\n },\n uuid: uuidFromContext,\n } = useEditorConfigContext()\n\n const { fields: parentDocumentFields } = useDocumentForm()\n const onChangeAbortControllerRef = useRef(new AbortController())\n const editDepth = useEditDepth()\n const [errorCount, setErrorCount] = React.useState(0)\n\n const { config } = useConfig()\n\n const drawerSlug = formatDrawerSlug({\n slug: `lexical-blocks-create-${uuidFromContext}-${formData.id}`,\n depth: editDepth,\n })\n const { toggleDrawer } = useLexicalDrawer(drawerSlug)\n\n // Used for saving collapsed to preferences (and gettin' it from there again)\n // Remember, these preferences are scoped to the whole document, not just this form. This\n // is important to consider for the data path used in setDocFieldPreferences\n const { getDocPreferences, setDocFieldPreferences } = useDocumentInfo()\n const [editor] = useLexicalComposerContext()\n\n const { getFormState } = useServerFunctions()\n const schemaFieldsPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.${formData.blockType}.fields`\n\n const [initialState, setInitialState] = React.useState<false \| FormState \| undefined>(() => {\n return initialLexicalFormState?.[formData.id]?.formState\n ? {\n ...initialLexicalFormState?.[formData.id]?.formState,\n blockName: {\n initialValue: formData.blockName,\n passesCondition: true,\n valid: true,\n value: formData.blockName,\n },\n }\n : false\n })\n\n const hasMounted = useRef(false)\n const prevCacheBuster = useRef(cacheBuster)\n useEffect(() => {\n if (hasMounted.current) {\n if (prevCacheBuster.current !== cacheBuster) {\n setInitialState(false)\n }\n prevCacheBuster.current = cacheBuster\n } else {\n hasMounted.current = true\n }\n }, [cacheBuster])\n\n const [CustomLabel, setCustomLabel] = React.useState<React.ReactNode \| undefined>(\n // @ts-expect-error - vestiges of when tsconfig was not strict. Feel free to improve\n initialState?.['_components']?.customComponents?.BlockLabel,\n )\n\n const [CustomBlock, setCustomBlock] = React.useState<React.ReactNode \| undefined>(\n // @ts-expect-error - vestiges of when tsconfig was not strict. Feel free to improve\n initialState?.['_components']?.customComponents?.Block,\n )\n\n // Initial state for newly created blocks\n useEffect(() => {\n const abortController = new AbortController()\n\n const awaitInitialState = async () => {\n /\n * This will only run if a new block is created. For all existing blocks that are loaded when the document is loaded, or when the form is saved,\n * this is not run, as the lexical field RSC will fetch the state server-side and pass it to the client. That way, we avoid unnecessary client-side\n * requests. Though for newly created blocks, we need to fetch the state client-side, as the server doesn't know about the block yet.\n /\n const { state } = await getFormState({\n id,\n collectionSlug,\n data: formData,\n docPermissions: { fields: true },\n docPreferences: await getDocPreferences(),\n documentFormState: deepCopyObjectSimpleWithoutReactComponents(parentDocumentFields),\n globalSlug,\n initialBlockData: formData,\n operation: 'update',\n renderAllFields: true,\n schemaPath: schemaFieldsPath,\n signal: abortController.signal,\n })\n\n if (state) {\n state.blockName = {\n initialValue: formData.blockName,\n passesCondition: true,\n valid: true,\n value: formData.blockName,\n }\n\n const newFormStateData: BlockFields = reduceFieldsToValues(\n deepCopyObjectSimpleWithoutReactComponents(state),\n true,\n ) as BlockFields\n\n // Things like default values may come back from the server => update the node with the new data\n editor.update(() => {\n const node = $getNodeByKey(nodeKey)\n if (node && $isBlockNode(node)) {\n const newData = newFormStateData\n newData.blockType = formData.blockType\n\n node.setFields(newData, true)\n }\n })\n\n setInitialState(state)\n setCustomLabel(state._components?.customComponents?.BlockLabel)\n setCustomBlock(state._components?.customComponents?.Block)\n }\n }\n\n if (formData && !initialState) {\n void awaitInitialState()\n }\n\n return () => {\n abortAndIgnore(abortController)\n }\n }, [\n getFormState,\n schemaFieldsPath,\n id,\n formData,\n editor,\n nodeKey,\n initialState,\n collectionSlug,\n globalSlug,\n getDocPreferences,\n parentDocumentFields,\n ])\n\n const [isCollapsed, setIsCollapsed] = React.useState<boolean>(\n initialLexicalFormState?.[formData.id]?.collapsed ?? false,\n )\n\n const componentMapRenderedBlockPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.${formData.blockType}`\n\n const clientSchemaMap = featureClientSchemaMap['blocks']\n\n const blocksField: BlocksFieldClient \| undefined = clientSchemaMap?.[\n componentMapRenderedBlockPath\n ]?.[0] as BlocksFieldClient\n\n const clientBlock: ClientBlock \| undefined = blocksField.blockReferences\n ? typeof blocksField?.blockReferences?.[0] === 'string'\n ? config.blocksMap[blocksField?.blockReferences?.[0]]\n : blocksField?.blockReferences?.[0]\n : blocksField?.blocks?.[0]\n\n const { i18n, t } = useTranslation<object, string>()\n\n const onChange = useCallback(\n async ({ formState: prevFormState, submit }: { formState: FormState; submit?: boolean }) => {\n abortAndIgnore(onChangeAbortControllerRef.current)\n\n const controller = new AbortController()\n onChangeAbortControllerRef.current = controller\n\n const { state: newFormState } = await getFormState({\n id,\n collectionSlug,\n docPermissions: {\n fields: true,\n },\n docPreferences: await getDocPreferences(),\n documentFormState: deepCopyObjectSimpleWithoutReactComponents(parentDocumentFields),\n formState: prevFormState,\n globalSlug,\n initialBlockFormState: prevFormState,\n operation: 'update',\n renderAllFields: submit ? true : false,\n schemaPath: schemaFieldsPath,\n signal: controller.signal,\n })\n\n if (!newFormState) {\n return prevFormState\n }\n\n if (prevFormState.blockName) {\n newFormState.blockName = prevFormState.blockName\n }\n\n const newFormStateData: BlockFields = reduceFieldsToValues(\n removeEmptyArrayValues({\n fields: deepCopyObjectSimpleWithoutReactComponents(newFormState),\n }),\n true,\n ) as BlockFields\n\n setTimeout(() => {\n editor.update(() => {\n const node = $getNodeByKey(nodeKey)\n if (node && $isBlockNode(node)) {\n const newData = newFormStateData\n newData.blockType = formData.blockType\n node.setFields(newData, true)\n }\n })\n }, 0)\n\n if (submit) {\n setCustomLabel(newFormState._components?.customComponents?.BlockLabel)\n setCustomBlock(newFormState._components?.customComponents?.Block)\n\n let rowErrorCount = 0\n for (const formField of Object.values(newFormState)) {\n if (formField?.valid === false) {\n rowErrorCount++\n }\n }\n setErrorCount(rowErrorCount)\n }\n\n return newFormState\n },\n\n [\n getFormState,\n id,\n collectionSlug,\n getDocPreferences,\n globalSlug,\n schemaFieldsPath,\n formData.blockType,\n parentDocumentFields,\n editor,\n nodeKey,\n ],\n )\n\n useEffect(() => {\n return () => {\n abortAndIgnore(onChangeAbortControllerRef.current)\n }\n }, [])\n\n const removeBlock = useCallback(() => {\n editor.update(() => {\n $getNodeByKey(nodeKey)?.remove()\n })\n }, [editor, nodeKey])\n\n const blockDisplayName = clientBlock?.labels?.singular\n ? getTranslation(clientBlock.labels.singular, i18n)\n : clientBlock?.slug\n\n const onCollapsedChange = useCallback(\n (changedCollapsed: boolean) => {\n void getDocPreferences().then((currentDocPreferences) => {\n const currentFieldPreferences =\n currentDocPreferences?.fields?.[parentLexicalRichTextField.name]\n\n const collapsedArray = currentFieldPreferences?.collapsed\n\n const newCollapsed: CollapsedPreferences =\n collapsedArray && collapsedArray?.length ? collapsedArray : []\n\n if (changedCollapsed) {\n if (!newCollapsed.includes(formData.id)) {\n newCollapsed.push(formData.id)\n }\n } else {\n if (newCollapsed.includes(formData.id)) {\n newCollapsed.splice(newCollapsed.indexOf(formData.id), 1)\n }\n }\n\n setDocFieldPreferences(parentLexicalRichTextField.name, {\n collapsed: newCollapsed,\n hello: 'hi',\n })\n })\n },\n [getDocPreferences, parentLexicalRichTextField.name, setDocFieldPreferences, formData.id],\n )\n\n const EditButton = useMemo(\n () => () => (\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__editButton`}\n disabled={readOnly}\n el=\"button\"\n icon=\"edit\"\n onClick={(e) => {\n e.preventDefault()\n e.stopPropagation()\n toggleDrawer()\n return false\n }}\n onMouseDown={(e) => {\n // Needed to preserve lexical selection for toggleDrawer lexical selection restore.\n // I believe this is needed due to this button (usually) being inside of a collapsible.\n e.preventDefault()\n }}\n round\n size=\"small\"\n tooltip={t('lexical:blocks:inlineBlocks:edit', { label: blockDisplayName })}\n />\n ),\n [blockDisplayName, readOnly, t, toggleDrawer],\n )\n\n const RemoveButton = useMemo(\n () => () => (\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__removeButton`}\n disabled={parentLexicalRichTextField?.admin?.readOnly \|\| false}\n icon=\"x\"\n onClick={(e) => {\n e.preventDefault()\n removeBlock()\n }}\n round\n tooltip=\"Remove Block\"\n />\n ),\n [parentLexicalRichTextField?.admin?.readOnly, removeBlock],\n )\n\n const BlockCollapsible = useMemo(\n () =>\n ({\n children,\n disableBlockName,\n editButton,\n errorCount,\n fieldHasErrors,\n Label,\n removeButton,\n }: {\n children?: React.ReactNode\n disableBlockName?: boolean\n editButton?: boolean\n errorCount?: number\n fieldHasErrors?: boolean\n /\n Override the default label with a custom label\n */\n Label?: React.ReactNode\n removeButton?: boolean\n }) => (\n <div className={baseClass + ' ' + baseClass + '-' + formData.blockType}>\n <Collapsible\n className={[\n `${baseClass}__row`,\n fieldHasErrors ? `${baseClass}__row--has-errors` : `${baseClass}__row--no-errors`,\n ].join(' ')}\n collapsibleStyle={fieldHasErrors ? 'error' : 'default'}\n header={\n <div className={`${baseClass}__block-header`}>\n {(Label ?? CustomLabel) ? (\n (Label ?? CustomLabel)\n ) : (\n <div>\n <Pill\n className={`${baseClass}__block-pill ${baseClass}__block-pill-${formData?.blockType}`}\n pillStyle=\"white\"\n size=\"small\"\n >\n {blockDisplayName ?? formData?.blockType}\n </Pill>\n {!disableBlockName && !clientBlock?.admin?.disableBlockName && (\n <SectionTitle\n path=\"blockName\"\n readOnly={parentLexicalRichTextField?.admin?.readOnly \|\| false}\n />\n )}\n\n {fieldHasErrors && (\n <ErrorPill count={errorCount ?? 0} i18n={i18n} withMessage />\n )}\n </div>\n )}\n\n <div>\n {(CustomBlock && editButton !== false) \|\| (!CustomBlock && editButton) ? (\n <EditButton />\n ) : null}\n {removeButton !== false && editor.isEditable() ? <RemoveButton /> : null}\n </div>\n </div>\n }\n isCollapsed={isCollapsed}\n key={0}\n onToggle={(incomingCollapsedState) => {\n onCollapsedChange(incomingCollapsedState)\n setIsCollapsed(incomingCollapsedState)\n }}\n >\n {children}\n </Collapsible>\n </div>\n ),\n [\n CustomBlock,\n CustomLabel,\n EditButton,\n RemoveButton,\n blockDisplayName,\n clientBlock?.admin?.disableBlockName,\n editor,\n formData.blockType,\n i18n,\n isCollapsed,\n onCollapsedChange,\n parentLexicalRichTextField?.admin?.readOnly,\n ],\n )\n\n const BlockDrawer = useMemo(\n () => () => (\n <EditDepthProvider>\n <Drawer\n className={''}\n slug={drawerSlug}\n title={t(`lexical:blocks:inlineBlocks:${formData?.id ? 'edit' : 'create'}`, {\n label: blockDisplayName ?? t('lexical:blocks:inlineBlocks:label'),\n })}\n >\n {initialState ? (\n <>\n <RenderFields\n fields={clientBlock?.fields ?? []}\n forceRender\n parentIndexPath=\"\"\n parentPath=\"\" // See Blocks feature path for details as for why this is empty\n parentSchemaPath={schemaFieldsPath}\n permissions={true}\n readOnly={false}\n />\n <FormSubmit programmaticSubmit={true}>{t('fields:saveChanges')}</FormSubmit>\n </>\n ) : null}\n </Drawer>\n </EditDepthProvider>\n ),\n [\n initialState,\n drawerSlug,\n blockDisplayName,\n t,\n clientBlock?.fields,\n schemaFieldsPath,\n permissions,\n // DO NOT ADD FORMDATA HERE! Adding formData will kick you out of sub block editors while writing.\n ],\n )\n\n // Memoized Form JSX\n const Block = useMemo(() => {\n if (!initialState) {\n return null\n }\n return (\n <Form\n beforeSubmit={[\n async ({ formState }) => {\n // This is only called when form is submitted from drawer - usually only the case if the block has a custom Block component\n return await onChange({ formState, submit: true })\n },\n ]}\n el=\"div\"\n fields={clientBlock?.fields ?? []}\n initialState={initialState}\n onChange={[onChange]}\n onSubmit={(formState, newData) => {\n // This is only called when form is submitted from drawer - usually only the case if the block has a custom Block component\n newData.blockType = formData.blockType\n editor.update(() => {\n const node = $getNodeByKey(nodeKey)\n if (node && $isBlockNode(node)) {\n node.setFields(newData as BlockFields, true)\n }\n })\n toggleDrawer()\n }}\n submitted={submitted}\n uuid={uuid()}\n >\n <BlockContent\n baseClass={baseClass}\n BlockDrawer={BlockDrawer}\n Collapsible={BlockCollapsible}\n CustomBlock={CustomBlock}\n EditButton={EditButton}\n errorCount={errorCount}\n formSchema={clientBlock?.fields ?? []}\n initialState={initialState}\n nodeKey={nodeKey}\n RemoveButton={RemoveButton}\n />\n </Form>\n )\n }, [\n BlockCollapsible,\n BlockDrawer,\n CustomBlock,\n clientBlock?.fields,\n RemoveButton,\n EditButton,\n editor,\n errorCount,\n toggleDrawer,\n clientBlock?.fields,\n // DO NOT ADD FORMDATA HERE! Adding formData will kick you out of sub block editors while writing.\n initialState,\n nodeKey,\n onChange,\n submitted,\n ])\n\n if (!clientBlock) {\n return (\n <BlockCollapsible disableBlockName={true} fieldHasErrors={true}>\n <div className=\"lexical-block-not-found\">\n Error: Block '{formData.blockType}' not found in the config but exists in the lexical data\n </div>\n </BlockCollapsible>\n )\n }\n\n return Block\n}\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"index.js","names":["Button","Collapsible","Drawer","EditDepthProvider","ErrorPill","Form","formatDrawerSlug","FormSubmit","Pill","RenderFields","SectionTitle","useConfig","useDocumentForm","useDocumentInfo","useEditDepth","useFormSubmitted","useServerFunctions","useTranslation","abortAndIgnore","deepCopyObjectSimpleWithoutReactComponents","reduceFieldsToValues","React","useCallback","useEffect","useMemo","useRef","baseClass","useLexicalComposerContext","useLexicalEditable","getTranslation","$getNodeByKey","v4","uuid","useEditorConfigContext","useLexicalDrawer","$isBlockNode","BlockContent","removeEmptyArrayValues","BlockComponent","props","cacheBuster","formData","nodeKey","submitted","id","collectionSlug","globalSlug","fieldProps","featureClientSchemaMap","field","parentLexicalRichTextField","initialLexicalFormState","schemaPath","uuidFromContext","fields","parentDocumentFields","onChangeAbortControllerRef","AbortController","editDepth","errorCount","setErrorCount","useState","config","drawerSlug","slug","depth","toggleDrawer","getDocPreferences","setDocFieldPreferences","editor","isEditable","blockType","getFormState","schemaFieldsPath","initialState","setInitialState","formState","blockName","initialValue","passesCondition","valid","value","hasMounted","prevCacheBuster","current","CustomLabel","setCustomLabel","customComponents","BlockLabel","undefined","CustomBlock","setCustomBlock","Block","abortController","awaitInitialState","state","data","docPermissions","docPreferences","documentFormState","initialBlockData","operation","readOnly","renderAllFields","signal","newFormStateData","update","node","newData","setFields","_components","isCollapsed","setIsCollapsed","collapsed","componentMapRenderedBlockPath","clientSchemaMap","blocksField","clientBlock","blockReferences","blocksMap","blocks","i18n","t","onChange","prevFormState","submit","controller","newFormState","initialBlockFormState","setTimeout","rowErrorCount","formField","Object","values","removeBlock","remove","blockDisplayName","labels","singular","onCollapsedChange","changedCollapsed","then","currentDocPreferences","currentFieldPreferences","name","collapsedArray","newCollapsed","length","includes","push","splice","indexOf","hello","EditButton","_jsx","buttonStyle","className","disabled","el","icon","onClick","e","preventDefault","stopPropagation","onMouseDown","round","size","tooltip","label","RemoveButton","BlockCollapsible","Actions","children","collapsibleProps","disableBlockName","editButton","fieldHasErrors","Label","CustomPill","removeButton","filter","Boolean","join","collapsibleStyle","header","_jsxs","pillStyle","admin","path","count","withMessage","_Fragment","onToggle","incomingCollapsedState","blockID","BlockDrawer","title","forceRender","parentIndexPath","parentPath","parentSchemaPath","permissions","programmaticSubmit","beforeSubmit","onSubmit","formSchema"],"sources":["../../../../../src/features/blocks/client/component/index.tsx"],"sourcesContent":["'use client'\n\nimport {\n Button,\n Collapsible,\n Drawer,\n EditDepthProvider,\n ErrorPill,\n Form,\n formatDrawerSlug,\n FormSubmit,\n Pill,\n RenderFields,\n SectionTitle,\n useConfig,\n useDocumentForm,\n useDocumentInfo,\n useEditDepth,\n useFormSubmitted,\n useServerFunctions,\n useTranslation,\n} from '@payloadcms/ui'\nimport { abortAndIgnore } from '@payloadcms/ui/shared'\nimport { deepCopyObjectSimpleWithoutReactComponents, reduceFieldsToValues } from 'payload/shared'\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react'\n\nconst baseClass = 'lexical-block'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport { getTranslation } from '@payloadcms/translations'\nimport { $getNodeByKey } from 'lexical'\nimport {\n type BlocksFieldClient,\n type ClientBlock,\n type CollapsedPreferences,\n type FormState,\n} from 'payload'\nimport { v4 as uuid } from 'uuid'\n\nimport type { BlockFields } from '../../server/nodes/BlocksNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport './index.scss'\nimport { useLexicalDrawer } from '../../../../utilities/fieldsDrawer/useLexicalDrawer.js'\nimport { $isBlockNode } from '../nodes/BlocksNode.js'\nimport { type BlockCollapsibleWithErrorProps, BlockContent } from './BlockContent.js'\nimport { removeEmptyArrayValues } from './removeEmptyArrayValues.js'\n\ntype Props = {\n /*\n Can be modified by the node in order to trigger the re-fetch of the initial state based on the\n * formData. This is useful when node.setFields() is explicitly called from outside of the form - in\n * this case, the new field state is likely not reflected in the form state, so we need to re-fetch\n /\n readonly cacheBuster: number\n readonly formData: BlockFields\n readonly nodeKey: string\n}\n\nexport const BlockComponent: React.FC<Props> = (props) => {\n const { cacheBuster, formData, nodeKey } = props\n const submitted = useFormSubmitted()\n const { id, collectionSlug, globalSlug } = useDocumentInfo()\n const {\n fieldProps: {\n featureClientSchemaMap,\n field: parentLexicalRichTextField,\n initialLexicalFormState,\n schemaPath,\n },\n uuid: uuidFromContext,\n } = useEditorConfigContext()\n\n const { fields: parentDocumentFields } = useDocumentForm()\n const onChangeAbortControllerRef = useRef(new AbortController())\n const editDepth = useEditDepth()\n const [errorCount, setErrorCount] = React.useState(0)\n\n const { config } = useConfig()\n\n const drawerSlug = formatDrawerSlug({\n slug: `lexical-blocks-create-${uuidFromContext}-${formData.id}`,\n depth: editDepth,\n })\n const { toggleDrawer } = useLexicalDrawer(drawerSlug)\n\n // Used for saving collapsed to preferences (and gettin' it from there again)\n // Remember, these preferences are scoped to the whole document, not just this form. This\n // is important to consider for the data path used in setDocFieldPreferences\n const { getDocPreferences, setDocFieldPreferences } = useDocumentInfo()\n const [editor] = useLexicalComposerContext()\n const isEditable = useLexicalEditable()\n\n const blockType = formData.blockType\n\n const { getFormState } = useServerFunctions()\n const schemaFieldsPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.${blockType}.fields`\n\n const [initialState, setInitialState] = React.useState<false \| FormState \| undefined>(() => {\n return initialLexicalFormState?.[formData.id]?.formState\n ? {\n ...initialLexicalFormState?.[formData.id]?.formState,\n blockName: {\n initialValue: formData.blockName,\n passesCondition: true,\n valid: true,\n value: formData.blockName,\n },\n }\n : false\n })\n\n const hasMounted = useRef(false)\n const prevCacheBuster = useRef(cacheBuster)\n useEffect(() => {\n if (hasMounted.current) {\n if (prevCacheBuster.current !== cacheBuster) {\n setInitialState(false)\n }\n prevCacheBuster.current = cacheBuster\n } else {\n hasMounted.current = true\n }\n }, [cacheBuster])\n\n const [CustomLabel, setCustomLabel] = React.useState<React.ReactNode \| undefined>(\n // @ts-expect-error - vestiges of when tsconfig was not strict. Feel free to improve\n initialState?.['_components']?.customComponents?.BlockLabel ?? undefined,\n )\n\n const [CustomBlock, setCustomBlock] = React.useState<React.ReactNode \| undefined>(\n // @ts-expect-error - vestiges of when tsconfig was not strict. Feel free to improve\n initialState?.['_components']?.customComponents?.Block ?? undefined,\n )\n\n // Initial state for newly created blocks\n useEffect(() => {\n const abortController = new AbortController()\n\n const awaitInitialState = async () => {\n /\n * This will only run if a new block is created. For all existing blocks that are loaded when the document is loaded, or when the form is saved,\n * this is not run, as the lexical field RSC will fetch the state server-side and pass it to the client. That way, we avoid unnecessary client-side\n * requests. Though for newly created blocks, we need to fetch the state client-side, as the server doesn't know about the block yet.\n */\n const { state } = await getFormState({\n id,\n collectionSlug,\n data: formData,\n docPermissions: { fields: true },\n docPreferences: await getDocPreferences(),\n documentFormState: deepCopyObjectSimpleWithoutReactComponents(parentDocumentFields),\n globalSlug,\n initialBlockData: formData,\n operation: 'update',\n readOnly: !isEditable,\n renderAllFields: true,\n schemaPath: schemaFieldsPath,\n signal: abortController.signal,\n })\n\n if (state) {\n state.blockName = {\n initialValue: formData.blockName,\n passesCondition: true,\n valid: true,\n value: formData.blockName,\n }\n\n const newFormStateData: BlockFields = reduceFieldsToValues(\n deepCopyObjectSimpleWithoutReactComponents(state),\n true,\n ) as BlockFields\n\n // Things like default values may come back from the server => update the node with the new data\n editor.update(() => {\n const node = $getNodeByKey(nodeKey)\n if (node && $isBlockNode(node)) {\n const newData = newFormStateData\n newData.blockType = blockType\n\n node.setFields(newData, true)\n }\n })\n\n setInitialState(state)\n setCustomLabel(state._components?.customComponents?.BlockLabel ?? undefined)\n setCustomBlock(state._components?.customComponents?.Block ?? undefined)\n }\n }\n\n if (formData && !initialState) {\n void awaitInitialState()\n }\n\n return () => {\n abortAndIgnore(abortController)\n }\n }, [\n getFormState,\n schemaFieldsPath,\n isEditable,\n id,\n formData,\n editor,\n nodeKey,\n initialState,\n collectionSlug,\n globalSlug,\n getDocPreferences,\n parentDocumentFields,\n blockType,\n ])\n\n const [isCollapsed, setIsCollapsed] = React.useState<boolean>(\n initialLexicalFormState?.[formData.id]?.collapsed ?? false,\n )\n\n const componentMapRenderedBlockPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.${blockType}`\n\n const clientSchemaMap = featureClientSchemaMap['blocks']\n\n const blocksField: BlocksFieldClient \| undefined = clientSchemaMap?.[\n componentMapRenderedBlockPath\n ]?.[0] as BlocksFieldClient\n\n const clientBlock: ClientBlock \| undefined = blocksField.blockReferences\n ? typeof blocksField?.blockReferences?.[0] === 'string'\n ? config.blocksMap[blocksField?.blockReferences?.[0]]\n : blocksField?.blockReferences?.[0]\n : blocksField?.blocks?.[0]\n\n const { i18n, t } = useTranslation<object, string>()\n\n const onChange = useCallback(\n async ({ formState: prevFormState, submit }: { formState: FormState; submit?: boolean }) => {\n abortAndIgnore(onChangeAbortControllerRef.current)\n\n const controller = new AbortController()\n onChangeAbortControllerRef.current = controller\n\n const { state: newFormState } = await getFormState({\n id,\n collectionSlug,\n docPermissions: {\n fields: true,\n },\n docPreferences: await getDocPreferences(),\n documentFormState: deepCopyObjectSimpleWithoutReactComponents(parentDocumentFields),\n formState: prevFormState,\n globalSlug,\n initialBlockFormState: prevFormState,\n operation: 'update',\n readOnly: !isEditable,\n renderAllFields: submit ? true : false,\n schemaPath: schemaFieldsPath,\n signal: controller.signal,\n })\n\n if (!newFormState) {\n return prevFormState\n }\n\n if (prevFormState.blockName) {\n newFormState.blockName = prevFormState.blockName\n }\n\n const newFormStateData: BlockFields = reduceFieldsToValues(\n removeEmptyArrayValues({\n fields: deepCopyObjectSimpleWithoutReactComponents(newFormState),\n }),\n true,\n ) as BlockFields\n\n setTimeout(() => {\n editor.update(() => {\n const node = $getNodeByKey(nodeKey)\n if (node && $isBlockNode(node)) {\n const newData = newFormStateData\n newData.blockType = blockType\n node.setFields(newData, true)\n }\n })\n }, 0)\n\n if (submit) {\n setCustomLabel(newFormState._components?.customComponents?.BlockLabel ?? undefined)\n setCustomBlock(newFormState._components?.customComponents?.Block ?? undefined)\n\n let rowErrorCount = 0\n for (const formField of Object.values(newFormState)) {\n if (formField?.valid === false) {\n rowErrorCount++\n }\n }\n setErrorCount(rowErrorCount)\n }\n\n return newFormState\n },\n\n [\n getFormState,\n id,\n collectionSlug,\n getDocPreferences,\n globalSlug,\n schemaFieldsPath,\n blockType,\n parentDocumentFields,\n isEditable,\n editor,\n nodeKey,\n ],\n )\n\n useEffect(() => {\n return () => {\n abortAndIgnore(onChangeAbortControllerRef.current)\n }\n }, [])\n\n const removeBlock = useCallback(() => {\n editor.update(() => {\n $getNodeByKey(nodeKey)?.remove()\n })\n }, [editor, nodeKey])\n\n const blockDisplayName = clientBlock?.labels?.singular\n ? getTranslation(clientBlock.labels.singular, i18n)\n : clientBlock?.slug\n\n const onCollapsedChange = useCallback(\n (changedCollapsed: boolean) => {\n void getDocPreferences().then((currentDocPreferences) => {\n const currentFieldPreferences =\n currentDocPreferences?.fields?.[parentLexicalRichTextField.name]\n\n const collapsedArray = currentFieldPreferences?.collapsed\n\n const newCollapsed: CollapsedPreferences =\n collapsedArray && collapsedArray?.length ? collapsedArray : []\n\n if (changedCollapsed) {\n if (!newCollapsed.includes(formData.id)) {\n newCollapsed.push(formData.id)\n }\n } else {\n if (newCollapsed.includes(formData.id)) {\n newCollapsed.splice(newCollapsed.indexOf(formData.id), 1)\n }\n }\n\n setDocFieldPreferences(parentLexicalRichTextField.name, {\n collapsed: newCollapsed,\n hello: 'hi',\n })\n })\n },\n [getDocPreferences, parentLexicalRichTextField.name, setDocFieldPreferences, formData.id],\n )\n\n const EditButton = useMemo(\n () => () => (\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__editButton`}\n disabled={!isEditable}\n el=\"button\"\n icon=\"edit\"\n onClick={(e) => {\n e.preventDefault()\n e.stopPropagation()\n toggleDrawer()\n return false\n }}\n onMouseDown={(e) => {\n // Needed to preserve lexical selection for toggleDrawer lexical selection restore.\n // I believe this is needed due to this button (usually) being inside of a collapsible.\n e.preventDefault()\n }}\n round\n size=\"small\"\n tooltip={t('lexical:blocks:inlineBlocks:edit', { label: blockDisplayName })}\n />\n ),\n [blockDisplayName, t, isEditable, toggleDrawer],\n )\n\n const RemoveButton = useMemo(\n () => () => (\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__removeButton`}\n disabled={!isEditable}\n icon=\"x\"\n onClick={(e) => {\n e.preventDefault()\n removeBlock()\n }}\n round\n tooltip=\"Remove Block\"\n />\n ),\n [isEditable, removeBlock],\n )\n\n const BlockCollapsible = useMemo(\n () =>\n ({\n Actions,\n children,\n className,\n collapsibleProps,\n disableBlockName,\n editButton,\n errorCount,\n fieldHasErrors,\n Label,\n Pill: CustomPill,\n removeButton,\n }: BlockCollapsibleWithErrorProps) => {\n return (\n <div className={baseClass + ' ' + baseClass + '-' + blockType}>\n <Collapsible\n className={[\n `${baseClass}__row`,\n fieldHasErrors ? `${baseClass}__row--has-errors` : `${baseClass}__row--no-errors`,\n className,\n ]\n .filter(Boolean)\n .join(' ')}\n collapsibleStyle={fieldHasErrors ? 'error' : 'default'}\n header={\n <div className={`${baseClass}__block-header`}>\n {typeof Label !== 'undefined' ? (\n Label\n ) : typeof CustomLabel !== 'undefined' ? (\n CustomLabel\n ) : (\n <div className={`${baseClass}__block-label`}>\n {typeof CustomPill !== 'undefined' ? (\n CustomPill\n ) : (\n <Pill\n className={`${baseClass}__block-pill ${baseClass}__block-pill-${blockType}`}\n pillStyle=\"white\"\n size=\"small\"\n >\n {blockDisplayName ?? blockType}\n </Pill>\n )}\n {!disableBlockName && !clientBlock?.admin?.disableBlockName && (\n <SectionTitle path=\"blockName\" readOnly={!isEditable} />\n )}\n\n {fieldHasErrors && (\n <ErrorPill count={errorCount ?? 0} i18n={i18n} withMessage />\n )}\n </div>\n )}\n\n <div className={`${baseClass}__block-actions`}>\n {typeof Actions !== 'undefined' ? (\n Actions\n ) : (\n <>\n {(CustomBlock && editButton !== false) \|\| (!CustomBlock && editButton) ? (\n <EditButton />\n ) : null}\n {removeButton !== false && isEditable ? <RemoveButton /> : null}\n </>\n )}\n </div>\n </div>\n }\n isCollapsed={isCollapsed}\n key={0}\n onToggle={(incomingCollapsedState) => {\n onCollapsedChange(incomingCollapsedState)\n setIsCollapsed(incomingCollapsedState)\n }}\n {...(collapsibleProps \|\| {})}\n >\n {children}\n </Collapsible>\n </div>\n )\n },\n [\n CustomBlock,\n CustomLabel,\n EditButton,\n RemoveButton,\n blockDisplayName,\n clientBlock?.admin?.disableBlockName,\n blockType,\n i18n,\n isCollapsed,\n onCollapsedChange,\n isEditable,\n ],\n )\n\n const blockID = formData?.id\n\n const BlockDrawer = useMemo(\n () => () => (\n <EditDepthProvider>\n <Drawer\n className={''}\n slug={drawerSlug}\n title={t(`lexical:blocks:inlineBlocks:${blockID ? 'edit' : 'create'}`, {\n label: blockDisplayName ?? t('lexical:blocks:inlineBlocks:label'),\n })}\n >\n {initialState ? (\n <>\n <RenderFields\n fields={clientBlock?.fields ?? []}\n forceRender\n parentIndexPath=\"\"\n parentPath=\"\" // See Blocks feature path for details as for why this is empty\n parentSchemaPath={schemaFieldsPath}\n permissions={true}\n readOnly={!isEditable}\n />\n <FormSubmit programmaticSubmit={true}>{t('fields:saveChanges')}</FormSubmit>\n </>\n ) : null}\n </Drawer>\n </EditDepthProvider>\n ),\n [\n initialState,\n drawerSlug,\n blockID,\n blockDisplayName,\n t,\n isEditable,\n clientBlock?.fields,\n schemaFieldsPath,\n // DO NOT ADD FORMDATA HERE! Adding formData will kick you out of sub block editors while writing.\n ],\n )\n\n // Memoized Form JSX\n const Block = useMemo(() => {\n if (!initialState) {\n return null\n }\n return (\n <Form\n beforeSubmit={[\n async ({ formState }) => {\n // This is only called when form is submitted from drawer - usually only the case if the block has a custom Block component\n return await onChange({ formState, submit: true })\n },\n ]}\n el=\"div\"\n fields={clientBlock?.fields ?? []}\n initialState={initialState}\n onChange={[onChange]}\n onSubmit={(formState, newData) => {\n // This is only called when form is submitted from drawer - usually only the case if the block has a custom Block component\n newData.blockType = blockType\n editor.update(() => {\n const node = $getNodeByKey(nodeKey)\n if (node && $isBlockNode(node)) {\n node.setFields(newData as BlockFields, true)\n }\n })\n toggleDrawer()\n }}\n submitted={submitted}\n uuid={uuid()}\n >\n <BlockContent\n baseClass={baseClass}\n BlockDrawer={BlockDrawer}\n Collapsible={BlockCollapsible}\n CustomBlock={CustomBlock}\n EditButton={EditButton}\n errorCount={errorCount}\n formSchema={clientBlock?.fields ?? []}\n initialState={initialState}\n nodeKey={nodeKey}\n RemoveButton={RemoveButton}\n />\n </Form>\n )\n }, [\n BlockCollapsible,\n BlockDrawer,\n CustomBlock,\n blockType,\n RemoveButton,\n EditButton,\n editor,\n errorCount,\n toggleDrawer,\n clientBlock?.fields,\n // DO NOT ADD FORMDATA HERE! Adding formData will kick you out of sub block editors while writing.\n initialState,\n nodeKey,\n onChange,\n submitted,\n ])\n\n if (!clientBlock) {\n return (\n <BlockCollapsible disableBlockName={true} fieldHasErrors={true}>\n <div className=\"lexical-block-not-found\">\n Error: Block '{blockType}' not found in the config but exists in the lexical data\n </div>\n </BlockCollapsible>\n )\n }\n\n return Block\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/blocks/client/componentInline/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/componentInline/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiE,MAAM,OAAO,CAAA;AAGrF,OAAO,KAAK,EAAwC,SAAS,EAAE,MAAM,SAAS,CAAA;AAuB9E,OAAO,cAAc,CAAA;~~AAKrB~~,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAA;AAM/E,KAAK,KAAK,GAAG;IACX;;;;OAIG;IACH,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAA;IAC5B,QAAQ,CAAC,QAAQ,EAAE,iBAAiB,CAAA;IACpC,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;CACzB,CAAA;AAED,KAAK,+BAA+B,GAAG;IACrC,UAAU,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;IACrB,YAAY,EAAE,KAAK,GAAG,SAAS,GAAG,SAAS,CAAA;IAC3C,oBAAoB,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE,CAAC,CAAA;IAC9D,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,YAAY,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;CACxB,CAAA;AAMD,eAAO,MAAM,8BAA8B,uCAA+C,CAAA;AAE1F,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,~~CAgZhD~~,CAAA"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/componentInline/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiE,MAAM,OAAO,CAAA;AAGrF,OAAO,KAAK,EAAwC,SAAS,EAAE,MAAM,SAAS,CAAA;AAuB9E,OAAO,cAAc,CAAA;AAMrB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAA;AAM/E,KAAK,KAAK,GAAG;IACX;;;;OAIG;IACH,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAA;IAC5B,QAAQ,CAAC,QAAQ,EAAE,iBAAiB,CAAA;IACpC,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;CACzB,CAAA;AAED,KAAK,+BAA+B,GAAG;IACrC,UAAU,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;IACrB,YAAY,EAAE,KAAK,GAAG,SAAS,GAAG,SAAS,CAAA;IAC3C,oBAAoB,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE,CAAC,CAAA;IAC9D,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,YAAY,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;CACxB,CAAA;AAMD,eAAO,MAAM,8BAA8B,uCAA+C,CAAA;AAE1F,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA+YhD,CAAA"}

package/dist/features/blocks/client/componentInline/index.js CHANGED Viewed

@@ -4,6 +4,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import React, { createContext, useCallback, useEffect, useMemo, useRef } from 'react';
 const baseClass = 'inline-block';
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { useLexicalEditable } from '@lexical/react/useLexicalEditable';
 import { getTranslation } from '@payloadcms/translations';
 import { Button, Drawer, EditDepthProvider, Form, formatDrawerSlug, FormSubmit, RenderFields, ShimmerEffect, useConfig, useDocumentForm, useDocumentInfo, useEditDepth, useServerFunctions, useTranslation } from '@payloadcms/ui';
 import { abortAndIgnore } from '@payloadcms/ui/shared';
@@ -24,6 +25,7 @@ export const InlineBlockComponent = props => {
     nodeKey
   } = props;
   const [editor] = useLexicalComposerContext();
+  const isEditable = useLexicalEditable();
   const {
     i18n,
     t
@@ -33,8 +35,6 @@ export const InlineBlockComponent = props => {
     fieldProps: {
       featureClientSchemaMap,
       initialLexicalFormState,
-      permissions,
-      readOnly,
       schemaPath
     },
     setCreatedInlineBlock,
@@ -132,6 +132,7 @@ export const InlineBlockComponent = props => {
         initialBlockData: formData,
         initialBlockFormState: formData,
         operation: 'update',
+        readOnly: !isEditable,
         renderAllFields: true,
         schemaPath: schemaFieldsPath,
         signal: abortController.signal
@@ -158,7 +159,7 @@ export const InlineBlockComponent = props => {
     return () => {
       abortAndIgnore(abortController);
     };
-  }, [getFormState, editor, nodeKey, schemaFieldsPath, id, formData, initialState, collectionSlug, globalSlug, getDocPreferences, parentDocumentFields]);
+  }, [getFormState, editor, nodeKey, isEditable, schemaFieldsPath, id, formData, initialState, collectionSlug, globalSlug, getDocPreferences, parentDocumentFields]);
   /**
   * HANDLE ONCHANGE
   */
@@ -183,6 +184,7 @@ export const InlineBlockComponent = props => {
       globalSlug,
       initialBlockFormState: prevFormState,
       operation: 'update',
+      readOnly: !isEditable,
       renderAllFields: submit ? true : false,
       schemaPath: schemaFieldsPath,
       signal: controller.signal
@@ -195,7 +197,7 @@ export const InlineBlockComponent = props => {
       setCustomBlock(state_0['_components']?.customComponents?.Block);
     }
     return state_0;
-  }, [getFormState, id, collectionSlug, getDocPreferences, parentDocumentFields, globalSlug, schemaFieldsPath]);
+  }, [getFormState, id, collectionSlug, getDocPreferences, parentDocumentFields, globalSlug, isEditable, schemaFieldsPath]);
   // cleanup effect
   useEffect(() => {
     const isStateOutOfSync = (formData_0, initialState_0) => {
@@ -226,7 +228,7 @@ export const InlineBlockComponent = props => {
   const RemoveButton = useMemo(() => () => /*#__PURE__*/_jsx(Button, {
     buttonStyle: "icon-label",
     className: `${baseClass}__removeButton`,
-    disabled: readOnly,
+    disabled: !isEditable,
     icon: "x",
     onClick: e => {
       e.preventDefault();
@@ -237,11 +239,11 @@ export const InlineBlockComponent = props => {
     tooltip: t('lexical:blocks:inlineBlocks:remove', {
       label: blockDisplayName
     })
-  }), [blockDisplayName, readOnly, removeInlineBlock, t]);
+  }), [blockDisplayName, isEditable, removeInlineBlock, t]);
   const EditButton = useMemo(() => () => /*#__PURE__*/_jsx(Button, {
     buttonStyle: "icon-label",
     className: `${baseClass}__editButton`,
-    disabled: readOnly,
+    disabled: !isEditable,
     el: "button",
     icon: "edit",
     onClick: () => {
@@ -252,7 +254,7 @@ export const InlineBlockComponent = props => {
     tooltip: t('lexical:blocks:inlineBlocks:edit', {
       label: blockDisplayName
     })
-  }), [blockDisplayName, readOnly, t, toggleDrawer]);
+  }), [blockDisplayName, isEditable, t, toggleDrawer]);
   const InlineBlockContainer = useMemo(() => ({
     children,
     className
@@ -275,7 +277,7 @@ export const InlineBlockComponent = props => {
       className: `${baseClass}-not-found`,
       children: [/*#__PURE__*/_jsxs("span", {
         children: ["Error: Block '", formData.blockType, "' not found"]
-      }), editor.isEditable() ? /*#__PURE__*/_jsx("div", {
+      }), isEditable ? /*#__PURE__*/_jsx("div", {
         className: `${baseClass}__actions`,
         children: /*#__PURE__*/_jsx(RemoveButton, {})
       }) : null]
@@ -318,7 +320,7 @@ export const InlineBlockComponent = props => {
             parentSchemaPath: schemaFieldsPath,
             permissions: true,
-            readOnly: false
+            readOnly: !isEditable
           }), /*#__PURE__*/_jsx(FormSubmit, {
             programmaticSubmit: true,
             children: t('fields:saveChanges')
@@ -339,7 +341,7 @@ export const InlineBlockComponent = props => {
       children: [initialState ? /*#__PURE__*/_jsx(Label, {}) : /*#__PURE__*/_jsx(ShimmerEffect, {
         height: "15px",
         width: "40px"
-      }), editor.isEditable() ? /*#__PURE__*/_jsxs("div", {
+      }), isEditable ? /*#__PURE__*/_jsxs("div", {
         className: `${baseClass}__actions`,
         children: [/*#__PURE__*/_jsx(EditButton, {}), /*#__PURE__*/_jsx(RemoveButton, {})]
       }) : null]