@payloadcms/richtext-lexical 4.0.0-internal.934870d → 4.0.0-internal.94ef095

package/dist/features/align/client/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","$isDecoratorBlockNode","$findMatchingParent","$getSelection","$isElementNode","$isNodeSelection","$isRangeSelection","COMMAND_PRIORITY_LOW","FORMAT_ELEMENT_COMMAND","useEffect","AlignCenterIcon","AlignJustifyIcon","AlignLeftIcon","AlignRightIcon","createClientFeature","toolbarAlignGroupWithItems","getFormatType","node","__format","toolbarGroups","ChildComponent","isActive","selection","getNodes","parent","getParent","key","label","i18n","t","onSelect","editor","dispatchCommand","order","AlignPlugin","$","t0","t1","registerCommand","_temp2","AlignFeatureClient","plugins","Component","position","toolbarFixed","groups","toolbarInline","_temp","parentNode","isInline","format","nodes","element","setFormat"],"sources":["../../../../src/features/align/client/index.tsx"],"sourcesContent":["'use client'\n\nimport type { DecoratorBlockNode } from '@lexical/react/LexicalDecoratorBlockNode'\nimport type { ElementFormatType, ElementNode } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { $isDecoratorBlockNode } from '@lexical/react/LexicalDecoratorBlockNode'\nimport { $findMatchingParent } from '@lexical/utils'\nimport {\n  $getSelection,\n  $isElementNode,\n  $isNodeSelection,\n  $isRangeSelection,\n  COMMAND_PRIORITY_LOW,\n  FORMAT_ELEMENT_COMMAND,\n} from 'lexical'\nimport { useEffect } from 'react'\n\nimport type { ToolbarGroup } from '../../toolbars/types.js'\n\nimport { AlignCenterIcon } from '../../../lexical/ui/icons/AlignCenter/index.js'\nimport { AlignJustifyIcon } from '../../../lexical/ui/icons/AlignJustify/index.js'\nimport { AlignLeftIcon } from '../../../lexical/ui/icons/AlignLeft/index.js'\nimport { AlignRightIcon } from '../../../lexical/ui/icons/AlignRight/index.js'\nimport { createClientFeature } from '../../../utilities/createClientFeature.js'\nimport { toolbarAlignGroupWithItems } from './toolbarAlignGroup.js'\n\n// DecoratorBlockNode has format, but Lexical forgot\n// to add the getters like ElementNode does.\nconst getFormatType = (node: DecoratorBlockNode | ElementNode): ElementFormatType => {\n  if ($isElementNode(node)) {\n    return node.getFormatType()\n  }\n  return node.__format\n}\n\nconst toolbarGroups: ToolbarGroup[] = [\n  toolbarAlignGroupWithItems([\n    {\n      ChildComponent: AlignLeftIcon,\n      isActive: ({ selection }) => {\n        if (!$isRangeSelection(selection)) {\n          return false\n        }\n        for (const node of selection.getNodes()) {\n          if ($isElementNode(node) || $isDecoratorBlockNode(node)) {\n            if (getFormatType(node) === 'left') {\n              continue\n            }\n          }\n\n          const parent = node.getParent()\n          if ($isElementNode(parent) || $isDecoratorBlockNode(parent)) {\n            if (getFormatType(parent) === 'left') {\n              continue\n            }\n          }\n\n          return false\n        }\n        return true\n      },\n      key: 'alignLeft',\n      label: ({ i18n }) => {\n        return i18n.t('lexical:align:alignLeftLabel')\n      },\n      onSelect: ({ editor }) => {\n        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'left')\n      },\n      order: 1,\n    },\n    {\n      ChildComponent: AlignCenterIcon,\n      isActive: ({ selection }) => {\n        if (!$isRangeSelection(selection)) {\n          return false\n        }\n        for (const node of selection.getNodes()) {\n          if ($isElementNode(node) || $isDecoratorBlockNode(node)) {\n            if (getFormatType(node) === 'center') {\n              continue\n            }\n          }\n\n          const parent = node.getParent()\n          if ($isElementNode(parent) || $isDecoratorBlockNode(parent)) {\n            if (getFormatType(parent) === 'center') {\n              continue\n            }\n          }\n\n          return false\n        }\n        return true\n      },\n      key: 'alignCenter',\n      label: ({ i18n }) => {\n        return i18n.t('lexical:align:alignCenterLabel')\n      },\n      onSelect: ({ editor }) => {\n        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'center')\n      },\n      order: 2,\n    },\n    {\n      ChildComponent: AlignRightIcon,\n      isActive: ({ selection }) => {\n        if (!$isRangeSelection(selection)) {\n          return false\n        }\n        for (const node of selection.getNodes()) {\n          if ($isElementNode(node) || $isDecoratorBlockNode(node)) {\n            if (getFormatType(node) === 'right') {\n              continue\n            }\n          }\n\n          const parent = node.getParent()\n          if ($isElementNode(parent) || $isDecoratorBlockNode(parent)) {\n            if (getFormatType(parent) === 'right') {\n              continue\n            }\n          }\n\n          return false\n        }\n        return true\n      },\n      key: 'alignRight',\n      label: ({ i18n }) => {\n        return i18n.t('lexical:align:alignRightLabel')\n      },\n      onSelect: ({ editor }) => {\n        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'right')\n      },\n      order: 3,\n    },\n    {\n      ChildComponent: AlignJustifyIcon,\n      isActive: ({ selection }) => {\n        if (!$isRangeSelection(selection)) {\n          return false\n        }\n        for (const node of selection.getNodes()) {\n          if ($isElementNode(node) || $isDecoratorBlockNode(node)) {\n            if (getFormatType(node) === 'justify') {\n              continue\n            }\n          }\n\n          const parent = node.getParent()\n          if ($isElementNode(parent) || $isDecoratorBlockNode(parent)) {\n            if (getFormatType(parent) === 'justify') {\n              continue\n            }\n          }\n\n          return false\n        }\n        return true\n      },\n      key: 'alignJustify',\n      label: ({ i18n }) => {\n        return i18n.t('lexical:align:alignJustifyLabel')\n      },\n      onSelect: ({ editor }) => {\n        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'justify')\n      },\n      order: 4,\n    },\n  ]),\n]\n\nconst AlignPlugin = () => {\n  const [editor] = useLexicalComposerContext()\n\n  useEffect(() => {\n    // Just like the default Lexical configuration, but in\n    // addition to ElementNode we also set DecoratorBlocks\n    return editor.registerCommand(\n      FORMAT_ELEMENT_COMMAND,\n      (format) => {\n        const selection = $getSelection()\n        if (!$isRangeSelection(selection) && !$isNodeSelection(selection)) {\n          return false\n        }\n        const nodes = selection.getNodes()\n        for (const node of nodes) {\n          const element = $findMatchingParent(\n            node,\n            (parentNode): parentNode is DecoratorBlockNode | ElementNode =>\n              ($isElementNode(parentNode) || $isDecoratorBlockNode(parentNode)) &&\n              !parentNode.isInline(),\n          )\n          if (element !== null) {\n            element.setFormat(format)\n          }\n        }\n        return true\n      },\n      COMMAND_PRIORITY_LOW,\n    )\n  }, [editor])\n  return null\n}\n\nexport const AlignFeatureClient = createClientFeature({\n  plugins: [\n    {\n      Component: AlignPlugin,\n      position: 'normal',\n    },\n  ],\n  toolbarFixed: {\n    groups: toolbarGroups,\n  },\n  toolbarInline: {\n    groups: toolbarGroups,\n  },\n})\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","$isDecoratorBlockNode","$findMatchingParent","$getSelection","$isElementNode","$isNodeSelection","$isRangeSelection","COMMAND_PRIORITY_LOW","FORMAT_ELEMENT_COMMAND","useEffect","AlignCenterIcon","AlignJustifyIcon","AlignLeftIcon","AlignRightIcon","createClientFeature","toolbarAlignGroupWithItems","getFormatType","node","__format","toolbarGroups","ChildComponent","isActive","selection","getNodes","parent","getParent","key","label","i18n","t","onSelect","editor","dispatchCommand","order","AlignPlugin","$","t0","t1","registerCommand","_temp2","AlignFeatureClient","plugins","Component","position","toolbarFixed","groups","toolbarInline","_temp","parentNode","isInline","format","nodes","element","setFormat"],"sources":["../../../../src/features/align/client/index.tsx"],"sourcesContent":["'use client'\n\nimport type { DecoratorBlockNode } from '@lexical/react/LexicalDecoratorBlockNode'\nimport type { ElementFormatType, ElementNode } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { $isDecoratorBlockNode } from '@lexical/react/LexicalDecoratorBlockNode'\nimport { $findMatchingParent } from '@lexical/utils'\nimport {\n  $getSelection,\n  $isElementNode,\n  $isNodeSelection,\n  $isRangeSelection,\n  COMMAND_PRIORITY_LOW,\n  FORMAT_ELEMENT_COMMAND,\n} from 'lexical'\nimport { useEffect } from 'react'\n\nimport type { ToolbarGroup } from '../../toolbars/types.js'\n\nimport { AlignCenterIcon } from '../../../lexical/ui/icons/AlignCenter/index.js'\nimport { AlignJustifyIcon } from '../../../lexical/ui/icons/AlignJustify/index.js'\nimport { AlignLeftIcon } from '../../../lexical/ui/icons/AlignLeft/index.js'\nimport { AlignRightIcon } from '../../../lexical/ui/icons/AlignRight/index.js'\nimport { createClientFeature } from '../../../utilities/createClientFeature.js'\nimport { toolbarAlignGroupWithItems } from './toolbarAlignGroup.js'\n\n// DecoratorBlockNode has format, but Lexical forgot\n// to add the getters like ElementNode does.\nconst getFormatType = (node: DecoratorBlockNode | ElementNode): ElementFormatType => {\n  if ($isElementNode(node)) {\n    return node.getFormatType()\n  }\n  return node.__format\n}\n\nconst toolbarGroups: ToolbarGroup[] = [\n  toolbarAlignGroupWithItems([\n    {\n      ChildComponent: AlignLeftIcon,\n      isActive: ({ selection }) => {\n        if (!$isRangeSelection(selection)) {\n          return false\n        }\n        for (const node of selection.getNodes()) {\n          if ($isElementNode(node) || $isDecoratorBlockNode(node)) {\n            if (getFormatType(node) === 'left') {\n              continue\n            }\n          }\n\n          const parent = node.getParent()\n          if ($isElementNode(parent) || $isDecoratorBlockNode(parent)) {\n            if (getFormatType(parent) === 'left') {\n              continue\n            }\n          }\n\n          return false\n        }\n        return true\n      },\n      key: 'alignLeft',\n      label: ({ i18n }) => {\n        return i18n.t('lexical:align:alignLeftLabel')\n      },\n      onSelect: ({ editor }) => {\n        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'left')\n      },\n      order: 1,\n    },\n    {\n      ChildComponent: AlignCenterIcon,\n      isActive: ({ selection }) => {\n        if (!$isRangeSelection(selection)) {\n          return false\n        }\n        for (const node of selection.getNodes()) {\n          if ($isElementNode(node) || $isDecoratorBlockNode(node)) {\n            if (getFormatType(node) === 'center') {\n              continue\n            }\n          }\n\n          const parent = node.getParent()\n          if ($isElementNode(parent) || $isDecoratorBlockNode(parent)) {\n            if (getFormatType(parent) === 'center') {\n              continue\n            }\n          }\n\n          return false\n        }\n        return true\n      },\n      key: 'alignCenter',\n      label: ({ i18n }) => {\n        return i18n.t('lexical:align:alignCenterLabel')\n      },\n      onSelect: ({ editor }) => {\n        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'center')\n      },\n      order: 2,\n    },\n    {\n      ChildComponent: AlignRightIcon,\n      isActive: ({ selection }) => {\n        if (!$isRangeSelection(selection)) {\n          return false\n        }\n        for (const node of selection.getNodes()) {\n          if ($isElementNode(node) || $isDecoratorBlockNode(node)) {\n            if (getFormatType(node) === 'right') {\n              continue\n            }\n          }\n\n          const parent = node.getParent()\n          if ($isElementNode(parent) || $isDecoratorBlockNode(parent)) {\n            if (getFormatType(parent) === 'right') {\n              continue\n            }\n          }\n\n          return false\n        }\n        return true\n      },\n      key: 'alignRight',\n      label: ({ i18n }) => {\n        return i18n.t('lexical:align:alignRightLabel')\n      },\n      onSelect: ({ editor }) => {\n        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'right')\n      },\n      order: 3,\n    },\n    {\n      ChildComponent: AlignJustifyIcon,\n      isActive: ({ selection }) => {\n        if (!$isRangeSelection(selection)) {\n          return false\n        }\n        for (const node of selection.getNodes()) {\n          if ($isElementNode(node) || $isDecoratorBlockNode(node)) {\n            if (getFormatType(node) === 'justify') {\n              continue\n            }\n          }\n\n          const parent = node.getParent()\n          if ($isElementNode(parent) || $isDecoratorBlockNode(parent)) {\n            if (getFormatType(parent) === 'justify') {\n              continue\n            }\n          }\n\n          return false\n        }\n        return true\n      },\n      key: 'alignJustify',\n      label: ({ i18n }) => {\n        return i18n.t('lexical:align:alignJustifyLabel')\n      },\n      onSelect: ({ editor }) => {\n        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'justify')\n      },\n      order: 4,\n    },\n  ]),\n]\n\nconst AlignPlugin = () => {\n  const [editor] = useLexicalComposerContext()\n\n  useEffect(() => {\n    // Just like the default Lexical configuration, but in\n    // addition to ElementNode we also set DecoratorBlocks\n    return editor.registerCommand(\n      FORMAT_ELEMENT_COMMAND,\n      (format) => {\n        const selection = $getSelection()\n        if (!$isRangeSelection(selection) && !$isNodeSelection(selection)) {\n          return false\n        }\n        const nodes = selection.getNodes()\n        for (const node of nodes) {\n          const element = $findMatchingParent(\n            node,\n            (parentNode): parentNode is DecoratorBlockNode | ElementNode =>\n              ($isElementNode(parentNode) || $isDecoratorBlockNode(parentNode)) &&\n              !parentNode.isInline(),\n          )\n          if (element !== null) {\n            element.setFormat(format)\n          }\n        }\n        return true\n      },\n      COMMAND_PRIORITY_LOW,\n    )\n  }, [editor])\n  return null\n}\n\nexport const AlignFeatureClient = createClientFeature({\n  plugins: [\n    {\n      Component: AlignPlugin,\n      position: 'normal',\n    },\n  ],\n  toolbarFixed: {\n    groups: toolbarGroups,\n  },\n  toolbarInline: {\n    groups: toolbarGroups,\n  },\n})\n"],"mappings":"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","ignoreList":[]}

