@payloadcms/richtext-lexical 3.0.0-canary.b8dd0db → 3.0.0-canary.bb00d64

package/dist/exports/server/rsc.d.ts

@@ -0,0 +1,3 @@
+export { RscEntryLexicalCell } from '../../cell/rscEntry.js';
+export { RscEntryLexicalField } from '../../field/rscEntry.js';
+//# sourceMappingURL=rsc.d.ts.map

package/dist/exports/server/rsc.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rsc.d.ts","sourceRoot":"","sources":["../../../src/exports/server/rsc.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAA;AAC5D,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAA"}

package/dist/exports/server/rsc.js

@@ -0,0 +1,3 @@
+export { RscEntryLexicalCell } from '../../cell/rscEntry.js';
+export { RscEntryLexicalField } from '../../field/rscEntry.js';
+//# sourceMappingURL=rsc.js.map

package/dist/exports/server/rsc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rsc.js","names":["RscEntryLexicalCell","RscEntryLexicalField"],"sources":["../../../src/exports/server/rsc.ts"],"sourcesContent":["export { RscEntryLexicalCell } from '../../cell/rscEntry.js'\nexport { RscEntryLexicalField } from '../../field/rscEntry.js'\n"],"mappings":"AAAA,SAASA,mBAAmB,QAAQ;AACpC,SAASC,oBAAoB,QAAQ","ignoreList":[]}

package/dist/features/align/client/index.d.ts

@@ -1,5 +1,2 @@
-export declare const AlignFeatureClient: import("react").FC<{
-    featureKey: string;
-    order: number;
-}>;
+export declare const AlignFeatureClient: import("../../typesClient.js").FeatureProviderProviderClient<undefined, undefined>;
 //# sourceMappingURL=index.d.ts.map

package/dist/features/align/client/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/features/align/client/index.tsx"],"names":[],"mappings":"AAsJA,eAAO,MAAM,kBAAkB;;;EAO7B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/features/align/client/index.tsx"],"names":[],"mappings":"AAsJA,eAAO,MAAM,kBAAkB,oFAO7B,CAAA"}

package/dist/features/blockquote/client/index.d.ts

@@ -1,5 +1,2 @@
-export declare const BlockquoteFeatureClient: import("react").FC<{
-    featureKey: string;
-    order: number;
-}>;
+export declare const BlockquoteFeatureClient: import("../../typesClient.js").FeatureProviderProviderClient<undefined, undefined>;
 //# sourceMappingURL=index.d.ts.map

package/dist/features/blockquote/client/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/features/blockquote/client/index.tsx"],"names":[],"mappings":"AA4CA,eAAO,MAAM,uBAAuB;;;EA8BlC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/features/blockquote/client/index.tsx"],"names":[],"mappings":"AA4CA,eAAO,MAAM,uBAAuB,oFA8BlC,CAAA"}

package/dist/features/blockquote/markdownTransformer.js.map

@@ -1 +1 @@
-{"version":3,"file":"markdownTransformer.js","names":["$createQuoteNode","$isQuoteNode","QuoteNode","$createLineBreakNode","MarkdownTransformer","type","dependencies","export","node","exportChildren","lines","split","output","line","push","join","regExp","replace","parentNode","children","_match","isImport","previousNode","getPreviousSibling","splice","getChildrenSize","select","remove","append"],"sources":["../../../src/features/blockquote/markdownTransformer.ts"],"sourcesContent":["import type { ElementTransformer } from '@lexical/markdown'\n\nimport { $createQuoteNode, $isQuoteNode, QuoteNode } from '@lexical/rich-text'\nimport { $createLineBreakNode } from 'lexical'\n\nexport const MarkdownTransformer: ElementTransformer = {\n  type: 'element',\n  dependencies: [QuoteNode],\n  export: (node, exportChildren) => {\n    if (!$isQuoteNode(node)) {\n      return null\n    }\n\n    const lines = exportChildren(node).split('\\n')\n    const output = []\n    for (const line of lines) {\n      output.push('> ' + line)\n    }\n    return output.join('\\n')\n  },\n  regExp: /^>\\s/,\n  replace: (parentNode, children, _match, isImport) => {\n    if (isImport) {\n      const previousNode = parentNode.getPreviousSibling()\n      if ($isQuoteNode(previousNode)) {\n        previousNode.splice(previousNode.getChildrenSize(), 0, [\n          $createLineBreakNode(),\n          ...children,\n        ])\n        previousNode.select(0, 0)\n        parentNode.remove()\n        return\n      }\n    }\n\n    const node = $createQuoteNode()\n    node.append(...children)\n    parentNode.replace(node)\n    node.select(0, 0)\n  },\n}\n"],"mappings":"AAEA,SAASA,gBAAgB,EAAEC,YAAY,EAAEC,SAAS,QAAQ;AAC1D,SAASC,oBAAoB,QAAQ;AAErC,OAAO,MAAMC,mBAAA,GAA0C;EACrDC,IAAA,EAAM;EACNC,YAAA,EAAc,CAACJ,SAAA,CAAU;EACzBK,MAAA,EAAQA,CAACC,IAAA,EAAMC,cAAA;IACb,IAAI,CAACR,YAAA,CAAaO,IAAA,GAAO;MACvB,OAAO;IACT;IAEA,MAAME,KAAA,GAAQD,cAAA,CAAeD,IAAA,EAAMG,KAAK,CAAC;IACzC,MAAMC,MAAA,GAAS,EAAE;IACjB,KAAK,MAAMC,IAAA,IAAQH,KAAA,EAAO;MACxBE,MAAA,CAAOE,IAAI,CAAC,OAAOD,IAAA;IACrB;IACA,OAAOD,MAAA,CAAOG,IAAI,CAAC;EACrB;EACAC,MAAA,EAAQ;EACRC,OAAA,EAASA,CAACC,UAAA,EAAYC,QAAA,EAAUC,MAAA,EAAQC,QAAA;IACtC,IAAIA,QAAA,EAAU;MACZ,MAAMC,YAAA,GAAeJ,UAAA,CAAWK,kBAAkB;MAClD,IAAItB,YAAA,CAAaqB,YAAA,GAAe;QAC9BA,YAAA,CAAaE,MAAM,CAACF,YAAA,CAAaG,eAAe,IAAI,GAAG,CACrDtB,oBAAA,I,GACGgB,QAAA,CACJ;QACDG,YAAA,CAAaI,MAAM,CAAC,GAAG;QACvBR,UAAA,CAAWS,MAAM;QACjB;MACF;IACF;IAEA,MAAMnB,IAAA,GAAOR,gBAAA;IACbQ,IAAA,CAAKoB,MAAM,IAAIT,QAAA;IACfD,UAAA,CAAWD,OAAO,CAACT,IAAA;IACnBA,IAAA,CAAKkB,MAAM,CAAC,GAAG;EACjB;AACF","ignoreList":[]}
+{"version":3,"file":"markdownTransformer.js","names":["$createQuoteNode","$isQuoteNode","QuoteNode","$createLineBreakNode","MarkdownTransformer","type","dependencies","export","node","exportChildren","lines","split","output","line","push","join","regExp","replace","parentNode","children","_match","isImport","previousNode","getPreviousSibling","splice","getChildrenSize","select","remove","append"],"sources":["../../../src/features/blockquote/markdownTransformer.ts"],"sourcesContent":["import type { ElementTransformer } from '@lexical/markdown'\n\nimport { $createQuoteNode, $isQuoteNode, QuoteNode } from '@lexical/rich-text'\nimport { $createLineBreakNode } from 'lexical'\n\nexport const MarkdownTransformer: ElementTransformer = {\n  type: 'element',\n  dependencies: [QuoteNode],\n  export: (node, exportChildren) => {\n    if (!$isQuoteNode(node)) {\n      return null\n    }\n\n    const lines = exportChildren(node).split('\\n')\n    const output: string[] = []\n    for (const line of lines) {\n      output.push('> ' + line)\n    }\n    return output.join('\\n')\n  },\n  regExp: /^>\\s/,\n  replace: (parentNode, children, _match, isImport) => {\n    if (isImport) {\n      const previousNode = parentNode.getPreviousSibling()\n      if ($isQuoteNode(previousNode)) {\n        previousNode.splice(previousNode.getChildrenSize(), 0, [\n          $createLineBreakNode(),\n          ...children,\n        ])\n        previousNode.select(0, 0)\n        parentNode.remove()\n        return\n      }\n    }\n\n    const node = $createQuoteNode()\n    node.append(...children)\n    parentNode.replace(node)\n    node.select(0, 0)\n  },\n}\n"],"mappings":"AAEA,SAASA,gBAAgB,EAAEC,YAAY,EAAEC,SAAS,QAAQ;AAC1D,SAASC,oBAAoB,QAAQ;AAErC,OAAO,MAAMC,mBAAA,GAA0C;EACrDC,IAAA,EAAM;EACNC,YAAA,EAAc,CAACJ,SAAA,CAAU;EACzBK,MAAA,EAAQA,CAACC,IAAA,EAAMC,cAAA;IACb,IAAI,CAACR,YAAA,CAAaO,IAAA,GAAO;MACvB,OAAO;IACT;IAEA,MAAME,KAAA,GAAQD,cAAA,CAAeD,IAAA,EAAMG,KAAK,CAAC;IACzC,MAAMC,MAAA,GAAmB,EAAE;IAC3B,KAAK,MAAMC,IAAA,IAAQH,KAAA,EAAO;MACxBE,MAAA,CAAOE,IAAI,CAAC,OAAOD,IAAA;IACrB;IACA,OAAOD,MAAA,CAAOG,IAAI,CAAC;EACrB;EACAC,MAAA,EAAQ;EACRC,OAAA,EAASA,CAACC,UAAA,EAAYC,QAAA,EAAUC,MAAA,EAAQC,QAAA;IACtC,IAAIA,QAAA,EAAU;MACZ,MAAMC,YAAA,GAAeJ,UAAA,CAAWK,kBAAkB;MAClD,IAAItB,YAAA,CAAaqB,YAAA,GAAe;QAC9BA,YAAA,CAAaE,MAAM,CAACF,YAAA,CAAaG,eAAe,IAAI,GAAG,CACrDtB,oBAAA,I,GACGgB,QAAA,CACJ;QACDG,YAAA,CAAaI,MAAM,CAAC,GAAG;QACvBR,UAAA,CAAWS,MAAM;QACjB;MACF;IACF;IAEA,MAAMnB,IAAA,GAAOR,gBAAA;IACbQ,IAAA,CAAKoB,MAAM,IAAIT,QAAA;IACfD,UAAA,CAAWD,OAAO,CAACT,IAAA;IACnBA,IAAA,CAAKkB,MAAM,CAAC,GAAG;EACjB;AACF","ignoreList":[]}

