@payloadcms/ui 4.0.0-internal.d21c039 → 4.0.0-internal.d3909a9

package/dist/elements/FileManager/FileToolbar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useRef","useElementHeightVariable","ChevronIcon","CropIcon","DownloadIcon","LinkIcon","NewTabIcon","SwapIcon","useTranslation","Button","CopyToClipboard","Popup","PopupList","baseClass","FileToolbar","filename","fileSrc","fileUrl","hideRemoveFile","isAdjustable","onEditImage","onReplace","t","ref","cssVar","_jsxs","className","_jsx","button","size","buttonType","horizontalAlign","portalClassName","verticalAlign","MenuItem","icon","onClick","defaultMessage","value","buttonStyle","margin","round","tooltip","href","rel","target","title","download"],"sources":["../../../../src/elements/FileManager/FileToolbar/index.tsx"],"sourcesContent":["'use client'\nimport React, { useRef } from 'react'\n\nimport { useElementHeightVariable } from '../../../hooks/useElementHeightVariable.js'\nimport { ChevronIcon } from '../../../icons/Chevron/index.js'\nimport { CropIcon } from '../../../icons/Crop/index.js'\nimport { DownloadIcon } from '../../../icons/Download/index.js'\nimport { LinkIcon } from '../../../icons/Link/index.js'\nimport { NewTabIcon } from '../../../icons/NewTab/index.js'\nimport { SwapIcon } from '../../../icons/Swap/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { Button } from '../../Button/index.js'\nimport { CopyToClipboard } from '../../CopyToClipboard/index.js'\nimport { Popup } from '../../Popup/index.js'\nimport * as PopupList from '../../Popup/PopupButtonList/index.js'\nimport './index.css'\n\nconst baseClass = 'file-toolbar'\n\ntype Props = {\n  readonly filename: string\n  readonly fileSrc?: null | string\n  readonly fileUrl?: null | string\n  readonly hideRemoveFile?: boolean\n  readonly isAdjustable?: boolean\n  readonly onEditImage?: () => void\n  readonly onReplace?: () => void\n}\n\nexport const FileToolbar: React.FC<Props> = ({\n  filename,\n  fileSrc,\n  fileUrl,\n  hideRemoveFile,\n  isAdjustable,\n  onEditImage,\n  onReplace,\n}) => {\n  const { t } = useTranslation()\n  const ref = useRef<HTMLDivElement>(null)\n  useElementHeightVariable({ cssVar: '--file-toolbar-height', ref })\n\n  return (\n    <div className={baseClass} ref={ref}>\n      <div className={`${baseClass}__left`}>\n        {hideRemoveFile ? (\n          <span className={`${baseClass}__filename-btn ${baseClass}__filename-btn--static`}>\n            <span className={`${baseClass}__filename-text`}>{filename}</span>\n          </span>\n        ) : (\n          <Popup\n            button={\n              <span className={`${baseClass}__filename-btn`}>\n                <span className={`${baseClass}__filename-text`}>{filename}</span>\n                <ChevronIcon size={16} />\n              </span>\n            }\n            buttonType=\"custom\"\n            horizontalAlign=\"left\"\n            portalClassName={`${baseClass}__filename-popup`}\n            size=\"fit-content\"\n            verticalAlign=\"bottom\"\n          >\n            <PopupList.MenuItem>\n              <PopupList.Button icon={<SwapIcon />} onClick={onReplace}>\n                {t('upload:replaceFile')}\n              </PopupList.Button>\n            </PopupList.MenuItem>\n          </Popup>\n        )}\n      </div>\n\n      <div className={`${baseClass}__right`}>\n        {fileUrl && (\n          <CopyToClipboard\n            defaultMessage={t('upload:copyLinkToFile')}\n            icon={<LinkIcon />}\n            value={fileUrl}\n          />\n        )}\n        {isAdjustable && (\n          <Button\n            aria-label={t('upload:editImage')}\n            buttonStyle=\"ghost\"\n            icon={<CropIcon size={24} />}\n            margin={false}\n            onClick={onEditImage}\n            round={false}\n            tooltip={t('upload:editImage')}\n          />\n        )}\n        {fileSrc && (\n          <a\n            aria-label={t('fields:openInNewTab')}\n            className={`${baseClass}__icon-link`}\n            href={fileSrc}\n            rel=\"noopener noreferrer\"\n            target=\"_blank\"\n            title={t('fields:openInNewTab')}\n          >\n            <NewTabIcon size={24} />\n          </a>\n        )}\n        {fileSrc && (\n          <a\n            aria-label={t('upload:download')}\n            className={`${baseClass}__icon-link`}\n            download={filename}\n            href={fileSrc}\n            title={t('upload:download')}\n          >\n            <DownloadIcon size={24} />\n          </a>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","useRef","useElementHeightVariable","ChevronIcon","CropIcon","DownloadIcon","LinkIcon","NewTabIcon","SwapIcon","useTranslation","Button","CopyToClipboard","Popup","PopupList","baseClass","FileToolbar","filename","fileSrc","fileUrl","hideRemoveFile","isAdjustable","onEditImage","onReplace","t","ref","cssVar","_jsxs","className","_jsx","button","size","buttonType","horizontalAlign","popupType","portalClassName","verticalAlign","MenuItem","icon","onClick","defaultMessage","value","buttonStyle","margin","round","tooltip","href","rel","target","title","download"],"sources":["../../../../src/elements/FileManager/FileToolbar/index.tsx"],"sourcesContent":["'use client'\nimport React, { useRef } from 'react'\n\nimport { useElementHeightVariable } from '../../../hooks/useElementHeightVariable.js'\nimport { ChevronIcon } from '../../../icons/Chevron/index.js'\nimport { CropIcon } from '../../../icons/Crop/index.js'\nimport { DownloadIcon } from '../../../icons/Download/index.js'\nimport { LinkIcon } from '../../../icons/Link/index.js'\nimport { NewTabIcon } from '../../../icons/NewTab/index.js'\nimport { SwapIcon } from '../../../icons/Swap/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { Button } from '../../Button/index.js'\nimport { CopyToClipboard } from '../../CopyToClipboard/index.js'\nimport { Popup } from '../../Popup/index.js'\nimport * as PopupList from '../../Popup/PopupButtonList/index.js'\nimport './index.css'\n\nconst baseClass = 'file-toolbar'\n\ntype Props = {\n  readonly filename: string\n  readonly fileSrc?: null | string\n  readonly fileUrl?: null | string\n  readonly hideRemoveFile?: boolean\n  readonly isAdjustable?: boolean\n  readonly onEditImage?: () => void\n  readonly onReplace?: () => void\n}\n\nexport const FileToolbar: React.FC<Props> = ({\n  filename,\n  fileSrc,\n  fileUrl,\n  hideRemoveFile,\n  isAdjustable,\n  onEditImage,\n  onReplace,\n}) => {\n  const { t } = useTranslation()\n  const ref = useRef<HTMLDivElement>(null)\n  useElementHeightVariable({ cssVar: '--file-toolbar-height', ref })\n\n  return (\n    <div className={baseClass} ref={ref}>\n      <div className={`${baseClass}__left`}>\n        {hideRemoveFile ? (\n          <span className={`${baseClass}__filename-btn ${baseClass}__filename-btn--static`}>\n            <span className={`${baseClass}__filename-text`}>{filename}</span>\n          </span>\n        ) : (\n          <Popup\n            button={\n              <span className={`${baseClass}__filename-btn`}>\n                <span className={`${baseClass}__filename-text`}>{filename}</span>\n                <ChevronIcon size={16} />\n              </span>\n            }\n            buttonType=\"custom\"\n            horizontalAlign=\"left\"\n            popupType=\"menu\"\n            portalClassName={`${baseClass}__filename-popup`}\n            size=\"fit-content\"\n            verticalAlign=\"bottom\"\n          >\n            <PopupList.MenuItem>\n              <PopupList.Button icon={<SwapIcon />} onClick={onReplace}>\n                {t('upload:replaceFile')}\n              </PopupList.Button>\n            </PopupList.MenuItem>\n          </Popup>\n        )}\n      </div>\n\n      <div className={`${baseClass}__right`}>\n        {fileUrl && (\n          <CopyToClipboard\n            defaultMessage={t('upload:copyLinkToFile')}\n            icon={<LinkIcon />}\n            value={fileUrl}\n          />\n        )}\n        {isAdjustable && (\n          <Button\n            aria-label={t('upload:editImage')}\n            buttonStyle=\"ghost\"\n            icon={<CropIcon size={24} />}\n            margin={false}\n            onClick={onEditImage}\n            round={false}\n            tooltip={t('upload:editImage')}\n          />\n        )}\n        {fileSrc && (\n          <a\n            aria-label={t('fields:openInNewTab')}\n            className={`${baseClass}__icon-link`}\n            href={fileSrc}\n            rel=\"noopener noreferrer\"\n            target=\"_blank\"\n            title={t('fields:openInNewTab')}\n          >\n            <NewTabIcon size={24} />\n          </a>\n        )}\n        {fileSrc && (\n          <a\n            aria-label={t('upload:download')}\n            className={`${baseClass}__icon-link`}\n            download={filename}\n            href={fileSrc}\n            title={t('upload:download')}\n          >\n            <DownloadIcon size={24} />\n          </a>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/FileManager/index.css

@@ -100,7 +100,6 @@
 
   .file-manager__selected-meta {
     color: var(--color-text-tertiary);
-    font-family: var(--text-body-small-font-family);
     font-size: var(--text-body-small-font-size);
     line-height: var(--text-body-small-line-height);
   }

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/FileManager/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,yBAAyB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAIrE,OAAO,KAAqD,MAAM,OAAO,CAAA;AA4BzE,OAAO,aAAa,CAAA;AAcpB,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAA;IAC/B,QAAQ,CAAC,YAAY,CAAC,EAAE,OAAO,SAAS,EAAE,SAAS,CAAA;IACnD;;;OAGG;IACH,QAAQ,CAAC,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAA;IACtC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAA;IACxD,QAAQ,CAAC,YAAY,EAAE,IAAI,CAAC,yBAAyB,CAAC,QAAQ,CAAC,EAAE,oBAAoB,CAAC,CAAA;IACtF,QAAQ,CAAC,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzC,QAAQ,CAAC,WAAW,CAAC,EAAE,WAAW,CAAA;IAClC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC7C,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA2VlD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/FileManager/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,yBAAyB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAIrE,OAAO,KAAqD,MAAM,OAAO,CAAA;AA8BzE,OAAO,aAAa,CAAA;AAIpB,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAA;IAC/B,QAAQ,CAAC,YAAY,CAAC,EAAE,OAAO,SAAS,EAAE,SAAS,CAAA;IACnD;;;OAGG;IACH,QAAQ,CAAC,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAA;IACtC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAA;IACxD,QAAQ,CAAC,YAAY,EAAE,IAAI,CAAC,yBAAyB,CAAC,QAAQ,CAAC,EAAE,oBAAoB,CAAC,CAAA;IACtF,QAAQ,CAAC,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzC,QAAQ,CAAC,WAAW,CAAC,EAAE,WAAW,CAAA;IAClC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC7C,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA+XlD,CAAA"}

package/dist/elements/FileManager/index.js

@@ -3,8 +3,9 @@
 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 { formatFilesize, isImage } from 'payload/shared';
+import { formatFilesize, isImage, validateMimeType } from 'payload/shared';
 import React, { Fragment, useCallback, useEffect, useState } from 'react';
+import { toast } from 'sonner';
 import { FieldError } from '../../fields/FieldError/index.js';
 import { fieldBaseClass } from '../../fields/shared/index.js';
 import { TextInput } from '../../fields/Text/Input.js';
@@ -21,6 +22,7 @@ import { Dropzone } from '../Dropzone/index.js';
 import { EditUpload } from '../EditUpload/index.js';
 import { PreviewSizes } from '../PreviewSizes/index.js';
 import { Thumbnail } from '../Thumbnail/index.js';
+import { getEditorFileSrc } from '../Upload/getEditorFileSrc.js';
 import { editDrawerSlug, sizePreviewSlug } from '../Upload/index.js';
 import { UploadFromURLModal } from '../Upload/UploadFromURLModal/index.js';
 import { usePasteFromClipboard } from '../Upload/usePasteFromClipboard.js';
@@ -33,17 +35,8 @@ import { VideoPreview } from './FilePreview/VideoPreview/index.js';
 import { FileToolbar } from './FileToolbar/index.js';
 import './index.css';
 const baseClass = 'file-manager';
-const validate = value => {
-  if (!value && value !== undefined) {
-    return 'A file is required.';
-  }
-  if (value && (!value.name || value.name === '')) {
-    return 'A file name is required.';
-  }
-  return true;
-};
 export const FileManager = t0 => {
-  const $ = _c(56);
+  const $ = _c(62);
   const {
     collectionSlug,
     initialState,
@@ -67,21 +60,43 @@ export const FileManager = t0 => {
     data
   } = useDocumentInfo();
   let t1;
-  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    t1 = {
+  if ($[0] !== t || $[1] !== uploadConfig.mimeTypes) {
+    t1 = file => {
+      if (!file && file !== undefined) {
+        return "A file is required.";
+      }
+      if (file && (!file.name || file.name === "")) {
+        return "A file name is required.";
+      }
+      if (file instanceof File && uploadConfig.mimeTypes?.length && !validateMimeType(file.type, uploadConfig.mimeTypes)) {
+        return t("error:invalidFileType");
+      }
+      return true;
+    };
+    $[0] = t;
+    $[1] = uploadConfig.mimeTypes;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  const validate = t1;
+  let t2;
+  if ($[3] !== validate) {
+    t2 = {
       path: "file",
       validate
     };
-    $[0] = t1;
+    $[3] = validate;
+    $[4] = t2;
   } else {
-    t1 = $[0];
+    t2 = $[4];
   }
   const {
     errorMessage,
     setValue,
     showError,
     value
-  } = useField(t1);
+  } = useField(t2);
   const {
     setUploadControlFile,
     setUploadControlFileName,
@@ -99,49 +114,55 @@ export const FileManager = t0 => {
   const [selectedSize, setSelectedSize] = useState(null);
   const acceptMimeTypes = uploadConfig.mimeTypes?.join(", ");
   const imageCacheTag = uploadConfig?.cacheTags && data?.updatedAt;
-  const hasImageSizes = uploadConfig?.imageSizes?.length > 0;
-  const hasResizeOptions = Boolean(uploadConfig?.resizeOptions);
+  const hasVariants = uploadConfig?.variants?.length > 0;
+  const hasImageAdjustments = Boolean(uploadConfig?.hasImageAdjustments);
   const focalPointEnabled = uploadConfig?.focalPoint === true;
   const {
-    crop: t2,
-    focalPoint: t3
+    crop: t3,
+    focalPoint: t4
   } = uploadConfig;
-  const showCrop = t2 === undefined ? true : t2;
-  const focalPoint = t3 === undefined ? true : t3;
-  const showFocalPoint = focalPoint && (hasImageSizes || hasResizeOptions || focalPointEnabled);
-  const selectedSizeData = selectedSize ? data?.sizes?.[selectedSize] : null;
+  const showCrop = t3 === undefined ? true : t3;
+  const focalPoint = t4 === undefined ? true : t4;
+  const showFocalPoint = focalPoint && (hasVariants || hasImageAdjustments || focalPointEnabled);
+  const selectedSizeData = selectedSize ? data?.variants?.[selectedSize] : null;
   const sidePanelFileSrc = selectedSizeData?.url ?? data?.thumbnailURL ?? data?.url ?? null;
   const sidePanelMimeType = data?.mimeType;
   const fileTypeIsAdjustable = !!sidePanelMimeType && isImage(sidePanelMimeType) && sidePanelMimeType !== "image/svg+xml" && sidePanelMimeType !== "image/jxl";
   const renameFile = _temp;
-  let t4;
-  if ($[1] !== setUploadControlFile || $[2] !== setUploadControlFileName || $[3] !== setUploadControlFileUrl || $[4] !== setValue) {
-    t4 = t5 => {
+  let t5;
+  if ($[5] !== setUploadControlFile || $[6] !== setUploadControlFileName || $[7] !== setUploadControlFileUrl || $[8] !== setValue || $[9] !== t || $[10] !== uploadConfig.mimeTypes) {
+    t5 = t6 => {
       const {
-        file,
-        isNewFile: t6
-      } = t5;
-      const isNewFile = t6 === undefined ? true : t6;
-      if (isNewFile && file instanceof File) {
-        setFileSrc(URL.createObjectURL(file));
+        file: file_0,
+        isNewFile: t7
+      } = t6;
+      const isNewFile = t7 === undefined ? true : t7;
+      if (file_0 instanceof File && uploadConfig.mimeTypes?.length && !validateMimeType(file_0.type, uploadConfig.mimeTypes)) {
+        toast.error(t("error:invalidFileType"));
+        return;
+      }
+      if (isNewFile && file_0 instanceof File) {
+        setFileSrc(URL.createObjectURL(file_0));
       }
-      setValue(file);
+      setValue(file_0);
       setUploadControlFileUrl("");
       setUploadControlFileName(null);
       setUploadControlFile(null);
     };
-    $[1] = setUploadControlFile;
-    $[2] = setUploadControlFileName;
-    $[3] = setUploadControlFileUrl;
-    $[4] = setValue;
-    $[5] = t4;
+    $[5] = setUploadControlFile;
+    $[6] = setUploadControlFileName;
+    $[7] = setUploadControlFileUrl;
+    $[8] = setValue;
+    $[9] = t;
+    $[10] = uploadConfig.mimeTypes;
+    $[11] = t5;
   } else {
-    t4 = $[5];
+    t5 = $[11];
   }
-  const handleFileChange = t4;
-  let t5;
-  if ($[6] !== handleFileChange || $[7] !== value) {
-    t5 = e => {
+  const handleFileChange = t5;
+  let t6;
+  if ($[12] !== handleFileChange || $[13] !== value) {
+    t6 = e => {
       const updatedFileName = e.target.value;
       if (value) {
         handleFileChange({
@@ -151,75 +172,75 @@ export const FileManager = t0 => {
         setFilename(updatedFileName);
       }
     };
-    $[6] = handleFileChange;
-    $[7] = value;
-    $[8] = t5;
+    $[12] = handleFileChange;
+    $[13] = value;
+    $[14] = t6;
   } else {
-    t5 = $[8];
+    t6 = $[14];
   }
-  const handleFileNameChange = t5;
-  let t6;
-  if ($[9] !== handleFileChange) {
-    t6 = files => handleFileChange({
+  const handleFileNameChange = t6;
+  let t7;
+  if ($[15] !== handleFileChange) {
+    t7 = files => handleFileChange({
       file: files?.[0]
     });
-    $[9] = handleFileChange;
-    $[10] = t6;
+    $[15] = handleFileChange;
+    $[16] = t7;
   } else {
-    t6 = $[10];
+    t7 = $[16];
   }
-  const handleFileSelection = t6;
-  let t7;
-  if ($[11] !== handleFileChange) {
-    t7 = file_0 => handleFileChange({
-      file: file_0
+  const handleFileSelection = t7;
+  let t8;
+  if ($[17] !== handleFileChange) {
+    t8 = file_1 => handleFileChange({
+      file: file_1
     });
-    $[11] = handleFileChange;
-    $[12] = t7;
+    $[17] = handleFileChange;
+    $[18] = t8;
   } else {
-    t7 = $[12];
+    t8 = $[18];
   }
-  const handleFileFetchedFromUrl = t7;
-  let t8;
-  if ($[13] !== collectionSlug || $[14] !== handleFileFetchedFromUrl || $[15] !== uploadConfig) {
-    t8 = {
+  const handleFileFetchedFromUrl = t8;
+  let t9;
+  if ($[19] !== collectionSlug || $[20] !== handleFileFetchedFromUrl || $[21] !== uploadConfig) {
+    t9 = {
       collectionSlug,
       onFileFetched: handleFileFetchedFromUrl,
       uploadConfig
     };
-    $[13] = collectionSlug;
-    $[14] = handleFileFetchedFromUrl;
-    $[15] = uploadConfig;
-    $[16] = t8;
+    $[19] = collectionSlug;
+    $[20] = handleFileFetchedFromUrl;
+    $[21] = uploadConfig;
+    $[22] = t9;
   } else {
-    t8 = $[16];
+    t9 = $[22];
   }
   const {
     fileUrl,
     handleUrlSubmit,
     isValidUrl,
     setFileUrl
-  } = useUploadFromUrl(t8);
-  let t9;
-  if ($[17] !== handleFileSelection || $[18] !== handleUrlSubmit || $[19] !== setFileUrl || $[20] !== uploadConfig) {
-    t9 = {
+  } = useUploadFromUrl(t9);
+  let t10;
+  if ($[23] !== handleFileSelection || $[24] !== handleUrlSubmit || $[25] !== setFileUrl || $[26] !== uploadConfig) {
+    t10 = {
       handleFileSelection,
       handleUrlSubmit,
       setFileUrl,
       uploadConfig
     };
-    $[17] = handleFileSelection;
-    $[18] = handleUrlSubmit;
-    $[19] = setFileUrl;
-    $[20] = uploadConfig;
-    $[21] = t9;
+    $[23] = handleFileSelection;
+    $[24] = handleUrlSubmit;
+    $[25] = setFileUrl;
+    $[26] = uploadConfig;
+    $[27] = t10;
   } else {
-    t9 = $[21];
+    t10 = $[27];
   }
-  const handlePasteFromClipboard = usePasteFromClipboard(t9);
-  let t10;
-  if ($[22] !== handleFileChange || $[23] !== resetUploadEdits || $[24] !== setFileUrl || $[25] !== setUploadControlFile || $[26] !== setUploadControlFileName || $[27] !== setUploadControlFileUrl) {
-    t10 = () => {
+  const handlePasteFromClipboard = usePasteFromClipboard(t10);
+  let t11;
+  if ($[28] !== handleFileChange || $[29] !== resetUploadEdits || $[30] !== setFileUrl || $[31] !== setUploadControlFile || $[32] !== setUploadControlFileName || $[33] !== setUploadControlFileUrl) {
+    t11 = () => {
       setRemovedFile(true);
       handleFileChange({
         file: null
@@ -232,92 +253,92 @@ export const FileManager = t0 => {
       setUploadControlFileName(null);
       setUploadControlFile(null);
     };
-    $[22] = handleFileChange;
-    $[23] = resetUploadEdits;
-    $[24] = setFileUrl;
-    $[25] = setUploadControlFile;
-    $[26] = setUploadControlFileName;
-    $[27] = setUploadControlFileUrl;
-    $[28] = t10;
+    $[28] = handleFileChange;
+    $[29] = resetUploadEdits;
+    $[30] = setFileUrl;
+    $[31] = setUploadControlFile;
+    $[32] = setUploadControlFileName;
+    $[33] = setUploadControlFileUrl;
+    $[34] = t11;
   } else {
-    t10 = $[28];
+    t11 = $[34];
   }
-  const handleFileRemoval = t10;
-  let t11;
-  if ($[29] !== setModified || $[30] !== updateUploadEdits) {
-    t11 = args => {
+  const handleFileRemoval = t11;
+  let t12;
+  if ($[35] !== setModified || $[36] !== updateUploadEdits) {
+    t12 = args => {
       setModified(true);
       updateUploadEdits(args);
     };
-    $[29] = setModified;
-    $[30] = updateUploadEdits;
-    $[31] = t11;
+    $[35] = setModified;
+    $[36] = updateUploadEdits;
+    $[37] = t12;
   } else {
-    t11 = $[31];
+    t12 = $[37];
   }
-  const onEditsSave = t11;
-  let t12;
-  if ($[32] === Symbol.for("react.memo_cache_sentinel")) {
-    t12 = () => {
+  const onEditsSave = t12;
+  let t13;
+  if ($[38] === Symbol.for("react.memo_cache_sentinel")) {
+    t13 = () => {
       setSelectedSize(null);
       setRemovedFile(false);
       setFileSrc("");
     };
-    $[32] = t12;
+    $[38] = t13;
   } else {
-    t12 = $[32];
+    t13 = $[38];
   }
-  const t13 = data?.url;
-  const t14 = data?.filename;
-  let t15;
-  if ($[33] !== t13 || $[34] !== t14) {
-    t15 = [t13, t14];
-    $[33] = t13;
-    $[34] = t14;
-    $[35] = t15;
+  const t14 = data?.url;
+  const t15 = data?.filename;
+  let t16;
+  if ($[39] !== t14 || $[40] !== t15) {
+    t16 = [t14, t15];
+    $[39] = t14;
+    $[40] = t15;
+    $[41] = t16;
   } else {
-    t15 = $[35];
+    t16 = $[41];
   }
-  useEffect(t12, t15);
-  let t16;
+  useEffect(t13, t16);
   let t17;
-  if ($[36] !== initialState) {
-    t16 = () => {
+  let t18;
+  if ($[42] !== initialState) {
+    t17 = () => {
       if (initialState?.file?.value instanceof File) {
         setFileSrc(URL.createObjectURL(initialState.file.value));
         setRemovedFile(false);
       }
     };
-    t17 = [initialState];
-    $[36] = initialState;
-    $[37] = t16;
-    $[38] = t17;
+    t18 = [initialState];
+    $[42] = initialState;
+    $[43] = t17;
+    $[44] = t18;
   } else {
-    t16 = $[37];
-    t17 = $[38];
+    t17 = $[43];
+    t18 = $[44];
   }
-  useEffect(t16, t17);
-  let t18;
+  useEffect(t17, t18);
   let t19;
-  if ($[39] !== fileSrc) {
-    t18 = () => () => {
+  let t20;
+  if ($[45] !== fileSrc) {
+    t19 = () => () => {
       if (fileSrc?.startsWith("blob:")) {
         URL.revokeObjectURL(fileSrc);
       }
     };
-    t19 = [fileSrc];
-    $[39] = fileSrc;
-    $[40] = t18;
-    $[41] = t19;
+    t20 = [fileSrc];
+    $[45] = fileSrc;
+    $[46] = t19;
+    $[47] = t20;
   } else {
-    t18 = $[40];
-    t19 = $[41];
+    t19 = $[46];
+    t20 = $[47];
   }
-  useEffect(t18, t19);
-  let t20;
+  useEffect(t19, t20);
   let t21;
-  if ($[42] !== handleUrlSubmit || $[43] !== setFileUrl || $[44] !== uploadControlFileUrl) {
-    t20 = () => {
+  let t22;
+  if ($[48] !== handleUrlSubmit || $[49] !== setFileUrl || $[50] !== uploadControlFileUrl) {
+    t21 = () => {
       const handleControlFileUrl = async () => {
         if (uploadControlFileUrl) {
           setFileUrl(uploadControlFileUrl);
@@ -326,40 +347,40 @@ export const FileManager = t0 => {
       };
       handleControlFileUrl();
     };
-    t21 = [uploadControlFileUrl, handleUrlSubmit, setFileUrl];
-    $[42] = handleUrlSubmit;
-    $[43] = setFileUrl;
-    $[44] = uploadControlFileUrl;
-    $[45] = t20;
-    $[46] = t21;
+    t22 = [uploadControlFileUrl, handleUrlSubmit, setFileUrl];
+    $[48] = handleUrlSubmit;
+    $[49] = setFileUrl;
+    $[50] = uploadControlFileUrl;
+    $[51] = t21;
+    $[52] = t22;
   } else {
-    t20 = $[45];
-    t21 = $[46];
+    t21 = $[51];
+    t22 = $[52];
   }
-  useEffect(t20, t21);
-  let t22;
+  useEffect(t21, t22);
   let t23;
-  if ($[47] !== handleFileChange || $[48] !== uploadControlFile) {
-    t22 = () => {
+  let t24;
+  if ($[53] !== handleFileChange || $[54] !== uploadControlFile) {
+    t23 = () => {
       if (uploadControlFile) {
         handleFileChange({
           file: uploadControlFile
         });
       }
     };
-    t23 = [uploadControlFile, handleFileChange];
-    $[47] = handleFileChange;
-    $[48] = uploadControlFile;
-    $[49] = t22;
-    $[50] = t23;
+    t24 = [uploadControlFile, handleFileChange];
+    $[53] = handleFileChange;
+    $[54] = uploadControlFile;
+    $[55] = t23;
+    $[56] = t24;
   } else {
-    t22 = $[49];
-    t23 = $[50];
+    t23 = $[55];
+    t24 = $[56];
   }
-  useEffect(t22, t23);
-  let t24;
-  if ($[51] !== collectionSlug || $[52] !== value?.name || $[53] !== value?.type) {
-    t24 = src => {
+  useEffect(t23, t24);
+  let t25;
+  if ($[57] !== collectionSlug || $[58] !== value?.name || $[59] !== value?.type) {
+    t25 = src => {
       const fileType = value?.type ?? "";
       if (fileType.startsWith("video/")) {
         return _jsx("div", {
@@ -395,19 +416,23 @@ export const FileManager = t0 => {
         })
       });
     };
-    $[51] = collectionSlug;
-    $[52] = value?.name;
-    $[53] = value?.type;
-    $[54] = t24;
+    $[57] = collectionSlug;
+    $[58] = value?.name;
+    $[59] = value?.type;
+    $[60] = t25;
   } else {
-    t24 = $[54];
+    t25 = $[60];
   }
-  const renderSelectedFilePreview = t24;
+  const renderSelectedFilePreview = t25;
   const drawers = _jsxs(Fragment, {
     children: [(value || data?.filename) && _jsx(EditDepthProvider, {
       children: _jsx(EditUpload, {
         fileName: value?.name || data?.filename,
-        fileSrc: data?.url || fileSrc,
+        fileSrc: getEditorFileSrc({
+          data,
+          fileSrc,
+          hasSelectedFile: Boolean(value)
+        }),
         imageCacheTag,
         initialCrop: uploadEdits?.crop ?? undefined,
         initialFocalPoint: {
@@ -418,7 +443,7 @@ export const FileManager = t0 => {
         showCrop,
         showFocalPoint
       })
-    }), data && hasImageSizes && _jsx(Drawer, {
+    }), data && hasVariants && _jsx(Drawer, {
       className: `${baseClass}__preview-drawer`,
       hoverTitle: true,
       slug: sizePreviewSlug,
@@ -438,15 +463,15 @@ export const FileManager = t0 => {
     })]
   });
   const showUploadInput = Boolean(value) || removedFile || !uploadConfig?.hideFileInputOnCreate;
-  let t25;
-  if ($[55] === Symbol.for("react.memo_cache_sentinel")) {
-    t25 = [fieldBaseClass, baseClass].filter(Boolean);
-    $[55] = t25;
+  let t26;
+  if ($[61] === Symbol.for("react.memo_cache_sentinel")) {
+    t26 = [fieldBaseClass, baseClass].filter(Boolean);
+    $[61] = t26;
   } else {
-    t25 = $[55];
+    t26 = $[61];
   }
   return _jsxs("div", {
-    className: t25.join(" "),
+    className: t26.join(" "),
     children: [_jsx(FieldError, {
       message: errorMessage,
       path: "filename",
@@ -475,6 +500,7 @@ export const FileManager = t0 => {
         }) : showUploadInput ? _jsxs("div", {
           className: `${baseClass}__upload`,
           children: [!value && removedFile && data?.filename && _jsx(Button, {
+            "aria-label": t("general:cancel"),
             buttonStyle: "secondary",
             className: `${baseClass}__remove`,
             icon: "x",
@@ -493,6 +519,7 @@ export const FileManager = t0 => {
             })
           }), value && fileSrc && _jsxs(Fragment, {
             children: [_jsx(Button, {
+              "aria-label": t("general:cancel"),
               buttonStyle: "secondary",
               className: `${baseClass}__remove`,
               icon: "x",