@payloadcms/richtext-lexical 3.68.0-internal-debug.e9b66ee → 3.68.0-internal-debug.654e4ad

package/dist/field/Diff/converters/unknown/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/field/Diff/converters/unknown/index.tsx"],"sourcesContent":["import type { LexicalNode } from 'lexical'\nimport type { PayloadRequest } from 'payload'\n\nimport { type I18nClient } from '@payloadcms/translations'\n\nimport './index.scss'\n\nimport { createHash } from 'crypto'\n\nimport type { HTMLConvertersAsync } from '../../../../features/converters/lexicalToHtml/async/types.js'\nimport type { SerializedBlockNode } from '../../../../nodeTypes.js'\n\nconst baseClass = 'lexical-unknown-diff'\n\nexport const UnknownDiffHTMLConverterAsync: (args: {\n  i18n: I18nClient\n  req: PayloadRequest\n}) => HTMLConvertersAsync<LexicalNode> = ({ i18n, req }) => {\n  return {\n    unknown: async ({ node, providedCSSString }) => {\n      const ReactDOMServer = (await import('react-dom/server')).default\n\n      // hash fields to ensure they are diffed if they change\n      const nodeFieldsHash = createHash('sha256')\n        .update(JSON.stringify(node ?? {}))\n        .digest('hex')\n\n      let nodeType = node.type\n\n      let nodeTypeSpecifier: null | string = null\n\n      if (node.type === 'block') {\n        nodeTypeSpecifier = (node as SerializedBlockNode).fields.blockType\n        nodeType = 'Block'\n      } else if (node.type === 'inlineBlock') {\n        nodeTypeSpecifier = (node as SerializedBlockNode).fields.blockType\n        nodeType = 'InlineBlock'\n      }\n\n      const JSX = (\n        <div\n          className={`${baseClass}${providedCSSString}`}\n          data-enable-match=\"true\"\n          data-fields-hash={`${nodeFieldsHash}`}\n        >\n          {nodeTypeSpecifier && (\n            <span className={`${baseClass}__specifier`}>{nodeTypeSpecifier}&nbsp;</span>\n          )}\n          <span>{nodeType}</span>\n          <div className={`${baseClass}__meta`}>\n            <br />\n          </div>\n        </div>\n      )\n\n      // Render to HTML\n      const html = ReactDOMServer.renderToStaticMarkup(JSX)\n\n      return html\n    },\n  }\n}\n"],"names":["createHash","baseClass","UnknownDiffHTMLConverterAsync","i18n","req","unknown","node","providedCSSString","ReactDOMServer","default","nodeFieldsHash","update","JSON","stringify","digest","nodeType","type","nodeTypeSpecifier","fields","blockType","JSX","div","className","data-enable-match","data-fields-hash","span","br","html","renderToStaticMarkup"],"mappings":"AAKA,OAAO,eAAc;AAErB,SAASA,UAAU,QAAQ,SAAQ;AAKnC,MAAMC,YAAY;AAElB,OAAO,MAAMC,gCAG4B,CAAC,EAAEC,IAAI,EAAEC,GAAG,EAAE;IACrD,OAAO;QACLC,SAAS,OAAO,EAAEC,IAAI,EAAEC,iBAAiB,EAAE;YACzC,MAAMC,iBAAiB,AAAC,CAAA,MAAM,MAAM,CAAC,mBAAkB,EAAGC,OAAO;YAEjE,uDAAuD;YACvD,MAAMC,iBAAiBV,WAAW,UAC/BW,MAAM,CAACC,KAAKC,SAAS,CAACP,QAAQ,CAAC,IAC/BQ,MAAM,CAAC;YAEV,IAAIC,WAAWT,KAAKU,IAAI;YAExB,IAAIC,oBAAmC;YAEvC,IAAIX,KAAKU,IAAI,KAAK,SAAS;gBACzBC,oBAAoB,AAACX,KAA6BY,MAAM,CAACC,SAAS;gBAClEJ,WAAW;YACb,OAAO,IAAIT,KAAKU,IAAI,KAAK,eAAe;gBACtCC,oBAAoB,AAACX,KAA6BY,MAAM,CAACC,SAAS;gBAClEJ,WAAW;YACb;YAEA,MAAMK,OACHC,IACCC,WAAW,GAAGrB,YAAYM,mBAAmB,EAC7CgB,kBAAkB,OAClBC,kBAAkB,GAAGd,gBAAgB,EACtC;UACC,CAACO,sBACEQ,KAAKH,WAAW,GAAGrB,UAAU,WAAW,CAAC,GAAGgB,kBAAkB,MAAM,EAAEQ,MACvE;UACF,CAACA,MAAMV,WAAWU,KAAK;UACvB,CAACJ,IAAIC,WAAW,GAAGrB,UAAU,MAAM,CAAC,EAAE;YACpC,CAACyB,IAAK;UACR,EAAEL,IAAI;QACR,EAAEA;YAGJ,iBAAiB;YACjB,MAAMM,OAAOnB,eAAeoB,oBAAoB,CAACR;YAEjD,OAAOO;QACT;IACF;AACF,EAAC"}
+{"version":3,"sources":["../../../../../src/field/Diff/converters/unknown/index.tsx"],"sourcesContent":["import type { LexicalNode } from 'lexical'\nimport type { PayloadRequest } from 'payload'\n\nimport { type I18nClient } from '@payloadcms/translations'\n\nimport './index.scss'\n\nimport { createHash } from 'crypto'\n\nimport type { HTMLConvertersAsync } from '../../../../features/converters/lexicalToHtml/async/types.js'\nimport type { SerializedBlockNode } from '../../../../nodeTypes.js'\n\nconst baseClass = 'lexical-unknown-diff'\n\nexport const UnknownDiffHTMLConverterAsync: (args: {\n  i18n: I18nClient\n  req: PayloadRequest\n}) => HTMLConvertersAsync<LexicalNode> = ({ i18n, req }) => {\n  return {\n    unknown: async ({ node, providedCSSString }) => {\n      const ReactDOMServer = (await import('react-dom/server')).default\n\n      // hash fields to ensure they are diffed if they change\n      const nodeFieldsHash = createHash('sha256')\n        .update(JSON.stringify(node ?? {}))\n        .digest('hex')\n\n      let nodeType = node.type\n\n      let nodeTypeSpecifier: null | string = null\n\n      if (node.type === 'block') {\n        nodeTypeSpecifier = (node as SerializedBlockNode).fields.blockType\n        nodeType = 'Block'\n      } else if (node.type === 'inlineBlock') {\n        nodeTypeSpecifier = (node as SerializedBlockNode).fields.blockType\n        nodeType = 'InlineBlock'\n      }\n\n      const JSX = (\n        <div\n          className={`${baseClass}${providedCSSString}`}\n          data-enable-match=\"true\"\n          data-fields-hash={`${nodeFieldsHash}`}\n        >\n          {nodeTypeSpecifier && (\n            <span className={`${baseClass}__specifier`}>{nodeTypeSpecifier}&nbsp;</span>\n          )}\n          <span>{nodeType}</span>\n          <div className={`${baseClass}__meta`}>\n            <br />\n          </div>\n        </div>\n      )\n\n      // Render to HTML\n      const html = ReactDOMServer.renderToStaticMarkup(JSX)\n\n      return html\n    },\n  }\n}\n"],"names":["createHash","baseClass","UnknownDiffHTMLConverterAsync","i18n","req","unknown","node","providedCSSString","ReactDOMServer","default","nodeFieldsHash","update","JSON","stringify","digest","nodeType","type","nodeTypeSpecifier","fields","blockType","JSX","div","className","data-enable-match","data-fields-hash","span","br","html","renderToStaticMarkup"],"mappings":";AAKA,OAAO,eAAc;AAErB,SAASA,UAAU,QAAQ,SAAQ;AAKnC,MAAMC,YAAY;AAElB,OAAO,MAAMC,gCAG4B,CAAC,EAAEC,IAAI,EAAEC,GAAG,EAAE;IACrD,OAAO;QACLC,SAAS,OAAO,EAAEC,IAAI,EAAEC,iBAAiB,EAAE;YACzC,MAAMC,iBAAiB,AAAC,CAAA,MAAM,MAAM,CAAC,mBAAkB,EAAGC,OAAO;YAEjE,uDAAuD;YACvD,MAAMC,iBAAiBV,WAAW,UAC/BW,MAAM,CAACC,KAAKC,SAAS,CAACP,QAAQ,CAAC,IAC/BQ,MAAM,CAAC;YAEV,IAAIC,WAAWT,KAAKU,IAAI;YAExB,IAAIC,oBAAmC;YAEvC,IAAIX,KAAKU,IAAI,KAAK,SAAS;gBACzBC,oBAAoB,AAACX,KAA6BY,MAAM,CAACC,SAAS;gBAClEJ,WAAW;YACb,OAAO,IAAIT,KAAKU,IAAI,KAAK,eAAe;gBACtCC,oBAAoB,AAACX,KAA6BY,MAAM,CAACC,SAAS;gBAClEJ,WAAW;YACb;YAEA,MAAMK,oBACJ,QAACC;gBACCC,WAAW,GAAGrB,YAAYM,mBAAmB;gBAC7CgB,qBAAkB;gBAClBC,oBAAkB,GAAGd,gBAAgB;;oBAEpCO,mCACC,QAACQ;wBAAKH,WAAW,GAAGrB,UAAU,WAAW,CAAC;;4BAAGgB;4BAAkB;;;;;;;kCAEjE,QAACQ;kCAAMV;;;;;;kCACP,QAACM;wBAAIC,WAAW,GAAGrB,UAAU,MAAM,CAAC;kCAClC,cAAA,QAACyB;;;;;;;;;;;;;;;;YAKP,iBAAiB;YACjB,MAAMC,OAAOnB,eAAeoB,oBAAoB,CAACR;YAEjD,OAAOO;QACT;IACF;AACF,EAAC"}

package/dist/field/Diff/converters/upload/index.js

@@ -1,3 +1,4 @@
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { File } from '@payloadcms/ui/rsc';
 import { createHash } from 'crypto';
 import './index.scss';
@@ -29,27 +30,96 @@ export const UploadDiffHTMLConverterAsync = ({ i18n, req })=>{
             const ReactDOMServer = (await import('react-dom/server')).default;
             // hash fields to ensure they are diffed if they change
             const nodeFieldsHash = createHash('sha256').update(JSON.stringify(node.fields ?? {})).digest('hex');
-            const JSX = <div className={`${baseClass}${providedCSSString}`} data-enable-match="true" data-fields-hash={`${nodeFieldsHash}`} data-filename={uploadDoc?.filename} data-lexical-upload-id={uploadNode.value} data-lexical-upload-relation-to={uploadNode.relationTo} data-src={thumbnailSRC}>
-          <div className={`${baseClass}__card`}>
-            <div className={`${baseClass}__thumbnail`}>
-              {thumbnailSRC?.length ? <img alt={uploadDoc?.filename} src={thumbnailSRC}/> : <File/>}
-            </div>
-            <div className={`${baseClass}__info`} data-enable-match="false">
-              <strong>{uploadDoc?.filename}</strong>
-              <div className={`${baseClass}__meta`}>
-                {formatFilesize(uploadDoc?.filesize)}
-                {typeof uploadDoc?.width === 'number' && typeof uploadDoc?.height === 'number' && <React.Fragment>
-                    &nbsp;-&nbsp;
-                    {uploadDoc?.width}x{uploadDoc?.height}
-                  </React.Fragment>}
-                {uploadDoc?.mimeType && <React.Fragment>
-                    &nbsp;-&nbsp;
-                    {uploadDoc?.mimeType}
-                  </React.Fragment>}
-              </div>
-            </div>
-          </div>
-        </div>;
+            const JSX = /*#__PURE__*/ _jsxDEV("div", {
+                className: `${baseClass}${providedCSSString}`,
+                "data-enable-match": "true",
+                "data-fields-hash": `${nodeFieldsHash}`,
+                "data-filename": uploadDoc?.filename,
+                "data-lexical-upload-id": uploadNode.value,
+                "data-lexical-upload-relation-to": uploadNode.relationTo,
+                "data-src": thumbnailSRC,
+                children: /*#__PURE__*/ _jsxDEV("div", {
+                    className: `${baseClass}__card`,
+                    children: [
+                        /*#__PURE__*/ _jsxDEV("div", {
+                            className: `${baseClass}__thumbnail`,
+                            children: thumbnailSRC?.length ? /*#__PURE__*/ _jsxDEV("img", {
+                                alt: uploadDoc?.filename,
+                                src: thumbnailSRC
+                            }, void 0, false, {
+                                fileName: "src/field/Diff/converters/upload/index.tsx",
+                                lineNumber: 70,
+                                columnNumber: 17
+                            }, this) : /*#__PURE__*/ _jsxDEV(File, {}, void 0, false, {
+                                fileName: "src/field/Diff/converters/upload/index.tsx",
+                                lineNumber: 72,
+                                columnNumber: 17
+                            }, this)
+                        }, void 0, false, {
+                            fileName: "src/field/Diff/converters/upload/index.tsx",
+                            lineNumber: 68,
+                            columnNumber: 13
+                        }, this),
+                        /*#__PURE__*/ _jsxDEV("div", {
+                            className: `${baseClass}__info`,
+                            "data-enable-match": "false",
+                            children: [
+                                /*#__PURE__*/ _jsxDEV("strong", {
+                                    children: uploadDoc?.filename
+                                }, void 0, false, {
+                                    fileName: "src/field/Diff/converters/upload/index.tsx",
+                                    lineNumber: 76,
+                                    columnNumber: 15
+                                }, this),
+                                /*#__PURE__*/ _jsxDEV("div", {
+                                    className: `${baseClass}__meta`,
+                                    children: [
+                                        formatFilesize(uploadDoc?.filesize),
+                                        typeof uploadDoc?.width === 'number' && typeof uploadDoc?.height === 'number' && /*#__PURE__*/ _jsxDEV(React.Fragment, {
+                                            children: [
+                                                " - ",
+                                                uploadDoc?.width,
+                                                "x",
+                                                uploadDoc?.height
+                                            ]
+                                        }, void 0, true, {
+                                            fileName: "src/field/Diff/converters/upload/index.tsx",
+                                            lineNumber: 80,
+                                            columnNumber: 19
+                                        }, this),
+                                        uploadDoc?.mimeType && /*#__PURE__*/ _jsxDEV(React.Fragment, {
+                                            children: [
+                                                " - ",
+                                                uploadDoc?.mimeType
+                                            ]
+                                        }, void 0, true, {
+                                            fileName: "src/field/Diff/converters/upload/index.tsx",
+                                            lineNumber: 86,
+                                            columnNumber: 19
+                                        }, this)
+                                    ]
+                                }, void 0, true, {
+                                    fileName: "src/field/Diff/converters/upload/index.tsx",
+                                    lineNumber: 77,
+                                    columnNumber: 15
+                                }, this)
+                            ]
+                        }, void 0, true, {
+                            fileName: "src/field/Diff/converters/upload/index.tsx",
+                            lineNumber: 75,
+                            columnNumber: 13
+                        }, this)
+                    ]
+                }, void 0, true, {
+                    fileName: "src/field/Diff/converters/upload/index.tsx",
+                    lineNumber: 67,
+                    columnNumber: 11
+                }, this)
+            }, void 0, false, {
+                fileName: "src/field/Diff/converters/upload/index.tsx",
+                lineNumber: 58,
+                columnNumber: 9
+            }, this);
             // Render to HTML
             const html = ReactDOMServer.renderToStaticMarkup(JSX);
             return html;

package/dist/field/Diff/converters/upload/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/field/Diff/converters/upload/index.tsx"],"sourcesContent":["import type { FileData, PayloadRequest, TypeWithID } from 'payload'\n\nimport { type I18nClient } from '@payloadcms/translations'\nimport { File } from '@payloadcms/ui/rsc'\nimport { createHash } from 'crypto'\n\nimport './index.scss'\n\nimport { formatFilesize } from 'payload/shared'\nimport React from 'react'\n\nimport type { HTMLConvertersAsync } from '../../../../features/converters/lexicalToHtml/async/types.js'\nimport type { UploadDataImproved } from '../../../../features/upload/server/nodes/UploadNode.js'\nimport type { SerializedUploadNode } from '../../../../nodeTypes.js'\n\nconst baseClass = 'lexical-upload-diff'\n\nexport const UploadDiffHTMLConverterAsync: (args: {\n  i18n: I18nClient\n  req: PayloadRequest\n}) => HTMLConvertersAsync<SerializedUploadNode> = ({ i18n, req }) => {\n  return {\n    upload: async ({ node, populate, providedCSSString }) => {\n      const uploadNode = node as UploadDataImproved\n\n      let uploadDoc: (FileData & TypeWithID) | undefined = undefined\n\n      // If there's no valid upload data, populate return an empty string\n      if (typeof uploadNode.value !== 'object') {\n        if (!populate) {\n          return ''\n        }\n        uploadDoc = await populate<FileData & TypeWithID>({\n          id: uploadNode.value,\n          collectionSlug: uploadNode.relationTo,\n        })\n      } else {\n        uploadDoc = uploadNode.value as unknown as FileData & TypeWithID\n      }\n\n      if (!uploadDoc) {\n        return ''\n      }\n\n      const relatedCollection = req.payload.collections[uploadNode.relationTo]?.config\n\n      const thumbnailSRC: string =\n        ('thumbnailURL' in uploadDoc && (uploadDoc?.thumbnailURL as string)) || uploadDoc?.url || ''\n\n      const ReactDOMServer = (await import('react-dom/server')).default\n\n      // hash fields to ensure they are diffed if they change\n      const nodeFieldsHash = createHash('sha256')\n        .update(JSON.stringify(node.fields ?? {}))\n        .digest('hex')\n\n      const JSX = (\n        <div\n          className={`${baseClass}${providedCSSString}`}\n          data-enable-match=\"true\"\n          data-fields-hash={`${nodeFieldsHash}`}\n          data-filename={uploadDoc?.filename}\n          data-lexical-upload-id={uploadNode.value}\n          data-lexical-upload-relation-to={uploadNode.relationTo}\n          data-src={thumbnailSRC}\n        >\n          <div className={`${baseClass}__card`}>\n            <div className={`${baseClass}__thumbnail`}>\n              {thumbnailSRC?.length ? (\n                <img alt={uploadDoc?.filename} src={thumbnailSRC} />\n              ) : (\n                <File />\n              )}\n            </div>\n            <div className={`${baseClass}__info`} data-enable-match=\"false\">\n              <strong>{uploadDoc?.filename}</strong>\n              <div className={`${baseClass}__meta`}>\n                {formatFilesize(uploadDoc?.filesize)}\n                {typeof uploadDoc?.width === 'number' && typeof uploadDoc?.height === 'number' && (\n                  <React.Fragment>\n                    &nbsp;-&nbsp;\n                    {uploadDoc?.width}x{uploadDoc?.height}\n                  </React.Fragment>\n                )}\n                {uploadDoc?.mimeType && (\n                  <React.Fragment>\n                    &nbsp;-&nbsp;\n                    {uploadDoc?.mimeType}\n                  </React.Fragment>\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n      )\n\n      // Render to HTML\n      const html = ReactDOMServer.renderToStaticMarkup(JSX)\n\n      return html\n    },\n  }\n}\n"],"names":["File","createHash","formatFilesize","React","baseClass","UploadDiffHTMLConverterAsync","i18n","req","upload","node","populate","providedCSSString","uploadNode","uploadDoc","undefined","value","id","collectionSlug","relationTo","relatedCollection","payload","collections","config","thumbnailSRC","thumbnailURL","url","ReactDOMServer","default","nodeFieldsHash","update","JSON","stringify","fields","digest","JSX","div","className","data-enable-match","data-fields-hash","data-filename","filename","data-lexical-upload-id","data-lexical-upload-relation-to","data-src","length","img","alt","src","strong","filesize","width","height","Fragment","mimeType","html","renderToStaticMarkup"],"mappings":"AAGA,SAASA,IAAI,QAAQ,qBAAoB;AACzC,SAASC,UAAU,QAAQ,SAAQ;AAEnC,OAAO,eAAc;AAErB,SAASC,cAAc,QAAQ,iBAAgB;AAC/C,OAAOC,WAAW,QAAO;AAMzB,MAAMC,YAAY;AAElB,OAAO,MAAMC,+BAGqC,CAAC,EAAEC,IAAI,EAAEC,GAAG,EAAE;IAC9D,OAAO;QACLC,QAAQ,OAAO,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,iBAAiB,EAAE;YAClD,MAAMC,aAAaH;YAEnB,IAAII,YAAiDC;YAErD,mEAAmE;YACnE,IAAI,OAAOF,WAAWG,KAAK,KAAK,UAAU;gBACxC,IAAI,CAACL,UAAU;oBACb,OAAO;gBACT;gBACAG,YAAY,MAAMH,SAAgC;oBAChDM,IAAIJ,WAAWG,KAAK;oBACpBE,gBAAgBL,WAAWM,UAAU;gBACvC;YACF,OAAO;gBACLL,YAAYD,WAAWG,KAAK;YAC9B;YAEA,IAAI,CAACF,WAAW;gBACd,OAAO;YACT;YAEA,MAAMM,oBAAoBZ,IAAIa,OAAO,CAACC,WAAW,CAACT,WAAWM,UAAU,CAAC,EAAEI;YAE1E,MAAMC,eACJ,AAAC,kBAAkBV,aAAcA,WAAWW,gBAA4BX,WAAWY,OAAO;YAE5F,MAAMC,iBAAiB,AAAC,CAAA,MAAM,MAAM,CAAC,mBAAkB,EAAGC,OAAO;YAEjE,uDAAuD;YACvD,MAAMC,iBAAiB3B,WAAW,UAC/B4B,MAAM,CAACC,KAAKC,SAAS,CAACtB,KAAKuB,MAAM,IAAI,CAAC,IACtCC,MAAM,CAAC;YAEV,MAAMC,OACHC,IACCC,WAAW,GAAGhC,YAAYO,mBAAmB,EAC7C0B,kBAAkB,OAClBC,kBAAkB,GAAGV,gBAAgB,EACrCW,eAAe1B,WAAW2B,UAC1BC,wBAAwB7B,WAAWG,KAAK,EACxC2B,iCAAiC9B,WAAWM,UAAU,EACtDyB,UAAUpB,cACX;UACC,CAACY,IAAIC,WAAW,GAAGhC,UAAU,MAAM,CAAC,EAAE;YACpC,CAAC+B,IAAIC,WAAW,GAAGhC,UAAU,WAAW,CAAC,EAAE;cACzC,CAACmB,cAAcqB,UACZC,IAAIC,KAAKjC,WAAW2B,UAAUO,KAAKxB,mBAEnCvB,OACD;YACJ,EAAEmC,IAAI;YACN,CAACA,IAAIC,WAAW,GAAGhC,UAAU,MAAM,CAAC,EAAEiC,kBAAkB,QAAQ;cAC9D,CAACW,QAAQnC,WAAW2B,WAAWQ,OAAO;cACtC,CAACb,IAAIC,WAAW,GAAGhC,UAAU,MAAM,CAAC,EAAE;gBACpC,CAACF,eAAeW,WAAWoC,UAAU;gBACrC,CAAC,OAAOpC,WAAWqC,UAAU,YAAY,OAAOrC,WAAWsC,WAAW,aACnEhD,MAAMiD,SAAS;;oBAEd,CAACvC,WAAWqC,MAAM,CAAC,CAACrC,WAAWsC,OAAO;kBACxC,EAAEhD,MAAMiD,UACR;gBACF,CAACvC,WAAWwC,aACTlD,MAAMiD,SAAS;;oBAEd,CAACvC,WAAWwC,SAAS;kBACvB,EAAElD,MAAMiD,UACR;cACJ,EAAEjB,IAAI;YACR,EAAEA,IAAI;UACR,EAAEA,IAAI;QACR,EAAEA;YAGJ,iBAAiB;YACjB,MAAMmB,OAAO5B,eAAe6B,oBAAoB,CAACrB;YAEjD,OAAOoB;QACT;IACF;AACF,EAAC"}
+{"version":3,"sources":["../../../../../src/field/Diff/converters/upload/index.tsx"],"sourcesContent":["import type { FileData, PayloadRequest, TypeWithID } from 'payload'\n\nimport { type I18nClient } from '@payloadcms/translations'\nimport { File } from '@payloadcms/ui/rsc'\nimport { createHash } from 'crypto'\n\nimport './index.scss'\n\nimport { formatFilesize } from 'payload/shared'\nimport React from 'react'\n\nimport type { HTMLConvertersAsync } from '../../../../features/converters/lexicalToHtml/async/types.js'\nimport type { UploadDataImproved } from '../../../../features/upload/server/nodes/UploadNode.js'\nimport type { SerializedUploadNode } from '../../../../nodeTypes.js'\n\nconst baseClass = 'lexical-upload-diff'\n\nexport const UploadDiffHTMLConverterAsync: (args: {\n  i18n: I18nClient\n  req: PayloadRequest\n}) => HTMLConvertersAsync<SerializedUploadNode> = ({ i18n, req }) => {\n  return {\n    upload: async ({ node, populate, providedCSSString }) => {\n      const uploadNode = node as UploadDataImproved\n\n      let uploadDoc: (FileData & TypeWithID) | undefined = undefined\n\n      // If there's no valid upload data, populate return an empty string\n      if (typeof uploadNode.value !== 'object') {\n        if (!populate) {\n          return ''\n        }\n        uploadDoc = await populate<FileData & TypeWithID>({\n          id: uploadNode.value,\n          collectionSlug: uploadNode.relationTo,\n        })\n      } else {\n        uploadDoc = uploadNode.value as unknown as FileData & TypeWithID\n      }\n\n      if (!uploadDoc) {\n        return ''\n      }\n\n      const relatedCollection = req.payload.collections[uploadNode.relationTo]?.config\n\n      const thumbnailSRC: string =\n        ('thumbnailURL' in uploadDoc && (uploadDoc?.thumbnailURL as string)) || uploadDoc?.url || ''\n\n      const ReactDOMServer = (await import('react-dom/server')).default\n\n      // hash fields to ensure they are diffed if they change\n      const nodeFieldsHash = createHash('sha256')\n        .update(JSON.stringify(node.fields ?? {}))\n        .digest('hex')\n\n      const JSX = (\n        <div\n          className={`${baseClass}${providedCSSString}`}\n          data-enable-match=\"true\"\n          data-fields-hash={`${nodeFieldsHash}`}\n          data-filename={uploadDoc?.filename}\n          data-lexical-upload-id={uploadNode.value}\n          data-lexical-upload-relation-to={uploadNode.relationTo}\n          data-src={thumbnailSRC}\n        >\n          <div className={`${baseClass}__card`}>\n            <div className={`${baseClass}__thumbnail`}>\n              {thumbnailSRC?.length ? (\n                <img alt={uploadDoc?.filename} src={thumbnailSRC} />\n              ) : (\n                <File />\n              )}\n            </div>\n            <div className={`${baseClass}__info`} data-enable-match=\"false\">\n              <strong>{uploadDoc?.filename}</strong>\n              <div className={`${baseClass}__meta`}>\n                {formatFilesize(uploadDoc?.filesize)}\n                {typeof uploadDoc?.width === 'number' && typeof uploadDoc?.height === 'number' && (\n                  <React.Fragment>\n                    &nbsp;-&nbsp;\n                    {uploadDoc?.width}x{uploadDoc?.height}\n                  </React.Fragment>\n                )}\n                {uploadDoc?.mimeType && (\n                  <React.Fragment>\n                    &nbsp;-&nbsp;\n                    {uploadDoc?.mimeType}\n                  </React.Fragment>\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n      )\n\n      // Render to HTML\n      const html = ReactDOMServer.renderToStaticMarkup(JSX)\n\n      return html\n    },\n  }\n}\n"],"names":["File","createHash","formatFilesize","React","baseClass","UploadDiffHTMLConverterAsync","i18n","req","upload","node","populate","providedCSSString","uploadNode","uploadDoc","undefined","value","id","collectionSlug","relationTo","relatedCollection","payload","collections","config","thumbnailSRC","thumbnailURL","url","ReactDOMServer","default","nodeFieldsHash","update","JSON","stringify","fields","digest","JSX","div","className","data-enable-match","data-fields-hash","data-filename","filename","data-lexical-upload-id","data-lexical-upload-relation-to","data-src","length","img","alt","src","strong","filesize","width","height","Fragment","mimeType","html","renderToStaticMarkup"],"mappings":";AAGA,SAASA,IAAI,QAAQ,qBAAoB;AACzC,SAASC,UAAU,QAAQ,SAAQ;AAEnC,OAAO,eAAc;AAErB,SAASC,cAAc,QAAQ,iBAAgB;AAC/C,OAAOC,WAAW,QAAO;AAMzB,MAAMC,YAAY;AAElB,OAAO,MAAMC,+BAGqC,CAAC,EAAEC,IAAI,EAAEC,GAAG,EAAE;IAC9D,OAAO;QACLC,QAAQ,OAAO,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,iBAAiB,EAAE;YAClD,MAAMC,aAAaH;YAEnB,IAAII,YAAiDC;YAErD,mEAAmE;YACnE,IAAI,OAAOF,WAAWG,KAAK,KAAK,UAAU;gBACxC,IAAI,CAACL,UAAU;oBACb,OAAO;gBACT;gBACAG,YAAY,MAAMH,SAAgC;oBAChDM,IAAIJ,WAAWG,KAAK;oBACpBE,gBAAgBL,WAAWM,UAAU;gBACvC;YACF,OAAO;gBACLL,YAAYD,WAAWG,KAAK;YAC9B;YAEA,IAAI,CAACF,WAAW;gBACd,OAAO;YACT;YAEA,MAAMM,oBAAoBZ,IAAIa,OAAO,CAACC,WAAW,CAACT,WAAWM,UAAU,CAAC,EAAEI;YAE1E,MAAMC,eACJ,AAAC,kBAAkBV,aAAcA,WAAWW,gBAA4BX,WAAWY,OAAO;YAE5F,MAAMC,iBAAiB,AAAC,CAAA,MAAM,MAAM,CAAC,mBAAkB,EAAGC,OAAO;YAEjE,uDAAuD;YACvD,MAAMC,iBAAiB3B,WAAW,UAC/B4B,MAAM,CAACC,KAAKC,SAAS,CAACtB,KAAKuB,MAAM,IAAI,CAAC,IACtCC,MAAM,CAAC;YAEV,MAAMC,oBACJ,QAACC;gBACCC,WAAW,GAAGhC,YAAYO,mBAAmB;gBAC7C0B,qBAAkB;gBAClBC,oBAAkB,GAAGV,gBAAgB;gBACrCW,iBAAe1B,WAAW2B;gBAC1BC,0BAAwB7B,WAAWG,KAAK;gBACxC2B,mCAAiC9B,WAAWM,UAAU;gBACtDyB,YAAUpB;0BAEV,cAAA,QAACY;oBAAIC,WAAW,GAAGhC,UAAU,MAAM,CAAC;;sCAClC,QAAC+B;4BAAIC,WAAW,GAAGhC,UAAU,WAAW,CAAC;sCACtCmB,cAAcqB,uBACb,QAACC;gCAAIC,KAAKjC,WAAW2B;gCAAUO,KAAKxB;;;;;qDAEpC,QAACvB;;;;;;;;;;sCAGL,QAACmC;4BAAIC,WAAW,GAAGhC,UAAU,MAAM,CAAC;4BAAEiC,qBAAkB;;8CACtD,QAACW;8CAAQnC,WAAW2B;;;;;;8CACpB,QAACL;oCAAIC,WAAW,GAAGhC,UAAU,MAAM,CAAC;;wCACjCF,eAAeW,WAAWoC;wCAC1B,OAAOpC,WAAWqC,UAAU,YAAY,OAAOrC,WAAWsC,WAAW,0BACpE,QAAChD,MAAMiD,QAAQ;;gDAAC;gDAEbvC,WAAWqC;gDAAM;gDAAErC,WAAWsC;;;;;;;wCAGlCtC,WAAWwC,0BACV,QAAClD,MAAMiD,QAAQ;;gDAAC;gDAEbvC,WAAWwC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAS1B,iBAAiB;YACjB,MAAMC,OAAO5B,eAAe6B,oBAAoB,CAACrB;YAEjD,OAAOoB;QACT;IACF;AACF,EAAC"}

package/dist/field/Diff/index.js

@@ -1,6 +1,8 @@
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { FieldDiffContainer, getHTMLDiffComponents } from '@payloadcms/ui/rsc';
 import './index.scss';
 import '../bundled.css';
+import React from 'react';
 import { convertLexicalToHTMLAsync } from '../../features/converters/lexicalToHtml/async/index.js';
 import { getPayloadPopulateFn } from '../../features/converters/utilities/payloadPopulateFn.js';
 import { LinkDiffHTMLConverterAsync } from './converters/link.js';
@@ -50,10 +52,21 @@ export const LexicalDiffComponent = async (args)=>{
         fromHTML: fromHTML?.length ? fromHTML : '<p></p>',
         toHTML: toHTML?.length ? toHTML : '<p></p>'
     });
-    return <FieldDiffContainer className={baseClass} From={From} i18n={i18n} label={{
-        label: field.label,
-        locale
-    }} nestingLevel={nestingLevel} To={To}/>;
+    return /*#__PURE__*/ _jsxDEV(FieldDiffContainer, {
+        className: baseClass,
+        From: From,
+        i18n: i18n,
+        label: {
+            label: field.label,
+            locale
+        },
+        nestingLevel: nestingLevel,
+        To: To
+    }, void 0, false, {
+        fileName: "src/field/Diff/index.tsx",
+        lineNumber: 69,
+        columnNumber: 5
+    }, this);
 };
 
 //# sourceMappingURL=index.js.map

package/dist/field/Diff/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/field/Diff/index.tsx"],"sourcesContent":["import type { SerializedEditorState } from 'lexical'\nimport type { RichTextFieldDiffServerComponent } from 'payload'\n\nimport { FieldDiffContainer, getHTMLDiffComponents } from '@payloadcms/ui/rsc'\n\nimport './index.scss'\nimport '../bundled.css'\n\nimport React from 'react'\n\nimport type { HTMLConvertersFunctionAsync } from '../../features/converters/lexicalToHtml/async/types.js'\n\nimport { convertLexicalToHTMLAsync } from '../../features/converters/lexicalToHtml/async/index.js'\nimport { getPayloadPopulateFn } from '../../features/converters/utilities/payloadPopulateFn.js'\nimport { LinkDiffHTMLConverterAsync } from './converters/link.js'\nimport { ListItemDiffHTMLConverterAsync } from './converters/listitem/index.js'\nimport { RelationshipDiffHTMLConverterAsync } from './converters/relationship/index.js'\nimport { UnknownDiffHTMLConverterAsync } from './converters/unknown/index.js'\nimport { UploadDiffHTMLConverterAsync } from './converters/upload/index.js'\n\nconst baseClass = 'lexical-diff'\n\nexport const LexicalDiffComponent: RichTextFieldDiffServerComponent = async (args) => {\n  const {\n    comparisonValue: valueFrom,\n    field,\n    i18n,\n    locale,\n    nestingLevel,\n    req,\n    versionValue: valueTo,\n  } = args\n\n  const converters: HTMLConvertersFunctionAsync = ({ defaultConverters }) => ({\n    ...defaultConverters,\n    ...LinkDiffHTMLConverterAsync({}),\n    ...ListItemDiffHTMLConverterAsync,\n    ...UploadDiffHTMLConverterAsync({ i18n, req }),\n    ...RelationshipDiffHTMLConverterAsync({ i18n, req }),\n    ...UnknownDiffHTMLConverterAsync({ i18n, req }),\n  })\n\n  const payloadPopulateFn = await getPayloadPopulateFn({\n    currentDepth: 0,\n    depth: 1,\n    req,\n  })\n  const fromHTML = await convertLexicalToHTMLAsync({\n    converters,\n    data: valueFrom as SerializedEditorState,\n    disableContainer: true,\n    populate: payloadPopulateFn,\n  })\n\n  const toHTML = await convertLexicalToHTMLAsync({\n    converters,\n    data: valueTo as SerializedEditorState,\n    disableContainer: true,\n    populate: payloadPopulateFn,\n  })\n\n  const { From, To } = getHTMLDiffComponents({\n    // Ensure empty paragraph is displayed for empty rich text fields - otherwise, toHTML may be displayed in the wrong column\n    fromHTML: fromHTML?.length ? fromHTML : '<p></p>',\n    toHTML: toHTML?.length ? toHTML : '<p></p>',\n  })\n\n  return (\n    <FieldDiffContainer\n      className={baseClass}\n      From={From}\n      i18n={i18n}\n      label={{\n        label: field.label,\n        locale,\n      }}\n      nestingLevel={nestingLevel}\n      To={To}\n    />\n  )\n}\n"],"names":["FieldDiffContainer","getHTMLDiffComponents","convertLexicalToHTMLAsync","getPayloadPopulateFn","LinkDiffHTMLConverterAsync","ListItemDiffHTMLConverterAsync","RelationshipDiffHTMLConverterAsync","UnknownDiffHTMLConverterAsync","UploadDiffHTMLConverterAsync","baseClass","LexicalDiffComponent","args","comparisonValue","valueFrom","field","i18n","locale","nestingLevel","req","versionValue","valueTo","converters","defaultConverters","payloadPopulateFn","currentDepth","depth","fromHTML","data","disableContainer","populate","toHTML","From","To","length","className","label"],"mappings":"AAGA,SAASA,kBAAkB,EAAEC,qBAAqB,QAAQ,qBAAoB;AAE9E,OAAO,eAAc;AACrB,OAAO,iBAAgB;AAMvB,SAASC,yBAAyB,QAAQ,yDAAwD;AAClG,SAASC,oBAAoB,QAAQ,2DAA0D;AAC/F,SAASC,0BAA0B,QAAQ,uBAAsB;AACjE,SAASC,8BAA8B,QAAQ,iCAAgC;AAC/E,SAASC,kCAAkC,QAAQ,qCAAoC;AACvF,SAASC,6BAA6B,QAAQ,gCAA+B;AAC7E,SAASC,4BAA4B,QAAQ,+BAA8B;AAE3E,MAAMC,YAAY;AAElB,OAAO,MAAMC,uBAAyD,OAAOC;IAC3E,MAAM,EACJC,iBAAiBC,SAAS,EAC1BC,KAAK,EACLC,IAAI,EACJC,MAAM,EACNC,YAAY,EACZC,GAAG,EACHC,cAAcC,OAAO,EACtB,GAAGT;IAEJ,MAAMU,aAA0C,CAAC,EAAEC,iBAAiB,EAAE,GAAM,CAAA;YAC1E,GAAGA,iBAAiB;YACpB,GAAGlB,2BAA2B,CAAC,EAAE;YACjC,GAAGC,8BAA8B;YACjC,GAAGG,6BAA6B;gBAAEO;gBAAMG;YAAI,EAAE;YAC9C,GAAGZ,mCAAmC;gBAAES;gBAAMG;YAAI,EAAE;YACpD,GAAGX,8BAA8B;gBAAEQ;gBAAMG;YAAI,EAAE;QACjD,CAAA;IAEA,MAAMK,oBAAoB,MAAMpB,qBAAqB;QACnDqB,cAAc;QACdC,OAAO;QACPP;IACF;IACA,MAAMQ,WAAW,MAAMxB,0BAA0B;QAC/CmB;QACAM,MAAMd;QACNe,kBAAkB;QAClBC,UAAUN;IACZ;IAEA,MAAMO,SAAS,MAAM5B,0BAA0B;QAC7CmB;QACAM,MAAMP;QACNQ,kBAAkB;QAClBC,UAAUN;IACZ;IAEA,MAAM,EAAEQ,IAAI,EAAEC,EAAE,EAAE,GAAG/B,sBAAsB;QACzC,0HAA0H;QAC1HyB,UAAUA,UAAUO,SAASP,WAAW;QACxCI,QAAQA,QAAQG,SAASH,SAAS;IACpC;IAEA,QACG9B,mBACCkC,WAAWzB,WACXsB,MAAMA,MACNhB,MAAMA,MACNoB,OAAO;QACLA,OAAOrB,MAAMqB,KAAK;QAClBnB;IACF,GACAC,cAAcA,cACde,IAAIA;AAGV,EAAC"}
+{"version":3,"sources":["../../../src/field/Diff/index.tsx"],"sourcesContent":["import type { SerializedEditorState } from 'lexical'\nimport type { RichTextFieldDiffServerComponent } from 'payload'\n\nimport { FieldDiffContainer, getHTMLDiffComponents } from '@payloadcms/ui/rsc'\n\nimport './index.scss'\nimport '../bundled.css'\n\nimport React from 'react'\n\nimport type { HTMLConvertersFunctionAsync } from '../../features/converters/lexicalToHtml/async/types.js'\n\nimport { convertLexicalToHTMLAsync } from '../../features/converters/lexicalToHtml/async/index.js'\nimport { getPayloadPopulateFn } from '../../features/converters/utilities/payloadPopulateFn.js'\nimport { LinkDiffHTMLConverterAsync } from './converters/link.js'\nimport { ListItemDiffHTMLConverterAsync } from './converters/listitem/index.js'\nimport { RelationshipDiffHTMLConverterAsync } from './converters/relationship/index.js'\nimport { UnknownDiffHTMLConverterAsync } from './converters/unknown/index.js'\nimport { UploadDiffHTMLConverterAsync } from './converters/upload/index.js'\n\nconst baseClass = 'lexical-diff'\n\nexport const LexicalDiffComponent: RichTextFieldDiffServerComponent = async (args) => {\n  const {\n    comparisonValue: valueFrom,\n    field,\n    i18n,\n    locale,\n    nestingLevel,\n    req,\n    versionValue: valueTo,\n  } = args\n\n  const converters: HTMLConvertersFunctionAsync = ({ defaultConverters }) => ({\n    ...defaultConverters,\n    ...LinkDiffHTMLConverterAsync({}),\n    ...ListItemDiffHTMLConverterAsync,\n    ...UploadDiffHTMLConverterAsync({ i18n, req }),\n    ...RelationshipDiffHTMLConverterAsync({ i18n, req }),\n    ...UnknownDiffHTMLConverterAsync({ i18n, req }),\n  })\n\n  const payloadPopulateFn = await getPayloadPopulateFn({\n    currentDepth: 0,\n    depth: 1,\n    req,\n  })\n  const fromHTML = await convertLexicalToHTMLAsync({\n    converters,\n    data: valueFrom as SerializedEditorState,\n    disableContainer: true,\n    populate: payloadPopulateFn,\n  })\n\n  const toHTML = await convertLexicalToHTMLAsync({\n    converters,\n    data: valueTo as SerializedEditorState,\n    disableContainer: true,\n    populate: payloadPopulateFn,\n  })\n\n  const { From, To } = getHTMLDiffComponents({\n    // Ensure empty paragraph is displayed for empty rich text fields - otherwise, toHTML may be displayed in the wrong column\n    fromHTML: fromHTML?.length ? fromHTML : '<p></p>',\n    toHTML: toHTML?.length ? toHTML : '<p></p>',\n  })\n\n  return (\n    <FieldDiffContainer\n      className={baseClass}\n      From={From}\n      i18n={i18n}\n      label={{\n        label: field.label,\n        locale,\n      }}\n      nestingLevel={nestingLevel}\n      To={To}\n    />\n  )\n}\n"],"names":["FieldDiffContainer","getHTMLDiffComponents","React","convertLexicalToHTMLAsync","getPayloadPopulateFn","LinkDiffHTMLConverterAsync","ListItemDiffHTMLConverterAsync","RelationshipDiffHTMLConverterAsync","UnknownDiffHTMLConverterAsync","UploadDiffHTMLConverterAsync","baseClass","LexicalDiffComponent","args","comparisonValue","valueFrom","field","i18n","locale","nestingLevel","req","versionValue","valueTo","converters","defaultConverters","payloadPopulateFn","currentDepth","depth","fromHTML","data","disableContainer","populate","toHTML","From","To","length","className","label"],"mappings":";AAGA,SAASA,kBAAkB,EAAEC,qBAAqB,QAAQ,qBAAoB;AAE9E,OAAO,eAAc;AACrB,OAAO,iBAAgB;AAEvB,OAAOC,WAAW,QAAO;AAIzB,SAASC,yBAAyB,QAAQ,yDAAwD;AAClG,SAASC,oBAAoB,QAAQ,2DAA0D;AAC/F,SAASC,0BAA0B,QAAQ,uBAAsB;AACjE,SAASC,8BAA8B,QAAQ,iCAAgC;AAC/E,SAASC,kCAAkC,QAAQ,qCAAoC;AACvF,SAASC,6BAA6B,QAAQ,gCAA+B;AAC7E,SAASC,4BAA4B,QAAQ,+BAA8B;AAE3E,MAAMC,YAAY;AAElB,OAAO,MAAMC,uBAAyD,OAAOC;IAC3E,MAAM,EACJC,iBAAiBC,SAAS,EAC1BC,KAAK,EACLC,IAAI,EACJC,MAAM,EACNC,YAAY,EACZC,GAAG,EACHC,cAAcC,OAAO,EACtB,GAAGT;IAEJ,MAAMU,aAA0C,CAAC,EAAEC,iBAAiB,EAAE,GAAM,CAAA;YAC1E,GAAGA,iBAAiB;YACpB,GAAGlB,2BAA2B,CAAC,EAAE;YACjC,GAAGC,8BAA8B;YACjC,GAAGG,6BAA6B;gBAAEO;gBAAMG;YAAI,EAAE;YAC9C,GAAGZ,mCAAmC;gBAAES;gBAAMG;YAAI,EAAE;YACpD,GAAGX,8BAA8B;gBAAEQ;gBAAMG;YAAI,EAAE;QACjD,CAAA;IAEA,MAAMK,oBAAoB,MAAMpB,qBAAqB;QACnDqB,cAAc;QACdC,OAAO;QACPP;IACF;IACA,MAAMQ,WAAW,MAAMxB,0BAA0B;QAC/CmB;QACAM,MAAMd;QACNe,kBAAkB;QAClBC,UAAUN;IACZ;IAEA,MAAMO,SAAS,MAAM5B,0BAA0B;QAC7CmB;QACAM,MAAMP;QACNQ,kBAAkB;QAClBC,UAAUN;IACZ;IAEA,MAAM,EAAEQ,IAAI,EAAEC,EAAE,EAAE,GAAGhC,sBAAsB;QACzC,0HAA0H;QAC1H0B,UAAUA,UAAUO,SAASP,WAAW;QACxCI,QAAQA,QAAQG,SAASH,SAAS;IACpC;IAEA,qBACE,QAAC/B;QACCmC,WAAWzB;QACXsB,MAAMA;QACNhB,MAAMA;QACNoB,OAAO;YACLA,OAAOrB,MAAMqB,KAAK;YAClBnB;QACF;QACAC,cAAcA;QACde,IAAIA;;;;;;AAGV,EAAC"}

package/dist/field/Field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../src/field/Field.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAoD,MAAM,OAAO,CAAA;AAGxE,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,4BAA4B,CAAA;AAE7E,OAAO,mCAAmC,CAAA;AAC1C,OAAO,eAAe,CAAA;AACtB,OAAO,cAAc,CAAA;AAErB,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAA;AAO5D,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAC/B;IACE,QAAQ,CAAC,YAAY,EAAE,2BAA2B,CAAA;CACnD,GAAG,yBAAyB,CA4K9B,CAAA;AAaD,eAAO,MAAM,QAAQ,EAAE,OAAO,iBAAqC,CAAA"}
+{"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../src/field/Field.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAoD,MAAM,OAAO,CAAA;AAGxE,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,4BAA4B,CAAA;AAE7E,OAAO,mCAAmC,CAAA;AAC1C,OAAO,eAAe,CAAA;AACtB,OAAO,cAAc,CAAA;AAErB,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAA;AAQ5D,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAC/B;IACE,QAAQ,CAAC,YAAY,EAAE,2BAA2B,CAAA;CACnD,GAAG,yBAAyB,CAsL9B,CAAA;AAaD,eAAO,MAAM,QAAQ,EAAE,OAAO,iBAAqC,CAAA"}

package/dist/field/Field.js

@@ -1,4 +1,5 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { BulkUploadProvider, FieldDescription, FieldError, FieldLabel, RenderCustomComponent, useEditDepth, useEffectEvent, useField } from '@payloadcms/ui';
 import { mergeFieldStyles } from '@payloadcms/ui/shared';
 import { dequal } from 'dequal/lite';
@@ -9,6 +10,7 @@ import './bundled.css';
 import './index.scss';
 import { LexicalProvider } from '../lexical/LexicalProvider.js';
 import { useRunDeprioritized } from '../utilities/useRunDeprioritized.js';
+import { ViewSelector } from './ViewSelector.js';
 const baseClass = 'rich-text-lexical';
 const RichTextComponent = // With rendered features n stuff
 (props)=>{
@@ -57,8 +59,8 @@ const RichTextComponent = // With rendered features n stuff
         isSmallWidthViewport
     ]);
     const classes = [
-        baseClass,
         'field-type',
+        baseClass,
         className,
         showError && 'error',
         disabled && `${baseClass}--read-only`,
@@ -108,34 +110,147 @@ const RichTextComponent = // With rendered features n stuff
     }, [
         initialValue
     ]);
-    return <div className={classes} key={pathWithEditDepth} style={styles}>
-      <RenderCustomComponent CustomComponent={Error} Fallback={<FieldError path={path} showError={showError}/>}/>
-      {Label || <FieldLabel label={label} localized={localized} path={path} required={required}/>}
-      <div className={`${baseClass}__wrap`}>
-        <ErrorBoundary fallbackRender={fallbackRender} onReset={()=>{}}>
-          {BeforeInput}
-          {}
-          <BulkUploadProvider drawerSlugPrefix={path}>
-            <LexicalProvider composerKey={pathWithEditDepth} editorConfig={editorConfig} fieldProps={props} isSmallWidthViewport={isSmallWidthViewport} key={JSON.stringify({
-        path,
-        rerenderProviderKey
-    })} // makes sure lexical is completely re-rendered when initialValue changes, bypassing the lexical-internal value memoization. That way, external changes to the form will update the editor. More infos in PR description (https://github.com/payloadcms/payload/pull/5010)
-    onChange={handleChange} readOnly={disabled} value={value}/>
-          </BulkUploadProvider>
-          {AfterInput}
-        </ErrorBoundary>
-        <RenderCustomComponent CustomComponent={Description} Fallback={<FieldDescription description={description} path={path}/>}/>
-      </div>
-    </div>;
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: classes,
+        "data-lexical-view": editorConfig?.view,
+        style: styles,
+        children: [
+            /*#__PURE__*/ _jsxDEV(RenderCustomComponent, {
+                CustomComponent: Error,
+                Fallback: /*#__PURE__*/ _jsxDEV(FieldError, {
+                    path: path,
+                    showError: showError
+                }, void 0, false, {
+                    fileName: "src/field/Field.tsx",
+                    lineNumber: 185,
+                    columnNumber: 19
+                }, void 0)
+            }, void 0, false, {
+                fileName: "src/field/Field.tsx",
+                lineNumber: 183,
+                columnNumber: 7
+            }, this),
+            /*#__PURE__*/ _jsxDEV("div", {
+                className: `${baseClass}__label-row`,
+                children: [
+                    Label || /*#__PURE__*/ _jsxDEV(FieldLabel, {
+                        label: label,
+                        localized: localized,
+                        path: path,
+                        required: required
+                    }, void 0, false, {
+                        fileName: "src/field/Field.tsx",
+                        lineNumber: 189,
+                        columnNumber: 11
+                    }, this),
+                    /*#__PURE__*/ _jsxDEV(ViewSelector, {}, void 0, false, {
+                        fileName: "src/field/Field.tsx",
+                        lineNumber: 191,
+                        columnNumber: 9
+                    }, this)
+                ]
+            }, void 0, true, {
+                fileName: "src/field/Field.tsx",
+                lineNumber: 187,
+                columnNumber: 7
+            }, this),
+            /*#__PURE__*/ _jsxDEV("div", {
+                className: `${baseClass}__wrap`,
+                children: [
+                    /*#__PURE__*/ _jsxDEV(ErrorBoundary, {
+                        fallbackRender: fallbackRender,
+                        onReset: ()=>{},
+                        children: [
+                            BeforeInput,
+                            /* Lexical may be in a drawer. We need to define another BulkUploadProvider to ensure that the bulk upload drawer
+          is rendered in the correct depth (not displayed *behind* the current drawer)*/ /*#__PURE__*/ _jsxDEV(BulkUploadProvider, {
+                                drawerSlugPrefix: path,
+                                children: /*#__PURE__*/ _jsxDEV(LexicalProvider, {
+                                    composerKey: pathWithEditDepth,
+                                    editorConfig: editorConfig,
+                                    fieldProps: props,
+                                    isSmallWidthViewport: isSmallWidthViewport,
+                                    // makes sure lexical is completely re-rendered when initialValue changes, bypassing the lexical-internal value memoization. That way, external changes to the form will update the editor. More infos in PR description (https://github.com/payloadcms/payload/pull/5010)
+                                    onChange: handleChange,
+                                    readOnly: disabled,
+                                    value: value
+                                }, JSON.stringify({
+                                    path,
+                                    rerenderProviderKey
+                                }), false, {
+                                    fileName: "src/field/Field.tsx",
+                                    lineNumber: 199,
+                                    columnNumber: 13
+                                }, this)
+                            }, void 0, false, {
+                                fileName: "src/field/Field.tsx",
+                                lineNumber: 198,
+                                columnNumber: 11
+                            }, this),
+                            AfterInput
+                        ]
+                    }, void 0, true, {
+                        fileName: "src/field/Field.tsx",
+                        lineNumber: 194,
+                        columnNumber: 9
+                    }, this),
+                    /*#__PURE__*/ _jsxDEV(RenderCustomComponent, {
+                        CustomComponent: Description,
+                        Fallback: /*#__PURE__*/ _jsxDEV(FieldDescription, {
+                            description: description,
+                            path: path
+                        }, void 0, false, {
+                            fileName: "src/field/Field.tsx",
+                            lineNumber: 214,
+                            columnNumber: 21
+                        }, void 0)
+                    }, void 0, false, {
+                        fileName: "src/field/Field.tsx",
+                        lineNumber: 212,
+                        columnNumber: 9
+                    }, this)
+                ]
+            }, void 0, true, {
+                fileName: "src/field/Field.tsx",
+                lineNumber: 193,
+                columnNumber: 7
+            }, this)
+        ]
+    }, pathWithEditDepth, true, {
+        fileName: "src/field/Field.tsx",
+        lineNumber: 177,
+        columnNumber: 5
+    }, this);
 };
 function fallbackRender({ error }) {
     // Call resetErrorBoundary() to reset the error boundary and retry the render.
-    return <div className="errorBoundary" role="alert">
-      <p>Something went wrong:</p>
-      <pre style={{
-        color: 'red'
-    }}>{error.message}</pre>
-    </div>;
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: "errorBoundary",
+        role: "alert",
+        children: [
+            /*#__PURE__*/ _jsxDEV("p", {
+                children: "Something went wrong:"
+            }, void 0, false, {
+                fileName: "src/field/Field.tsx",
+                lineNumber: 226,
+                columnNumber: 7
+            }, this),
+            /*#__PURE__*/ _jsxDEV("pre", {
+                style: {
+                    color: 'red'
+                },
+                children: error.message
+            }, void 0, false, {
+                fileName: "src/field/Field.tsx",
+                lineNumber: 227,
+                columnNumber: 7
+            }, this)
+        ]
+    }, void 0, true, {
+        fileName: "src/field/Field.tsx",
+        lineNumber: 225,
+        columnNumber: 5
+    }, this);
 }
 export const RichText = RichTextComponent;
 

package/dist/field/Field.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/field/Field.tsx"],"sourcesContent":["'use client'\nimport type { EditorState, SerializedEditorState } from 'lexical'\n\nimport {\n  BulkUploadProvider,\n  FieldDescription,\n  FieldError,\n  FieldLabel,\n  RenderCustomComponent,\n  useEditDepth,\n  useEffectEvent,\n  useField,\n} from '@payloadcms/ui'\nimport { mergeFieldStyles } from '@payloadcms/ui/shared'\nimport { dequal } from 'dequal/lite'\nimport { type Validate } from 'payload'\nimport React, { useCallback, useEffect, useMemo, useState } from 'react'\nimport { ErrorBoundary } from 'react-error-boundary'\n\nimport type { SanitizedClientEditorConfig } from '../lexical/config/types.js'\n\nimport '../lexical/theme/EditorTheme.scss'\nimport './bundled.css'\nimport './index.scss'\n\nimport type { LexicalRichTextFieldProps } from '../types.js'\n\nimport { LexicalProvider } from '../lexical/LexicalProvider.js'\nimport { useRunDeprioritized } from '../utilities/useRunDeprioritized.js'\n\nconst baseClass = 'rich-text-lexical'\n\nconst RichTextComponent: React.FC<\n  {\n    readonly editorConfig: SanitizedClientEditorConfig // With rendered features n stuff\n  } & LexicalRichTextFieldProps\n> = (props) => {\n  const {\n    editorConfig,\n    field,\n    field: {\n      admin: { className, description, readOnly: readOnlyFromAdmin } = {},\n      label,\n      localized,\n      required,\n    },\n    path: pathFromProps,\n    readOnly: readOnlyFromTopLevelProps,\n    validate, // Users can pass in client side validation if they WANT to, but it's not required anymore\n  } = props\n\n  const readOnlyFromProps = readOnlyFromTopLevelProps || readOnlyFromAdmin\n\n  const editDepth = useEditDepth()\n\n  const memoizedValidate = useCallback<Validate>(\n    (value, validationOptions) => {\n      if (typeof validate === 'function') {\n        // @ts-expect-error - vestiges of when tsconfig was not strict. Feel free to improve\n        return validate(value, { ...validationOptions, required })\n      }\n      return true\n    },\n    // Important: do not add props to the dependencies array.\n    // This would cause an infinite loop and endless re-rendering.\n    // Removing props from the dependencies array fixed this issue: https://github.com/payloadcms/payload/issues/3709\n    [validate, required],\n  )\n\n  const {\n    customComponents: { AfterInput, BeforeInput, Description, Error, Label } = {},\n    disabled: disabledFromField,\n    initialValue,\n    path,\n    setValue,\n    showError,\n    value,\n  } = useField<SerializedEditorState>({\n    potentiallyStalePath: pathFromProps,\n    validate: memoizedValidate,\n  })\n\n  const disabled = readOnlyFromProps || disabledFromField\n\n  const [isSmallWidthViewport, setIsSmallWidthViewport] = useState<boolean>(false)\n  const [rerenderProviderKey, setRerenderProviderKey] = useState<Date>()\n\n  const prevInitialValueRef = React.useRef<SerializedEditorState | undefined>(initialValue)\n  const prevValueRef = React.useRef<SerializedEditorState | undefined>(value)\n\n  useEffect(() => {\n    const updateViewPortWidth = () => {\n      const isNextSmallWidthViewport = window.matchMedia('(max-width: 768px)').matches\n\n      if (isNextSmallWidthViewport !== isSmallWidthViewport) {\n        setIsSmallWidthViewport(isNextSmallWidthViewport)\n      }\n    }\n    updateViewPortWidth()\n    window.addEventListener('resize', updateViewPortWidth)\n\n    return () => {\n      window.removeEventListener('resize', updateViewPortWidth)\n    }\n  }, [isSmallWidthViewport])\n\n  const classes = [\n    baseClass,\n    'field-type',\n    className,\n    showError && 'error',\n    disabled && `${baseClass}--read-only`,\n    editorConfig?.admin?.hideGutter !== true && !isSmallWidthViewport\n      ? `${baseClass}--show-gutter`\n      : null,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  const pathWithEditDepth = `${path}.${editDepth}`\n\n  const runDeprioritized = useRunDeprioritized() // defaults to 500 ms timeout\n\n  const handleChange = useCallback(\n    (editorState: EditorState) => {\n      // Capture `editorState` in the closure so we can safely run later.\n      const updateFieldValue = () => {\n        const newState = editorState.toJSON()\n        prevValueRef.current = newState\n        setValue(newState)\n      }\n\n      // Queue the update for the browser’s idle time (or Safari shim)\n      // and let the hook handle debouncing/cancellation.\n      void runDeprioritized(updateFieldValue)\n    },\n    [setValue, runDeprioritized], // `runDeprioritized` is stable (useCallback inside hook)\n  )\n\n  const styles = useMemo(() => mergeFieldStyles(field), [field])\n\n  const handleInitialValueChange = useEffectEvent(\n    (initialValue: SerializedEditorState | undefined) => {\n      // Object deep equality check here, as re-mounting the editor if\n      // the new value is the same as the old one is not necessary.\n      // In postgres, the order of keys in JSON objects is not guaranteed to be preserved,\n      // so we need to do a deep equality check here that does not care about key order => we use dequal.\n      // If we used JSON.stringify, the editor would re-mount every time you save the document, as the order of keys changes => change detected => re-mount.\n      if (\n        prevValueRef.current !== value &&\n        !dequal(\n          prevValueRef.current != null\n            ? JSON.parse(JSON.stringify(prevValueRef.current))\n            : prevValueRef.current,\n          value,\n        )\n      ) {\n        prevInitialValueRef.current = initialValue\n        prevValueRef.current = value\n        setRerenderProviderKey(new Date())\n      }\n    },\n  )\n\n  useEffect(() => {\n    // Needs to trigger for object reference changes - otherwise,\n    // reacting to the same initial value change twice will cause\n    // the second change to be ignored, even though the value has changed.\n    // That's because initialValue is not kept up-to-date\n    if (!Object.is(initialValue, prevInitialValueRef.current)) {\n      handleInitialValueChange(initialValue)\n    }\n  }, [initialValue])\n\n  return (\n    <div className={classes} key={pathWithEditDepth} style={styles}>\n      <RenderCustomComponent\n        CustomComponent={Error}\n        Fallback={<FieldError path={path} showError={showError} />}\n      />\n      {Label || <FieldLabel label={label} localized={localized} path={path} required={required} />}\n      <div className={`${baseClass}__wrap`}>\n        <ErrorBoundary fallbackRender={fallbackRender} onReset={() => {}}>\n          {BeforeInput}\n          {/* Lexical may be in a drawer. We need to define another BulkUploadProvider to ensure that the bulk upload drawer\n          is rendered in the correct depth (not displayed *behind* the current drawer)*/}\n          <BulkUploadProvider drawerSlugPrefix={path}>\n            <LexicalProvider\n              composerKey={pathWithEditDepth}\n              editorConfig={editorConfig}\n              fieldProps={props}\n              isSmallWidthViewport={isSmallWidthViewport}\n              key={JSON.stringify({ path, rerenderProviderKey })} // makes sure lexical is completely re-rendered when initialValue changes, bypassing the lexical-internal value memoization. That way, external changes to the form will update the editor. More infos in PR description (https://github.com/payloadcms/payload/pull/5010)\n              onChange={handleChange}\n              readOnly={disabled}\n              value={value}\n            />\n          </BulkUploadProvider>\n          {AfterInput}\n        </ErrorBoundary>\n        <RenderCustomComponent\n          CustomComponent={Description}\n          Fallback={<FieldDescription description={description} path={path} />}\n        />\n      </div>\n    </div>\n  )\n}\n\nfunction fallbackRender({ error }: { error: Error }) {\n  // Call resetErrorBoundary() to reset the error boundary and retry the render.\n\n  return (\n    <div className=\"errorBoundary\" role=\"alert\">\n      <p>Something went wrong:</p>\n      <pre style={{ color: 'red' }}>{error.message}</pre>\n    </div>\n  )\n}\n\nexport const RichText: typeof RichTextComponent = RichTextComponent\n"],"names":["BulkUploadProvider","FieldDescription","FieldError","FieldLabel","RenderCustomComponent","useEditDepth","useEffectEvent","useField","mergeFieldStyles","dequal","React","useCallback","useEffect","useMemo","useState","ErrorBoundary","LexicalProvider","useRunDeprioritized","baseClass","RichTextComponent","props","editorConfig","field","admin","className","description","readOnly","readOnlyFromAdmin","label","localized","required","path","pathFromProps","readOnlyFromTopLevelProps","validate","readOnlyFromProps","editDepth","memoizedValidate","value","validationOptions","customComponents","AfterInput","BeforeInput","Description","Error","Label","disabled","disabledFromField","initialValue","setValue","showError","potentiallyStalePath","isSmallWidthViewport","setIsSmallWidthViewport","rerenderProviderKey","setRerenderProviderKey","prevInitialValueRef","useRef","prevValueRef","updateViewPortWidth","isNextSmallWidthViewport","window","matchMedia","matches","addEventListener","removeEventListener","classes","hideGutter","filter","Boolean","join","pathWithEditDepth","runDeprioritized","handleChange","editorState","updateFieldValue","newState","toJSON","current","styles","handleInitialValueChange","JSON","parse","stringify","Date","Object","is","div","key","style","CustomComponent","Fallback","fallbackRender","onReset","drawerSlugPrefix","composerKey","fieldProps","onChange","error","role","p","pre","color","message","RichText"],"mappings":"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"}
+{"version":3,"sources":["../../src/field/Field.tsx"],"sourcesContent":["'use client'\nimport type { EditorState, SerializedEditorState } from 'lexical'\n\nimport {\n  BulkUploadProvider,\n  FieldDescription,\n  FieldError,\n  FieldLabel,\n  RenderCustomComponent,\n  useEditDepth,\n  useEffectEvent,\n  useField,\n} from '@payloadcms/ui'\nimport { mergeFieldStyles } from '@payloadcms/ui/shared'\nimport { dequal } from 'dequal/lite'\nimport { type Validate } from 'payload'\nimport React, { useCallback, useEffect, useMemo, useState } from 'react'\nimport { ErrorBoundary } from 'react-error-boundary'\n\nimport type { SanitizedClientEditorConfig } from '../lexical/config/types.js'\n\nimport '../lexical/theme/EditorTheme.scss'\nimport './bundled.css'\nimport './index.scss'\n\nimport type { LexicalRichTextFieldProps } from '../types.js'\n\nimport { LexicalProvider } from '../lexical/LexicalProvider.js'\nimport { useRunDeprioritized } from '../utilities/useRunDeprioritized.js'\nimport { ViewSelector } from './ViewSelector.js'\n\nconst baseClass = 'rich-text-lexical'\n\nconst RichTextComponent: React.FC<\n  {\n    readonly editorConfig: SanitizedClientEditorConfig // With rendered features n stuff\n  } & LexicalRichTextFieldProps\n> = (props) => {\n  const {\n    editorConfig,\n    field,\n    field: {\n      admin: { className, description, readOnly: readOnlyFromAdmin } = {},\n      label,\n      localized,\n      required,\n    },\n    path: pathFromProps,\n    readOnly: readOnlyFromTopLevelProps,\n    validate, // Users can pass in client side validation if they WANT to, but it's not required anymore\n  } = props\n\n  const readOnlyFromProps = readOnlyFromTopLevelProps || readOnlyFromAdmin\n\n  const editDepth = useEditDepth()\n\n  const memoizedValidate = useCallback<Validate>(\n    (value, validationOptions) => {\n      if (typeof validate === 'function') {\n        // @ts-expect-error - vestiges of when tsconfig was not strict. Feel free to improve\n        return validate(value, { ...validationOptions, required })\n      }\n      return true\n    },\n    // Important: do not add props to the dependencies array.\n    // This would cause an infinite loop and endless re-rendering.\n    // Removing props from the dependencies array fixed this issue: https://github.com/payloadcms/payload/issues/3709\n    [validate, required],\n  )\n\n  const {\n    customComponents: { AfterInput, BeforeInput, Description, Error, Label } = {},\n    disabled: disabledFromField,\n    initialValue,\n    path,\n    setValue,\n    showError,\n    value,\n  } = useField<SerializedEditorState>({\n    potentiallyStalePath: pathFromProps,\n    validate: memoizedValidate,\n  })\n\n  const disabled = readOnlyFromProps || disabledFromField\n\n  const [isSmallWidthViewport, setIsSmallWidthViewport] = useState<boolean>(false)\n  const [rerenderProviderKey, setRerenderProviderKey] = useState<Date>()\n\n  const prevInitialValueRef = React.useRef<SerializedEditorState | undefined>(initialValue)\n  const prevValueRef = React.useRef<SerializedEditorState | undefined>(value)\n\n  useEffect(() => {\n    const updateViewPortWidth = () => {\n      const isNextSmallWidthViewport = window.matchMedia('(max-width: 768px)').matches\n\n      if (isNextSmallWidthViewport !== isSmallWidthViewport) {\n        setIsSmallWidthViewport(isNextSmallWidthViewport)\n      }\n    }\n    updateViewPortWidth()\n    window.addEventListener('resize', updateViewPortWidth)\n\n    return () => {\n      window.removeEventListener('resize', updateViewPortWidth)\n    }\n  }, [isSmallWidthViewport])\n\n  const classes = [\n    'field-type',\n    baseClass,\n    className,\n    showError && 'error',\n    disabled && `${baseClass}--read-only`,\n    editorConfig?.admin?.hideGutter !== true && !isSmallWidthViewport\n      ? `${baseClass}--show-gutter`\n      : null,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  const pathWithEditDepth = `${path}.${editDepth}`\n\n  const runDeprioritized = useRunDeprioritized() // defaults to 500 ms timeout\n\n  const handleChange = useCallback(\n    (editorState: EditorState) => {\n      // Capture `editorState` in the closure so we can safely run later.\n      const updateFieldValue = () => {\n        const newState = editorState.toJSON()\n        prevValueRef.current = newState\n        setValue(newState)\n      }\n\n      // Queue the update for the browser’s idle time (or Safari shim)\n      // and let the hook handle debouncing/cancellation.\n      void runDeprioritized(updateFieldValue)\n    },\n    [setValue, runDeprioritized], // `runDeprioritized` is stable (useCallback inside hook)\n  )\n\n  const styles = useMemo(() => mergeFieldStyles(field), [field])\n\n  const handleInitialValueChange = useEffectEvent(\n    (initialValue: SerializedEditorState | undefined) => {\n      // Object deep equality check here, as re-mounting the editor if\n      // the new value is the same as the old one is not necessary.\n      // In postgres, the order of keys in JSON objects is not guaranteed to be preserved,\n      // so we need to do a deep equality check here that does not care about key order => we use dequal.\n      // If we used JSON.stringify, the editor would re-mount every time you save the document, as the order of keys changes => change detected => re-mount.\n      if (\n        prevValueRef.current !== value &&\n        !dequal(\n          prevValueRef.current != null\n            ? JSON.parse(JSON.stringify(prevValueRef.current))\n            : prevValueRef.current,\n          value,\n        )\n      ) {\n        prevInitialValueRef.current = initialValue\n        prevValueRef.current = value\n        setRerenderProviderKey(new Date())\n      }\n    },\n  )\n\n  useEffect(() => {\n    // Needs to trigger for object reference changes - otherwise,\n    // reacting to the same initial value change twice will cause\n    // the second change to be ignored, even though the value has changed.\n    // That's because initialValue is not kept up-to-date\n    if (!Object.is(initialValue, prevInitialValueRef.current)) {\n      handleInitialValueChange(initialValue)\n    }\n  }, [initialValue])\n\n  return (\n    <div\n      className={classes}\n      data-lexical-view={editorConfig?.view}\n      key={pathWithEditDepth}\n      style={styles}\n    >\n      <RenderCustomComponent\n        CustomComponent={Error}\n        Fallback={<FieldError path={path} showError={showError} />}\n      />\n      <div className={`${baseClass}__label-row`}>\n        {Label || (\n          <FieldLabel label={label} localized={localized} path={path} required={required} />\n        )}\n        <ViewSelector />\n      </div>\n      <div className={`${baseClass}__wrap`}>\n        <ErrorBoundary fallbackRender={fallbackRender} onReset={() => {}}>\n          {BeforeInput}\n          {/* Lexical may be in a drawer. We need to define another BulkUploadProvider to ensure that the bulk upload drawer\n          is rendered in the correct depth (not displayed *behind* the current drawer)*/}\n          <BulkUploadProvider drawerSlugPrefix={path}>\n            <LexicalProvider\n              composerKey={pathWithEditDepth}\n              editorConfig={editorConfig}\n              fieldProps={props}\n              isSmallWidthViewport={isSmallWidthViewport}\n              key={JSON.stringify({ path, rerenderProviderKey })} // makes sure lexical is completely re-rendered when initialValue changes, bypassing the lexical-internal value memoization. That way, external changes to the form will update the editor. More infos in PR description (https://github.com/payloadcms/payload/pull/5010)\n              onChange={handleChange}\n              readOnly={disabled}\n              value={value}\n            />\n          </BulkUploadProvider>\n          {AfterInput}\n        </ErrorBoundary>\n        <RenderCustomComponent\n          CustomComponent={Description}\n          Fallback={<FieldDescription description={description} path={path} />}\n        />\n      </div>\n    </div>\n  )\n}\n\nfunction fallbackRender({ error }: { error: Error }) {\n  // Call resetErrorBoundary() to reset the error boundary and retry the render.\n\n  return (\n    <div className=\"errorBoundary\" role=\"alert\">\n      <p>Something went wrong:</p>\n      <pre style={{ color: 'red' }}>{error.message}</pre>\n    </div>\n  )\n}\n\nexport const RichText: typeof RichTextComponent = RichTextComponent\n"],"names":["BulkUploadProvider","FieldDescription","FieldError","FieldLabel","RenderCustomComponent","useEditDepth","useEffectEvent","useField","mergeFieldStyles","dequal","React","useCallback","useEffect","useMemo","useState","ErrorBoundary","LexicalProvider","useRunDeprioritized","ViewSelector","baseClass","RichTextComponent","props","editorConfig","field","admin","className","description","readOnly","readOnlyFromAdmin","label","localized","required","path","pathFromProps","readOnlyFromTopLevelProps","validate","readOnlyFromProps","editDepth","memoizedValidate","value","validationOptions","customComponents","AfterInput","BeforeInput","Description","Error","Label","disabled","disabledFromField","initialValue","setValue","showError","potentiallyStalePath","isSmallWidthViewport","setIsSmallWidthViewport","rerenderProviderKey","setRerenderProviderKey","prevInitialValueRef","useRef","prevValueRef","updateViewPortWidth","isNextSmallWidthViewport","window","matchMedia","matches","addEventListener","removeEventListener","classes","hideGutter","filter","Boolean","join","pathWithEditDepth","runDeprioritized","handleChange","editorState","updateFieldValue","newState","toJSON","current","styles","handleInitialValueChange","JSON","parse","stringify","Date","Object","is","div","data-lexical-view","view","style","CustomComponent","Fallback","fallbackRender","onReset","drawerSlugPrefix","composerKey","fieldProps","onChange","error","role","p","pre","color","message","RichText"],"mappings":"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"}

package/dist/field/RenderLexical/index.js

@@ -1,4 +1,5 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { FieldContext, FieldPathContext, ServerFunctionsContext, ShimmerEffect, useServerFunctions } from '@payloadcms/ui';
 import React, { useCallback, useEffect, useRef } from 'react';
 /**
@@ -55,7 +56,11 @@ import React, { useCallback, useEffect, useRef } from 'react';
         renderLexical
     ]);
     if (!Component) {
-        return typeof Loading !== 'undefined' ? Loading : <ShimmerEffect/>;
+        return typeof Loading !== 'undefined' ? Loading : /*#__PURE__*/ _jsxDEV(ShimmerEffect, {}, void 0, false, {
+            fileName: "src/field/RenderLexical/index.tsx",
+            lineNumber: 82,
+            columnNumber: 55
+        }, this);
     }
     /**
    * By default, the lexical will make form state requests (e.g. to get drawer fields), passing in the arguments
@@ -72,13 +77,23 @@ import React, { useCallback, useEffect, useRef } from 'react';
         }
     };
     if (typeof value === 'undefined' && !setValue) {
-        return <ServerFunctionsContext value={{
-            ...adjustedServerFunctionContext
-        }}>
-        <FieldPathContext key={fieldPath} value={fieldPath}>
-          {Component}
-        </FieldPathContext>
-      </ServerFunctionsContext>;
+        return /*#__PURE__*/ _jsxDEV(ServerFunctionsContext, {
+            value: {
+                ...adjustedServerFunctionContext
+            },
+            children: /*#__PURE__*/ _jsxDEV(FieldPathContext, {
+                value: fieldPath,
+                children: Component
+            }, fieldPath, false, {
+                fileName: "src/field/RenderLexical/index.tsx",
+                lineNumber: 104,
+                columnNumber: 9
+            }, this)
+        }, void 0, false, {
+            fileName: "src/field/RenderLexical/index.tsx",
+            lineNumber: 103,
+            columnNumber: 7
+        }, this);
     }
     const fieldValue = {
         disabled: false,
@@ -91,13 +106,30 @@ import React, { useCallback, useEffect, useRef } from 'react';
         showError: false,
         value
     };
-    return <ServerFunctionsContext value={{
-        ...adjustedServerFunctionContext
-    }}>
-      <FieldPathContext key={fieldPath} value={fieldPath}>
-        <FieldContext value={fieldValue}>{Component}</FieldContext>
-      </FieldPathContext>
-    </ServerFunctionsContext>;
+    return /*#__PURE__*/ _jsxDEV(ServerFunctionsContext, {
+        value: {
+            ...adjustedServerFunctionContext
+        },
+        children: /*#__PURE__*/ _jsxDEV(FieldPathContext, {
+            value: fieldPath,
+            children: /*#__PURE__*/ _jsxDEV(FieldContext, {
+                value: fieldValue,
+                children: Component
+            }, void 0, false, {
+                fileName: "src/field/RenderLexical/index.tsx",
+                lineNumber: 126,
+                columnNumber: 9
+            }, this)
+        }, fieldPath, false, {
+            fileName: "src/field/RenderLexical/index.tsx",
+            lineNumber: 125,
+            columnNumber: 7
+        }, this)
+    }, void 0, false, {
+        fileName: "src/field/RenderLexical/index.tsx",
+        lineNumber: 124,
+        columnNumber: 5
+    }, this);
 };
 
 //# sourceMappingURL=index.js.map