package/dist/features/blockquote/server/index.d.ts

@@ -3,5 +3,5 @@ import type { Spread } from 'lexical';
 export type SerializedQuoteNode = Spread<{
     type: 'quote';
 }, _SerializedQuoteNode>;
-export declare const BlockquoteFeature: import("../../typesServer.js").FeatureProviderProviderServer<undefined, undefined, any>;
+export declare const BlockquoteFeature: import("../../typesServer.js").FeatureProviderProviderServer<undefined, undefined, null>;
 //# sourceMappingURL=index.d.ts.map

package/dist/features/blockquote/server/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/features/blockquote/server/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,IAAI,oBAAoB,EAAE,MAAM,oBAAoB,CAAA;AACrF,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAUrC,MAAM,MAAM,mBAAmB,GAAG,MAAM,CACtC;IACE,IAAI,EAAE,OAAO,CAAA;CACd,EACD,oBAAoB,CACrB,CAAA;AAED,eAAO,MAAM,iBAAiB,yFA0C5B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/features/blockquote/server/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,IAAI,oBAAoB,EAAE,MAAM,oBAAoB,CAAA;AACrF,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAUrC,MAAM,MAAM,mBAAmB,GAAG,MAAM,CACtC;IACE,IAAI,EAAE,OAAO,CAAA;CACd,EACD,oBAAoB,CACrB,CAAA;AAED,eAAO,MAAM,iBAAiB,0FA8C5B,CAAA"}

package/dist/features/blockquote/server/index.js

@@ -2,8 +2,8 @@ import { QuoteNode } from '@lexical/rich-text';
 import { createServerFeature } from '../../../utilities/createServerFeature.js';
 import { convertLexicalNodesToHTML } from '../../converters/html/converter/index.js';
 import { createNode } from '../../typeUtilities.js';
-import { i18n } from './i18n.js';
 import { MarkdownTransformer } from '../markdownTransformer.js';
