@payloadcms/richtext-lexical 3.68.0-internal-debug.591ab42 → 3.68.0-internal-debug.e9b66ee

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

@@ -1,12 +1,11 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
 import { useLexicalEditable } from '@lexical/react/useLexicalEditable';
 import { getTranslation } from '@payloadcms/translations';
 import { Button, formatDrawerSlug, Thumbnail, useConfig, useEditDepth, usePayloadAPI, useTranslation } from '@payloadcms/ui';
 import { $getNodeByKey } from 'lexical';
 import { isImage } from 'payload/shared';
-import React, { useCallback, useId, useReducer, useRef, useState } from 'react';
+import { useCallback, useId, useReducer, useRef, useState } from 'react';
 import { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js';
 import { FieldsDrawer } from '../../../../utilities/fieldsDrawer/Drawer.js';
 import { useLexicalDocumentDrawer } from '../../../../utilities/fieldsDrawer/useLexicalDocumentDrawer.js';
@@ -89,171 +88,48 @@ export const UploadComponent = (props)=>{
         nodeKey
     ]);
     const aspectRatio = thumbnailSRC && data?.width && data?.height ? data.width > data.height ? 'landscape' : 'portrait' : 'landscape';
-    return /*#__PURE__*/ _jsxDEV("div", {
-        className: `${baseClass}__contents ${baseClass}__contents--${aspectRatio}`,
-        "data-align": format || undefined,
-        "data-filename": data?.filename,
-        ref: uploadRef,
-        children: [
-            /*#__PURE__*/ _jsxDEV("div", {
-                className: `${baseClass}__card`,
-                children: [
-                    /*#__PURE__*/ _jsxDEV("div", {
-                        className: `${baseClass}__media`,
-                        children: [
-                            /*#__PURE__*/ _jsxDEV(Thumbnail, {
-                                collectionSlug: relationTo,
-                                fileSrc: isImage(data?.mimeType) ? thumbnailSRC : null,
-                                height: data?.height,
-                                size: "none",
-                                width: data?.width
-                            }, void 0, false, {
-                                fileName: "src/features/upload/client/component/index.tsx",
-                                lineNumber: 160,
-                                columnNumber: 11
-                            }, this),
-                            isEditable && /*#__PURE__*/ _jsxDEV("div", {
-                                className: `${baseClass}__overlay ${baseClass}__floater`,
-                                children: /*#__PURE__*/ _jsxDEV("div", {
-                                    className: `${baseClass}__actions`,
-                                    role: "toolbar",
-                                    children: [
-                                        hasExtraFields ? /*#__PURE__*/ _jsxDEV(Button, {
-                                            buttonStyle: "icon-label",
-                                            className: `${baseClass}__upload-drawer-toggler`,
-                                            disabled: !isEditable,
-                                            el: "button",
-                                            icon: "edit",
-                                            onClick: toggleDrawer,
-                                            round: true,
-                                            size: "medium",
-                                            tooltip: t('fields:editRelationship')
-                                        }, void 0, false, {
-                                            fileName: "src/features/upload/client/component/index.tsx",
-                                            lineNumber: 172,
-                                            columnNumber: 19
-                                        }, this) : null,
-                                        /*#__PURE__*/ _jsxDEV(Button, {
-                                            buttonStyle: "icon-label",
-                                            className: `${baseClass}__swap-drawer-toggler`,
-                                            disabled: !isEditable,
-                                            el: "button",
-                                            icon: "swap",
-                                            onClick: ()=>{
-                                                editor.dispatchCommand(INSERT_UPLOAD_WITH_DRAWER_COMMAND, {
-                                                    replace: {
-                                                        nodeKey
-                                                    }
-                                                });
-                                            },
-                                            round: true,
-                                            size: "medium",
-                                            tooltip: t('fields:swapUpload')
-                                        }, void 0, false, {
-                                            fileName: "src/features/upload/client/component/index.tsx",
-                                            lineNumber: 185,
-                                            columnNumber: 17
-                                        }, this),
-                                        /*#__PURE__*/ _jsxDEV(Button, {
-                                            buttonStyle: "icon-label",
-                                            className: `${baseClass}__removeButton`,
-                                            disabled: !isEditable,
-                                            icon: "x",
-                                            onClick: (e)=>{
-                                                e.preventDefault();
-                                                removeUpload();
-                                            },
-                                            round: true,
-                                            size: "medium",
-                                            tooltip: t('fields:removeUpload')
-                                        }, void 0, false, {
-                                            fileName: "src/features/upload/client/component/index.tsx",
-                                            lineNumber: 201,
-                                            columnNumber: 17
-                                        }, this)
-                                    ]
-                                }, void 0, true, {
-                                    fileName: "src/features/upload/client/component/index.tsx",
-                                    lineNumber: 170,
-                                    columnNumber: 15
-                                }, this)
-                            }, void 0, false, {
-                                fileName: "src/features/upload/client/component/index.tsx",
-                                lineNumber: 169,
-                                columnNumber: 13
-                            }, this)
-                        ]
-                    }, void 0, true, {
-                        fileName: "src/features/upload/client/component/index.tsx",
-                        lineNumber: 159,
-                        columnNumber: 9
-                    }, this),
-                    /*#__PURE__*/ _jsxDEV("div", {
-                        className: `${baseClass}__metaOverlay ${baseClass}__floater`,
-                        children: [
-                            /*#__PURE__*/ _jsxDEV(DocumentDrawerToggler, {
-                                className: `${baseClass}__doc-drawer-toggler`,
-                                children: /*#__PURE__*/ _jsxDEV("strong", {
-                                    className: `${baseClass}__filename`,
-                                    children: data?.filename || t('general:untitled')
-                                }, void 0, false, {
-                                    fileName: "src/features/upload/client/component/index.tsx",
-                                    lineNumber: 221,
-                                    columnNumber: 13
-                                }, this)
-                            }, void 0, false, {
-                                fileName: "src/features/upload/client/component/index.tsx",
-                                lineNumber: 220,
-                                columnNumber: 11
-                            }, this),
-                            /*#__PURE__*/ _jsxDEV("div", {
-                                className: `${baseClass}__collectionLabel`,
-                                children: getTranslation(relatedCollection.labels.singular, i18n)
-                            }, void 0, false, {
-                                fileName: "src/features/upload/client/component/index.tsx",
-                                lineNumber: 225,
-                                columnNumber: 11
-                            }, this)
-                        ]
-                    }, void 0, true, {
-                        fileName: "src/features/upload/client/component/index.tsx",
-                        lineNumber: 219,
-                        columnNumber: 9
-                    }, this)
-                ]
-            }, void 0, true, {
-                fileName: "src/features/upload/client/component/index.tsx",
-                lineNumber: 158,
-                columnNumber: 7
-            }, this),
-            value ? /*#__PURE__*/ _jsxDEV(DocumentDrawer, {
-                onSave: updateUpload
-            }, void 0, false, {
-                fileName: "src/features/upload/client/component/index.tsx",
-                lineNumber: 231,
-                columnNumber: 16
-            }, this) : null,
-            hasExtraFields ? /*#__PURE__*/ _jsxDEV(FieldsDrawer, {
-                data: fields,
-                drawerSlug: extraFieldsDrawerSlug,
-                drawerTitle: t('general:editLabel', {
-                    label: getTranslation(relatedCollection.labels.singular, i18n)
-                }),
-                featureKey: "upload",
-                handleDrawerSubmit: onExtraFieldsDrawerSubmit,
-                schemaPath: schemaPath,
-                schemaPathSuffix: relatedCollection.slug
-            }, void 0, false, {
-                fileName: "src/features/upload/client/component/index.tsx",
-                lineNumber: 233,
-                columnNumber: 9
-            }, this) : null
-        ]
-    }, void 0, true, {
-        fileName: "src/features/upload/client/component/index.tsx",
-        lineNumber: 152,
-        columnNumber: 5
-    }, this);
+    return <div className={`${baseClass}__contents ${baseClass}__contents--${aspectRatio}`} data-align={format || undefined} data-filename={data?.filename} ref={uploadRef}>
+      <div className={`${baseClass}__card`}>
+        <div className={`${baseClass}__media`}>
+          <Thumbnail collectionSlug={relationTo} fileSrc={isImage(data?.mimeType) ? thumbnailSRC : null} height={data?.height} size="none" width={data?.width}/>
+
+          {isEditable && <div className={`${baseClass}__overlay ${baseClass}__floater`}>
+              <div className={`${baseClass}__actions`} role="toolbar">
+                {hasExtraFields ? <Button buttonStyle="icon-label" className={`${baseClass}__upload-drawer-toggler`} disabled={!isEditable} el="button" icon="edit" onClick={toggleDrawer} round size="medium" tooltip={t('fields:editRelationship')}/> : null}
+
+                <Button buttonStyle="icon-label" className={`${baseClass}__swap-drawer-toggler`} disabled={!isEditable} el="button" icon="swap" onClick={()=>{
+        editor.dispatchCommand(INSERT_UPLOAD_WITH_DRAWER_COMMAND, {
+            replace: {
+                nodeKey
+            }
+        });
+    }} round size="medium" tooltip={t('fields:swapUpload')}/>
+
+                <Button buttonStyle="icon-label" className={`${baseClass}__removeButton`} disabled={!isEditable} icon="x" onClick={(e)=>{
+        e.preventDefault();
+        removeUpload();
+    }} round size="medium" tooltip={t('fields:removeUpload')}/>
+              </div>
+            </div>}
+        </div>
+
+        <div className={`${baseClass}__metaOverlay ${baseClass}__floater`}>
+          <DocumentDrawerToggler className={`${baseClass}__doc-drawer-toggler`}>
+            <strong className={`${baseClass}__filename`}>
+              {data?.filename || t('general:untitled')}
+            </strong>
+          </DocumentDrawerToggler>
+          <div className={`${baseClass}__collectionLabel`}>
+            {getTranslation(relatedCollection.labels.singular, i18n)}
+          </div>
+        </div>
+      </div>
+
+      {value ? <DocumentDrawer onSave={updateUpload}/> : null}
+      {hasExtraFields ? <FieldsDrawer data={fields} drawerSlug={extraFieldsDrawerSlug} drawerTitle={t('general:editLabel', {
+        label: getTranslation(relatedCollection.labels.singular, i18n)
+    })} featureKey="upload" handleDrawerSubmit={onExtraFieldsDrawerSubmit} schemaPath={schemaPath} schemaPathSuffix={relatedCollection.slug}/> : null}
+    </div>;
 };
 
 //# sourceMappingURL=index.js.map