package/dist/features/blocks/client/component/BlockContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"BlockContent.js","names":["c","_c","useLexicalEditable","RenderFields","useFormSubmitted","React","createContext","useMemo","BlockComponentContext","baseClass","BlockCollapsible","BlockDrawer","EditButton","errorCount","formSchema","initialState","nodeKey","RemoveButton","useBlockComponentContext","use","BlockContent","props","$","Collapsible","CustomBlock","CustomLabel","contextProps","hasSubmitted","fieldHasErrors","isEditable","t0","collapsibleProps","children","rest","_jsx","CollapsibleWithErrorProps","blockContextValue","_jsxs","value","fields","forceRender","parentIndexPath","parentPath","parentSchemaPath","permissions","readOnly"],"sources":["../../../../../src/features/blocks/client/component/BlockContent.tsx"],"sourcesContent":["'use client'\nimport type { CollapsibleProps } from '@payloadcms/ui/elements/Collapsible'\nimport type { ClientField, FormState } from 'payload'\n\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport { RenderFields, useFormSubmitted } from '@payloadcms/ui'\nimport React, { createContext, useMemo } from 'react'\n\nexport type BlockCollapsibleProps = {\n  /**\n   * Replace the top-right portion of the header that renders the Edit and Remove buttons with custom content.\n   * If this property is provided, the `removeButton` and `editButton` properties are ignored.\n   */\n  Actions?: React.ReactNode\n  children?: React.ReactNode\n  /**\n   * Additional className to the collapsible wrapper\n   */\n  className?: string\n  /**\n   * Props to pass to the underlying Collapsible component. You could use this to override the `Header` entirely, for example.\n   */\n  collapsibleProps?: Partial<CollapsibleProps>\n  /**\n   * Whether to disable rendering the block name field in the header Label\n   * @default false\n   */\n  disableBlockName?: boolean\n  /**\n   * Whether to show the Edit button\n   * If `Actions` is provided, this property is ignored.\n   * @default true\n   */\n  editButton?: boolean\n  /**\n   * Replace the default Label component with a custom Label\n   */\n  Label?: React.ReactNode\n  /**\n   * Replace the default Pill component component that's rendered within the default Label component with a custom Pill.\n   * This property has no effect if you provide a custom Label component via the `Label` property.\n   */\n  Pill?: React.ReactNode\n  /**\n   * Whether to show the Remove button\n   * If `Actions` is provided, this property is ignored.\n   * @default true\n   */\n  removeButton?: boolean\n  /**\n   * Whether to show the drag handle icon\n   * @default true\n   */\n  showDragHandle?: boolean\n  /**\n   * Whether to show the row number\n   * @default true\n   */\n  showRowNumber?: boolean\n}\n\nexport type BlockCollapsibleWithErrorProps = {\n  errorCount?: number\n  fieldHasErrors?: boolean\n} & BlockCollapsibleProps\n\nexport type BlockContentProps = {\n  baseClass: string\n  BlockDrawer: React.FC\n  Collapsible: React.FC<BlockCollapsibleWithErrorProps>\n  /**\n   * Custom block component (pre-rendered ReactNode).\n   */\n  CustomBlock?: React.ReactNode\n  CustomLabel: React.ReactNode\n  EditButton: React.FC\n  errorCount: number\n  formSchema: ClientField[]\n  initialState: false | FormState | undefined\n\n  nodeKey: string\n  RemoveButton: React.FC\n}\n\nexport type BlockComponentContextType = {\n  BlockCollapsible: React.FC<BlockCollapsibleProps>\n} & Omit<BlockContentProps, 'Collapsible' | 'CustomBlock' | 'CustomLabel'>\n\nconst BlockComponentContext = createContext<BlockComponentContextType>({\n  baseClass: 'LexicalEditorTheme__block',\n  BlockCollapsible: () => null,\n  BlockDrawer: () => null,\n  EditButton: () => null,\n  errorCount: 0,\n  formSchema: [],\n  initialState: false,\n  nodeKey: '',\n  RemoveButton: () => null,\n})\n\nexport const useBlockComponentContext = () => React.use(BlockComponentContext)\n\n/**\n * The actual content of the Block. This should be INSIDE a Form component,\n * scoped to the block. All format operations in here are thus scoped to the block's form, and\n * not the whole document.\n */\nexport const BlockContent: React.FC<BlockContentProps> = (props) => {\n  const { Collapsible, CustomBlock, CustomLabel, ...contextProps } = props\n\n  const { BlockDrawer, errorCount, formSchema } = contextProps\n\n  const hasSubmitted = useFormSubmitted()\n\n  const fieldHasErrors = hasSubmitted && errorCount > 0\n  const isEditable = useLexicalEditable()\n\n  const CollapsibleWithErrorProps = useMemo(\n    () => (collapsibleProps: BlockCollapsibleProps) => {\n      const { children, ...rest } = collapsibleProps\n      return (\n        <Collapsible errorCount={errorCount} fieldHasErrors={fieldHasErrors} {...rest}>\n          {children}\n        </Collapsible>\n      )\n    },\n    [Collapsible, fieldHasErrors, errorCount],\n  )\n\n  const blockContextValue: BlockComponentContextType = {\n    ...contextProps,\n    BlockCollapsible: CollapsibleWithErrorProps,\n  }\n\n  // Provide context for useBlockComponentContext() hook\n  return CustomBlock ? (\n    <BlockComponentContext value={blockContextValue}>\n      {CustomBlock}\n      <BlockDrawer />\n    </BlockComponentContext>\n  ) : (\n    <CollapsibleWithErrorProps>\n      <RenderFields\n        fields={formSchema}\n        forceRender={true}\n        parentIndexPath=\"\"\n        parentPath={''}\n        parentSchemaPath=\"\"\n        permissions={true}\n        readOnly={!isEditable}\n      />\n    </CollapsibleWithErrorProps>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAIA,SAASC,kBAAkB,QAAQ;AACnC,SAASC,YAAY,EAAEC,gBAAgB,QAAQ;AAC/C,OAAOC,KAAA,IAASC,aAAa,EAAEC,OAAO,QAAQ;AAkF9C,MAAMC,qBAAA,gBAAwBF,aAAA,CAAyC;EACrEG,SAAA,EAAW;EACXC,gBAAA,EAAkBA,CAAA,KAAM;EACxBC,WAAA,EAAaA,CAAA,KAAM;EACnBC,UAAA,EAAYA,CAAA,KAAM;EAClBC,UAAA,EAAY;EACZC,UAAA,EAAY,EAAE;EACdC,YAAA,EAAc;EACdC,OAAA,EAAS;EACTC,YAAA,EAAcA,CAAA,KAAM;AACtB;AAEA,OAAO,MAAMC,wBAAA,GAA2BA,CAAA,KAAMb,KAAA,CAAMc,GAAG,CAACX,qBAAA;AAExD;;;;;AAKA,OAAO,MAAMY,YAAA,GAA4CC,KAAA;EAAA,MAAAC,CAAA,GAAArB,EAAA;EACvD;IAAAsB,WAAA;IAAAC,WAAA;IAAAC,WAAA;IAAA,GAAAC;EAAA,IAAmEL,KAAA;EAEnE;IAAAV,WAAA;IAAAE,UAAA;IAAAC;EAAA,IAAgDY,YAAA;EAEhD,MAAAC,YAAA,GAAqBvB,gBAAA;EAErB,MAAAwB,cAAA,GAAuBD,YAAA,IAAgBd,UAAA,IAAa;EACpD,MAAAgB,UAAA,GAAmB3B,kBAAA;EAAA,IAAA4B,EAAA;EAAA,IAAAR,CAAA,QAAAC,WAAA,IAAAD,CAAA,QAAAT,UAAA,IAAAS,CAAA,QAAAM,cAAA;IAGXE,EAAA,GAAAC,gBAAA;MACJ;QAAAC,QAAA;QAAA,GAAAC;MAAA,IAA8BF,gBAAA;MAAA,OAE5BG,IAAA,CAACX,WAAA;QAAAV,UAAA;QAAAe,cAAA;QAAA,GAAwEK,IAAI;QAAAD;MAAA,C;;IAIjFV,CAAA,MAAAC,WAAA;IAAAD,CAAA,MAAAT,UAAA;IAAAS,CAAA,MAAAM,cAAA;IAAAN,CAAA,MAAAQ,EAAA;EAAA;IAAAA,EAAA,GAAAR,CAAA;EAAA;EARF,MAAAa,yBAAA,GACQL,EAON;EAIF,MAAAM,iBAAA;IAAA,GACKV,YAAY;IAAAhB,gBAAA,EACGyB;EAAA;EACpB,OAGOX,WAAA,GACLa,KAAA,CAAA7B,qBAAA;IAAA8B,KAAA,EAA8BF,iBAAA;IAAAJ,QAAA,GAC3BR,WAAA,EACDU,IAAA,CAACvB,WAAA;EAAA,C,IAGHuB,IAAA,CAACC,yBAAA;IAAAH,QAAA,EACCE,IAAA,CAAA/B,YAAA;MAAAoC,MAAA,EACUzB,UAAA;MAAA0B,WAAA;MAAAC,eAAA,EAEQ;MAAAC,UAAA,EACJ;MAAAC,gBAAA,EACK;MAAAC,WAAA;MAAAC,QAAA,GAENhB;IAAA,C;;CAInB","ignoreList":[]}
+{"version":3,"file":"BlockContent.js","names":["c","_c","useLexicalEditable","RenderFields","useFormSubmitted","React","createContext","useMemo","BlockComponentContext","baseClass","BlockCollapsible","BlockDrawer","EditButton","errorCount","formSchema","initialState","nodeKey","RemoveButton","useBlockComponentContext","use","BlockContent","props","$","Collapsible","CustomBlock","CustomLabel","contextProps","hasSubmitted","fieldHasErrors","isEditable","t0","collapsibleProps","children","rest","_jsx","CollapsibleWithErrorProps","blockContextValue","_jsxs","value","fields","forceRender","parentIndexPath","parentPath","parentSchemaPath","permissions","readOnly"],"sources":["../../../../../src/features/blocks/client/component/BlockContent.tsx"],"sourcesContent":["'use client'\nimport type { CollapsibleProps } from '@payloadcms/ui/elements/Collapsible'\nimport type { ClientField, FormState } from 'payload'\n\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport { RenderFields, useFormSubmitted } from '@payloadcms/ui'\nimport React, { createContext, useMemo } from 'react'\n\nexport type BlockCollapsibleProps = {\n  /**\n   * Replace the top-right portion of the header that renders the Edit and Remove buttons with custom content.\n   * If this property is provided, the `removeButton` and `editButton` properties are ignored.\n   */\n  Actions?: React.ReactNode\n  children?: React.ReactNode\n  /**\n   * Additional className to the collapsible wrapper\n   */\n  className?: string\n  /**\n   * Props to pass to the underlying Collapsible component. You could use this to override the `Header` entirely, for example.\n   */\n  collapsibleProps?: Partial<CollapsibleProps>\n  /**\n   * Whether to disable rendering the block name field in the header Label\n   * @default false\n   */\n  disableBlockName?: boolean\n  /**\n   * Whether to show the Edit button\n   * If `Actions` is provided, this property is ignored.\n   * @default true\n   */\n  editButton?: boolean\n  /**\n   * Replace the default Label component with a custom Label\n   */\n  Label?: React.ReactNode\n  /**\n   * Replace the default Pill component component that's rendered within the default Label component with a custom Pill.\n   * This property has no effect if you provide a custom Label component via the `Label` property.\n   */\n  Pill?: React.ReactNode\n  /**\n   * Whether to show the Remove button\n   * If `Actions` is provided, this property is ignored.\n   * @default true\n   */\n  removeButton?: boolean\n  /**\n   * Whether to show the drag handle icon\n   * @default true\n   */\n  showDragHandle?: boolean\n  /**\n   * Whether to show the row number\n   * @default true\n   */\n  showRowNumber?: boolean\n}\n\nexport type BlockCollapsibleWithErrorProps = {\n  errorCount?: number\n  fieldHasErrors?: boolean\n} & BlockCollapsibleProps\n\nexport type BlockContentProps = {\n  baseClass: string\n  BlockDrawer: React.FC\n  Collapsible: React.FC<BlockCollapsibleWithErrorProps>\n  /**\n   * Custom block component (pre-rendered ReactNode).\n   */\n  CustomBlock?: React.ReactNode\n  CustomLabel: React.ReactNode\n  EditButton: React.FC\n  errorCount: number\n  formSchema: ClientField[]\n  initialState: false | FormState | undefined\n\n  nodeKey: string\n  RemoveButton: React.FC\n}\n\nexport type BlockComponentContextType = {\n  BlockCollapsible: React.FC<BlockCollapsibleProps>\n} & Omit<BlockContentProps, 'Collapsible' | 'CustomBlock' | 'CustomLabel'>\n\nconst BlockComponentContext = createContext<BlockComponentContextType>({\n  baseClass: 'LexicalEditorTheme__block',\n  BlockCollapsible: () => null,\n  BlockDrawer: () => null,\n  EditButton: () => null,\n  errorCount: 0,\n  formSchema: [],\n  initialState: false,\n  nodeKey: '',\n  RemoveButton: () => null,\n})\n\nexport const useBlockComponentContext = () => React.use(BlockComponentContext)\n\n/**\n * The actual content of the Block. This should be INSIDE a Form component,\n * scoped to the block. All format operations in here are thus scoped to the block's form, and\n * not the whole document.\n */\nexport const BlockContent: React.FC<BlockContentProps> = (props) => {\n  const { Collapsible, CustomBlock, CustomLabel, ...contextProps } = props\n\n  const { BlockDrawer, errorCount, formSchema } = contextProps\n\n  const hasSubmitted = useFormSubmitted()\n\n  const fieldHasErrors = hasSubmitted && errorCount > 0\n  const isEditable = useLexicalEditable()\n\n  const CollapsibleWithErrorProps = useMemo(\n    () => (collapsibleProps: BlockCollapsibleProps) => {\n      const { children, ...rest } = collapsibleProps\n      return (\n        <Collapsible errorCount={errorCount} fieldHasErrors={fieldHasErrors} {...rest}>\n          {children}\n        </Collapsible>\n      )\n    },\n    [Collapsible, fieldHasErrors, errorCount],\n  )\n\n  const blockContextValue: BlockComponentContextType = {\n    ...contextProps,\n    BlockCollapsible: CollapsibleWithErrorProps,\n  }\n\n  // Provide context for useBlockComponentContext() hook\n  return CustomBlock ? (\n    <BlockComponentContext value={blockContextValue}>\n      {CustomBlock}\n      <BlockDrawer />\n    </BlockComponentContext>\n  ) : (\n    <CollapsibleWithErrorProps>\n      <RenderFields\n        fields={formSchema}\n        forceRender={true}\n        parentIndexPath=\"\"\n        parentPath={''}\n        parentSchemaPath=\"\"\n        permissions={true}\n        readOnly={!isEditable}\n      />\n    </CollapsibleWithErrorProps>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAIA,SAASC,kBAAkB,QAAQ;AACnC,SAASC,YAAY,EAAEC,gBAAgB,QAAQ;AAC/C,OAAOC,KAAA,IAASC,aAAa,EAAEC,OAAO,QAAQ;AAkF9C,MAAMC,qBAAA,gBAAwBF,aAAA,CAAyC;EACrEG,SAAA,EAAW;EACXC,gBAAA,EAAkBA,CAAA,KAAM;EACxBC,WAAA,EAAaA,CAAA,KAAM;EACnBC,UAAA,EAAYA,CAAA,KAAM;EAClBC,UAAA,EAAY;EACZC,UAAA,EAAY,EAAE;EACdC,YAAA,EAAc;EACdC,OAAA,EAAS;EACTC,YAAA,EAAcA,CAAA,KAAM;AACtB;AAEA,OAAO,MAAMC,wBAAA,GAA2BA,CAAA,KAAMb,KAAA,CAAMc,GAAG,CAACX,qBAAA;AAExD;;;;;AAKA,OAAO,MAAMY,YAAA,GAA4CC,KAAA;EAAA,MAAAC,CAAA,GAAArB,EAAA;EACvD;IAAAsB,WAAA;IAAAC,WAAA;IAAAC,WAAA;IAAA,GAAAC;EAAA,IAAmEL,KAAA;EAEnE;IAAAV,WAAA;IAAAE,UAAA;IAAAC;EAAA,IAAgDY,YAAA;EAEhD,MAAAC,YAAA,GAAqBvB,gBAAA;EAErB,MAAAwB,cAAA,GAAuBD,YAA6B,IAAbd,UAAA,GAAa;EACpD,MAAAgB,UAAA,GAAmB3B,kBAAA;EAAA,IAAA4B,EAAA;EAAA,IAAAR,CAAA,QAAAC,WAAA,IAAAD,CAAA,QAAAT,UAAA,IAAAS,CAAA,QAAAM,cAAA;IAGXE,EAAA,GAAAC,gBAAA;MACJ;QAAAC,QAAA;QAAA,GAAAC;MAAA,IAA8BF,gBAAA;MAAA,OAE5BG,IAAA,CAACX,WAAA;QAAAV,UAAA;QAAAe,cAAA;QAAA,GAAwEK,IAAI;QAAAD;;KAIjF;IAAAV,CAAA,MAAAC,WAAA;IAAAD,CAAA,MAAAT,UAAA;IAAAS,CAAA,MAAAM,cAAA;IAAAN,CAAA,MAAAQ,EAAA;EAAA;IAAAA,EAAA,GAAAR,CAAA;EAAA;EARF,MAAAa,yBAAA,GACQL,EAON;EAIF,MAAAM,iBAAA,GAAqD;IAAA,GAChDV,YAAY;IAAAhB,gBAAA,EACGyB;EACpB;EAAA,OAGOX,WAAA,GACLa,KAAA,CAAC7B,qBAAA;IAAA8B,KAAA,EAA6BF,iBAAA;IAAAJ,QAAA,E,CAC3BR,WAAA,EACDU,IAAA,CAACvB,WAAA;OAGHuB,IAAA,CAACC,yBAAA;IAAAH,QAAA,EACCE,IAAA,CAAC/B,YAAA;MAAAoC,MAAA,EACSzB,UAAA;MAAA0B,WAAA,EACK;MAAAC,eAAA,EACG;MAAAC,UAAA,EACJ;MAAAC,gBAAA,EACK;MAAAC,WAAA,EACJ;MAAAC,QAAA,EACH,CAAChB;;;CAInB","ignoreList":[]}

package/dist/features/blocks/client/component/components/BlockCollapsible.js.map

@@ -1 +1 @@
-{"version":3,"file":"BlockCollapsible.js","names":["React","useBlockComponentContext","BlockCollapsible","props","children","rest","_jsx"],"sources":["../../../../../../src/features/blocks/client/component/components/BlockCollapsible.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { type BlockCollapsibleProps, useBlockComponentContext } from '../BlockContent.js'\n\nexport const BlockCollapsible: React.FC<BlockCollapsibleProps> = (props) => {\n  const { children, ...rest } = props\n  const { BlockCollapsible } = useBlockComponentContext()\n\n  return BlockCollapsible ? <BlockCollapsible {...rest}>{children}</BlockCollapsible> : null\n}\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,MAAW;AAElB,SAAqCC,wBAAwB,QAAQ;AAErE,OAAO,MAAMC,gBAAA,GAAoDC,KAAA;EAC/D;IAAAC,QAAA;IAAA,GAAAC;EAAA,IAA8BF,KAAA;EAC9B;IAAAD;EAAA,IAA6BD,wBAAA;EAAA,OAEtBC,gBAAA,GAAmBI,IAAA,CAACJ,gBAAA;IAAA,GAAqBG,IAAI;IAAAD;EAAA,C,QAAkC;AAAA,CACxF","ignoreList":[]}
+{"version":3,"file":"BlockCollapsible.js","names":["React","useBlockComponentContext","BlockCollapsible","props","children","rest","_jsx"],"sources":["../../../../../../src/features/blocks/client/component/components/BlockCollapsible.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { type BlockCollapsibleProps, useBlockComponentContext } from '../BlockContent.js'\n\nexport const BlockCollapsible: React.FC<BlockCollapsibleProps> = (props) => {\n  const { children, ...rest } = props\n  const { BlockCollapsible } = useBlockComponentContext()\n\n  return BlockCollapsible ? <BlockCollapsible {...rest}>{children}</BlockCollapsible> : null\n}\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,MAAW;AAElB,SAAqCC,wBAAwB,QAAQ;AAErE,OAAO,MAAMC,gBAAA,GAAoDC,KAAA;EAC/D;IAAAC,QAAA;IAAA,GAAAC;EAAA,IAA8BF,KAAA;EAC9B;IAAAD;EAAA,IAA6BD,wBAAA;EAAA,OAEtBC,gBAAA,GAAmBI,IAAA,CAACJ,gBAAA;IAAA,GAAqBG,IAAI;IAAAD;GAAkC,IAA/E,IAA+E;AAAA,CACxF","ignoreList":[]}

package/dist/features/blocks/client/component/components/BlockEditButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BlockEditButton.js","names":["c","_c","React","useBlockComponentContext","BlockEditButton","$","EditButton","t0","_jsx"],"sources":["../../../../../../src/features/blocks/client/component/components/BlockEditButton.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { useBlockComponentContext } from '../BlockContent.js'\n\nexport const BlockEditButton = () => {\n  const { EditButton } = useBlockComponentContext()\n\n  return EditButton ? <EditButton /> : null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,SAASC,wBAAwB,QAAQ;AAEzC,OAAO,MAAMC,eAAA,GAAkBA,CAAA;EAAA,MAAAC,CAAA,GAAAJ,EAAA;EAC7B;IAAAK;EAAA,IAAuBH,wBAAA;EAAA,IAAAI,EAAA;EAAA,IAAAF,CAAA,QAAAC,UAAA;IAEhBC,EAAA,GAAAD,UAAA,GAAaE,IAAA,CAACF,UAAA,YAAgB;IAAAD,CAAA,MAAAC,UAAA;IAAAD,CAAA,MAAAE,EAAA;EAAA;IAAAA,EAAA,GAAAF,CAAA;EAAA;EAAA,OAA9BE,EAA8B;AAAA,CACvC","ignoreList":[]}
+{"version":3,"file":"BlockEditButton.js","names":["c","_c","React","useBlockComponentContext","BlockEditButton","$","EditButton","t0","_jsx"],"sources":["../../../../../../src/features/blocks/client/component/components/BlockEditButton.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { useBlockComponentContext } from '../BlockContent.js'\n\nexport const BlockEditButton = () => {\n  const { EditButton } = useBlockComponentContext()\n\n  return EditButton ? <EditButton /> : null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,SAASC,wBAAwB,QAAQ;AAEzC,OAAO,MAAMC,eAAA,GAAkBA,CAAA;EAAA,MAAAC,CAAA,GAAAJ,EAAA;EAC7B;IAAAK;EAAA,IAAuBH,wBAAA;EAAA,IAAAI,EAAA;EAAA,IAAAF,CAAA,QAAAC,UAAA;IAEhBC,EAAA,GAAAD,UAAA,GAAaE,IAAA,CAACF,UAAA,IAAgB,IAA9B,IAA8B;IAAAD,CAAA,MAAAC,UAAA;IAAAD,CAAA,MAAAE,EAAA;EAAA;IAAAA,EAAA,GAAAF,CAAA;EAAA;EAAA,OAA9BE,EAA8B;AAAA,CACvC","ignoreList":[]}

package/dist/features/blocks/client/component/components/BlockRemoveButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BlockRemoveButton.js","names":["c","_c","React","useBlockComponentContext","BlockRemoveButton","$","RemoveButton","t0","_jsx"],"sources":["../../../../../../src/features/blocks/client/component/components/BlockRemoveButton.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { useBlockComponentContext } from '../BlockContent.js'\n\nexport const BlockRemoveButton = () => {\n  const { RemoveButton } = useBlockComponentContext()\n\n  return RemoveButton ? <RemoveButton /> : null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,SAASC,wBAAwB,QAAQ;AAEzC,OAAO,MAAMC,iBAAA,GAAoBA,CAAA;EAAA,MAAAC,CAAA,GAAAJ,EAAA;EAC/B;IAAAK;EAAA,IAAyBH,wBAAA;EAAA,IAAAI,EAAA;EAAA,IAAAF,CAAA,QAAAC,YAAA;IAElBC,EAAA,GAAAD,YAAA,GAAeE,IAAA,CAACF,YAAA,YAAkB;IAAAD,CAAA,MAAAC,YAAA;IAAAD,CAAA,MAAAE,EAAA;EAAA;IAAAA,EAAA,GAAAF,CAAA;EAAA;EAAA,OAAlCE,EAAkC;AAAA,CAC3C","ignoreList":[]}
+{"version":3,"file":"BlockRemoveButton.js","names":["c","_c","React","useBlockComponentContext","BlockRemoveButton","$","RemoveButton","t0","_jsx"],"sources":["../../../../../../src/features/blocks/client/component/components/BlockRemoveButton.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { useBlockComponentContext } from '../BlockContent.js'\n\nexport const BlockRemoveButton = () => {\n  const { RemoveButton } = useBlockComponentContext()\n\n  return RemoveButton ? <RemoveButton /> : null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,SAASC,wBAAwB,QAAQ;AAEzC,OAAO,MAAMC,iBAAA,GAAoBA,CAAA;EAAA,MAAAC,CAAA,GAAAJ,EAAA;EAC/B;IAAAK;EAAA,IAAyBH,wBAAA;EAAA,IAAAI,EAAA;EAAA,IAAAF,CAAA,QAAAC,YAAA;IAElBC,EAAA,GAAAD,YAAA,GAAeE,IAAA,CAACF,YAAA,IAAkB,IAAlC,IAAkC;IAAAD,CAAA,MAAAC,YAAA;IAAAD,CAAA,MAAAE,EAAA;EAAA;IAAAA,EAAA,GAAAF,CAAA;EAAA;EAAA,OAAlCE,EAAkC;AAAA,CAC3C","ignoreList":[]}

package/dist/features/blocks/client/component/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/component/index.tsx"],"names":[],"mappings":"AAqCA,OAAO,KAAkD,MAAM,OAAO,CAAA;AAGtE,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,4BAA4B,CAAA;AAC5E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AAEzD,OAAO,aAAa,CAAA;AACpB,OAAO,8CAA8C,CAAA;AAmBrD,MAAM,MAAM,mBAAmB,CAAC,SAAS,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,WAAW,IAAI;IACzF;;;;OAIG;IACH,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAA;IAC5B,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAA;IAC1B;;;OAGG;IACH,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAAC,CAAA;IAC3D;;;OAGG;IACH,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAAC,CAAA;IAC3D,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAmzBxD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/component/index.tsx"],"names":[],"mappings":"AAwCA,OAAO,KAAkD,MAAM,OAAO,CAAA;AAGtE,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,4BAA4B,CAAA;AAC5E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AAEzD,OAAO,aAAa,CAAA;AACpB,OAAO,8CAA8C,CAAA;AAgBrD,MAAM,MAAM,mBAAmB,CAAC,SAAS,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,WAAW,IAAI;IACzF;;;;OAIG;IACH,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAA;IAC5B,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAA;IAC1B;;;OAGG;IACH,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAAC,CAAA;IAC3D;;;OAGG;IACH,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAAC,CAAA;IAC3D,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAivBxD,CAAA"}

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

@@ -1,13 +1,14 @@
 'use client';
 
+import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
 import { useLexicalEditable } from '@lexical/react/useLexicalEditable';
 import { getTranslation } from '@payloadcms/translations';
-import { Button, Collapsible, Drawer, EditDepthProvider, ErrorPill, Form, formatDrawerSlug, MoreIcon, Pill, Popup, PopupList, RenderFields, SectionTitle, useConfig, useDocumentForm, useDocumentInfo, useEditDepth, useFormSubmitted, useServerFunctions, useTranslation, XIcon } from '@payloadcms/ui';
+import { Button, Collapsible, Drawer, EditDepthProvider, ErrorPill, Form, formatDrawerSlug, MoreIcon, Pill, Popup, PopupList, RenderFields, SectionTitle, useConfig, useDocumentForm, useDocumentInfo, useEditDepth, useFormSubmitted, useOperation, useServerFunctions, useTranslation, XIcon } from '@payloadcms/ui';
 import { abortAndIgnore } from '@payloadcms/ui/shared';
 import { $getNodeByKey, $getRoot, SKIP_DOM_SELECTION_TAG } from 'lexical';
-import { deepCopyObjectSimpleWithoutReactComponents } from 'payload/shared';
+import { deepCopyObjectSimpleWithoutReactComponents, getDataFromFormState } from 'payload/shared';
 import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import { v4 as uuid } from 'uuid';
 import './index.css';
@@ -15,7 +16,7 @@ import '../../../../utilities/fieldsDrawer/index.css';
 import { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js';
 import { RegisterFormSubmit, useDrawerSubmit } from '../../../../utilities/fieldsDrawer/useDrawerSubmit.js';
 import { useLexicalDrawer } from '../../../../utilities/fieldsDrawer/useLexicalDrawer.js';
-import { getCachedFormStateIfDataMatches, reduceFormStateToBlockData } from '../getCachedFormStateIfDataMatches.js';
+import { getCachedFormStateIfDataMatches } from '../getCachedFormStateIfDataMatches.js';
 import { $isBlockNode } from '../nodes/BlocksNode.js';
 import { BlockContent, useBlockComponentContext } from './BlockContent.js';
 import { BlockReordering } from './BlockReordering/index.js';
@@ -46,7 +47,6 @@ export const BlockComponent = props => {
   const {
     fields: parentDocumentFields
   } = useDocumentForm();
-  const onChangeAbortControllerRef = useRef(new AbortController());
   const editDepth = useEditDepth();
   const [errorCount, setErrorCount] = React.useState(0);
   const {
@@ -68,9 +68,8 @@ export const BlockComponent = props => {
   } = useDocumentInfo();
   const [editor] = useLexicalComposerContext();
   const isEditable = useLexicalEditable();
+  const operation = useOperation();
   const blockType = formData.blockType;
-  const formDataRef = useRef(formData);
-  formDataRef.current = formData;
   const componentMapRenderedBlockPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.${blockType}`;
   const clientSchemaMap = featureClientSchemaMap['blocks'];
   const blocksField = clientSchemaMap?.[componentMapRenderedBlockPath]?.[0];
@@ -147,7 +146,7 @@ export const BlockComponent = props => {
         isEditor: true,
         isJSXConverter: false,
         nodeKey: nodeKey,
-        // eslint-disable-next-line react-compiler/react-compiler -- intentionally passed as a prop for custom block components to call
+        // eslint-disable-next-line react-hooks/hooks -- intentionally passed as a prop for custom block components to call
         useBlockComponentContext: useBlockComponentContext
       });
     }
@@ -161,7 +160,7 @@ export const BlockComponent = props => {
         isEditor: true,
         isJSXConverter: false,
         nodeKey: nodeKey,
-        // eslint-disable-next-line react-compiler/react-compiler -- intentionally passed as a prop for custom block components to call
+        // eslint-disable-next-line react-hooks/hooks -- intentionally passed as a prop for custom block components to call
         useBlockComponentContext: useBlockComponentContext
       });
     }
@@ -186,12 +185,10 @@ export const BlockComponent = props => {
           fields: true
         },
         docPreferences: await getDocPreferences(),
-        documentFormState: deepCopyObjectSimpleWithoutReactComponents(parentDocumentFields, {
-          excludeFiles: true
-        }),
+        documentFormState: parentDocumentFields,
         globalSlug,
         initialBlockData: formData,
-        operation: 'update',
+        operation,
         readOnly: !isEditable,
         renderAllFields: true,
         schemaPath: schemaFieldsPath,
@@ -204,9 +201,9 @@ export const BlockComponent = props => {
           valid: true,
           value: formData.blockName
         };
-        const newFormStateData = reduceFormStateToBlockData(deepCopyObjectSimpleWithoutReactComponents(state, {
+        const newFormStateData = getDataFromFormState(deepCopyObjectSimpleWithoutReactComponents(state, {
           excludeFiles: true
-        }));
+        }), true);
         // Things like default values may come back from the server => update the node with the new data
         editor.update(() => {
           const node = $getNodeByKey(nodeKey);
@@ -236,53 +233,19 @@ export const BlockComponent = props => {
     return () => {
       abortAndIgnore(abortController);
     };
-  }, [getFormState, schemaFieldsPath, isEditable, id, CustomLabelFromProps, CustomBlockFromProps, formData, editor, nodeKey, initialState, collectionSlug, globalSlug, getDocPreferences, parentDocumentFields, blockType, clientBlock]);
+  }, [getFormState, schemaFieldsPath, isEditable, id, CustomLabelFromProps, CustomBlockFromProps, formData, editor, nodeKey, initialState, collectionSlug, globalSlug, getDocPreferences, operation, parentDocumentFields, blockType, clientBlock]);
   const [isCollapsed, setIsCollapsed] = React.useState(initialLexicalFormState?.[formData.id]?.collapsed ?? false);
   const {
     i18n,
     t
   } = useTranslation();
-  const onChange = useCallback(async ({
-    formState: prevFormState,
-    submit
-  }) => {
-    abortAndIgnore(onChangeAbortControllerRef.current);
-    const controller = new AbortController();
-    onChangeAbortControllerRef.current = controller;
-    const blockData = reduceFormStateToBlockData(deepCopyObjectSimpleWithoutReactComponents(prevFormState, {
-      excludeFiles: true
-    }), formDataRef.current);
-    const {
-      state: newFormState
-    } = await getFormState({
-      id,
-      collectionSlug,
-      data: blockData,
-      docPermissions: {
-        fields: true
-      },
-      docPreferences: await getDocPreferences(),
-      documentFormState: deepCopyObjectSimpleWithoutReactComponents(parentDocumentFields, {
-        excludeFiles: true
-      }),
-      formState: prevFormState,
-      globalSlug,
-      initialBlockData: blockData,
-      operation: 'update',
-      readOnly: !isEditable,
-      renderAllFields: submit ? true : false,
-      schemaPath: schemaFieldsPath,
-      signal: controller.signal
-    });
-    if (!newFormState) {
-      return prevFormState;
-    }
+  const applyServerState = useCallback((newFormState, prevFormState) => {
     if (prevFormState.blockName) {
       newFormState.blockName = prevFormState.blockName;
     }
-    const newFormStateData_0 = reduceFormStateToBlockData(deepCopyObjectSimpleWithoutReactComponents(newFormState, {
+    const newFormStateData_0 = getDataFromFormState(deepCopyObjectSimpleWithoutReactComponents(newFormState, {
       excludeFiles: true
-    }), blockData);
+    }), true);
     setTimeout(() => {
       editor.update(() => {
         const node_0 = $getNodeByKey(nodeKey);
@@ -298,28 +261,22 @@ export const BlockComponent = props => {
         tag: SKIP_DOM_SELECTION_TAG
       });
     }, 0);
-    if (submit) {
+  }, [blockType, editor, nodeKey]);
+  const onChange = useCallback(({
+    formState,
+    submitted: submitted_0
+  }) => {
+    applyServerState(formState, formState);
+    if (submitted_0) {
       if (!CustomLabelFromProps) {
-        setCustomLabel(newFormState._components?.customComponents?.BlockLabel ?? undefined);
+        setCustomLabel(formState._components?.customComponents?.BlockLabel ?? undefined);
       }
       if (!CustomBlockFromProps) {
-        setCustomBlock(newFormState._components?.customComponents?.Block ?? undefined);
-      }
-      let rowErrorCount = 0;
-      for (const formField of Object.values(newFormState)) {
-        if (formField?.valid === false) {
-          rowErrorCount++;
-        }
+        setCustomBlock(formState._components?.customComponents?.Block ?? undefined);
       }
-      setErrorCount(rowErrorCount);
+      setErrorCount(Object.values(formState).filter(field => field.valid === false).length);
     }
-    return newFormState;
-  }, [getFormState, id, collectionSlug, getDocPreferences, globalSlug, schemaFieldsPath, blockType, parentDocumentFields, isEditable, editor, nodeKey, CustomBlockFromProps, CustomLabelFromProps]);
-  useEffect(() => {
-    return () => {
-      abortAndIgnore(onChangeAbortControllerRef.current);
-    };
-  }, []);
+  }, [applyServerState, CustomLabelFromProps, CustomBlockFromProps]);
   const removeBlock = useCallback(() => {
     editor.update(() => {
       $getNodeByKey(nodeKey)?.remove();
@@ -498,6 +455,7 @@ export const BlockComponent = props => {
               role: 'button',
               tabIndex: 0
             },
+            draggable: true,
             listeners: {
               onBlur
             }
@@ -517,10 +475,8 @@ export const BlockComponent = props => {
               }), !disableBlockName && !clientBlock?.admin?.disableBlockName && /*#__PURE__*/_jsx(SectionTitle, {
                 path: "blockName",
                 readOnly: !isEditable
-              }), fieldHasErrors && /*#__PURE__*/_jsx(ErrorPill, {
-                count: errorCount_0 ?? 0,
-                i18n: i18n,
-                withMessage: true
+              }), fieldHasErrors && /*#__PURE__*/_jsx(BlockErrorPill, {
+                count: errorCount_0 ?? 0
               })]
             })
           }),
@@ -545,7 +501,7 @@ export const BlockComponent = props => {
         }, 0)
       })
     });
-  }, [editor, resolvedCustomBlock, resolvedCustomLabel, blockDisplayName, baseClass, clientBlock?.admin?.disableBlockName, blockType, i18n, isCollapsed, onCollapsedChange, isEditable, nodeKey, removeBlock, rowIndex, t, toggleDrawer]);
+  }, [editor, resolvedCustomBlock, resolvedCustomLabel, blockDisplayName, baseClass, clientBlock?.admin?.disableBlockName, blockType, isCollapsed, onCollapsedChange, isEditable, nodeKey, removeBlock, rowIndex, t, toggleDrawer]);
   const blockID = formData?.id;
   const {
     headerActions,
@@ -586,22 +542,13 @@ export const BlockComponent = props => {
         display: 'contents'
       },
       children: /*#__PURE__*/_jsx(Form, {
-        beforeSubmit: [async ({
-          formState
-        }) => {
-          // This is only called when form is submitted from drawer - usually only the case if the block has a custom Block component
-          return await onChange({
-            formState,
-            submit: true
-          });
-        }],
         el: "div",
         fields: clientBlock?.fields ?? [],
         initialState: initialState,
         onChange: [onChange],
         onSubmit: formState_0 => {
           // This is only called when form is submitted from drawer - usually only the case if the block has a custom Block component
-          const newData_1 = reduceFormStateToBlockData(formState_0, formDataRef.current);
+          const newData_1 = getDataFromFormState(formState_0, true);
           newData_1.blockType = blockType;
           editor.update(() => {
             const node_1 = $getNodeByKey(nodeKey);
@@ -616,6 +563,8 @@ export const BlockComponent = props => {
           });
           toggleDrawer();
         },
+        readOnly: !isEditable,
+        schemaPath: schemaFieldsPath,
         submitted: submitted,
         uuid: formUuid,
         children: /*#__PURE__*/_jsx(BlockContent, {
@@ -633,7 +582,7 @@ export const BlockComponent = props => {
         })
       })
     });
-  }, [BlockCollapsible, BlockDrawer, resolvedCustomBlock, resolvedCustomLabel, blockType, drawerSlug, RemoveButton, EditButton, baseClass, editor, errorCount, toggleDrawer, clientBlock?.fields, formUuid, initialState, nodeKey, onChange, submitted]);
+  }, [BlockCollapsible, BlockDrawer, resolvedCustomBlock, resolvedCustomLabel, blockType, drawerSlug, RemoveButton, EditButton, baseClass, editor, errorCount, toggleDrawer, clientBlock?.fields, formUuid, initialState, nodeKey, schemaFieldsPath, isEditable, onChange, submitted]);
   if (!clientBlock) {
     return /*#__PURE__*/_jsx(BlockCollapsible, {
       disableBlockName: true,
@@ -646,4 +595,32 @@ export const BlockComponent = props => {
   }
   return Block;
 };
+/**
+ * Reads `i18n` itself so `BlockCollapsible` does not depend on it. `BlockCollapsible` is created in
+ * a `useMemo`, so each new `i18n` object (e.g. once the date-fns locale is set after mount) would
+ * remount the whole block, closing its open menus and dropping focus.
+ */
+const BlockErrorPill = t0 => {
+  const $ = _c(3);
+  const {
+    count
+  } = t0;
+  const {
+    i18n
+  } = useTranslation();
+  let t1;
+  if ($[0] !== count || $[1] !== i18n) {
+    t1 = _jsx(ErrorPill, {
+      count,
+      i18n,
+      withMessage: true
+    });
+    $[0] = count;
+    $[1] = i18n;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  return t1;
+};
 //# sourceMappingURL=index.js.map