+import { i18n } from './i18n.js';
 export const BlockquoteFeature = createServerFeature({
   feature: {
     ClientFeature: '@payloadcms/richtext-lexical/client#BlockquoteFeatureClient',
@@ -15,6 +15,8 @@ export const BlockquoteFeature = createServerFeature({
         html: {
           converter: async ({
             converters,
+            currentDepth,
+            depth,
             draft,
             node,
             overrideAccess,
@@ -24,6 +26,8 @@ export const BlockquoteFeature = createServerFeature({
           }) => {
             const childrenText = await convertLexicalNodesToHTML({
               converters,
+              currentDepth,
+              depth,
               draft,
               lexicalNodes: node.children,
               overrideAccess,

package/dist/features/blockquote/server/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["QuoteNode","createServerFeature","convertLexicalNodesToHTML","createNode","i18n","MarkdownTransformer","BlockquoteFeature","feature","ClientFeature","clientFeatureProps","markdownTransformers","nodes","converters","html","converter","draft","node","overrideAccess","parent","req","showHiddenFields","childrenText","lexicalNodes","children","nodeTypes","getType","key"],"sources":["../../../../src/features/blockquote/server/index.ts"],"sourcesContent":["import type { SerializedQuoteNode as _SerializedQuoteNode } from '@lexical/rich-text'\nimport type { Spread } from 'lexical'\n\nimport { QuoteNode } from '@lexical/rich-text'\n\nimport { createServerFeature } from '../../../utilities/createServerFeature.js'\nimport { convertLexicalNodesToHTML } from '../../converters/html/converter/index.js'\nimport { createNode } from '../../typeUtilities.js'\nimport { i18n } from './i18n.js'\nimport { MarkdownTransformer } from '../markdownTransformer.js'\n\nexport type SerializedQuoteNode = Spread<\n  {\n    type: 'quote'\n  },\n  _SerializedQuoteNode\n>\n\nexport const BlockquoteFeature = createServerFeature({\n  feature: {\n    ClientFeature: '@payloadcms/richtext-lexical/client#BlockquoteFeatureClient',\n    clientFeatureProps: null,\n    i18n,\n    markdownTransformers: [MarkdownTransformer],\n    nodes: [\n      createNode({\n        converters: {\n          html: {\n            converter: async ({\n              converters,\n              draft,\n              node,\n              overrideAccess,\n              parent,\n              req,\n              showHiddenFields,\n            }) => {\n              const childrenText = await convertLexicalNodesToHTML({\n                converters,\n                draft,\n                lexicalNodes: node.children,\n                overrideAccess,\n                parent: {\n                  ...node,\n                  parent,\n                },\n                req,\n                showHiddenFields,\n              })\n\n              return `<blockquote>${childrenText}</blockquote>`\n            },\n            nodeTypes: [QuoteNode.getType()],\n          },\n        },\n        node: QuoteNode,\n      }),\n    ],\n  },\n  key: 'blockquote',\n})\n"],"mappings":"AAGA,SAASA,SAAS,QAAQ;AAE1B,SAASC,mBAAmB,QAAQ;AACpC,SAASC,yBAAyB,QAAQ;AAC1C,SAASC,UAAU,QAAQ;AAC3B,SAASC,IAAI,QAAQ;AACrB,SAASC,mBAAmB,QAAQ;AASpC,OAAO,MAAMC,iBAAA,GAAoBL,mBAAA,CAAoB;EACnDM,OAAA,EAAS;IACPC,aAAA,EAAe;IACfC,kBAAA,EAAoB;IACpBL,IAAA;IACAM,oBAAA,EAAsB,CAACL,mBAAA,CAAoB;IAC3CM,KAAA,EAAO,CACLR,UAAA,CAAW;MACTS,UAAA,EAAY;QACVC,IAAA,EAAM;UACJC,SAAA,EAAW,MAAAA,CAAO;YAChBF,UAAU;YACVG,KAAK;YACLC,IAAI;YACJC,cAAc;YACdC,MAAM;YACNC,GAAG;YACHC;UAAgB,CACjB;YACC,MAAMC,YAAA,GAAe,MAAMnB,yBAAA,CAA0B;cACnDU,UAAA;cACAG,KAAA;cACAO,YAAA,EAAcN,IAAA,CAAKO,QAAQ;cAC3BN,cAAA;cACAC,MAAA,EAAQ;gBACN,GAAGF,IAAI;gBACPE;cACF;cACAC,GAAA;cACAC;YACF;YAEA,OAAO,eAAeC,YAAA,eAA2B;UACnD;UACAG,SAAA,EAAW,CAACxB,SAAA,CAAUyB,OAAO;QAC/B;MACF;MACAT,IAAA,EAAMhB;IACR;EAEJ;EACA0B,GAAA,EAAK;AACP","ignoreList":[]}
+{"version":3,"file":"index.js","names":["QuoteNode","createServerFeature","convertLexicalNodesToHTML","createNode","MarkdownTransformer","i18n","BlockquoteFeature","feature","ClientFeature","clientFeatureProps","markdownTransformers","nodes","converters","html","converter","currentDepth","depth","draft","node","overrideAccess","parent","req","showHiddenFields","childrenText","lexicalNodes","children","nodeTypes","getType","key"],"sources":["../../../../src/features/blockquote/server/index.ts"],"sourcesContent":["import type { SerializedQuoteNode as _SerializedQuoteNode } from '@lexical/rich-text'\nimport type { Spread } from 'lexical'\n\nimport { QuoteNode } from '@lexical/rich-text'\n\nimport { createServerFeature } from '../../../utilities/createServerFeature.js'\nimport { convertLexicalNodesToHTML } from '../../converters/html/converter/index.js'\nimport { createNode } from '../../typeUtilities.js'\nimport { MarkdownTransformer } from '../markdownTransformer.js'\nimport { i18n } from './i18n.js'\n\nexport type SerializedQuoteNode = Spread<\n  {\n    type: 'quote'\n  },\n  _SerializedQuoteNode\n>\n\nexport const BlockquoteFeature = createServerFeature({\n  feature: {\n    ClientFeature: '@payloadcms/richtext-lexical/client#BlockquoteFeatureClient',\n    clientFeatureProps: null,\n    i18n,\n    markdownTransformers: [MarkdownTransformer],\n    nodes: [\n      createNode({\n        converters: {\n          html: {\n            converter: async ({\n              converters,\n              currentDepth,\n              depth,\n              draft,\n              node,\n              overrideAccess,\n              parent,\n              req,\n              showHiddenFields,\n            }) => {\n              const childrenText = await convertLexicalNodesToHTML({\n                converters,\n                currentDepth,\n                depth,\n                draft,\n                lexicalNodes: node.children,\n                overrideAccess,\n                parent: {\n                  ...node,\n                  parent,\n                },\n                req,\n                showHiddenFields,\n              })\n\n              return `<blockquote>${childrenText}</blockquote>`\n            },\n            nodeTypes: [QuoteNode.getType()],\n          },\n        },\n        node: QuoteNode,\n      }),\n    ],\n  },\n  key: 'blockquote',\n})\n"],"mappings":"AAGA,SAASA,SAAS,QAAQ;AAE1B,SAASC,mBAAmB,QAAQ;AACpC,SAASC,yBAAyB,QAAQ;AAC1C,SAASC,UAAU,QAAQ;AAC3B,SAASC,mBAAmB,QAAQ;AACpC,SAASC,IAAI,QAAQ;AASrB,OAAO,MAAMC,iBAAA,GAAoBL,mBAAA,CAAoB;EACnDM,OAAA,EAAS;IACPC,aAAA,EAAe;IACfC,kBAAA,EAAoB;IACpBJ,IAAA;IACAK,oBAAA,EAAsB,CAACN,mBAAA,CAAoB;IAC3CO,KAAA,EAAO,CACLR,UAAA,CAAW;MACTS,UAAA,EAAY;QACVC,IAAA,EAAM;UACJC,SAAA,EAAW,MAAAA,CAAO;YAChBF,UAAU;YACVG,YAAY;YACZC,KAAK;YACLC,KAAK;YACLC,IAAI;YACJC,cAAc;YACdC,MAAM;YACNC,GAAG;YACHC;UAAgB,CACjB;YACC,MAAMC,YAAA,GAAe,MAAMrB,yBAAA,CAA0B;cACnDU,UAAA;cACAG,YAAA;cACAC,KAAA;cACAC,KAAA;cACAO,YAAA,EAAcN,IAAA,CAAKO,QAAQ;cAC3BN,cAAA;cACAC,MAAA,EAAQ;gBACN,GAAGF,IAAI;gBACPE;cACF;cACAC,GAAA;cACAC;YACF;YAEA,OAAO,eAAeC,YAAA,eAA2B;UACnD;UACAG,SAAA,EAAW,CAAC1B,SAAA,CAAU2B,OAAO;QAC/B;MACF;MACAT,IAAA,EAAMlB;IACR;EAEJ;EACA4B,GAAA,EAAK;AACP","ignoreList":[]}

package/dist/features/blocks/client/component/BlockContent.d.ts

@@ -8,6 +8,7 @@ type Props = {
     field: LexicalRichTextFieldProps['field'];
     formData: BlockFields;
     formSchema: ClientField[];
+    Label?: React.ReactNode;
     nodeKey: string;
     path: string;
     schemaPath: string;

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

@@ -1 +1 @@
-{"version":3,"file":"BlockContent.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/component/BlockContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAmC,MAAM,SAAS,CAAA;AAkBxF,OAAO,KAAsB,MAAM,OAAO,CAAA;AAE1C,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAA;AACrE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAKnE,KAAK,KAAK,GAAG;IACX,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,WAAW,CAAA;IACxB,KAAK,EAAE,yBAAyB,CAAC,OAAO,CAAC,CAAA;IACzC,QAAQ,EAAE,WAAW,CAAA;IACrB,UAAU,EAAE,WAAW,EAAE,CAAA;IACzB,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,MAAM,CAAA;IACZ,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAoBD;;;;GAIG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAwLxC,CAAA"}
+{"version":3,"file":"BlockContent.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/component/BlockContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAmC,MAAM,SAAS,CAAA;AAiBxF,OAAO,KAAiC,MAAM,OAAO,CAAA;AAErD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAA;AACrE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAMnE,KAAK,KAAK,GAAG;IACX,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,WAAW,CAAA;IACxB,KAAK,EAAE,yBAAyB,CAAC,OAAO,CAAC,CAAA;IACzC,QAAQ,EAAE,WAAW,CAAA;IACrB,UAAU,EAAE,WAAW,EAAE,CAAA;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,MAAM,CAAA;IACZ,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAoBD;;;;GAIG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAmLxC,CAAA"}

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

@@ -3,10 +3,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
 import { getTranslation } from '@payloadcms/translations';
-import { Button, Collapsible, ErrorPill, Pill, RenderComponent, RenderFields, SectionTitle, useDocumentInfo, useFormSubmitted, useTranslation } from '@payloadcms/ui';
+import { Button, Collapsible, ErrorPill, Pill, RenderFields, SectionTitle, useDocumentInfo, useFormSubmitted, useTranslation } from '@payloadcms/ui';
 import { dequal } from 'dequal/lite';
 import { $getNodeByKey } from 'lexical';
-import React, { useCallback } from 'react';
+import React, { useCallback, useEffect } from 'react';
+import { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js';
+import { $isBlockNode } from '../nodes/BlocksNode.js';
 import { FormSavePlugin } from './FormSavePlugin.js';
 // Recursively remove all undefined values from even being present in formData, as they will
 // cause isDeepEqual to return false if, for example, formData has a key that fields.data
@@ -36,12 +38,19 @@ export const BlockContent = props => {
     clientBlock,
     field,
     formSchema,
+    Label,
     nodeKey,
+    path,
     schemaPath
   } = props;
   let {
     formData
   } = props;
+  const {
+    fieldProps: {
+      permissions
+    }
+  } = useEditorConfigContext();
   const {
     i18n
   } = useTranslation();
@@ -50,21 +59,18 @@ export const BlockContent = props => {
   // Remember, these preferences are scoped to the whole document, not just this form. This
   // is important to consider for the data path used in setDocFieldPreferences
   const {
+    docPermissions,
     getDocPreferences,
     setDocFieldPreferences
   } = useDocumentInfo();
-  const [isCollapsed, setIsCollapsed] = React.useState(() => {
-    let initialState = false;
+  const [isCollapsed, setIsCollapsed] = React.useState();
+  useEffect(() => {
     void getDocPreferences().then(currentDocPreferences => {
       const currentFieldPreferences = currentDocPreferences?.fields[field.name];
       const collapsedArray = currentFieldPreferences?.collapsed;
-      if (collapsedArray && collapsedArray.includes(formData.id)) {
-        initialState = true;
-        setIsCollapsed(true);
-      }
+      setIsCollapsed(collapsedArray ? collapsedArray.includes(formData.id) : false);
     });
-    return initialState;
-  });
+  }, [field.name, formData.id, getDocPreferences]);
   const hasSubmitted = useFormSubmitted();
   const [errorCount, setErrorCount] = React.useState(0);
   const fieldHasErrors = hasSubmitted && errorCount > 0;
@@ -87,7 +93,7 @@ export const BlockContent = props => {
       setTimeout(() => {
         editor.update(() => {
           const node = $getNodeByKey(nodeKey);
-          if (node) {
+          if (node && $isBlockNode(node)) {
             formData = newFormData;
             node.setFields(newFormData);
           }
@@ -127,29 +133,26 @@ export const BlockContent = props => {
   }, [getDocPreferences, field.name, setDocFieldPreferences, formData.id]);
   const removeBlock = useCallback(() => {
     editor.update(() => {
-      $getNodeByKey(nodeKey).remove();
+      $getNodeByKey(nodeKey)?.remove();
     });
   }, [editor, nodeKey]);
+  if (typeof isCollapsed !== 'boolean') {
+    return null;
+  }
   return /*#__PURE__*/_jsxs(React.Fragment, {
     children: [/*#__PURE__*/_jsx(Collapsible, {
       className: classNames,
       collapsibleStyle: fieldHasErrors ? 'error' : 'default',
-      header: clientBlock?.admin?.components?.Label ? /*#__PURE__*/_jsx(RenderComponent, {
-        clientProps: {
-          blockKind: 'lexicalBlock',
-          formData
-        },
-        mappedComponent: clientBlock.admin.components.Label
-      }) : /*#__PURE__*/_jsxs("div", {
+      header: Label || /*#__PURE__*/_jsxs("div", {
         className: `${baseClass}__block-header`,
         children: [/*#__PURE__*/_jsxs("div", {
           children: [/*#__PURE__*/_jsx(Pill, {
             className: `${baseClass}__block-pill ${baseClass}__block-pill-${formData?.blockType}`,
             pillStyle: "white",
-            children: typeof clientBlock?.labels.singular === 'string' ? getTranslation(clientBlock?.labels.singular, i18n) : clientBlock.slug
+            children: typeof clientBlock?.labels?.singular === 'string' ? getTranslation(clientBlock?.labels.singular, i18n) : clientBlock.slug
           }), /*#__PURE__*/_jsx(SectionTitle, {
             path: "blockName",
-            readOnly: field?.admin?.readOnly
+            readOnly: field?.admin?.readOnly || false
           }), fieldHasErrors && /*#__PURE__*/_jsx(ErrorPill, {
             count: errorCount,
             i18n: i18n,
@@ -174,15 +177,12 @@ export const BlockContent = props => {
         setIsCollapsed(incomingCollapsedState);
       },
       children: /*#__PURE__*/_jsx(RenderFields, {
-        className: `${baseClass}__fields`,
         fields: formSchema,
         forceRender: true,
-        margins: "small",
-        path: "" // Leaving path empty makes it so field values are not prefixed / scoped by the entire schemaPath. e.g. we can access "myField" instead of "someLexicalField.feature.blocks.someArrayB" // TODO: Could there be any implications leaving path different than schemaPath?
-        ,
-
-        readOnly: false,
-        schemaPath: schemaPath
+        parentIndexPath: "",
+        parentPath: '',
+        parentSchemaPath: "",
+        permissions: permissions
       })
     }, 0), /*#__PURE__*/_jsx(FormSavePlugin, {
       onChange: onFormChange

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

@@ -1 +1 @@
-{"version":3,"file":"BlockContent.js","names":["useLexicalComposerContext","getTranslation","Button","Collapsible","ErrorPill","Pill","RenderComponent","RenderFields","SectionTitle","useDocumentInfo","useFormSubmitted","useTranslation","dequal","$getNodeByKey","React","useCallback","FormSavePlugin","removeUndefinedAndNullAndEmptyArraysRecursively","obj","key","value","Array","isArray","length","undefined","BlockContent","props","baseClass","clientBlock","field","formSchema","nodeKey","schemaPath","formData","i18n","editor","getDocPreferences","setDocFieldPreferences","isCollapsed","setIsCollapsed","useState","initialState","then","currentDocPreferences","currentFieldPreferences","fields","name","collapsedArray","collapsed","includes","id","hasSubmitted","errorCount","setErrorCount","fieldHasErrors","classNames","filter","Boolean","join","onFormChange","fullFieldsWithValues","newFormData","blockType","setTimeout","update","node","setFields","rowErrorCount","formField","Object","values","valid","onCollapsedChange","changedCollapsed","newCollapsed","push","splice","indexOf","hello","removeBlock","remove","_jsxs","Fragment","_jsx","className","collapsibleStyle","header","admin","components","Label","clientProps","blockKind","mappedComponent","pillStyle","labels","singular","slug","path","readOnly","count","withMessage","isEditable","buttonStyle","disabled","icon","onClick","e","preventDefault","round","tooltip","onToggle","incomingCollapsedState","forceRender","margins","onChange"],"sources":["../../../../../src/features/blocks/client/component/BlockContent.tsx"],"sourcesContent":["'use client'\nimport type { ClientBlock, ClientField, CollapsedPreferences, FormState } from 'payload'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n  Button,\n  Collapsible,\n  ErrorPill,\n  Pill,\n  RenderComponent,\n  RenderFields,\n  SectionTitle,\n  useDocumentInfo,\n  useFormSubmitted,\n  useTranslation,\n} from '@payloadcms/ui'\nimport { dequal } from 'dequal/lite'\nimport { $getNodeByKey } from 'lexical'\nimport React, { useCallback } from 'react'\n\nimport type { LexicalRichTextFieldProps } from '../../../../types.js'\nimport type { BlockFields } from '../../server/nodes/BlocksNode.js'\nimport type { BlockNode } from '../nodes/BlocksNode.js'\n\nimport { FormSavePlugin } from './FormSavePlugin.js'\n\ntype Props = {\n  baseClass: string\n  clientBlock: ClientBlock\n  field: LexicalRichTextFieldProps['field']\n  formData: BlockFields\n  formSchema: ClientField[]\n  nodeKey: string\n  path: string\n  schemaPath: string\n}\n\n// Recursively remove all undefined values from even being present in formData, as they will\n// cause isDeepEqual to return false if, for example, formData has a key that fields.data\n// does not have, even if it's undefined.\n// Currently, this happens if a block has another sub-blocks field. Inside formData, that sub-blocks field has an undefined blockName property.\n// Inside of fields.data however, that sub-blocks blockName property does not exist at all.\nfunction removeUndefinedAndNullAndEmptyArraysRecursively(obj: object) {\n  for (const key in obj) {\n    const value = obj[key]\n    if (Array.isArray(value) && !value?.length) {\n      delete obj[key]\n    } else if (value && typeof value === 'object') {\n      removeUndefinedAndNullAndEmptyArraysRecursively(value)\n    } else if (value === undefined || value === null) {\n      delete obj[key]\n    }\n  }\n}\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<Props> = (props) => {\n  const { baseClass, clientBlock, field, formSchema, nodeKey, schemaPath } = props\n  let { formData } = props\n\n  const { i18n } = useTranslation()\n  const [editor] = useLexicalComposerContext()\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\n  const [isCollapsed, setIsCollapsed] = React.useState<boolean>(() => {\n    let initialState = false\n\n    void getDocPreferences().then((currentDocPreferences) => {\n      const currentFieldPreferences = currentDocPreferences?.fields[field.name]\n\n      const collapsedArray = currentFieldPreferences?.collapsed\n\n      if (collapsedArray && collapsedArray.includes(formData.id)) {\n        initialState = true\n        setIsCollapsed(true)\n      }\n    })\n    return initialState\n  })\n\n  const hasSubmitted = useFormSubmitted()\n\n  const [errorCount, setErrorCount] = React.useState(0)\n\n  const fieldHasErrors = hasSubmitted && errorCount > 0\n\n  const classNames = [\n    `${baseClass}__row`,\n    fieldHasErrors ? `${baseClass}__row--has-errors` : `${baseClass}__row--no-errors`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  const onFormChange = useCallback(\n    ({\n      fullFieldsWithValues,\n      newFormData,\n    }: {\n      fullFieldsWithValues: FormState\n      newFormData: BlockFields\n    }) => {\n      newFormData.id = formData.id\n      newFormData.blockType = formData.blockType\n\n      removeUndefinedAndNullAndEmptyArraysRecursively(newFormData)\n      removeUndefinedAndNullAndEmptyArraysRecursively(formData)\n\n      // Only update if the data has actually changed. Otherwise, we may be triggering an unnecessary value change,\n      // which would trigger the \"Leave without saving\" dialog unnecessarily\n      if (!dequal(formData, newFormData)) {\n        // Running this in the next tick in the meantime fixes this issue: https://github.com/payloadcms/payload/issues/4108\n        // I don't know why. When this is called immediately, it might focus out of a nested lexical editor field if an update is made there.\n        // My hypothesis is that the nested editor might not have fully finished its update cycle yet. By updating in the next tick, we\n        // ensure that the nested editor has finished its update cycle before we update the block node.\n        setTimeout(() => {\n          editor.update(() => {\n            const node: BlockNode = $getNodeByKey(nodeKey)\n            if (node) {\n              formData = newFormData\n              node.setFields(newFormData)\n            }\n          })\n        }, 0)\n      }\n\n      // update error count\n      if (hasSubmitted) {\n        let rowErrorCount = 0\n        for (const formField of Object.values(fullFieldsWithValues)) {\n          if (formField?.valid === false) {\n            rowErrorCount++\n          }\n        }\n        setErrorCount(rowErrorCount)\n      }\n    },\n    [editor, nodeKey, hasSubmitted, formData],\n  )\n\n  const onCollapsedChange = useCallback(\n    (changedCollapsed: boolean) => {\n      void getDocPreferences().then((currentDocPreferences) => {\n        const currentFieldPreferences = currentDocPreferences?.fields[field.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(field.name, {\n          collapsed: newCollapsed,\n          hello: 'hi',\n        })\n      })\n    },\n    [getDocPreferences, field.name, setDocFieldPreferences, formData.id],\n  )\n\n  const removeBlock = useCallback(() => {\n    editor.update(() => {\n      $getNodeByKey(nodeKey).remove()\n    })\n  }, [editor, nodeKey])\n\n  return (\n    <React.Fragment>\n      <Collapsible\n        className={classNames}\n        collapsibleStyle={fieldHasErrors ? 'error' : 'default'}\n        header={\n          clientBlock?.admin?.components?.Label ? (\n            <RenderComponent\n              clientProps={{ blockKind: 'lexicalBlock', formData }}\n              mappedComponent={clientBlock.admin.components.Label}\n            />\n          ) : (\n            <div className={`${baseClass}__block-header`}>\n              <div>\n                <Pill\n                  className={`${baseClass}__block-pill ${baseClass}__block-pill-${formData?.blockType}`}\n                  pillStyle=\"white\"\n                >\n                  {typeof clientBlock?.labels.singular === 'string'\n                    ? getTranslation(clientBlock?.labels.singular, i18n)\n                    : clientBlock.slug}\n                </Pill>\n                <SectionTitle path=\"blockName\" readOnly={field?.admin?.readOnly} />\n                {fieldHasErrors && <ErrorPill count={errorCount} i18n={i18n} withMessage />}\n              </div>\n              {editor.isEditable() && (\n                <Button\n                  buttonStyle=\"icon-label\"\n                  className={`${baseClass}__removeButton`}\n                  disabled={field?.admin?.readOnly}\n                  icon=\"x\"\n                  onClick={(e) => {\n                    e.preventDefault()\n                    removeBlock()\n                  }}\n                  round\n                  tooltip=\"Remove Block\"\n                />\n              )}\n            </div>\n          )\n        }\n        isCollapsed={isCollapsed}\n        key={0}\n        onToggle={(incomingCollapsedState) => {\n          onCollapsedChange(incomingCollapsedState)\n          setIsCollapsed(incomingCollapsedState)\n        }}\n      >\n        <RenderFields\n          className={`${baseClass}__fields`}\n          fields={formSchema}\n          forceRender\n          margins=\"small\"\n          path=\"\" // Leaving path empty makes it so field values are not prefixed / scoped by the entire schemaPath. e.g. we can access \"myField\" instead of \"someLexicalField.feature.blocks.someArrayB\" // TODO: Could there be any implications leaving path different than schemaPath?\n          readOnly={false}\n          schemaPath={schemaPath} // Having the correct schemaPath here allows sub-fields (like array > addRow) to run correct form-state calls and retrieve their needed form state from the server\n        />\n      </Collapsible>\n\n      <FormSavePlugin onChange={onFormChange} />\n    </React.Fragment>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"BlockContent.js","names":["useLexicalComposerContext","getTranslation","Button","Collapsible","ErrorPill","Pill","RenderFields","SectionTitle","useDocumentInfo","useFormSubmitted","useTranslation","dequal","$getNodeByKey","React","useCallback","useEffect","useEditorConfigContext","$isBlockNode","FormSavePlugin","removeUndefinedAndNullAndEmptyArraysRecursively","obj","key","value","Array","isArray","length","undefined","BlockContent","props","baseClass","clientBlock","field","formSchema","Label","nodeKey","path","schemaPath","formData","fieldProps","permissions","i18n","editor","docPermissions","getDocPreferences","setDocFieldPreferences","isCollapsed","setIsCollapsed","useState","then","currentDocPreferences","currentFieldPreferences","fields","name","collapsedArray","collapsed","includes","id","hasSubmitted","errorCount","setErrorCount","fieldHasErrors","classNames","filter","Boolean","join","onFormChange","fullFieldsWithValues","newFormData","blockType","setTimeout","update","node","setFields","rowErrorCount","formField","Object","values","valid","onCollapsedChange","changedCollapsed","newCollapsed","push","splice","indexOf","hello","removeBlock","remove","_jsxs","Fragment","_jsx","className","collapsibleStyle","header","pillStyle","labels","singular","slug","readOnly","admin","count","withMessage","isEditable","buttonStyle","disabled","icon","onClick","e","preventDefault","round","tooltip","onToggle","incomingCollapsedState","forceRender","parentIndexPath","parentPath","parentSchemaPath","onChange"],"sources":["../../../../../src/features/blocks/client/component/BlockContent.tsx"],"sourcesContent":["'use client'\nimport type { ClientBlock, ClientField, CollapsedPreferences, FormState } from 'payload'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n  Button,\n  Collapsible,\n  ErrorPill,\n  Pill,\n  RenderFields,\n  SectionTitle,\n  useDocumentInfo,\n  useFormSubmitted,\n  useTranslation,\n} from '@payloadcms/ui'\nimport { dequal } from 'dequal/lite'\nimport { $getNodeByKey } from 'lexical'\nimport React, { useCallback, useEffect } from 'react'\n\nimport type { LexicalRichTextFieldProps } from '../../../../types.js'\nimport type { BlockFields } from '../../server/nodes/BlocksNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { $isBlockNode } from '../nodes/BlocksNode.js'\nimport { FormSavePlugin } from './FormSavePlugin.js'\n\ntype Props = {\n  baseClass: string\n  clientBlock: ClientBlock\n  field: LexicalRichTextFieldProps['field']\n  formData: BlockFields\n  formSchema: ClientField[]\n  Label?: React.ReactNode\n  nodeKey: string\n  path: string\n  schemaPath: string\n}\n\n// Recursively remove all undefined values from even being present in formData, as they will\n// cause isDeepEqual to return false if, for example, formData has a key that fields.data\n// does not have, even if it's undefined.\n// Currently, this happens if a block has another sub-blocks field. Inside formData, that sub-blocks field has an undefined blockName property.\n// Inside of fields.data however, that sub-blocks blockName property does not exist at all.\nfunction removeUndefinedAndNullAndEmptyArraysRecursively(obj: object) {\n  for (const key in obj) {\n    const value = obj[key]\n    if (Array.isArray(value) && !value?.length) {\n      delete obj[key]\n    } else if (value && typeof value === 'object') {\n      removeUndefinedAndNullAndEmptyArraysRecursively(value)\n    } else if (value === undefined || value === null) {\n      delete obj[key]\n    }\n  }\n}\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<Props> = (props) => {\n  const { baseClass, clientBlock, field, formSchema, Label, nodeKey, path, schemaPath } = props\n  let { formData } = props\n  const {\n    fieldProps: { permissions },\n  } = useEditorConfigContext()\n\n  const { i18n } = useTranslation()\n  const [editor] = useLexicalComposerContext()\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 { docPermissions, getDocPreferences, setDocFieldPreferences } = useDocumentInfo()\n\n  const [isCollapsed, setIsCollapsed] = React.useState<boolean>()\n\n  useEffect(() => {\n    void getDocPreferences().then((currentDocPreferences) => {\n      const currentFieldPreferences = currentDocPreferences?.fields[field.name]\n      const collapsedArray = currentFieldPreferences?.collapsed\n      setIsCollapsed(collapsedArray ? collapsedArray.includes(formData.id) : false)\n    })\n  }, [field.name, formData.id, getDocPreferences])\n\n  const hasSubmitted = useFormSubmitted()\n\n  const [errorCount, setErrorCount] = React.useState(0)\n\n  const fieldHasErrors = hasSubmitted && errorCount > 0\n\n  const classNames = [\n    `${baseClass}__row`,\n    fieldHasErrors ? `${baseClass}__row--has-errors` : `${baseClass}__row--no-errors`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  const onFormChange = useCallback(\n    ({\n      fullFieldsWithValues,\n      newFormData,\n    }: {\n      fullFieldsWithValues: FormState\n      newFormData: BlockFields\n    }) => {\n      newFormData.id = formData.id\n      newFormData.blockType = formData.blockType\n\n      removeUndefinedAndNullAndEmptyArraysRecursively(newFormData)\n      removeUndefinedAndNullAndEmptyArraysRecursively(formData)\n\n      // Only update if the data has actually changed. Otherwise, we may be triggering an unnecessary value change,\n      // which would trigger the \"Leave without saving\" dialog unnecessarily\n      if (!dequal(formData, newFormData)) {\n        // Running this in the next tick in the meantime fixes this issue: https://github.com/payloadcms/payload/issues/4108\n        // I don't know why. When this is called immediately, it might focus out of a nested lexical editor field if an update is made there.\n        // My hypothesis is that the nested editor might not have fully finished its update cycle yet. By updating in the next tick, we\n        // ensure that the nested editor has finished its update cycle before we update the block node.\n        setTimeout(() => {\n          editor.update(() => {\n            const node = $getNodeByKey(nodeKey)\n            if (node && $isBlockNode(node)) {\n              formData = newFormData\n              node.setFields(newFormData)\n            }\n          })\n        }, 0)\n      }\n\n      // update error count\n      if (hasSubmitted) {\n        let rowErrorCount = 0\n        for (const formField of Object.values(fullFieldsWithValues)) {\n          if (formField?.valid === false) {\n            rowErrorCount++\n          }\n        }\n        setErrorCount(rowErrorCount)\n      }\n    },\n    [editor, nodeKey, hasSubmitted, formData],\n  )\n\n  const onCollapsedChange = useCallback(\n    (changedCollapsed: boolean) => {\n      void getDocPreferences().then((currentDocPreferences) => {\n        const currentFieldPreferences = currentDocPreferences?.fields[field.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(field.name, {\n          collapsed: newCollapsed,\n          hello: 'hi',\n        })\n      })\n    },\n    [getDocPreferences, field.name, setDocFieldPreferences, formData.id],\n  )\n\n  const removeBlock = useCallback(() => {\n    editor.update(() => {\n      $getNodeByKey(nodeKey)?.remove()\n    })\n  }, [editor, nodeKey])\n\n  if (typeof isCollapsed !== 'boolean') {\n    return null\n  }\n\n  return (\n    <React.Fragment>\n      <Collapsible\n        className={classNames}\n        collapsibleStyle={fieldHasErrors ? 'error' : 'default'}\n        header={\n          Label || (\n            <div className={`${baseClass}__block-header`}>\n              <div>\n                <Pill\n                  className={`${baseClass}__block-pill ${baseClass}__block-pill-${formData?.blockType}`}\n                  pillStyle=\"white\"\n                >\n                  {typeof clientBlock?.labels?.singular === 'string'\n                    ? getTranslation(clientBlock?.labels.singular, i18n)\n                    : clientBlock.slug}\n                </Pill>\n                <SectionTitle path=\"blockName\" readOnly={field?.admin?.readOnly || false} />\n                {fieldHasErrors && <ErrorPill count={errorCount} i18n={i18n} withMessage />}\n              </div>\n              {editor.isEditable() && (\n                <Button\n                  buttonStyle=\"icon-label\"\n                  className={`${baseClass}__removeButton`}\n                  disabled={field?.admin?.readOnly}\n                  icon=\"x\"\n                  onClick={(e) => {\n                    e.preventDefault()\n                    removeBlock()\n                  }}\n                  round\n                  tooltip=\"Remove Block\"\n                />\n              )}\n            </div>\n          )\n        }\n        isCollapsed={isCollapsed}\n        key={0}\n        onToggle={(incomingCollapsedState) => {\n          onCollapsedChange(incomingCollapsedState)\n          setIsCollapsed(incomingCollapsedState)\n        }}\n      >\n        <RenderFields\n          fields={formSchema}\n          forceRender={true}\n          parentIndexPath=\"\"\n          parentPath={''}\n          parentSchemaPath=\"\"\n          permissions={permissions} // TODO: Pass field permissions\n        />\n      </Collapsible>\n\n      <FormSavePlugin onChange={onFormChange} />\n    </React.Fragment>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -4,7 +4,7 @@ import './index.scss';
 type Props = {
     readonly children?: React.ReactNode;
     readonly formData: BlockFields;
-    readonly nodeKey?: string;
+    readonly nodeKey: string;
 };
 export declare const BlockComponent: React.FC<Props>;
 export {};

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":"AAiBA,OAAO,KAAoD,MAAM,OAAO,CAAA;AASxE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAInE,OAAO,cAAc,CAAA;AAErB,KAAK,KAAK,GAAG;IACX,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACnC,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAA;IAC9B,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAA;CAC1B,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAsJ1C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/component/index.tsx"],"names":[],"mappings":"AAaA,OAAO,KAA4D,MAAM,OAAO,CAAA;AAOhF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA;AAInE,OAAO,cAAc,CAAA;AAErB,KAAK,KAAK,GAAG;IACX,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACnC,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAA;IAC9B,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAwN1C,CAAA"}

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

@@ -1,11 +1,10 @@
 'use client';
 
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Collapsible, Form, Pill, RenderComponent, SectionTitle, ShimmerEffect, useConfig, useDocumentInfo, useFieldProps, useFormSubmitted, useTranslation } from '@payloadcms/ui';
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import { Collapsible, Form, Pill, SectionTitle, ShimmerEffect, useDocumentInfo, useFormSubmitted, useServerFunctions, useTranslation } from '@payloadcms/ui';
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 const baseClass = 'lexical-block';
 import { getTranslation } from '@payloadcms/translations';
-import { getFormState } from '@payloadcms/ui/shared';
 import { v4 as uuid } from 'uuid';
 import { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js';
 import { BlockContent } from './BlockContent.js';
@@ -14,42 +13,55 @@ export const BlockComponent = props => {
     formData,
     nodeKey
   } = props;
-  const {
-    config
-  } = useConfig();
   const submitted = useFormSubmitted();
   const {
-    id
+    id,
+    collectionSlug,
+    globalSlug
   } = useDocumentInfo();
   const {
-    path,
-    schemaPath
-  } = useFieldProps();
-  const {
-    field: parentLexicalRichTextField
+    fieldProps: {
+      featureClientSchemaMap,
+      field: parentLexicalRichTextField,
+      path,
+      schemaPath
+    }
   } = useEditorConfigContext();
+  const abortControllerRef = useRef(new AbortController());
+  const {
+    docPermissions,
+    getDocPreferences
+  } = useDocumentInfo();
+  const {
+    getFormState
+  } = useServerFunctions();
   const [initialState, setInitialState] = useState(false);
+  const schemaFieldsPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.${formData.blockType}.fields`;
+  const componentMapRenderedBlockPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.${formData.blockType}`;
+  const clientSchemaMap = featureClientSchemaMap['blocks'];
+  const blocksField = clientSchemaMap[componentMapRenderedBlockPath][0];
+  const clientBlock = blocksField.blocks[0];
   const {
-    field: {
-      richTextComponentMap
-    }
-  } = useEditorConfigContext();
-  const schemaFieldsPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_blocks.lexical_blocks.${formData.blockType}`;
-  const componentMapRenderedBlockPath = `lexical_internal_feature.blocks.fields.lexical_blocks`;
-  const blocksField = richTextComponentMap.get(componentMapRenderedBlockPath)[0];
-  const clientBlock = blocksField.blocks.find(block => block.slug === formData.blockType);
+    i18n
+  } = useTranslation();
   // Field Schema
   useEffect(() => {
+    const abortController = new AbortController();
     const awaitInitialState = async () => {
-      const state = await getFormState({
-        apiRoute: config.routes.api,
-        body: {
-          id,
-          data: formData,
-          operation: 'update',
-          schemaPath: schemaFieldsPath
-        },
-        serverURL: config.serverURL
+      const {
+        state
+      } = await getFormState({
+        id,
+        collectionSlug,
+        data: formData,
+        docPermissions,
+        docPreferences: await getDocPreferences(),
+        doNotAbort: true,
+        globalSlug,
+        operation: 'update',
+        renderAllFields: true,
+        schemaPath: schemaFieldsPath,
+        signal: abortController.signal
       });
       if (state) {
         state.blockName = {
@@ -64,33 +76,65 @@ export const BlockComponent = props => {
     if (formData) {
       void awaitInitialState();
     }
-  }, [config.routes.api, config.serverURL, schemaFieldsPath, id]) // DO NOT ADD FORMDATA HERE! Adding formData will kick you out of sub block editors while writing.
+    return () => {
+      try {
+        abortController.abort();
+      } catch (_err) {
+        // swallow error
+      }
+    };
+  }, [getFormState, schemaFieldsPath, id, collectionSlug, globalSlug, getDocPreferences, docPermissions]) // DO NOT ADD FORMDATA HERE! Adding formData will kick you out of sub block editors while writing.
   ;
   const onChange = useCallback(async ({
     formState: prevFormState
   }) => {
-    const formState = await getFormState({
-      apiRoute: config.routes.api,
-      body: {
-        id,
-        formState: prevFormState,
-        operation: 'update',
-        schemaPath: schemaFieldsPath
-      },
-      serverURL: config.serverURL
+    if (abortControllerRef.current) {
+      try {
+        abortControllerRef.current.abort();
+      } catch (_err_0) {
+        // swallow error
+      }
+    }
+    const abortController_0 = new AbortController();
+    abortControllerRef.current = abortController_0;
+    const {
+      state: newFormState
+    } = await getFormState({
+      id,
+      collectionSlug,
+      docPermissions,
+      docPreferences: await getDocPreferences(),
+      doNotAbort: true,
+      formState: prevFormState,
+      globalSlug,
+      operation: 'update',
+      schemaPath: schemaFieldsPath,
+      signal: abortController_0.signal
     });
-    formState.blockName = {
+    if (!newFormState) {
+      return prevFormState;
+    }
+    newFormState.blockName = {
       initialValue: '',
       passesCondition: true,
       valid: true,
       value: formData.blockName
     };
-    return formState;
-  }, [config.routes.api, config.serverURL, id, schemaFieldsPath, formData.blockName]);
-  const {
-    i18n
-  } = useTranslation();
+    return newFormState;
+  }, [getFormState, id, collectionSlug, docPermissions, getDocPreferences, globalSlug, schemaFieldsPath, formData.blockName]);
+  // cleanup effect
+  useEffect(() => {
+    const abortController_1 = abortControllerRef.current;
+    return () => {
+      try {
+        abortController_1.abort();
+      } catch (_err_1) {
+        // swallow error
+      }
+    };
+  }, []);
   const classNames = [`${baseClass}__row`, `${baseClass}__row--no-errors`].filter(Boolean).join(' ');
+  const Label = clientBlock?.admin?.components?.Label;
   // Memoized Form JSX
   const formContent = useMemo(() => {
     return clientBlock && initialState !== false ? /*#__PURE__*/_jsx(Form, {
@@ -113,22 +157,16 @@ export const BlockComponent = props => {
     }) : /*#__PURE__*/_jsx(Collapsible, {
       className: classNames,
       collapsibleStyle: "default",
-      header: clientBlock?.admin?.components?.Label ? /*#__PURE__*/_jsx(RenderComponent, {
-        clientProps: {
-          blockKind: 'lexicalBlock',
-          formData
-        },
-        mappedComponent: clientBlock.admin.components.Label
-      }) : /*#__PURE__*/_jsx("div", {
+      header: clientBlock?.admin?.components?.Label ? Label : /*#__PURE__*/_jsx("div", {
         className: `${baseClass}__block-header`,
         children: /*#__PURE__*/_jsxs("div", {
           children: [/*#__PURE__*/_jsx(Pill, {
             className: `${baseClass}__block-pill ${baseClass}__block-pill-${formData?.blockType}`,
             pillStyle: "white",
-            children: clientBlock && typeof clientBlock.labels.singular === 'string' ? getTranslation(clientBlock.labels.singular, i18n) : clientBlock.slug
+            children: clientBlock && typeof clientBlock.labels?.singular === 'string' ? getTranslation(clientBlock.labels.singular, i18n) : clientBlock?.slug
           }), /*#__PURE__*/_jsx(SectionTitle, {
             path: "blockName",
-            readOnly: parentLexicalRichTextField?.admin?.readOnly
+            readOnly: parentLexicalRichTextField?.admin?.readOnly || false
           })]
         })
       }),
@@ -136,7 +174,8 @@ export const BlockComponent = props => {
         height: "35vh"
       })
     }, 0);
-  }, [clientBlock, initialState, onChange, submitted, parentLexicalRichTextField, nodeKey, path, schemaFieldsPath, classNames, i18n]);
+  }, [clientBlock, initialState, onChange, submitted, parentLexicalRichTextField, nodeKey, path, schemaFieldsPath, classNames, i18n]) // DO NOT ADD FORMDATA HERE! Adding formData will kick you out of sub block editors while writing.
+  ;
   return /*#__PURE__*/_jsx("div", {
     className: baseClass + ' ' + baseClass + '-' + formData.blockType,
     children: formContent