@payloadcms/ui 4.0.0-internal.21664f3 → 4.0.0-internal.22d1431

package/dist/elements/UnpublishMany/index.js

@@ -9,7 +9,7 @@ import { useTranslation } from '../../providers/Translation/index.js';
 import { ListSelectionButton } from '../ListSelection/index.js';
 import { UnpublishManyDrawerContent } from './DrawerContent.js';
 export const UnpublishMany = props => {
-  const $ = _c(12);
+  const $ = _c(14);
   const {
     collection,
     collection: t0,
@@ -20,10 +20,18 @@ export const UnpublishMany = props => {
     selectAll,
     where
   } = props;
+  let t1;
+  if ($[0] !== t0) {
+    t1 = t0 === undefined ? {} : t0;
+    $[0] = t0;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
   const {
     slug,
     versions
-  } = t0 === undefined ? {} : t0;
+  } = t1;
   const {
     t
   } = useTranslation();
@@ -39,23 +47,23 @@ export const UnpublishMany = props => {
   if (!versions?.drafts || count === 0 || !hasPermission) {
     return null;
   }
-  let t1;
-  if ($[0] !== collection || $[1] !== drawerSlug || $[2] !== ids || $[3] !== onSuccess || $[4] !== selectAll || $[5] !== t || $[6] !== toggleModal || $[7] !== where) {
-    let t2;
-    if ($[9] !== drawerSlug || $[10] !== toggleModal) {
-      t2 = () => {
+  let t2;
+  if ($[2] !== collection || $[3] !== drawerSlug || $[4] !== ids || $[5] !== onSuccess || $[6] !== selectAll || $[7] !== t || $[8] !== toggleModal || $[9] !== where) {
+    let t3;
+    if ($[11] !== drawerSlug || $[12] !== toggleModal) {
+      t3 = () => {
         toggleModal(drawerSlug);
       };
-      $[9] = drawerSlug;
-      $[10] = toggleModal;
-      $[11] = t2;
+      $[11] = drawerSlug;
+      $[12] = toggleModal;
+      $[13] = t3;
     } else {
-      t2 = $[11];
+      t3 = $[13];
     }
-    t1 = _jsxs(React.Fragment, {
+    t2 = _jsxs(React.Fragment, {
       children: [_jsx(ListSelectionButton, {
         "aria-label": t("version:unpublish"),
-        onClick: t2,
+        onClick: t3,
         children: t("version:unpublish")
       }), _jsx(UnpublishManyDrawerContent, {
         collection,
@@ -66,18 +74,18 @@ export const UnpublishMany = props => {
         where
       })]
     });
-    $[0] = collection;
-    $[1] = drawerSlug;
-    $[2] = ids;
-    $[3] = onSuccess;
-    $[4] = selectAll;
-    $[5] = t;
-    $[6] = toggleModal;
-    $[7] = where;
-    $[8] = t1;
+    $[2] = collection;
+    $[3] = drawerSlug;
+    $[4] = ids;
+    $[5] = onSuccess;
+    $[6] = selectAll;
+    $[7] = t;
+    $[8] = toggleModal;
+    $[9] = where;
+    $[10] = t2;
   } else {
-    t1 = $[8];
+    t2 = $[10];
   }
-  return t1;
+  return t2;
 };
 //# sourceMappingURL=index.js.map

package/dist/elements/UnpublishMany/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","useModal","React","useAuth","useTranslation","ListSelectionButton","UnpublishManyDrawerContent","UnpublishMany","props","$","collection","t0","count","ids","modalPrefix","onSuccess","selectAll","where","slug","versions","undefined","t","permissions","toggleModal","collectionPermissions","collections","hasPermission","update","drawerSlug","drafts","t1","t2","_jsxs","Fragment","children","_jsx","onClick"],"sources":["../../../src/elements/UnpublishMany/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig, Where } from 'payload'\n\nimport { useModal } from '@faceless-ui/modal'\nimport React from 'react'\n\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ListSelectionButton } from '../ListSelection/index.js'\nimport { UnpublishManyDrawerContent } from './DrawerContent.js'\n\nexport type UnpublishManyProps = {\n  collection: ClientCollectionConfig\n  count: number\n  ids: (number | string)[]\n  /**\n   * When multiple UnpublishMany components are rendered on the page, this will differentiate them.\n   */\n  modalPrefix?: string\n  onSuccess?: () => void\n  selectAll: boolean\n  where?: Where\n}\n\nexport const UnpublishMany: React.FC<UnpublishManyProps> = (props) => {\n  const {\n    collection,\n    collection: { slug, versions } = {},\n    count,\n    ids,\n    modalPrefix,\n    onSuccess,\n    selectAll,\n    where,\n  } = props\n\n  const { t } = useTranslation()\n  const { permissions } = useAuth()\n  const { toggleModal } = useModal()\n\n  const collectionPermissions = permissions?.collections?.[slug]\n  const hasPermission = collectionPermissions?.update\n\n  const drawerSlug = `${modalPrefix ? `${modalPrefix}-` : ''}unpublish-${slug}`\n\n  if (!versions?.drafts || count === 0 || !hasPermission) {\n    return null\n  }\n\n  return (\n    <React.Fragment>\n      <ListSelectionButton\n        aria-label={t('version:unpublish')}\n        onClick={() => {\n          toggleModal(drawerSlug)\n        }}\n      >\n        {t('version:unpublish')}\n      </ListSelectionButton>\n      <UnpublishManyDrawerContent\n        collection={collection}\n        drawerSlug={drawerSlug}\n        ids={ids}\n        onSuccess={onSuccess}\n        selectAll={selectAll}\n        where={where}\n      />\n    </React.Fragment>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SAASC,QAAQ,QAAQ;AACzB,OAAOC,KAAA,MAAW;AAElB,SAASC,OAAO,QAAQ;AACxB,SAASC,cAAc,QAAQ;AAC/B,SAASC,mBAAmB,QAAQ;AACpC,SAASC,0BAA0B,QAAQ;AAe3C,OAAO,MAAMC,aAAA,GAA8CC,KAAA;EAAA,MAAAC,CAAA,GAAAT,EAAA;EACzD;IAAAU,UAAA;IAAAA,UAAA,EAAAC,EAAA;IAAAC,KAAA;IAAAC,GAAA;IAAAC,WAAA;IAAAC,SAAA;IAAAC,SAAA;IAAAC;EAAA,IASIT,KAAA;EAPU;IAAAU,IAAA;IAAAC;EAAA,IAAAR,EAAuB,KAAAS,SAAA,QAAvBT,EAAuB;EASrC;IAAAU;EAAA,IAAcjB,cAAA;EACd;IAAAkB;EAAA,IAAwBnB,OAAA;EACxB;IAAAoB;EAAA,IAAwBtB,QAAA;EAExB,MAAAuB,qBAAA,GAA8BF,WAAA,EAAAG,WAAA,GAA2BP,IAAA;EACzD,MAAAQ,aAAA,GAAsBF,qBAAA,EAAAG,MAAA;EAEtB,MAAAC,UAAA,GAAmB,GAAGd,WAAA,GAAc,GAAGA,WAAA,GAAc,GAAG,eAAeI,IAAA,EAAM;EAAA,IAEzE,CAACC,QAAA,EAAAU,MAAA,IAAoBjB,KAAA,MAAU,KAAMc,aAAA;IAAA;EAAA;EAAA,IAAAI,EAAA;EAAA,IAAArB,CAAA,QAAAC,UAAA,IAAAD,CAAA,QAAAmB,UAAA,IAAAnB,CAAA,QAAAI,GAAA,IAAAJ,CAAA,QAAAM,SAAA,IAAAN,CAAA,QAAAO,SAAA,IAAAP,CAAA,QAAAY,CAAA,IAAAZ,CAAA,QAAAc,WAAA,IAAAd,CAAA,QAAAQ,KAAA;IAAA,IAAAc,EAAA;IAAA,IAAAtB,CAAA,QAAAmB,UAAA,IAAAnB,CAAA,SAAAc,WAAA;MAQ1BQ,EAAA,GAAAA,CAAA;QACPR,WAAA,CAAYK,UAAA;MAAA;MACdnB,CAAA,MAAAmB,UAAA;MAAAnB,CAAA,OAAAc,WAAA;MAAAd,CAAA,OAAAsB,EAAA;IAAA;MAAAA,EAAA,GAAAtB,CAAA;IAAA;IALJqB,EAAA,GAAAE,KAAA,CAAA9B,KAAA,CAAA+B,QAAA;MAAAC,QAAA,GACEC,IAAA,CAAA9B,mBAAA;QAAA,cACcgB,CAAA,CAAE;QAAAe,OAAA,EACLL,EAET;QAAAG,QAAA,EAECb,CAAA,CAAE;MAAA,C,GAELc,IAAA,CAAA7B,0BAAA;QAAAI,UAAA;QAAAkB,UAAA;QAAAf,GAAA;QAAAE,SAAA;QAAAC,SAAA;QAAAC;MAAA,C;;;;;;;;;;;;;;SATFa,E;CAmBJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","useModal","React","useAuth","useTranslation","ListSelectionButton","UnpublishManyDrawerContent","UnpublishMany","props","$","collection","t0","count","ids","modalPrefix","onSuccess","selectAll","where","t1","undefined","slug","versions","t","permissions","toggleModal","collectionPermissions","collections","hasPermission","update","drawerSlug","drafts","t2","t3","_jsxs","Fragment","children","_jsx","onClick"],"sources":["../../../src/elements/UnpublishMany/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig, Where } from 'payload'\n\nimport { useModal } from '@faceless-ui/modal'\nimport React from 'react'\n\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ListSelectionButton } from '../ListSelection/index.js'\nimport { UnpublishManyDrawerContent } from './DrawerContent.js'\n\nexport type UnpublishManyProps = {\n  collection: ClientCollectionConfig\n  count: number\n  ids: (number | string)[]\n  /**\n   * When multiple UnpublishMany components are rendered on the page, this will differentiate them.\n   */\n  modalPrefix?: string\n  onSuccess?: () => void\n  selectAll: boolean\n  where?: Where\n}\n\nexport const UnpublishMany: React.FC<UnpublishManyProps> = (props) => {\n  const {\n    collection,\n    collection: { slug, versions } = {},\n    count,\n    ids,\n    modalPrefix,\n    onSuccess,\n    selectAll,\n    where,\n  } = props\n\n  const { t } = useTranslation()\n  const { permissions } = useAuth()\n  const { toggleModal } = useModal()\n\n  const collectionPermissions = permissions?.collections?.[slug]\n  const hasPermission = collectionPermissions?.update\n\n  const drawerSlug = `${modalPrefix ? `${modalPrefix}-` : ''}unpublish-${slug}`\n\n  if (!versions?.drafts || count === 0 || !hasPermission) {\n    return null\n  }\n\n  return (\n    <React.Fragment>\n      <ListSelectionButton\n        aria-label={t('version:unpublish')}\n        onClick={() => {\n          toggleModal(drawerSlug)\n        }}\n      >\n        {t('version:unpublish')}\n      </ListSelectionButton>\n      <UnpublishManyDrawerContent\n        collection={collection}\n        drawerSlug={drawerSlug}\n        ids={ids}\n        onSuccess={onSuccess}\n        selectAll={selectAll}\n        where={where}\n      />\n    </React.Fragment>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SAASC,QAAQ,QAAQ;AACzB,OAAOC,KAAA,MAAW;AAElB,SAASC,OAAO,QAAQ;AACxB,SAASC,cAAc,QAAQ;AAC/B,SAASC,mBAAmB,QAAQ;AACpC,SAASC,0BAA0B,QAAQ;AAe3C,OAAO,MAAMC,aAAA,GAA8CC,KAAA;EAAA,MAAAC,CAAA,GAAAT,EAAA;EACzD;IAAAU,UAAA;IAAAA,UAAA,EAAAC,EAAA;IAAAC,KAAA;IAAAC,GAAA;IAAAC,WAAA;IAAAC,SAAA;IAAAC,SAAA;IAAAC;EAAA,IASIT,KAAA;EAAA,IAAAU,EAAA;EAAA,IAAAT,CAAA,QAAAE,EAAA;IAPUO,EAAA,GAAAP,EAAuB,KAAvBQ,SAAuB,GAAvB,CAAsB,CAAC,GAAvBR,EAAuB;IAAAF,CAAA,MAAAE,EAAA;IAAAF,CAAA,MAAAS,EAAA;EAAA;IAAAA,EAAA,GAAAT,CAAA;EAAA;EAAvB;IAAAW,IAAA;IAAAC;EAAA,IAAAH,EAAuB;EASrC;IAAAI;EAAA,IAAclB,cAAA;EACd;IAAAmB;EAAA,IAAwBpB,OAAA;EACxB;IAAAqB;EAAA,IAAwBvB,QAAA;EAExB,MAAAwB,qBAAA,GAA8BF,WAAA,EAAAG,WAAgC,GAALN,IAAA,CAAK;EAC9D,MAAAO,aAAA,GAAsBF,qBAAA,EAAAG,MAAuB;EAE7C,MAAAC,UAAA,GAAmB,GAAGf,WAAA,MAAiBA,WAAA,GAAiB,GAAlC,EAAkC,aAAeM,IAAA,EAAM;EAE7E,IAAI,CAACC,QAAA,EAAAS,MAA8B,IAAVlB,KAAA,KAAU,CAAM,IAArC,CAAqCe,aAAA;IAAA,OAChC;EAAA;EACT,IAAAI,EAAA;EAAA,IAAAtB,CAAA,QAAAC,UAAA,IAAAD,CAAA,QAAAoB,UAAA,IAAApB,CAAA,QAAAI,GAAA,IAAAJ,CAAA,QAAAM,SAAA,IAAAN,CAAA,QAAAO,SAAA,IAAAP,CAAA,QAAAa,CAAA,IAAAb,CAAA,QAAAe,WAAA,IAAAf,CAAA,QAAAQ,KAAA;IAAA,IAAAe,EAAA;IAAA,IAAAvB,CAAA,SAAAoB,UAAA,IAAApB,CAAA,SAAAe,WAAA;MAMeQ,EAAA,GAAAA,CAAA;QACPR,WAAA,CAAYK,UAAA;MAAA,CACd;MAAApB,CAAA,OAAAoB,UAAA;MAAApB,CAAA,OAAAe,WAAA;MAAAf,CAAA,OAAAuB,EAAA;IAAA;MAAAA,EAAA,GAAAvB,CAAA;IAAA;IALJsB,EAAA,GAAAE,KAAA,CAAC/B,KAAA,CAAAgC,QAAc;MAAAC,QAAA,E,CACbC,IAAA,CAAC/B,mBAAA;QAAA,cACaiB,CAAA,CAAE;QAAAe,OAAA,EACLL,EAET;QAAAG,QAAA,EAECb,CAAA,CAAE;UAELc,IAAA,CAAC9B,0BAAA;QAAAI,UAAA;QAAAmB,UAAA;QAAAhB,GAAA;QAAAE,SAAA;QAAAC,SAAA;QAAAC;;;;;;;;;;;;;;;SATHc,E;CAmBJ","ignoreList":[]}

package/dist/elements/Upload/UploadFromURLModal/index.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 export declare const pasteURLDrawerSlug = "upload-paste-url";
 type Props = {
     readonly fileUrl: string;
-    readonly handleUrlSubmit: () => Promise<void>;
+    readonly handleUrlSubmit: () => Promise<boolean>;
     readonly isValidUrl: boolean;
     readonly setFileUrl: (url: string) => void;
 };

package/dist/elements/Upload/UploadFromURLModal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Upload/UploadFromURLModal/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,eAAO,MAAM,kBAAkB,qBAAqB,CAAA;AAEpD,KAAK,KAAK,GAAG;IACX,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;IACxB,QAAQ,CAAC,eAAe,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;IAC7C,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAA;IAC5B,QAAQ,CAAC,UAAU,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;CAC3C,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAkC9C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Upload/UploadFromURLModal/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,eAAO,MAAM,kBAAkB,qBAAqB,CAAA;AAEpD,KAAK,KAAK,GAAG;IACX,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;IACxB,QAAQ,CAAC,eAAe,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,CAAA;IAChD,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAA;IAC5B,QAAQ,CAAC,UAAU,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;CAC3C,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAkC9C,CAAA"}

package/dist/elements/Upload/UploadFromURLModal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","TextInput","useTranslation","Button","DialogBody","DialogFooter","DialogHeader","DialogModal","pasteURLDrawerSlug","UploadFromURLModal","t0","$","fileUrl","handleUrlSubmit","isValidUrl","setFileUrl","t","t1","t2","e","preventDefault","t3","e_0","target","value","t4","_jsxs","closeOnBlur","slug","children","_jsx","showClose","title","onSubmit","label","onChange","path","placeholder","buttonStyle","disabled","onClick"],"sources":["../../../../src/elements/Upload/UploadFromURLModal/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { TextInput } from '../../../fields/Text/Input.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { Button } from '../../Button/index.js'\nimport { DialogBody, DialogFooter, DialogHeader, DialogModal } from '../../Dialog/index.js'\n\nexport const pasteURLDrawerSlug = 'upload-paste-url'\n\ntype Props = {\n  readonly fileUrl: string\n  readonly handleUrlSubmit: () => Promise<void>\n  readonly isValidUrl: boolean\n  readonly setFileUrl: (url: string) => void\n}\n\nexport const UploadFromURLModal: React.FC<Props> = ({\n  fileUrl,\n  handleUrlSubmit,\n  isValidUrl,\n  setFileUrl,\n}) => {\n  const { t } = useTranslation()\n\n  return (\n    <DialogModal closeOnBlur slug={pasteURLDrawerSlug}>\n      <DialogHeader showClose title={t('upload:fromURL')} />\n      <DialogBody>\n        <form\n          onSubmit={(e) => {\n            e.preventDefault()\n            void handleUrlSubmit()\n          }}\n        >\n          <TextInput\n            label={t('upload:linkToFile')}\n            onChange={(e) => setFileUrl(e.target.value)}\n            path=\"url\"\n            placeholder=\"https://\"\n            value={fileUrl}\n          />\n        </form>\n      </DialogBody>\n      <DialogFooter>\n        <Button buttonStyle=\"primary\" disabled={!isValidUrl} onClick={() => void handleUrlSubmit()}>\n          {t('upload:addFile')}\n        </Button>\n      </DialogFooter>\n    </DialogModal>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,SAASC,SAAS,QAAQ;AAC1B,SAASC,cAAc,QAAQ;AAC/B,SAASC,MAAM,QAAQ;AACvB,SAASC,UAAU,EAAEC,YAAY,EAAEC,YAAY,EAAEC,WAAW,QAAQ;AAEpE,OAAO,MAAMC,kBAAA,GAAqB;AASlC,OAAO,MAAMC,kBAAA,GAAsCC,EAAA;EAAA,MAAAC,CAAA,GAAAZ,EAAA;EAAC;IAAAa,OAAA;IAAAC,eAAA;IAAAC,UAAA;IAAAC;EAAA,IAAAL,EAKnD;EACC;IAAAM;EAAA,IAAcd,cAAA;EAAA,IAAAe,EAAA;EAAA,IAAAN,CAAA,QAAAC,OAAA,IAAAD,CAAA,QAAAE,eAAA,IAAAF,CAAA,QAAAG,UAAA,IAAAH,CAAA,QAAAI,UAAA,IAAAJ,CAAA,QAAAK,CAAA;IAAA,IAAAE,EAAA;IAAA,IAAAP,CAAA,QAAAE,eAAA;MAOIK,EAAA,GAAAC,CAAA;QACRA,CAAA,CAAAC,cAAA,CAAgB;QACXP,eAAA;MAAA;MACPF,CAAA,MAAAE,eAAA;MAAAF,CAAA,MAAAO,EAAA;IAAA;MAAAA,EAAA,GAAAP,CAAA;IAAA;IAAA,IAAAU,EAAA;IAAA,IAAAV,CAAA,QAAAI,UAAA;MAIYM,EAAA,GAAAC,GAAA,IAAOP,UAAA,CAAWI,GAAA,CAAAI,MAAA,CAAAC,KAAc;MAAAb,CAAA,MAAAI,UAAA;MAAAJ,CAAA,MAAAU,EAAA;IAAA;MAAAA,EAAA,GAAAV,CAAA;IAAA;IAAA,IAAAc,EAAA;IAAA,IAAAd,CAAA,SAAAE,eAAA;MAQgBY,EAAA,GAAAA,CAAA,UAAWZ,eAAA;MAAAF,CAAA,OAAAE,eAAA;MAAAF,CAAA,OAAAc,EAAA;IAAA;MAAAA,EAAA,GAAAd,CAAA;IAAA;IAnB7EM,EAAA,GAAAS,KAAA,CAAAnB,WAAA;MAAAoB,WAAA;MAAAC,IAAA,EAAApB,kBAAA;MAAAqB,QAAA,GACEC,IAAA,CAAAxB,YAAA;QAAAyB,SAAA;QAAAC,KAAA,EAA+BhB,CAAA,CAAE;MAAA,C,GACjCc,IAAA,CAAA1B,UAAA;QAAAyB,QAAA,EACEC,IAAA,CAAC;UAAAG,QAAA,EACWf,EAGV;UAAAW,QAAA,EAEAC,IAAA,CAAA7B,SAAA;YAAAiC,KAAA,EACSlB,CAAA,CAAE;YAAAmB,QAAA,EACCd,EAAgC;YAAAe,IAAA,EACrC;YAAAC,WAAA,EACO;YAAAb,KAAA,EACLZ;UAAA,C;;UAIbkB,IAAA,CAAAzB,YAAA;QAAAwB,QAAA,EACEC,IAAA,CAAA3B,MAAA;UAAAmC,WAAA,EAAoB;UAAAC,QAAA,GAAqBzB,UAAA;UAAA0B,OAAA,EAAqBf,EAAW;UAAAI,QAAA,EACtEb,CAAA,CAAE;QAAA,C;;;;;;;;;;;;SApBTC,E;CAyBJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","TextInput","useTranslation","Button","DialogBody","DialogFooter","DialogHeader","DialogModal","pasteURLDrawerSlug","UploadFromURLModal","t0","$","fileUrl","handleUrlSubmit","isValidUrl","setFileUrl","t","t1","t2","e","preventDefault","t3","e_0","target","value","t4","_jsxs","closeOnBlur","slug","children","_jsx","showClose","title","onSubmit","label","onChange","path","placeholder","buttonStyle","disabled","onClick"],"sources":["../../../../src/elements/Upload/UploadFromURLModal/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { TextInput } from '../../../fields/Text/Input.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { Button } from '../../Button/index.js'\nimport { DialogBody, DialogFooter, DialogHeader, DialogModal } from '../../Dialog/index.js'\n\nexport const pasteURLDrawerSlug = 'upload-paste-url'\n\ntype Props = {\n  readonly fileUrl: string\n  readonly handleUrlSubmit: () => Promise<boolean>\n  readonly isValidUrl: boolean\n  readonly setFileUrl: (url: string) => void\n}\n\nexport const UploadFromURLModal: React.FC<Props> = ({\n  fileUrl,\n  handleUrlSubmit,\n  isValidUrl,\n  setFileUrl,\n}) => {\n  const { t } = useTranslation()\n\n  return (\n    <DialogModal closeOnBlur slug={pasteURLDrawerSlug}>\n      <DialogHeader showClose title={t('upload:fromURL')} />\n      <DialogBody>\n        <form\n          onSubmit={(e) => {\n            e.preventDefault()\n            void handleUrlSubmit()\n          }}\n        >\n          <TextInput\n            label={t('upload:linkToFile')}\n            onChange={(e) => setFileUrl(e.target.value)}\n            path=\"url\"\n            placeholder=\"https://\"\n            value={fileUrl}\n          />\n        </form>\n      </DialogBody>\n      <DialogFooter>\n        <Button buttonStyle=\"primary\" disabled={!isValidUrl} onClick={() => void handleUrlSubmit()}>\n          {t('upload:addFile')}\n        </Button>\n      </DialogFooter>\n    </DialogModal>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,SAASC,SAAS,QAAQ;AAC1B,SAASC,cAAc,QAAQ;AAC/B,SAASC,MAAM,QAAQ;AACvB,SAASC,UAAU,EAAEC,YAAY,EAAEC,YAAY,EAAEC,WAAW,QAAQ;AAEpE,OAAO,MAAMC,kBAAA,GAAqB;AASlC,OAAO,MAAMC,kBAAA,GAAsCC,EAAA;EAAA,MAAAC,CAAA,GAAAZ,EAAA;EAAC;IAAAa,OAAA;IAAAC,eAAA;IAAAC,UAAA;IAAAC;EAAA,IAAAL,EAKnD;EACC;IAAAM;EAAA,IAAcd,cAAA;EAAA,IAAAe,EAAA;EAAA,IAAAN,CAAA,QAAAC,OAAA,IAAAD,CAAA,QAAAE,eAAA,IAAAF,CAAA,QAAAG,UAAA,IAAAH,CAAA,QAAAI,UAAA,IAAAJ,CAAA,QAAAK,CAAA;IAAA,IAAAE,EAAA;IAAA,IAAAP,CAAA,QAAAE,eAAA;MAOIK,EAAA,GAAAC,CAAA;QACRA,CAAA,CAAAC,cAAgB;QACXP,eAAA;MAAA,CACP;MAAAF,CAAA,MAAAE,eAAA;MAAAF,CAAA,MAAAO,EAAA;IAAA;MAAAA,EAAA,GAAAP,CAAA;IAAA;IAAA,IAAAU,EAAA;IAAA,IAAAV,CAAA,QAAAI,UAAA;MAIYM,EAAA,GAAAC,GAAA,IAAOP,UAAA,CAAWI,GAAA,CAAAI,MAAQ,CAAAC,KAAM;MAAAb,CAAA,MAAAI,UAAA;MAAAJ,CAAA,MAAAU,EAAA;IAAA;MAAAA,EAAA,GAAAV,CAAA;IAAA;IAAA,IAAAc,EAAA;IAAA,IAAAd,CAAA,SAAAE,eAAA;MAQgBY,EAAA,GAAAA,CAAA,KAAM,KAAKZ,eAAA;MAAAF,CAAA,OAAAE,eAAA;MAAAF,CAAA,OAAAc,EAAA;IAAA;MAAAA,EAAA,GAAAd,CAAA;IAAA;IAnB7EM,EAAA,GAAAS,KAAA,CAACnB,WAAA;MAAAoB,WAAA,EAAuB;MAAAC,IAAA,EAAOpB,kBAAA;MAAAqB,QAAA,E,CAC7BC,IAAA,CAACxB,YAAA;QAAAyB,SAAA,EAAsB;QAAAC,KAAA,EAAQhB,CAAA,CAAE;UACjCc,IAAA,CAAC1B,UAAA;QAAAyB,QAAA,EACCC,IAAA,CAAC;UAAAG,QAAA,EACWf,EAGV;UAAAW,QAAA,EAEAC,IAAA,CAAC7B,SAAA;YAAAiC,KAAA,EACQlB,CAAA,CAAE;YAAAmB,QAAA,EACCd,EAAgC;YAAAe,IAAA,EACrC;YAAAC,WAAA,EACO;YAAAb,KAAA,EACLZ;;;UAIbkB,IAAA,CAACzB,YAAA;QAAAwB,QAAA,EACCC,IAAA,CAAC3B,MAAA;UAAAmC,WAAA,EAAmB;UAAAC,QAAA,EAAoB,CAACzB,UAAA;UAAA0B,OAAA,EAAqBf,EAAW;UAAAI,QAAA,EACtEb,CAAA,CAAE;;;;;;;;;;;;;SApBTC,E;CAyBJ","ignoreList":[]}

package/dist/elements/Upload/getEditorFileSrc.d.ts

@@ -0,0 +1,11 @@
+export declare const getEditorFileSrc: ({ data, fileSrc, hasSelectedFile, }: {
+    data?: {
+        original?: {
+            url?: string;
+        } | null;
+        url?: string;
+    };
+    fileSrc?: null | string;
+    hasSelectedFile: boolean;
+}) => string;
+//# sourceMappingURL=getEditorFileSrc.d.ts.map

package/dist/elements/Upload/getEditorFileSrc.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getEditorFileSrc.d.ts","sourceRoot":"","sources":["../../../src/elements/Upload/getEditorFileSrc.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,gBAAgB,wCAI1B;IACD,IAAI,CAAC,EAAE;QAAE,QAAQ,CAAC,EAAE;YAAE,GAAG,CAAC,EAAE,MAAM,CAAA;SAAE,GAAG,IAAI,CAAC;QAAC,GAAG,CAAC,EAAE,MAAM,CAAA;KAAE,CAAA;IAC3D,OAAO,CAAC,EAAE,IAAI,GAAG,MAAM,CAAA;IACvB,eAAe,EAAE,OAAO,CAAA;CACzB,KAAG,MAA2F,CAAA"}

package/dist/elements/Upload/getEditorFileSrc.js

@@ -0,0 +1,6 @@
+export const getEditorFileSrc = ({
+  data,
+  fileSrc,
+  hasSelectedFile
+}) => hasSelectedFile && fileSrc || data?.original?.url || data?.url || fileSrc || '';
+//# sourceMappingURL=getEditorFileSrc.js.map

package/dist/elements/Upload/getEditorFileSrc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getEditorFileSrc.js","names":["getEditorFileSrc","data","fileSrc","hasSelectedFile","original","url"],"sources":["../../../src/elements/Upload/getEditorFileSrc.ts"],"sourcesContent":["export const getEditorFileSrc = ({\n  data,\n  fileSrc,\n  hasSelectedFile,\n}: {\n  data?: { original?: { url?: string } | null; url?: string }\n  fileSrc?: null | string\n  hasSelectedFile: boolean\n}): string => (hasSelectedFile && fileSrc) || data?.original?.url || data?.url || fileSrc || ''\n"],"mappings":"AAAA,OAAO,MAAMA,gBAAA,GAAmBA,CAAC;EAC/BC,IAAI;EACJC,OAAO;EACPC;AAAe,CAKhB,KAAaA,eAAC,IAAmBD,OAAA,IAAYD,IAAA,EAAMG,QAAA,EAAUC,GAAA,IAAOJ,IAAA,EAAMI,GAAA,IAAOH,OAAA,IAAW","ignoreList":[]}

package/dist/elements/Upload/index.css

@@ -9,11 +9,8 @@
   .file-field__upload {
     display: flex;
     position: relative;
-  }
-
-  .file-field .tooltip.error-message {
-    z-index: 3;
-    bottom: calc(100% - var(--spacer-2));
+    flex-wrap: wrap;
+    justify-content: space-between;
   }
 
   .file-field__file-selected {
@@ -22,7 +19,7 @@
 
   .file-field__thumbnail-wrap {
     position: relative;
-    width: 150px;
+    width: 50%;
 
     .thumbnail {
       position: relative;
@@ -37,16 +34,19 @@
     position: absolute;
     top: var(--spacer-2);
     right: var(--spacer-2);
-    margin: 0;
+    margin: var(--spacer-3);
     z-index: 1;
+    order: 2;
   }
 
   .file-field__file-adjustments {
-    padding: var(--spacer-3);
+    padding: var(--spacer-2);
     width: 100%;
     display: flex;
     flex-direction: column;
-    gap: var(--spacer-2);
+    gap: 0;
+    order: 3;
+    border-top: var(--stroke-width-medium) solid var(--color-bg-primary);
   }
 
   .file-field__upload-actions {
@@ -101,21 +101,28 @@
     text-transform: lowercase;
     align-self: center;
     color: var(--color-text-tertiary);
+    display: none;
   }
 
   .file-field--side-panel {
     position: relative;
     flex: 1 0 0;
     width: 100%;
-    min-height: max(500px, calc(100dvh - var(--doc-controls-height) - var(--app-header-height)));
+    min-height: 400px;
     margin-bottom: 0;
     border-radius: 0;
     background: var(--color-bg-secondary);
   }
 
+  .file-field__side-panel {
+    position: static;
+    height: auto;
+    min-height: 400px;
+  }
+
   .file-field__side-panel__content {
     display: flex;
-    flex-direction: row;
+    flex-direction: column;
     flex: 1 1 0;
     min-height: 0;
     overflow: hidden;
@@ -130,6 +137,7 @@
     padding: var(--spacer-3) var(--spacer-4);
     gap: var(--spacer-3);
     overflow: hidden;
+    height: auto;
   }
 
   .file-field__side-panel__info {
@@ -148,10 +156,9 @@
     height: 16px;
     border-radius: var(--radius-small);
     background: var(--color-bg-secondary-hover);
-    font-family: var(--text-body-medium-strong-font-family);
     font-size: var(--text-body-medium-font-size);
-    font-weight: var(--text-body-medium-strong-font-weight);
-    line-height: var(--text-body-medium-strong-line-height);
+    font-weight: var(--text-body-medium-bold-font-weight);
+    line-height: var(--text-body-medium-bold-line-height);
     color: var(--color-text);
     white-space: nowrap;
     flex-shrink: 0;
@@ -202,55 +209,49 @@
     }
   }
 
-  @media (max-width: 1024px) {
+  @media (min-width: 1024px) {
     .file-field--side-panel {
-      min-height: 400px;
+      min-height: max(500px, calc(100dvh - var(--doc-controls-height) - var(--app-header-height)));
     }
 
     .file-field__side-panel {
-      position: static;
-      height: auto;
-      min-height: 400px;
+      min-height: auto;
     }
 
     .file-field__side-panel__content {
-      flex-direction: column;
-    }
-
-    .file-field__side-panel__preview {
-      height: auto;
+      flex-direction: row;
     }
   }
 
-  @media (max-width: 768px) {
+  @media (min-width: 768px) {
     .file-field__upload {
-      flex-wrap: wrap;
-      justify-content: space-between;
+      flex-wrap: nowrap;
+      justify-content: normal;
     }
 
     .file-field__remove {
-      margin: var(--spacer-3);
-      order: 2;
+      margin: 0;
+      order: 0;
     }
 
     .file-field__file-adjustments {
-      order: 3;
-      border-top: 2px solid var(--color-bg-primary);
-      padding: var(--spacer-2);
-      gap: 0;
+      order: 0;
+      border-top: none;
+      padding: var(--spacer-3);
+      gap: var(--spacer-2);
     }
 
     .file-field__thumbnail-wrap {
-      order: 1;
-      width: 50%;
-
-      .thumbnail {
-        width: 100%;
-      }
+      order: 0;
+      width: 150px;
     }
 
     .file-field__edit {
-      display: none;
+      /* display: revert; */
+    }
+
+    .file-field__dragAndDropText {
+      display: block;
     }
   }
 }

package/dist/elements/Upload/index.d.ts

@@ -17,7 +17,7 @@ export type UploadProps = {
     readonly customActions?: React.ReactNode[];
     readonly initialState?: FormState;
     readonly onChange?: (file?: File) => void;
-    readonly uploadConfig: SanitizedCollectionConfig['upload'];
+    readonly uploadConfig: Omit<SanitizedCollectionConfig['upload'], 'uploadInstructions'>;
     readonly UploadControls?: React.ReactNode;
 };
 export declare const Upload: React.FC<UploadProps>;

package/dist/elements/Upload/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Upload/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,yBAAyB,EAAe,MAAM,SAAS,CAAA;AAIhF,OAAO,KAA6D,MAAM,OAAO,CAAA;AAkBjF,OAAO,aAAa,CAAA;AAIpB,OAAO,EAAE,kBAAkB,EAAsB,MAAM,+BAA+B,CAAA;AAEtF,OAAO,EAAE,kBAAkB,EAAE,CAAA;AAG7B,eAAO,MAAM,cAAc,gBAAgB,CAAA;AAC3C,eAAO,MAAM,eAAe,kBAAkB,CAAA;AAc9C,KAAK,iBAAiB,GAAG;IACvB,QAAQ,CAAC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IAC1C,QAAQ,CAAC,iBAAiB,EAAE,OAAO,CAAA;IACnC,QAAQ,CAAC,kBAAkB,EAAE,OAAO,CAAA;IACpC,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;CAC1B,CAAA;AAED,eAAO,MAAM,aAAa,wEAKvB,iBAAiB,sBAkDnB,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAA;IAC/B,QAAQ,CAAC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IAC1C,QAAQ,CAAC,YAAY,CAAC,EAAE,SAAS,CAAA;IACjC,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,KAAK,IAAI,CAAA;IACzC,QAAQ,CAAC,YAAY,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAA;IAC1D,QAAQ,CAAC,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1C,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAYxC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Upload/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,yBAAyB,EAAe,MAAM,SAAS,CAAA;AAIhF,OAAO,KAAmD,MAAM,OAAO,CAAA;AAevE,OAAO,aAAa,CAAA;AAMpB,OAAO,EAAE,kBAAkB,EAAsB,MAAM,+BAA+B,CAAA;AAItF,OAAO,EAAE,kBAAkB,EAAE,CAAA;AAG7B,eAAO,MAAM,cAAc,gBAAgB,CAAA;AAC3C,eAAO,MAAM,eAAe,kBAAkB,CAAA;AAc9C,KAAK,iBAAiB,GAAG;IACvB,QAAQ,CAAC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IAC1C,QAAQ,CAAC,iBAAiB,EAAE,OAAO,CAAA;IACnC,QAAQ,CAAC,kBAAkB,EAAE,OAAO,CAAA;IACpC,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;CAC1B,CAAA;AAED,eAAO,MAAM,aAAa,wEAKvB,iBAAiB,sBAkDnB,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAA;IAC/B,QAAQ,CAAC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IAC1C,QAAQ,CAAC,YAAY,CAAC,EAAE,SAAS,CAAA;IACjC,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,KAAK,IAAI,CAAA;IACzC,QAAQ,CAAC,YAAY,EAAE,IAAI,CAAC,yBAAyB,CAAC,QAAQ,CAAC,EAAE,oBAAoB,CAAC,CAAA;IACtF,QAAQ,CAAC,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1C,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAYxC,CAAA"}

package/dist/elements/Upload/index.js

@@ -3,15 +3,13 @@
 import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useModal } from '@faceless-ui/modal';
-import { formatAdminURL, isImage } from 'payload/shared';
-import React, { Fragment, useCallback, useEffect, useRef, useState } from 'react';
-import { toast } from 'sonner';
+import { isImage } from 'payload/shared';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { FieldError } from '../../fields/FieldError/index.js';
 import { fieldBaseClass } from '../../fields/shared/index.js';
 import { TextInput } from '../../fields/Text/Input.js';
 import { useForm, useFormProcessing } from '../../forms/Form/index.js';
 import { useField } from '../../forms/useField/index.js';
-import { useConfig } from '../../providers/Config/index.js';
 import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
 import { EditDepthProvider } from '../../providers/EditDepth/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
@@ -20,12 +18,15 @@ import { useUploadEdits } from '../../providers/UploadEdits/index.js';
 import { Button } from '../Button/index.js';
 import { Drawer } from '../Drawer/index.js';
 import { Dropzone } from '../Dropzone/index.js';
-import { EditUpload } from '../EditUpload/index.js';
 import './index.css';
+import { EditUpload } from '../EditUpload/index.js';
 import { FileDetails } from '../FileDetails/index.js';
 import { PreviewSizes } from '../PreviewSizes/index.js';
 import { Thumbnail } from '../Thumbnail/index.js';
+import { getEditorFileSrc } from './getEditorFileSrc.js';
 import { pasteURLDrawerSlug, UploadFromURLModal } from './UploadFromURLModal/index.js';
+import { usePasteFromClipboard } from './usePasteFromClipboard.js';
+import { useUploadFromUrl } from './useUploadFromUrl.js';
 export { pasteURLDrawerSlug };
 const baseClass = 'file-field';
 export const editDrawerSlug = 'edit-upload';
@@ -149,31 +150,17 @@ const UploadComponent = props => {
     setUploadControlFileName,
     setUploadControlFileUrl,
     uploadControlFile,
-    uploadControlFileName,
     uploadControlFileUrl
   } = useUploadControls();
-  const {
-    config: {
-      routes: {
-        api
-      }
-    }
-  } = useConfig();
   const {
     t
   } = useTranslation();
-  const {
-    closeModal,
-    openModal
-  } = useModal();
   const {
     setModified
   } = useForm();
   const {
-    id,
     data,
-    docPermissions,
-    setUploadStatus
+    docPermissions
   } = useDocumentInfo();
   const isFormSubmitting = useFormProcessing();
   const {
@@ -188,9 +175,7 @@ const UploadComponent = props => {
   const [fileSrc, setFileSrc] = useState(null);
   const [removedFile, setRemovedFile] = useState(false);
   const [filename, setFilename] = useState(value?.name || '');
-  const [fileUrl, setFileUrl] = useState('');
   const inputRef = useRef(null);
-  const useServerSideFetch = typeof uploadConfig?.pasteURL === 'object' && uploadConfig.pasteURL.allowList?.length > 0;
   const handleFileChange = useCallback(({
     file,
     isNewFile = true
@@ -230,6 +215,25 @@ const UploadComponent = props => {
       file: fileToUpload
     });
   }, [handleFileChange]);
+  const handleFileFetchedFromUrl = useCallback(file_0 => handleFileChange({
+    file: file_0
+  }), [handleFileChange]);
+  const {
+    fileUrl,
+    handleUrlSubmit,
+    isValidUrl,
+    setFileUrl
+  } = useUploadFromUrl({
+    collectionSlug,
+    onFileFetched: handleFileFetchedFromUrl,
+    uploadConfig
+  });
+  const handlePasteFromClipboard = usePasteFromClipboard({
+    handleFileSelection,
+    handleUrlSubmit,
+    setFileUrl,
+    uploadConfig
+  });
   const handleFileRemoval = useCallback(() => {
     setRemovedFile(true);
     handleFileChange({
@@ -241,71 +245,11 @@ const UploadComponent = props => {
     setUploadControlFileUrl('');
     setUploadControlFileName(null);
     setUploadControlFile(null);
-  }, [handleFileChange, resetUploadEdits, setUploadControlFile, setUploadControlFileName, setUploadControlFileUrl]);
+  }, [handleFileChange, resetUploadEdits, setFileUrl, setUploadControlFile, setUploadControlFileName, setUploadControlFileUrl]);
   const onEditsSave = useCallback(args => {
     setModified(true);
     updateUploadEdits(args);
   }, [setModified, updateUploadEdits]);
-  const isValidUrl = Boolean(fileUrl && URL.canParse(fileUrl));
-  const handleUrlSubmit = useCallback(async () => {
-    if (!fileUrl || !URL.canParse(fileUrl) || uploadConfig?.pasteURL === false) {
-      return;
-    }
-    setUploadStatus('uploading');
-    try {
-      // Attempt client-side fetch
-      const clientResponse = await fetch(fileUrl);
-      if (!clientResponse.ok) {
-        throw new Error(`Fetch failed with status: ${clientResponse.status}`);
-      }
-      const blob = await clientResponse.blob();
-      const rawSegment = fileUrl.split('/').pop() || '';
-      const fileName = uploadControlFileName || decodeURIComponent(rawSegment.split('?')[0]);
-      const file_0 = new File([blob], fileName, {
-        type: blob.type
-      });
-      handleFileChange({
-        file: file_0
-      });
-      setUploadStatus('idle');
-      closeModal(pasteURLDrawerSlug);
-      setFileUrl('');
-      return; // Exit if client-side fetch succeeds
-    } catch (_clientError) {
-      if (!useServerSideFetch) {
-        // If server-side fetch is not enabled, show client-side error
-        toast.error('Failed to fetch the file.');
-        setUploadStatus('failed');
-        return;
-      }
-    }
-    // Attempt server-side fetch if client-side fetch fails and useServerSideFetch is true
-    try {
-      const pasteURL = `/${collectionSlug}/paste-url${id ? `/${id}?` : '?'}src=${encodeURIComponent(fileUrl)}`;
-      const serverResponse = await fetch(formatAdminURL({
-        apiRoute: api,
-        path: pasteURL
-      }));
-      if (!serverResponse.ok) {
-        throw new Error(`Fetch failed with status: ${serverResponse.status}`);
-      }
-      const blob_0 = await serverResponse.blob();
-      const rawSegment_0 = fileUrl.split('/').pop() || '';
-      const fileName_0 = decodeURIComponent(rawSegment_0.split('?')[0]);
-      const file_1 = new File([blob_0], fileName_0, {
-        type: blob_0.type
-      });
-      handleFileChange({
-        file: file_1
-      });
-      setUploadStatus('idle');
-      closeModal(pasteURLDrawerSlug);
-      setFileUrl('');
-    } catch (_serverError) {
-      toast.error('The provided URL is not allowed.');
-      setUploadStatus('failed');
-    }
-  }, [api, closeModal, collectionSlug, fileUrl, handleFileChange, id, setUploadStatus, uploadConfig, uploadControlFileName, useServerSideFetch]);
   useEffect(() => {
     if (initialState?.file?.value instanceof File) {
       setFileSrc(URL.createObjectURL(initialState.file.value));
@@ -325,15 +269,15 @@ const UploadComponent = props => {
     }
   }, [isFormSubmitting]);
   const canRemoveUpload = docPermissions?.update;
-  const hasImageSizes = uploadConfig?.imageSizes?.length > 0;
-  const hasResizeOptions = Boolean(uploadConfig?.resizeOptions);
+  const hasVariants = uploadConfig?.variants?.length > 0;
+  const hasImageAdjustments = Boolean(uploadConfig?.hasImageAdjustments);
   // Explicity check if set to true, default is undefined
   const focalPointEnabled = uploadConfig?.focalPoint === true;
   const {
     crop: showCrop = true,
     focalPoint = true
   } = uploadConfig;
-  const showFocalPoint = focalPoint && (hasImageSizes || hasResizeOptions || focalPointEnabled);
+  const showFocalPoint = focalPoint && (hasVariants || hasImageAdjustments || focalPointEnabled);
   const acceptMimeTypes = uploadConfig.mimeTypes?.join(', ');
   const imageCacheTag = uploadConfig?.cacheTags && data?.updatedAt;
   useEffect(() => {
@@ -344,7 +288,7 @@ const UploadComponent = props => {
       }
     };
     void handleControlFileUrl();
-  }, [uploadControlFileUrl, handleUrlSubmit]);
+  }, [uploadControlFileUrl, handleUrlSubmit, setFileUrl]);
   useEffect(() => {
     const handleControlFile = () => {
       if (uploadControlFile) {
@@ -359,7 +303,11 @@ const UploadComponent = props => {
     children: [(value || data?.filename) && /*#__PURE__*/_jsx(EditDepthProvider, {
       children: /*#__PURE__*/_jsx(EditUpload, {
         fileName: value?.name || data?.filename,
-        fileSrc: data?.url || fileSrc,
+        fileSrc: getEditorFileSrc({
+          data,
+          fileSrc,
+          hasSelectedFile: Boolean(value)
+        }),
         imageCacheTag: imageCacheTag,
         initialCrop: uploadEdits?.crop ?? undefined,
         initialFocalPoint: {
@@ -370,7 +318,7 @@ const UploadComponent = props => {
         showCrop: showCrop,
         showFocalPoint: showFocalPoint
       })
-    }), data && hasImageSizes && /*#__PURE__*/_jsx(Drawer, {
+    }), data && hasVariants && /*#__PURE__*/_jsx(Drawer, {
       className: `${baseClass}__previewDrawer`,
       hoverTitle: true,
       slug: sizePreviewSlug,
@@ -400,7 +348,7 @@ const UploadComponent = props => {
       doc: data,
       enableAdjustments: showCrop || showFocalPoint,
       handleRemove: canRemoveUpload ? handleFileRemoval : undefined,
-      hasImageSizes: hasImageSizes,
+      hasImageSizes: hasVariants,
       hideRemoveFile: uploadConfig.hideRemoveFile,
       imageCacheTag: imageCacheTag,
       uploadConfig: uploadConfig
@@ -433,21 +381,16 @@ const UploadComponent = props => {
               },
               ref: inputRef,
               type: "file"
-            }), uploadConfig?.pasteURL !== false && /*#__PURE__*/_jsxs(Fragment, {
-              children: [/*#__PURE__*/_jsx("span", {
-                className: `${baseClass}__orText`,
-                children: t('general:or')
-              }), /*#__PURE__*/_jsx(Button, {
-                buttonStyle: "pill",
-                onClick: () => {
-                  openModal(pasteURLDrawerSlug);
-                  setUploadControlFileUrl('');
-                  setUploadControlFile(null);
-                  setUploadControlFileName(null);
-                },
-                size: "medium",
-                children: t('upload:pasteURL')
-              })]
+            }), /*#__PURE__*/_jsx("span", {
+              className: `${baseClass}__orText`,
+              children: t('general:or')
+            }), /*#__PURE__*/_jsx(Button, {
+              buttonStyle: "pill",
+              className: `${baseClass}__pasteFromClipboard`,
+              icon: "clipboard",
+              onClick: handlePasteFromClipboard,
+              size: "medium",
+              tooltip: t('upload:pasteURL')
             }), UploadControls ? UploadControls : null]
           }), /*#__PURE__*/_jsxs("p", {
             className: `${baseClass}__dragAndDropText`,
@@ -478,7 +421,7 @@ const UploadComponent = props => {
           }), /*#__PURE__*/_jsx(UploadActions, {
             customActions: customActions,
             enableAdjustments: showCrop || showFocalPoint,
-            enablePreviewSizes: hasImageSizes && data?.filename && !removedFile,
+            enablePreviewSizes: hasVariants && data?.filename && !removedFile,
             mimeType: value.type
           })]
         })]