package/dist/features/upload/client/component/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/features/upload/client/component/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig, Data, FormState, JsonObject } from 'payload'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n  Button,\n  formatDrawerSlug,\n  Thumbnail,\n  useConfig,\n  useEditDepth,\n  usePayloadAPI,\n  useTranslation,\n} from '@payloadcms/ui'\nimport { $getNodeByKey, type ElementFormatType } from 'lexical'\nimport { isImage } from 'payload/shared'\nimport React, { useCallback, useId, useReducer, useRef, useState } from 'react'\n\nimport type { BaseClientFeatureProps } from '../../../typesClient.js'\nimport type { UploadData } from '../../server/nodes/UploadNode.js'\nimport type { UploadFeaturePropsClient } from '../index.js'\nimport type { UploadNode } from '../nodes/UploadNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { FieldsDrawer } from '../../../../utilities/fieldsDrawer/Drawer.js'\nimport { useLexicalDocumentDrawer } from '../../../../utilities/fieldsDrawer/useLexicalDocumentDrawer.js'\nimport { useLexicalDrawer } from '../../../../utilities/fieldsDrawer/useLexicalDrawer.js'\nimport { INSERT_UPLOAD_WITH_DRAWER_COMMAND } from '../drawer/commands.js'\nimport './index.scss'\n\nconst initialParams = {\n  depth: 0,\n}\n\nexport type ElementProps = {\n  className: string\n  data: UploadData\n  format?: ElementFormatType\n  nodeKey: string\n}\n\nexport const UploadComponent: React.FC<ElementProps> = (props) => {\n  const {\n    className: baseClass,\n    data: { fields, relationTo, value },\n    format,\n    nodeKey,\n  } = props\n\n  if (typeof value === 'object') {\n    throw new Error(\n      'Upload value should be a string or number. The Lexical Upload component should not receive the populated value object.',\n    )\n  }\n\n  const {\n    config: {\n      routes: { api },\n      serverURL,\n    },\n    getEntityConfig,\n  } = useConfig()\n  const uploadRef = useRef<HTMLDivElement | null>(null)\n  const { uuid } = useEditorConfigContext()\n  const editDepth = useEditDepth()\n  const [editor] = useLexicalComposerContext()\n\n  const {\n    editorConfig,\n    fieldProps: { schemaPath },\n  } = useEditorConfigContext()\n  const isEditable = useLexicalEditable()\n  const { i18n, t } = useTranslation()\n  const [cacheBust, dispatchCacheBust] = useReducer((state) => state + 1, 0)\n  const [relatedCollection] = useState<ClientCollectionConfig>(() =>\n    getEntityConfig({ collectionSlug: relationTo }),\n  )\n\n  const componentID = useId()\n\n  const extraFieldsDrawerSlug = formatDrawerSlug({\n    slug: `lexical-upload-drawer-` + uuid + componentID, // There can be multiple upload components, each with their own drawer, in one single editor => separate them by componentID\n    depth: editDepth,\n  })\n\n  // Need to use hook to initialize useEffect that restores cursor position\n  const { toggleDrawer } = useLexicalDrawer(extraFieldsDrawerSlug, true)\n\n  const { closeDocumentDrawer, DocumentDrawer, DocumentDrawerToggler } = useLexicalDocumentDrawer({\n    id: value,\n    collectionSlug: relatedCollection.slug,\n  })\n\n  // Get the referenced document\n  const [{ data }, { setParams }] = usePayloadAPI(\n    `${serverURL}${api}/${relatedCollection.slug}/${value}`,\n    { initialParams },\n  )\n\n  const thumbnailSRC = data?.thumbnailURL || data?.url\n\n  const removeUpload = useCallback(() => {\n    editor.update(() => {\n      $getNodeByKey(nodeKey)?.remove()\n    })\n  }, [editor, nodeKey])\n\n  const updateUpload = useCallback(\n    (_data: Data) => {\n      setParams({\n        ...initialParams,\n        cacheBust, // do this to get the usePayloadAPI to re-fetch the data even though the URL string hasn't changed\n      })\n\n      dispatchCacheBust()\n      closeDocumentDrawer()\n    },\n    [setParams, cacheBust, closeDocumentDrawer],\n  )\n\n  const hasExtraFields = (\n    editorConfig?.resolvedFeatureMap?.get('upload')\n      ?.sanitizedClientFeatureProps as BaseClientFeatureProps<UploadFeaturePropsClient>\n  ).collections?.[relatedCollection.slug]?.hasExtraFields\n\n  const onExtraFieldsDrawerSubmit = useCallback(\n    (_: FormState, data: JsonObject) => {\n      // Update lexical node (with key nodeKey) with new data\n      editor.update(() => {\n        const uploadNode: null | UploadNode = $getNodeByKey(nodeKey)\n        if (uploadNode) {\n          const newData: UploadData = {\n            ...uploadNode.getData(),\n            fields: data,\n          }\n          uploadNode.setData(newData)\n        }\n      })\n    },\n    [editor, nodeKey],\n  )\n\n  const aspectRatio =\n    thumbnailSRC && data?.width && data?.height\n      ? data.width > data.height\n        ? 'landscape'\n        : 'portrait'\n      : 'landscape'\n\n  return (\n    <div\n      className={`${baseClass}__contents ${baseClass}__contents--${aspectRatio}`}\n      data-align={format || undefined}\n      data-filename={data?.filename}\n      ref={uploadRef}\n    >\n      <div className={`${baseClass}__card`}>\n        <div className={`${baseClass}__media`}>\n          <Thumbnail\n            collectionSlug={relationTo}\n            fileSrc={isImage(data?.mimeType) ? thumbnailSRC : null}\n            height={data?.height}\n            size=\"none\"\n            width={data?.width}\n          />\n\n          {isEditable && (\n            <div className={`${baseClass}__overlay ${baseClass}__floater`}>\n              <div className={`${baseClass}__actions`} role=\"toolbar\">\n                {hasExtraFields ? (\n                  <Button\n                    buttonStyle=\"icon-label\"\n                    className={`${baseClass}__upload-drawer-toggler`}\n                    disabled={!isEditable}\n                    el=\"button\"\n                    icon=\"edit\"\n                    onClick={toggleDrawer}\n                    round\n                    size=\"medium\"\n                    tooltip={t('fields:editRelationship')}\n                  />\n                ) : null}\n\n                <Button\n                  buttonStyle=\"icon-label\"\n                  className={`${baseClass}__swap-drawer-toggler`}\n                  disabled={!isEditable}\n                  el=\"button\"\n                  icon=\"swap\"\n                  onClick={() => {\n                    editor.dispatchCommand(INSERT_UPLOAD_WITH_DRAWER_COMMAND, {\n                      replace: { nodeKey },\n                    })\n                  }}\n                  round\n                  size=\"medium\"\n                  tooltip={t('fields:swapUpload')}\n                />\n\n                <Button\n                  buttonStyle=\"icon-label\"\n                  className={`${baseClass}__removeButton`}\n                  disabled={!isEditable}\n                  icon=\"x\"\n                  onClick={(e) => {\n                    e.preventDefault()\n                    removeUpload()\n                  }}\n                  round\n                  size=\"medium\"\n                  tooltip={t('fields:removeUpload')}\n                />\n              </div>\n            </div>\n          )}\n        </div>\n\n        <div className={`${baseClass}__metaOverlay ${baseClass}__floater`}>\n          <DocumentDrawerToggler className={`${baseClass}__doc-drawer-toggler`}>\n            <strong className={`${baseClass}__filename`}>\n              {data?.filename || t('general:untitled')}\n            </strong>\n          </DocumentDrawerToggler>\n          <div className={`${baseClass}__collectionLabel`}>\n            {getTranslation(relatedCollection.labels.singular, i18n)}\n          </div>\n        </div>\n      </div>\n\n      {value ? <DocumentDrawer onSave={updateUpload} /> : null}\n      {hasExtraFields ? (\n        <FieldsDrawer\n          data={fields}\n          drawerSlug={extraFieldsDrawerSlug}\n          drawerTitle={t('general:editLabel', {\n            label: getTranslation(relatedCollection.labels.singular, i18n),\n          })}\n          featureKey=\"upload\"\n          handleDrawerSubmit={onExtraFieldsDrawerSubmit}\n          schemaPath={schemaPath}\n          schemaPathSuffix={relatedCollection.slug}\n        />\n      ) : null}\n    </div>\n  )\n}\n"],"names":["useLexicalComposerContext","useLexicalEditable","getTranslation","Button","formatDrawerSlug","Thumbnail","useConfig","useEditDepth","usePayloadAPI","useTranslation","$getNodeByKey","isImage","React","useCallback","useId","useReducer","useRef","useState","useEditorConfigContext","FieldsDrawer","useLexicalDocumentDrawer","useLexicalDrawer","INSERT_UPLOAD_WITH_DRAWER_COMMAND","initialParams","depth","UploadComponent","props","className","baseClass","data","fields","relationTo","value","format","nodeKey","Error","config","routes","api","serverURL","getEntityConfig","uploadRef","uuid","editDepth","editor","editorConfig","fieldProps","schemaPath","isEditable","i18n","t","cacheBust","dispatchCacheBust","state","relatedCollection","collectionSlug","componentID","extraFieldsDrawerSlug","slug","toggleDrawer","closeDocumentDrawer","DocumentDrawer","DocumentDrawerToggler","id","setParams","thumbnailSRC","thumbnailURL","url","removeUpload","update","remove","updateUpload","_data","hasExtraFields","resolvedFeatureMap","get","sanitizedClientFeatureProps","collections","onExtraFieldsDrawerSubmit","_","uploadNode","newData","getData","setData","aspectRatio","width","height","div","data-align","undefined","data-filename","filename","ref","fileSrc","mimeType","size","role","buttonStyle","disabled","el","icon","onClick","round","tooltip","dispatchCommand","replace","e","preventDefault","strong","labels","singular","onSave","drawerSlug","drawerTitle","label","featureKey","handleDrawerSubmit","schemaPathSuffix"],"mappings":"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"}
+{"version":3,"sources":["../../../../../src/features/upload/client/component/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig, Data, FormState, JsonObject } from 'payload'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n  Button,\n  formatDrawerSlug,\n  Thumbnail,\n  useConfig,\n  useEditDepth,\n  usePayloadAPI,\n  useTranslation,\n} from '@payloadcms/ui'\nimport { $getNodeByKey, type ElementFormatType } from 'lexical'\nimport { isImage } from 'payload/shared'\nimport React, { useCallback, useId, useReducer, useRef, useState } from 'react'\n\nimport type { BaseClientFeatureProps } from '../../../typesClient.js'\nimport type { UploadData } from '../../server/nodes/UploadNode.js'\nimport type { UploadFeaturePropsClient } from '../index.js'\nimport type { UploadNode } from '../nodes/UploadNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { FieldsDrawer } from '../../../../utilities/fieldsDrawer/Drawer.js'\nimport { useLexicalDocumentDrawer } from '../../../../utilities/fieldsDrawer/useLexicalDocumentDrawer.js'\nimport { useLexicalDrawer } from '../../../../utilities/fieldsDrawer/useLexicalDrawer.js'\nimport { INSERT_UPLOAD_WITH_DRAWER_COMMAND } from '../drawer/commands.js'\nimport './index.scss'\n\nconst initialParams = {\n  depth: 0,\n}\n\nexport type ElementProps = {\n  className: string\n  data: UploadData\n  format?: ElementFormatType\n  nodeKey: string\n}\n\nexport const UploadComponent: React.FC<ElementProps> = (props) => {\n  const {\n    className: baseClass,\n    data: { fields, relationTo, value },\n    format,\n    nodeKey,\n  } = props\n\n  if (typeof value === 'object') {\n    throw new Error(\n      'Upload value should be a string or number. The Lexical Upload component should not receive the populated value object.',\n    )\n  }\n\n  const {\n    config: {\n      routes: { api },\n      serverURL,\n    },\n    getEntityConfig,\n  } = useConfig()\n  const uploadRef = useRef<HTMLDivElement | null>(null)\n  const { uuid } = useEditorConfigContext()\n  const editDepth = useEditDepth()\n  const [editor] = useLexicalComposerContext()\n\n  const {\n    editorConfig,\n    fieldProps: { schemaPath },\n  } = useEditorConfigContext()\n  const isEditable = useLexicalEditable()\n  const { i18n, t } = useTranslation()\n  const [cacheBust, dispatchCacheBust] = useReducer((state) => state + 1, 0)\n  const [relatedCollection] = useState<ClientCollectionConfig>(() =>\n    getEntityConfig({ collectionSlug: relationTo }),\n  )\n\n  const componentID = useId()\n\n  const extraFieldsDrawerSlug = formatDrawerSlug({\n    slug: `lexical-upload-drawer-` + uuid + componentID, // There can be multiple upload components, each with their own drawer, in one single editor => separate them by componentID\n    depth: editDepth,\n  })\n\n  // Need to use hook to initialize useEffect that restores cursor position\n  const { toggleDrawer } = useLexicalDrawer(extraFieldsDrawerSlug, true)\n\n  const { closeDocumentDrawer, DocumentDrawer, DocumentDrawerToggler } = useLexicalDocumentDrawer({\n    id: value,\n    collectionSlug: relatedCollection.slug,\n  })\n\n  // Get the referenced document\n  const [{ data }, { setParams }] = usePayloadAPI(\n    `${serverURL}${api}/${relatedCollection.slug}/${value}`,\n    { initialParams },\n  )\n\n  const thumbnailSRC = data?.thumbnailURL || data?.url\n\n  const removeUpload = useCallback(() => {\n    editor.update(() => {\n      $getNodeByKey(nodeKey)?.remove()\n    })\n  }, [editor, nodeKey])\n\n  const updateUpload = useCallback(\n    (_data: Data) => {\n      setParams({\n        ...initialParams,\n        cacheBust, // do this to get the usePayloadAPI to re-fetch the data even though the URL string hasn't changed\n      })\n\n      dispatchCacheBust()\n      closeDocumentDrawer()\n    },\n    [setParams, cacheBust, closeDocumentDrawer],\n  )\n\n  const hasExtraFields = (\n    editorConfig?.resolvedFeatureMap?.get('upload')\n      ?.sanitizedClientFeatureProps as BaseClientFeatureProps<UploadFeaturePropsClient>\n  ).collections?.[relatedCollection.slug]?.hasExtraFields\n\n  const onExtraFieldsDrawerSubmit = useCallback(\n    (_: FormState, data: JsonObject) => {\n      // Update lexical node (with key nodeKey) with new data\n      editor.update(() => {\n        const uploadNode: null | UploadNode = $getNodeByKey(nodeKey)\n        if (uploadNode) {\n          const newData: UploadData = {\n            ...uploadNode.getData(),\n            fields: data,\n          }\n          uploadNode.setData(newData)\n        }\n      })\n    },\n    [editor, nodeKey],\n  )\n\n  const aspectRatio =\n    thumbnailSRC && data?.width && data?.height\n      ? data.width > data.height\n        ? 'landscape'\n        : 'portrait'\n      : 'landscape'\n\n  return (\n    <div\n      className={`${baseClass}__contents ${baseClass}__contents--${aspectRatio}`}\n      data-align={format || undefined}\n      data-filename={data?.filename}\n      ref={uploadRef}\n    >\n      <div className={`${baseClass}__card`}>\n        <div className={`${baseClass}__media`}>\n          <Thumbnail\n            collectionSlug={relationTo}\n            fileSrc={isImage(data?.mimeType) ? thumbnailSRC : null}\n            height={data?.height}\n            size=\"none\"\n            width={data?.width}\n          />\n\n          {isEditable && (\n            <div className={`${baseClass}__overlay ${baseClass}__floater`}>\n              <div className={`${baseClass}__actions`} role=\"toolbar\">\n                {hasExtraFields ? (\n                  <Button\n                    buttonStyle=\"icon-label\"\n                    className={`${baseClass}__upload-drawer-toggler`}\n                    disabled={!isEditable}\n                    el=\"button\"\n                    icon=\"edit\"\n                    onClick={toggleDrawer}\n                    round\n                    size=\"medium\"\n                    tooltip={t('fields:editRelationship')}\n                  />\n                ) : null}\n\n                <Button\n                  buttonStyle=\"icon-label\"\n                  className={`${baseClass}__swap-drawer-toggler`}\n                  disabled={!isEditable}\n                  el=\"button\"\n                  icon=\"swap\"\n                  onClick={() => {\n                    editor.dispatchCommand(INSERT_UPLOAD_WITH_DRAWER_COMMAND, {\n                      replace: { nodeKey },\n                    })\n                  }}\n                  round\n                  size=\"medium\"\n                  tooltip={t('fields:swapUpload')}\n                />\n\n                <Button\n                  buttonStyle=\"icon-label\"\n                  className={`${baseClass}__removeButton`}\n                  disabled={!isEditable}\n                  icon=\"x\"\n                  onClick={(e) => {\n                    e.preventDefault()\n                    removeUpload()\n                  }}\n                  round\n                  size=\"medium\"\n                  tooltip={t('fields:removeUpload')}\n                />\n              </div>\n            </div>\n          )}\n        </div>\n\n        <div className={`${baseClass}__metaOverlay ${baseClass}__floater`}>\n          <DocumentDrawerToggler className={`${baseClass}__doc-drawer-toggler`}>\n            <strong className={`${baseClass}__filename`}>\n              {data?.filename || t('general:untitled')}\n            </strong>\n          </DocumentDrawerToggler>\n          <div className={`${baseClass}__collectionLabel`}>\n            {getTranslation(relatedCollection.labels.singular, i18n)}\n          </div>\n        </div>\n      </div>\n\n      {value ? <DocumentDrawer onSave={updateUpload} /> : null}\n      {hasExtraFields ? (\n        <FieldsDrawer\n          data={fields}\n          drawerSlug={extraFieldsDrawerSlug}\n          drawerTitle={t('general:editLabel', {\n            label: getTranslation(relatedCollection.labels.singular, i18n),\n          })}\n          featureKey=\"upload\"\n          handleDrawerSubmit={onExtraFieldsDrawerSubmit}\n          schemaPath={schemaPath}\n          schemaPathSuffix={relatedCollection.slug}\n        />\n      ) : null}\n    </div>\n  )\n}\n"],"names":["useLexicalComposerContext","useLexicalEditable","getTranslation","Button","formatDrawerSlug","Thumbnail","useConfig","useEditDepth","usePayloadAPI","useTranslation","$getNodeByKey","isImage","useCallback","useId","useReducer","useRef","useState","useEditorConfigContext","FieldsDrawer","useLexicalDocumentDrawer","useLexicalDrawer","INSERT_UPLOAD_WITH_DRAWER_COMMAND","initialParams","depth","UploadComponent","props","className","baseClass","data","fields","relationTo","value","format","nodeKey","Error","config","routes","api","serverURL","getEntityConfig","uploadRef","uuid","editDepth","editor","editorConfig","fieldProps","schemaPath","isEditable","i18n","t","cacheBust","dispatchCacheBust","state","relatedCollection","collectionSlug","componentID","extraFieldsDrawerSlug","slug","toggleDrawer","closeDocumentDrawer","DocumentDrawer","DocumentDrawerToggler","id","setParams","thumbnailSRC","thumbnailURL","url","removeUpload","update","remove","updateUpload","_data","hasExtraFields","resolvedFeatureMap","get","sanitizedClientFeatureProps","collections","onExtraFieldsDrawerSubmit","_","uploadNode","newData","getData","setData","aspectRatio","width","height","div","data-align","undefined","data-filename","filename","ref","fileSrc","mimeType","size","role","buttonStyle","disabled","el","icon","onClick","round","tooltip","dispatchCommand","replace","e","preventDefault","strong","labels","singular","onSave","drawerSlug","drawerTitle","label","featureKey","handleDrawerSubmit","schemaPathSuffix"],"mappings":"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"}

package/dist/features/upload/client/component/pending/index.js

@@ -1,23 +1,10 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { ShimmerEffect } from '@payloadcms/ui';
 import '../index.scss';
 export const PendingUploadComponent = ()=>{
-    return /*#__PURE__*/ _jsxDEV("div", {
-        className: 'lexical-upload',
-        children: /*#__PURE__*/ _jsxDEV(ShimmerEffect, {
-            height: '95px',
-            width: '203px'
-        }, void 0, false, {
-            fileName: "src/features/upload/client/component/pending/index.tsx",
-            lineNumber: 10,
-            columnNumber: 7
-        }, this)
-    }, void 0, false, {
-        fileName: "src/features/upload/client/component/pending/index.tsx",
-        lineNumber: 9,
-        columnNumber: 5
-    }, this);
+    return <div className={'lexical-upload'}>
+      <ShimmerEffect height={'95px'} width={'203px'}/>
+    </div>;
 };
 
 //# sourceMappingURL=index.js.map

package/dist/features/upload/client/component/pending/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/features/upload/client/component/pending/index.tsx"],"sourcesContent":["'use client'\n\nimport { ShimmerEffect } from '@payloadcms/ui'\n\nimport '../index.scss'\n\nexport const PendingUploadComponent = (): React.ReactNode => {\n  return (\n    <div className={'lexical-upload'}>\n      <ShimmerEffect height={'95px'} width={'203px'} />\n    </div>\n  )\n}\n"],"names":["ShimmerEffect","PendingUploadComponent","div","className","height","width"],"mappings":"AAAA;;AAEA,SAASA,aAAa,QAAQ,iBAAgB;AAE9C,OAAO,gBAAe;AAEtB,OAAO,MAAMC,yBAAyB;IACpC,qBACE,QAACC;QAAIC,WAAW;kBACd,cAAA,QAACH;YAAcI,QAAQ;YAAQC,OAAO;;;;;;;;;;;AAG5C,EAAC"}
+{"version":3,"sources":["../../../../../../src/features/upload/client/component/pending/index.tsx"],"sourcesContent":["'use client'\n\nimport { ShimmerEffect } from '@payloadcms/ui'\n\nimport '../index.scss'\n\nexport const PendingUploadComponent = (): React.ReactNode => {\n  return (\n    <div className={'lexical-upload'}>\n      <ShimmerEffect height={'95px'} width={'203px'} />\n    </div>\n  )\n}\n"],"names":["ShimmerEffect","PendingUploadComponent","div","className","height","width"],"mappings":"AAAA;AAEA,SAASA,aAAa,QAAQ,iBAAgB;AAE9C,OAAO,gBAAe;AAEtB,OAAO,MAAMC,yBAAyB;IACpC,QACGC,IAAIC,WAAW,kBAAkB;MAChC,CAACH,cAAcI,QAAQ,QAAQC,OAAO,UAAW;IACnD,EAAEH;AAEN,EAAC"}

package/dist/features/upload/client/drawer/index.js

@@ -1,9 +1,8 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
 import { toast } from '@payloadcms/ui';
 import { $getNodeByKey, COMMAND_PRIORITY_EDITOR } from 'lexical';
-import React, { useCallback, useEffect, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import { useLexicalListDrawer } from '../../../../utilities/fieldsDrawer/useLexicalListDrawer.js';
 import { $createUploadNode } from '../nodes/UploadNode.js';
 import { INSERT_UPLOAD_COMMAND } from '../plugin/index.js';
@@ -62,13 +61,7 @@ const UploadDrawerComponent = ({ enabledCollectionSlugs })=>{
         closeListDrawer,
         replaceNodeKey
     ]);
-    return /*#__PURE__*/ _jsxDEV(ListDrawer, {
-        onSelect: onSelect
-    }, void 0, false, {
-        fileName: "src/features/upload/client/drawer/index.tsx",
-        lineNumber: 94,
-        columnNumber: 10
-    }, this);
+    return <ListDrawer onSelect={onSelect}/>;
 };
 const UploadDrawerComponentFallback = ()=>{
     const [editor] = useLexicalComposerContext();
@@ -84,19 +77,9 @@ const UploadDrawerComponentFallback = ()=>{
 };
 export const UploadDrawer = ({ enabledCollectionSlugs })=>{
     if (!enabledCollectionSlugs?.length) {
-        return /*#__PURE__*/ _jsxDEV(UploadDrawerComponentFallback, {}, void 0, false, {
-            fileName: "src/features/upload/client/drawer/index.tsx",
-            lineNumber: 118,
-            columnNumber: 12
-        }, this);
+        return <UploadDrawerComponentFallback/>;
     }
-    return /*#__PURE__*/ _jsxDEV(UploadDrawerComponent, {
-        enabledCollectionSlugs: enabledCollectionSlugs
-    }, void 0, false, {
-        fileName: "src/features/upload/client/drawer/index.tsx",
-        lineNumber: 121,
-        columnNumber: 10
-    }, this);
+    return <UploadDrawerComponent enabledCollectionSlugs={enabledCollectionSlugs}/>;
 };
 
 //# sourceMappingURL=index.js.map

package/dist/features/upload/client/drawer/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/features/upload/client/drawer/index.tsx"],"sourcesContent":["'use client'\nimport type { ListDrawerProps } from '@payloadcms/ui'\nimport type { LexicalEditor } from 'lexical'\nimport type { UploadCollectionSlug } from 'payload'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { toast } from '@payloadcms/ui'\nimport { $getNodeByKey, COMMAND_PRIORITY_EDITOR } from 'lexical'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport { useLexicalListDrawer } from '../../../../utilities/fieldsDrawer/useLexicalListDrawer.js'\nimport { $createUploadNode } from '../nodes/UploadNode.js'\nimport { INSERT_UPLOAD_COMMAND } from '../plugin/index.js'\nimport { INSERT_UPLOAD_WITH_DRAWER_COMMAND } from './commands.js'\n\nconst insertUpload = ({\n  editor,\n  relationTo,\n  replaceNodeKey,\n  value,\n}: {\n  editor: LexicalEditor\n  relationTo: string\n  replaceNodeKey: null | string\n  value: number | string\n}) => {\n  if (!replaceNodeKey) {\n    editor.dispatchCommand(INSERT_UPLOAD_COMMAND, {\n      // @ts-expect-error - TODO: fix this\n      fields: null,\n      relationTo,\n      value,\n    })\n  } else {\n    editor.update(() => {\n      const node = $getNodeByKey(replaceNodeKey)\n      if (node) {\n        node.replace(\n          $createUploadNode({\n            data: {\n              // @ts-expect-error - TODO: fix this\n              fields: null,\n              relationTo,\n              value,\n            },\n          }),\n        )\n      }\n    })\n  }\n}\n\ntype Props = {\n  enabledCollectionSlugs: UploadCollectionSlug[]\n}\n\nconst UploadDrawerComponent: React.FC<Props> = ({ enabledCollectionSlugs }) => {\n  const [editor] = useLexicalComposerContext()\n\n  const [replaceNodeKey, setReplaceNodeKey] = useState<null | string>(null)\n\n  const { closeListDrawer, ListDrawer, openListDrawer } = useLexicalListDrawer({\n    collectionSlugs: enabledCollectionSlugs,\n    uploads: true,\n  })\n\n  useEffect(() => {\n    return editor.registerCommand<{\n      replace: { nodeKey: string } | false\n    }>(\n      INSERT_UPLOAD_WITH_DRAWER_COMMAND,\n      (payload) => {\n        setReplaceNodeKey(payload?.replace ? payload?.replace.nodeKey : null)\n        openListDrawer()\n        return true\n      },\n      COMMAND_PRIORITY_EDITOR,\n    )\n  }, [editor, openListDrawer])\n\n  const onSelect = useCallback<NonNullable<ListDrawerProps['onSelect']>>(\n    ({ collectionSlug, doc }) => {\n      closeListDrawer()\n      insertUpload({\n        editor,\n        relationTo: collectionSlug,\n        replaceNodeKey,\n        value: doc.id,\n      })\n    },\n    [editor, closeListDrawer, replaceNodeKey],\n  )\n\n  return <ListDrawer onSelect={onSelect} />\n}\n\nconst UploadDrawerComponentFallback: React.FC = () => {\n  const [editor] = useLexicalComposerContext()\n\n  useEffect(() => {\n    return editor.registerCommand<{\n      replace: { nodeKey: string } | false\n    }>(\n      INSERT_UPLOAD_WITH_DRAWER_COMMAND,\n      () => {\n        toast.error('No upload collections enabled')\n        return true\n      },\n      COMMAND_PRIORITY_EDITOR,\n    )\n  }, [editor])\n\n  return null\n}\n\nexport const UploadDrawer = ({ enabledCollectionSlugs }: Props): React.ReactNode => {\n  if (!enabledCollectionSlugs?.length) {\n    return <UploadDrawerComponentFallback />\n  }\n\n  return <UploadDrawerComponent enabledCollectionSlugs={enabledCollectionSlugs} />\n}\n"],"names":["useLexicalComposerContext","toast","$getNodeByKey","COMMAND_PRIORITY_EDITOR","React","useCallback","useEffect","useState","useLexicalListDrawer","$createUploadNode","INSERT_UPLOAD_COMMAND","INSERT_UPLOAD_WITH_DRAWER_COMMAND","insertUpload","editor","relationTo","replaceNodeKey","value","dispatchCommand","fields","update","node","replace","data","UploadDrawerComponent","enabledCollectionSlugs","setReplaceNodeKey","closeListDrawer","ListDrawer","openListDrawer","collectionSlugs","uploads","registerCommand","payload","nodeKey","onSelect","collectionSlug","doc","id","UploadDrawerComponentFallback","error","UploadDrawer","length"],"mappings":"AAAA;;AAKA,SAASA,yBAAyB,QAAQ,2CAA0C;AACpF,SAASC,KAAK,QAAQ,iBAAgB;AACtC,SAASC,aAAa,EAAEC,uBAAuB,QAAQ,UAAS;AAChE,OAAOC,SAASC,WAAW,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,QAAO;AAE/D,SAASC,oBAAoB,QAAQ,6DAA4D;AACjG,SAASC,iBAAiB,QAAQ,yBAAwB;AAC1D,SAASC,qBAAqB,QAAQ,qBAAoB;AAC1D,SAASC,iCAAiC,QAAQ,gBAAe;AAEjE,MAAMC,eAAe,CAAC,EACpBC,MAAM,EACNC,UAAU,EACVC,cAAc,EACdC,KAAK,EAMN;IACC,IAAI,CAACD,gBAAgB;QACnBF,OAAOI,eAAe,CAACP,uBAAuB;YAC5C,oCAAoC;YACpCQ,QAAQ;YACRJ;YACAE;QACF;IACF,OAAO;QACLH,OAAOM,MAAM,CAAC;YACZ,MAAMC,OAAOlB,cAAca;YAC3B,IAAIK,MAAM;gBACRA,KAAKC,OAAO,CACVZ,kBAAkB;oBAChBa,MAAM;wBACJ,oCAAoC;wBACpCJ,QAAQ;wBACRJ;wBACAE;oBACF;gBACF;YAEJ;QACF;IACF;AACF;AAMA,MAAMO,wBAAyC,CAAC,EAAEC,sBAAsB,EAAE;IACxE,MAAM,CAACX,OAAO,GAAGb;IAEjB,MAAM,CAACe,gBAAgBU,kBAAkB,GAAGlB,SAAwB;IAEpE,MAAM,EAAEmB,eAAe,EAAEC,UAAU,EAAEC,cAAc,EAAE,GAAGpB,qBAAqB;QAC3EqB,iBAAiBL;QACjBM,SAAS;IACX;IAEAxB,UAAU;QACR,OAAOO,OAAOkB,eAAe,CAG3BpB,mCACA,CAACqB;YACCP,kBAAkBO,SAASX,UAAUW,SAASX,QAAQY,UAAU;YAChEL;YACA,OAAO;QACT,GACAzB;IAEJ,GAAG;QAACU;QAAQe;KAAe;IAE3B,MAAMM,WAAW7B,YACf,CAAC,EAAE8B,cAAc,EAAEC,GAAG,EAAE;QACtBV;QACAd,aAAa;YACXC;YACAC,YAAYqB;YACZpB;YACAC,OAAOoB,IAAIC,EAAE;QACf;IACF,GACA;QAACxB;QAAQa;QAAiBX;KAAe;IAG3C,qBAAO,QAACY;QAAWO,UAAUA;;;;;;AAC/B;AAEA,MAAMI,gCAA0C;IAC9C,MAAM,CAACzB,OAAO,GAAGb;IAEjBM,UAAU;QACR,OAAOO,OAAOkB,eAAe,CAG3BpB,mCACA;YACEV,MAAMsC,KAAK,CAAC;YACZ,OAAO;QACT,GACApC;IAEJ,GAAG;QAACU;KAAO;IAEX,OAAO;AACT;AAEA,OAAO,MAAM2B,eAAe,CAAC,EAAEhB,sBAAsB,EAAS;IAC5D,IAAI,CAACA,wBAAwBiB,QAAQ;QACnC,qBAAO,QAACH;;;;;IACV;IAEA,qBAAO,QAACf;QAAsBC,wBAAwBA;;;;;;AACxD,EAAC"}
+{"version":3,"sources":["../../../../../src/features/upload/client/drawer/index.tsx"],"sourcesContent":["'use client'\nimport type { ListDrawerProps } from '@payloadcms/ui'\nimport type { LexicalEditor } from 'lexical'\nimport type { UploadCollectionSlug } from 'payload'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { toast } from '@payloadcms/ui'\nimport { $getNodeByKey, COMMAND_PRIORITY_EDITOR } from 'lexical'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport { useLexicalListDrawer } from '../../../../utilities/fieldsDrawer/useLexicalListDrawer.js'\nimport { $createUploadNode } from '../nodes/UploadNode.js'\nimport { INSERT_UPLOAD_COMMAND } from '../plugin/index.js'\nimport { INSERT_UPLOAD_WITH_DRAWER_COMMAND } from './commands.js'\n\nconst insertUpload = ({\n  editor,\n  relationTo,\n  replaceNodeKey,\n  value,\n}: {\n  editor: LexicalEditor\n  relationTo: string\n  replaceNodeKey: null | string\n  value: number | string\n}) => {\n  if (!replaceNodeKey) {\n    editor.dispatchCommand(INSERT_UPLOAD_COMMAND, {\n      // @ts-expect-error - TODO: fix this\n      fields: null,\n      relationTo,\n      value,\n    })\n  } else {\n    editor.update(() => {\n      const node = $getNodeByKey(replaceNodeKey)\n      if (node) {\n        node.replace(\n          $createUploadNode({\n            data: {\n              // @ts-expect-error - TODO: fix this\n              fields: null,\n              relationTo,\n              value,\n            },\n          }),\n        )\n      }\n    })\n  }\n}\n\ntype Props = {\n  enabledCollectionSlugs: UploadCollectionSlug[]\n}\n\nconst UploadDrawerComponent: React.FC<Props> = ({ enabledCollectionSlugs }) => {\n  const [editor] = useLexicalComposerContext()\n\n  const [replaceNodeKey, setReplaceNodeKey] = useState<null | string>(null)\n\n  const { closeListDrawer, ListDrawer, openListDrawer } = useLexicalListDrawer({\n    collectionSlugs: enabledCollectionSlugs,\n    uploads: true,\n  })\n\n  useEffect(() => {\n    return editor.registerCommand<{\n      replace: { nodeKey: string } | false\n    }>(\n      INSERT_UPLOAD_WITH_DRAWER_COMMAND,\n      (payload) => {\n        setReplaceNodeKey(payload?.replace ? payload?.replace.nodeKey : null)\n        openListDrawer()\n        return true\n      },\n      COMMAND_PRIORITY_EDITOR,\n    )\n  }, [editor, openListDrawer])\n\n  const onSelect = useCallback<NonNullable<ListDrawerProps['onSelect']>>(\n    ({ collectionSlug, doc }) => {\n      closeListDrawer()\n      insertUpload({\n        editor,\n        relationTo: collectionSlug,\n        replaceNodeKey,\n        value: doc.id,\n      })\n    },\n    [editor, closeListDrawer, replaceNodeKey],\n  )\n\n  return <ListDrawer onSelect={onSelect} />\n}\n\nconst UploadDrawerComponentFallback: React.FC = () => {\n  const [editor] = useLexicalComposerContext()\n\n  useEffect(() => {\n    return editor.registerCommand<{\n      replace: { nodeKey: string } | false\n    }>(\n      INSERT_UPLOAD_WITH_DRAWER_COMMAND,\n      () => {\n        toast.error('No upload collections enabled')\n        return true\n      },\n      COMMAND_PRIORITY_EDITOR,\n    )\n  }, [editor])\n\n  return null\n}\n\nexport const UploadDrawer = ({ enabledCollectionSlugs }: Props): React.ReactNode => {\n  if (!enabledCollectionSlugs?.length) {\n    return <UploadDrawerComponentFallback />\n  }\n\n  return <UploadDrawerComponent enabledCollectionSlugs={enabledCollectionSlugs} />\n}\n"],"names":["useLexicalComposerContext","toast","$getNodeByKey","COMMAND_PRIORITY_EDITOR","useCallback","useEffect","useState","useLexicalListDrawer","$createUploadNode","INSERT_UPLOAD_COMMAND","INSERT_UPLOAD_WITH_DRAWER_COMMAND","insertUpload","editor","relationTo","replaceNodeKey","value","dispatchCommand","fields","update","node","replace","data","UploadDrawerComponent","enabledCollectionSlugs","setReplaceNodeKey","closeListDrawer","ListDrawer","openListDrawer","collectionSlugs","uploads","registerCommand","payload","nodeKey","onSelect","collectionSlug","doc","id","UploadDrawerComponentFallback","error","UploadDrawer","length"],"mappings":"AAAA;AAKA,SAASA,yBAAyB,QAAQ,2CAA0C;AACpF,SAASC,KAAK,QAAQ,iBAAgB;AACtC,SAASC,aAAa,EAAEC,uBAAuB,QAAQ,UAAS;AAChE,SAAgBC,WAAW,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,QAAO;AAE/D,SAASC,oBAAoB,QAAQ,6DAA4D;AACjG,SAASC,iBAAiB,QAAQ,yBAAwB;AAC1D,SAASC,qBAAqB,QAAQ,qBAAoB;AAC1D,SAASC,iCAAiC,QAAQ,gBAAe;AAEjE,MAAMC,eAAe,CAAC,EACpBC,MAAM,EACNC,UAAU,EACVC,cAAc,EACdC,KAAK,EAMN;IACC,IAAI,CAACD,gBAAgB;QACnBF,OAAOI,eAAe,CAACP,uBAAuB;YAC5C,oCAAoC;YACpCQ,QAAQ;YACRJ;YACAE;QACF;IACF,OAAO;QACLH,OAAOM,MAAM,CAAC;YACZ,MAAMC,OAAOjB,cAAcY;YAC3B,IAAIK,MAAM;gBACRA,KAAKC,OAAO,CACVZ,kBAAkB;oBAChBa,MAAM;wBACJ,oCAAoC;wBACpCJ,QAAQ;wBACRJ;wBACAE;oBACF;gBACF;YAEJ;QACF;IACF;AACF;AAMA,MAAMO,wBAAyC,CAAC,EAAEC,sBAAsB,EAAE;IACxE,MAAM,CAACX,OAAO,GAAGZ;IAEjB,MAAM,CAACc,gBAAgBU,kBAAkB,GAAGlB,SAAwB;IAEpE,MAAM,EAAEmB,eAAe,EAAEC,UAAU,EAAEC,cAAc,EAAE,GAAGpB,qBAAqB;QAC3EqB,iBAAiBL;QACjBM,SAAS;IACX;IAEAxB,UAAU;QACR,OAAOO,OAAOkB,eAAe,CAG3BpB,mCACA,CAACqB;YACCP,kBAAkBO,SAASX,UAAUW,SAASX,QAAQY,UAAU;YAChEL;YACA,OAAO;QACT,GACAxB;IAEJ,GAAG;QAACS;QAAQe;KAAe;IAE3B,MAAMM,WAAW7B,YACf,CAAC,EAAE8B,cAAc,EAAEC,GAAG,EAAE;QACtBV;QACAd,aAAa;YACXC;YACAC,YAAYqB;YACZpB;YACAC,OAAOoB,IAAIC,EAAE;QACf;IACF,GACA;QAACxB;QAAQa;QAAiBX;KAAe;IAG3C,QAAQY,WAAWO,UAAUA;AAC/B;AAEA,MAAMI,gCAA0C;IAC9C,MAAM,CAACzB,OAAO,GAAGZ;IAEjBK,UAAU;QACR,OAAOO,OAAOkB,eAAe,CAG3BpB,mCACA;YACET,MAAMqC,KAAK,CAAC;YACZ,OAAO;QACT,GACAnC;IAEJ,GAAG;QAACS;KAAO;IAEX,OAAO;AACT;AAEA,OAAO,MAAM2B,eAAe,CAAC,EAAEhB,sBAAsB,EAAS;IAC5D,IAAI,CAACA,wBAAwBiB,QAAQ;QACnC,QAAQH;IACV;IAEA,QAAQf,sBAAsBC,wBAAwBA;AACxD,EAAC"}

package/dist/features/upload/client/nodes/UploadNode.js

@@ -1,12 +1,11 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import ObjectID from 'bson-objectid';
 import { $applyNodeReplacement } from 'lexical';
 import * as React from 'react';
 import { $convertUploadElement } from '../../server/nodes/conversions.js';
 import { UploadServerNode } from '../../server/nodes/UploadNode.js';
 import { PendingUploadComponent } from '../component/pending/index.js';
-const RawUploadComponent = /*#__PURE__*/ React.lazy(()=>import('../../client/component/index.js').then((module)=>({
+const RawUploadComponent = React.lazy(()=>import('../../client/component/index.js').then((module)=>({
             default: module.UploadComponent
         })));
 export class UploadNode extends UploadServerNode {
@@ -47,22 +46,9 @@ export class UploadNode extends UploadServerNode {
     }
     decorate(editor, config) {
         if (this.__data.pending) {
-            return /*#__PURE__*/ _jsxDEV(PendingUploadComponent, {}, void 0, false, {
-                fileName: "src/features/upload/client/nodes/UploadNode.tsx",
-                lineNumber: 66,
-                columnNumber: 14
-            }, this);
+            return <PendingUploadComponent/>;
         }
-        return /*#__PURE__*/ _jsxDEV(RawUploadComponent, {
-            className: config?.theme?.upload ?? 'LexicalEditorTheme__upload',
-            data: this.__data,
-            format: this.__format,
-            nodeKey: this.getKey()
-        }, void 0, false, {
-            fileName: "src/features/upload/client/nodes/UploadNode.tsx",
-            lineNumber: 69,
-            columnNumber: 7
-        }, this);
+        return <RawUploadComponent className={config?.theme?.upload ?? 'LexicalEditorTheme__upload'} data={this.__data} format={this.__format} nodeKey={this.getKey()}/>;
     }
     exportJSON() {
         return super.exportJSON();

package/dist/features/upload/client/nodes/UploadNode.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/features/upload/client/nodes/UploadNode.tsx"],"sourcesContent":["'use client'\nimport type { DOMConversionMap, EditorConfig, LexicalEditor, LexicalNode } from 'lexical'\nimport type { JSX } from 'react'\n\nimport ObjectID from 'bson-objectid'\nimport { $applyNodeReplacement } from 'lexical'\nimport * as React from 'react'\n\nimport type {\n  Internal_UploadData,\n  SerializedUploadNode,\n  UploadData,\n} from '../../server/nodes/UploadNode.js'\n\nimport { $convertUploadElement } from '../../server/nodes/conversions.js'\nimport { UploadServerNode } from '../../server/nodes/UploadNode.js'\nimport { PendingUploadComponent } from '../component/pending/index.js'\n\nconst RawUploadComponent = React.lazy(() =>\n  import('../../client/component/index.js').then((module) => ({ default: module.UploadComponent })),\n)\n\nexport class UploadNode extends UploadServerNode {\n  static override clone(node: UploadServerNode): UploadServerNode {\n    return super.clone(node)\n  }\n\n  static override getType(): string {\n    return super.getType()\n  }\n\n  static override importDOM(): DOMConversionMap<HTMLImageElement> {\n    return {\n      img: (node) => ({\n        conversion: (domNode) => $convertUploadElement(domNode, $createUploadNode),\n        priority: 0,\n      }),\n    }\n  }\n\n  static override importJSON(serializedNode: SerializedUploadNode): UploadNode {\n    if (serializedNode.version === 1 && (serializedNode?.value as unknown as { id: string })?.id) {\n      serializedNode.value = (serializedNode.value as unknown as { id: string }).id\n    }\n    if (serializedNode.version === 2 && !serializedNode?.id) {\n      serializedNode.id = new ObjectID.default().toHexString()\n      serializedNode.version = 3\n    }\n\n    const importedData: Internal_UploadData = {\n      id: serializedNode.id,\n      fields: serializedNode.fields,\n      pending: (serializedNode as Internal_UploadData).pending,\n      relationTo: serializedNode.relationTo,\n      value: serializedNode.value,\n    }\n\n    const node = $createUploadNode({ data: importedData })\n    node.setFormat(serializedNode.format)\n\n    return node\n  }\n\n  override decorate(editor?: LexicalEditor, config?: EditorConfig): JSX.Element {\n    if ((this.__data as Internal_UploadData).pending) {\n      return <PendingUploadComponent />\n    }\n    return (\n      <RawUploadComponent\n        className={config?.theme?.upload ?? 'LexicalEditorTheme__upload'}\n        data={this.__data}\n        format={this.__format}\n        nodeKey={this.getKey()}\n      />\n    )\n  }\n\n  override exportJSON(): SerializedUploadNode {\n    return super.exportJSON()\n  }\n}\n\nexport function $createUploadNode({\n  data,\n}: {\n  data: Omit<UploadData, 'id'> & Partial<Pick<UploadData, 'id'>>\n}): UploadNode {\n  if (!data?.id) {\n    data.id = new ObjectID.default().toHexString()\n  }\n\n  return $applyNodeReplacement(new UploadNode({ data: data as UploadData }))\n}\n\nexport function $isUploadNode(node: LexicalNode | null | undefined): node is UploadNode {\n  return node instanceof UploadNode\n}\n"],"names":["ObjectID","$applyNodeReplacement","React","$convertUploadElement","UploadServerNode","PendingUploadComponent","RawUploadComponent","lazy","then","module","default","UploadComponent","UploadNode","clone","node","getType","importDOM","img","conversion","domNode","$createUploadNode","priority","importJSON","serializedNode","version","value","id","toHexString","importedData","fields","pending","relationTo","data","setFormat","format","decorate","editor","config","__data","className","theme","upload","__format","nodeKey","getKey","exportJSON","$isUploadNode"],"mappings":"AAAA;;AAIA,OAAOA,cAAc,gBAAe;AACpC,SAASC,qBAAqB,QAAQ,UAAS;AAC/C,YAAYC,WAAW,QAAO;AAQ9B,SAASC,qBAAqB,QAAQ,oCAAmC;AACzE,SAASC,gBAAgB,QAAQ,mCAAkC;AACnE,SAASC,sBAAsB,QAAQ,gCAA+B;AAEtE,MAAMC,mCAAqBJ,MAAMK,IAAI,CAAC,IACpC,MAAM,CAAC,mCAAmCC,IAAI,CAAC,CAACC,SAAY,CAAA;YAAEC,SAASD,OAAOE,eAAe;QAAC,CAAA;AAGhG,OAAO,MAAMC,mBAAmBR;IAC9B,OAAgBS,MAAMC,IAAsB,EAAoB;QAC9D,OAAO,KAAK,CAACD,MAAMC;IACrB;IAEA,OAAgBC,UAAkB;QAChC,OAAO,KAAK,CAACA;IACf;IAEA,OAAgBC,YAAgD;QAC9D,OAAO;YACLC,KAAK,CAACH,OAAU,CAAA;oBACdI,YAAY,CAACC,UAAYhB,sBAAsBgB,SAASC;oBACxDC,UAAU;gBACZ,CAAA;QACF;IACF;IAEA,OAAgBC,WAAWC,cAAoC,EAAc;QAC3E,IAAIA,eAAeC,OAAO,KAAK,KAAMD,gBAAgBE,OAAqCC,IAAI;YAC5FH,eAAeE,KAAK,GAAG,AAACF,eAAeE,KAAK,CAA+BC,EAAE;QAC/E;QACA,IAAIH,eAAeC,OAAO,KAAK,KAAK,CAACD,gBAAgBG,IAAI;YACvDH,eAAeG,EAAE,GAAG,IAAI1B,SAASU,OAAO,GAAGiB,WAAW;YACtDJ,eAAeC,OAAO,GAAG;QAC3B;QAEA,MAAMI,eAAoC;YACxCF,IAAIH,eAAeG,EAAE;YACrBG,QAAQN,eAAeM,MAAM;YAC7BC,SAAS,AAACP,eAAuCO,OAAO;YACxDC,YAAYR,eAAeQ,UAAU;YACrCN,OAAOF,eAAeE,KAAK;QAC7B;QAEA,MAAMX,OAAOM,kBAAkB;YAAEY,MAAMJ;QAAa;QACpDd,KAAKmB,SAAS,CAACV,eAAeW,MAAM;QAEpC,OAAOpB;IACT;IAESqB,SAASC,MAAsB,EAAEC,MAAqB,EAAe;QAC5E,IAAI,AAAC,IAAI,CAACC,MAAM,CAAyBR,OAAO,EAAE;YAChD,qBAAO,QAACzB;;;;;QACV;QACA,qBACE,QAACC;YACCiC,WAAWF,QAAQG,OAAOC,UAAU;YACpCT,MAAM,IAAI,CAACM,MAAM;YACjBJ,QAAQ,IAAI,CAACQ,QAAQ;YACrBC,SAAS,IAAI,CAACC,MAAM;;;;;;IAG1B;IAESC,aAAmC;QAC1C,OAAO,KAAK,CAACA;IACf;AACF;AAEA,OAAO,SAASzB,kBAAkB,EAChCY,IAAI,EAGL;IACC,IAAI,CAACA,MAAMN,IAAI;QACbM,KAAKN,EAAE,GAAG,IAAI1B,SAASU,OAAO,GAAGiB,WAAW;IAC9C;IAEA,OAAO1B,sBAAsB,IAAIW,WAAW;QAAEoB,MAAMA;IAAmB;AACzE;AAEA,OAAO,SAASc,cAAchC,IAAoC;IAChE,OAAOA,gBAAgBF;AACzB"}
+{"version":3,"sources":["../../../../../src/features/upload/client/nodes/UploadNode.tsx"],"sourcesContent":["'use client'\nimport type { DOMConversionMap, EditorConfig, LexicalEditor, LexicalNode } from 'lexical'\nimport type { JSX } from 'react'\n\nimport ObjectID from 'bson-objectid'\nimport { $applyNodeReplacement } from 'lexical'\nimport * as React from 'react'\n\nimport type {\n  Internal_UploadData,\n  SerializedUploadNode,\n  UploadData,\n} from '../../server/nodes/UploadNode.js'\n\nimport { $convertUploadElement } from '../../server/nodes/conversions.js'\nimport { UploadServerNode } from '../../server/nodes/UploadNode.js'\nimport { PendingUploadComponent } from '../component/pending/index.js'\n\nconst RawUploadComponent = React.lazy(() =>\n  import('../../client/component/index.js').then((module) => ({ default: module.UploadComponent })),\n)\n\nexport class UploadNode extends UploadServerNode {\n  static override clone(node: UploadServerNode): UploadServerNode {\n    return super.clone(node)\n  }\n\n  static override getType(): string {\n    return super.getType()\n  }\n\n  static override importDOM(): DOMConversionMap<HTMLImageElement> {\n    return {\n      img: (node) => ({\n        conversion: (domNode) => $convertUploadElement(domNode, $createUploadNode),\n        priority: 0,\n      }),\n    }\n  }\n\n  static override importJSON(serializedNode: SerializedUploadNode): UploadNode {\n    if (serializedNode.version === 1 && (serializedNode?.value as unknown as { id: string })?.id) {\n      serializedNode.value = (serializedNode.value as unknown as { id: string }).id\n    }\n    if (serializedNode.version === 2 && !serializedNode?.id) {\n      serializedNode.id = new ObjectID.default().toHexString()\n      serializedNode.version = 3\n    }\n\n    const importedData: Internal_UploadData = {\n      id: serializedNode.id,\n      fields: serializedNode.fields,\n      pending: (serializedNode as Internal_UploadData).pending,\n      relationTo: serializedNode.relationTo,\n      value: serializedNode.value,\n    }\n\n    const node = $createUploadNode({ data: importedData })\n    node.setFormat(serializedNode.format)\n\n    return node\n  }\n\n  override decorate(editor?: LexicalEditor, config?: EditorConfig): JSX.Element {\n    if ((this.__data as Internal_UploadData).pending) {\n      return <PendingUploadComponent />\n    }\n    return (\n      <RawUploadComponent\n        className={config?.theme?.upload ?? 'LexicalEditorTheme__upload'}\n        data={this.__data}\n        format={this.__format}\n        nodeKey={this.getKey()}\n      />\n    )\n  }\n\n  override exportJSON(): SerializedUploadNode {\n    return super.exportJSON()\n  }\n}\n\nexport function $createUploadNode({\n  data,\n}: {\n  data: Omit<UploadData, 'id'> & Partial<Pick<UploadData, 'id'>>\n}): UploadNode {\n  if (!data?.id) {\n    data.id = new ObjectID.default().toHexString()\n  }\n\n  return $applyNodeReplacement(new UploadNode({ data: data as UploadData }))\n}\n\nexport function $isUploadNode(node: LexicalNode | null | undefined): node is UploadNode {\n  return node instanceof UploadNode\n}\n"],"names":["ObjectID","$applyNodeReplacement","React","$convertUploadElement","UploadServerNode","PendingUploadComponent","RawUploadComponent","lazy","then","module","default","UploadComponent","UploadNode","clone","node","getType","importDOM","img","conversion","domNode","$createUploadNode","priority","importJSON","serializedNode","version","value","id","toHexString","importedData","fields","pending","relationTo","data","setFormat","format","decorate","editor","config","__data","className","theme","upload","__format","nodeKey","getKey","exportJSON","$isUploadNode"],"mappings":"AAAA;AAIA,OAAOA,cAAc,gBAAe;AACpC,SAASC,qBAAqB,QAAQ,UAAS;AAC/C,YAAYC,WAAW,QAAO;AAQ9B,SAASC,qBAAqB,QAAQ,oCAAmC;AACzE,SAASC,gBAAgB,QAAQ,mCAAkC;AACnE,SAASC,sBAAsB,QAAQ,gCAA+B;AAEtE,MAAMC,qBAAqBJ,MAAMK,IAAI,CAAC,IACpC,MAAM,CAAC,mCAAmCC,IAAI,CAAC,CAACC,SAAY,CAAA;YAAEC,SAASD,OAAOE,eAAe;QAAC,CAAA;AAGhG,OAAO,MAAMC,mBAAmBR;IAC9B,OAAgBS,MAAMC,IAAsB,EAAoB;QAC9D,OAAO,KAAK,CAACD,MAAMC;IACrB;IAEA,OAAgBC,UAAkB;QAChC,OAAO,KAAK,CAACA;IACf;IAEA,OAAgBC,YAAgD;QAC9D,OAAO;YACLC,KAAK,CAACH,OAAU,CAAA;oBACdI,YAAY,CAACC,UAAYhB,sBAAsBgB,SAASC;oBACxDC,UAAU;gBACZ,CAAA;QACF;IACF;IAEA,OAAgBC,WAAWC,cAAoC,EAAc;QAC3E,IAAIA,eAAeC,OAAO,KAAK,KAAMD,gBAAgBE,OAAqCC,IAAI;YAC5FH,eAAeE,KAAK,GAAG,AAACF,eAAeE,KAAK,CAA+BC,EAAE;QAC/E;QACA,IAAIH,eAAeC,OAAO,KAAK,KAAK,CAACD,gBAAgBG,IAAI;YACvDH,eAAeG,EAAE,GAAG,IAAI1B,SAASU,OAAO,GAAGiB,WAAW;YACtDJ,eAAeC,OAAO,GAAG;QAC3B;QAEA,MAAMI,eAAoC;YACxCF,IAAIH,eAAeG,EAAE;YACrBG,QAAQN,eAAeM,MAAM;YAC7BC,SAAS,AAACP,eAAuCO,OAAO;YACxDC,YAAYR,eAAeQ,UAAU;YACrCN,OAAOF,eAAeE,KAAK;QAC7B;QAEA,MAAMX,OAAOM,kBAAkB;YAAEY,MAAMJ;QAAa;QACpDd,KAAKmB,SAAS,CAACV,eAAeW,MAAM;QAEpC,OAAOpB;IACT;IAESqB,SAASC,MAAsB,EAAEC,MAAqB,EAAe;QAC5E,IAAI,AAAC,IAAI,CAACC,MAAM,CAAyBR,OAAO,EAAE;YAChD,QAAQzB;QACV;QACA,QACGC,mBACCiC,WAAWF,QAAQG,OAAOC,UAAU,8BACpCT,MAAM,IAAI,CAACM,MAAM,EACjBJ,QAAQ,IAAI,CAACQ,QAAQ,EACrBC,SAAS,IAAI,CAACC,MAAM;IAG1B;IAESC,aAAmC;QAC1C,OAAO,KAAK,CAACA;IACf;AACF;AAEA,OAAO,SAASzB,kBAAkB,EAChCY,IAAI,EAGL;IACC,IAAI,CAACA,MAAMN,IAAI;QACbM,KAAKN,EAAE,GAAG,IAAI1B,SAASU,OAAO,GAAGiB,WAAW;IAC9C;IAEA,OAAO1B,sBAAsB,IAAIW,WAAW;QAAEoB,MAAMA;IAAmB;AACzE;AAEA,OAAO,SAASc,cAAchC,IAAoC;IAChE,OAAOA,gBAAgBF;AACzB"}

package/dist/features/upload/client/plugin/index.js

@@ -1,11 +1,10 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
 import { $dfsIterator, $insertNodeToNearestRoot, mergeRegister } from '@lexical/utils';
 import { useBulkUpload, useEffectEvent, useModal } from '@payloadcms/ui';
 import ObjectID from 'bson-objectid';
 import { $createRangeSelection, $getPreviousSelection, $getSelection, $isParagraphNode, $isRangeSelection, $setSelection, COMMAND_PRIORITY_EDITOR, COMMAND_PRIORITY_LOW, createCommand, DROP_COMMAND, getDOMSelectionFromTarget, isHTMLElement, PASTE_COMMAND } from 'lexical';
-import React, { useEffect } from 'react';
+import { useEffect } from 'react';
 import { useEnabledRelationships } from '../../../relationship/client/utils/useEnabledRelationships.js';
 import { UploadDrawer } from '../drawer/index.js';
 import { $createUploadNode, $isUploadNode, UploadNode } from '../nodes/UploadNode.js';
@@ -308,13 +307,7 @@ export const INSERT_UPLOAD_COMMAND = createCommand('INSERT_UPLOAD_COMMAND');
     }, [
         editor
     ]);
-    return /*#__PURE__*/ _jsxDEV(UploadDrawer, {
-        enabledCollectionSlugs: enabledCollectionSlugs
-    }, void 0, false, {
-        fileName: "src/features/upload/client/plugin/index.tsx",
-        lineNumber: 401,
-        columnNumber: 10
-    }, this);
+    return <UploadDrawer enabledCollectionSlugs={enabledCollectionSlugs}/>;
 };
 
 //# sourceMappingURL=index.js.map