@payloadcms/ui 3.71.0-internal-debug.e053082 → 3.71.0-internal.49c4f67

package/dist/elements/BulkUpload/FileSidebar/index.js

@@ -1,5 +1,7 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
+
+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 { useWindowInfo } from '@faceless-ui/window-info';
 import { isImage } from 'payload/shared';
@@ -25,402 +27,321 @@ import { useBulkUpload } from '../index.js';
 const addMoreFilesDrawerSlug = 'bulk-upload-drawer--add-more-files';
 const baseClass = 'file-selections';
 export function FileSidebar() {
-    const { activeIndex, addFiles, forms, isInitializing, removeFile, setActiveIndex, totalErrorCount } = useFormsManager();
-    const { initialFiles, initialForms, maxFiles } = useBulkUpload();
-    const { i18n, t } = useTranslation();
-    const { closeModal, openModal } = useModal();
-    const [showFiles, setShowFiles] = React.useState(false);
-    const { breakpoints } = useWindowInfo();
-    const handleRemoveFile = React.useCallback((indexToRemove)=>{
-        removeFile(indexToRemove);
-    }, [
-        removeFile
-    ]);
-    const handleAddFiles = React.useCallback((filelist)=>{
-        void addFiles(filelist);
-        closeModal(addMoreFilesDrawerSlug);
-    }, [
-        addFiles,
-        closeModal
-    ]);
-    const getFileSize = React.useCallback((file)=>{
-        const size = file.size;
-        const i = size === 0 ? 0 : Math.floor(Math.log(size) / Math.log(1024));
-        const decimals = i > 1 ? 1 : 0;
-        const formattedSize = (size / Math.pow(1024, i)).toFixed(decimals) + ' ' + [
-            'B',
-            'kB',
-            'MB',
-            'GB',
-            'TB'
-        ][i];
-        return formattedSize;
-    }, []);
-    const totalFileCount = isInitializing ? initialFiles?.length ?? initialForms?.length : forms.length;
-    const { collectionSlug: bulkUploadCollectionSlug, selectableCollections, setCollectionSlug } = useBulkUpload();
-    const { getEntityConfig } = useConfig();
-    return /*#__PURE__*/ _jsxDEV("div", {
-        className: [
-            baseClass,
-            showFiles && `${baseClass}__showingFiles`
-        ].filter(Boolean).join(' '),
-        children: [
-            breakpoints.m && showFiles ? /*#__PURE__*/ _jsxDEV("div", {
-                className: `${baseClass}__mobileBlur`
-            }, void 0, false, {
-                fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                lineNumber: 87,
-                columnNumber: 37
-            }, this) : null,
-            /*#__PURE__*/ _jsxDEV("div", {
-                className: `${baseClass}__header`,
-                children: [
-                    selectableCollections?.length > 1 && /*#__PURE__*/ _jsxDEV(SelectInput, {
-                        className: `${baseClass}__collectionSelect`,
-                        isClearable: false,
-                        name: "groupBy",
-                        onChange: (e)=>{
-                            const val = typeof e === 'object' && 'value' in e ? e?.value : e;
-                            setCollectionSlug(val);
-                        },
-                        options: selectableCollections?.map((coll)=>{
-                            const config = getEntityConfig({
-                                collectionSlug: coll
-                            });
-                            return {
-                                label: config.labels.singular,
-                                value: config.slug
-                            };
-                        }) || [],
-                        path: "groupBy",
-                        required: true,
-                        value: bulkUploadCollectionSlug
-                    }, void 0, false, {
-                        fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                        lineNumber: 90,
-                        columnNumber: 11
-                    }, this),
-                    /*#__PURE__*/ _jsxDEV("div", {
-                        className: `${baseClass}__headerTopRow`,
-                        children: [
-                            /*#__PURE__*/ _jsxDEV("div", {
-                                className: `${baseClass}__header__text`,
-                                children: [
-                                    /*#__PURE__*/ _jsxDEV(ErrorPill, {
-                                        count: totalErrorCount,
-                                        i18n: i18n,
-                                        withMessage: true
-                                    }, void 0, false, {
-                                        fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                        lineNumber: 114,
-                                        columnNumber: 13
-                                    }, this),
-                                    /*#__PURE__*/ _jsxDEV("p", {
-                                        children: /*#__PURE__*/ _jsxDEV("strong", {
-                                            title: `${totalFileCount} ${t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}`,
-                                            children: [
-                                                totalFileCount,
-                                                ' ',
-                                                t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')
-                                            ]
-                                        }, void 0, true, {
-                                            fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                            lineNumber: 116,
-                                            columnNumber: 15
-                                        }, this)
-                                    }, void 0, false, {
-                                        fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                        lineNumber: 115,
-                                        columnNumber: 13
-                                    }, this)
-                                ]
-                            }, void 0, true, {
-                                fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                lineNumber: 113,
-                                columnNumber: 11
-                            }, this),
-                            /*#__PURE__*/ _jsxDEV("div", {
-                                className: `${baseClass}__header__actions`,
-                                children: [
-                                    (typeof maxFiles === 'number' ? totalFileCount < maxFiles : true) ? /*#__PURE__*/ _jsxDEV(Pill, {
-                                        className: `${baseClass}__header__addFile`,
-                                        onClick: ()=>openModal(addMoreFilesDrawerSlug),
-                                        size: "small",
-                                        children: t('upload:addFile')
-                                    }, void 0, false, {
-                                        fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                        lineNumber: 127,
-                                        columnNumber: 15
-                                    }, this) : null,
-                                    /*#__PURE__*/ _jsxDEV(Button, {
-                                        buttonStyle: "transparent",
-                                        className: `${baseClass}__toggler`,
-                                        onClick: ()=>setShowFiles((prev)=>!prev),
-                                        children: [
-                                            /*#__PURE__*/ _jsxDEV("span", {
-                                                className: `${baseClass}__toggler__label`,
-                                                children: /*#__PURE__*/ _jsxDEV("strong", {
-                                                    title: `${totalFileCount} ${t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}`,
-                                                    children: [
-                                                        totalFileCount,
-                                                        ' ',
-                                                        t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')
-                                                    ]
-                                                }, void 0, true, {
-                                                    fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                                    lineNumber: 141,
-                                                    columnNumber: 17
-                                                }, this)
-                                            }, void 0, false, {
-                                                fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                                lineNumber: 140,
-                                                columnNumber: 15
-                                            }, this),
-                                            /*#__PURE__*/ _jsxDEV(ChevronIcon, {
-                                                direction: showFiles ? 'down' : 'up'
-                                            }, void 0, false, {
-                                                fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                                lineNumber: 148,
-                                                columnNumber: 15
-                                            }, this)
-                                        ]
-                                    }, void 0, true, {
-                                        fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                        lineNumber: 135,
-                                        columnNumber: 13
-                                    }, this),
-                                    /*#__PURE__*/ _jsxDEV(Drawer, {
-                                        gutter: false,
-                                        Header: null,
-                                        slug: addMoreFilesDrawerSlug,
-                                        children: /*#__PURE__*/ _jsxDEV(AddFilesView, {
-                                            onCancel: ()=>closeModal(addMoreFilesDrawerSlug),
-                                            onDrop: handleAddFiles
-                                        }, void 0, false, {
-                                            fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                            lineNumber: 152,
-                                            columnNumber: 15
-                                        }, this)
-                                    }, void 0, false, {
-                                        fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                        lineNumber: 151,
-                                        columnNumber: 13
-                                    }, this)
-                                ]
-                            }, void 0, true, {
-                                fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                lineNumber: 125,
-                                columnNumber: 11
-                            }, this)
-                        ]
-                    }, void 0, true, {
-                        fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                        lineNumber: 112,
-                        columnNumber: 9
-                    }, this),
-                    /*#__PURE__*/ _jsxDEV("div", {
-                        className: `${baseClass}__header__mobileDocActions`,
-                        children: /*#__PURE__*/ _jsxDEV(Actions, {}, void 0, false, {
-                            fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                            lineNumber: 161,
-                            columnNumber: 11
-                        }, this)
-                    }, void 0, false, {
-                        fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                        lineNumber: 160,
-                        columnNumber: 9
-                    }, this)
-                ]
-            }, void 0, true, {
-                fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                lineNumber: 88,
-                columnNumber: 7
-            }, this),
-            /*#__PURE__*/ _jsxDEV("div", {
-                className: `${baseClass}__animateWrapper`,
-                children: /*#__PURE__*/ _jsxDEV(AnimateHeight, {
-                    height: !breakpoints.m || showFiles ? 'auto' : 0,
-                    children: /*#__PURE__*/ _jsxDEV("div", {
-                        className: `${baseClass}__filesContainer`,
-                        children: [
-                            isInitializing && forms.length === 0 && (initialFiles?.length > 0 || initialForms?.length > 0) ? (initialFiles ? Array.from(initialFiles) : initialForms).map((file, index)=>/*#__PURE__*/ _jsxDEV(ShimmerEffect, {
-                                    animationDelay: `calc(${index} * ${60}ms)`,
-                                    height: "35px"
-                                }, index, false, {
-                                    fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                    lineNumber: 172,
-                                    columnNumber: 19
-                                }, this)) : null,
-                            forms.map(({ errorCount, formID, formState }, index)=>{
-                                const currentFile = formState?.file?.value || {};
-                                return /*#__PURE__*/ _jsxDEV("div", {
-                                    className: [
-                                        `${baseClass}__fileRowContainer`,
-                                        index === activeIndex && `${baseClass}__fileRowContainer--active`,
-                                        errorCount && errorCount > 0 && `${baseClass}__fileRowContainer--error`
-                                    ].filter(Boolean).join(' '),
-                                    children: [
-                                        /*#__PURE__*/ _jsxDEV("button", {
-                                            className: `${baseClass}__fileRow`,
-                                            onClick: ()=>setActiveIndex(index),
-                                            type: "button",
-                                            children: [
-                                                /*#__PURE__*/ _jsxDEV(SidebarThumbnail, {
-                                                    file: currentFile,
-                                                    formID: formID
-                                                }, void 0, false, {
-                                                    fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                                    lineNumber: 198,
-                                                    columnNumber: 21
-                                                }, this),
-                                                /*#__PURE__*/ _jsxDEV("div", {
-                                                    className: `${baseClass}__fileDetails`,
-                                                    children: /*#__PURE__*/ _jsxDEV("p", {
-                                                        className: `${baseClass}__fileName`,
-                                                        title: currentFile.name,
-                                                        children: currentFile.name || t('upload:noFile')
-                                                    }, void 0, false, {
-                                                        fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                                        lineNumber: 200,
-                                                        columnNumber: 23
-                                                    }, this)
-                                                }, void 0, false, {
-                                                    fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                                    lineNumber: 199,
-                                                    columnNumber: 21
-                                                }, this),
-                                                currentFile instanceof File ? /*#__PURE__*/ _jsxDEV("p", {
-                                                    className: `${baseClass}__fileSize`,
-                                                    children: getFileSize(currentFile)
-                                                }, void 0, false, {
-                                                    fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                                    lineNumber: 205,
-                                                    columnNumber: 23
-                                                }, this) : null,
-                                                /*#__PURE__*/ _jsxDEV("div", {
-                                                    className: `${baseClass}__remove ${baseClass}__remove--underlay`,
-                                                    children: /*#__PURE__*/ _jsxDEV(XIcon, {}, void 0, false, {
-                                                        fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                                        lineNumber: 208,
-                                                        columnNumber: 23
-                                                    }, this)
-                                                }, void 0, false, {
-                                                    fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                                    lineNumber: 207,
-                                                    columnNumber: 21
-                                                }, this),
-                                                errorCount ? /*#__PURE__*/ _jsxDEV(ErrorPill, {
-                                                    className: `${baseClass}__errorCount`,
-                                                    count: errorCount,
-                                                    i18n: i18n
-                                                }, void 0, false, {
-                                                    fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                                    lineNumber: 212,
-                                                    columnNumber: 23
-                                                }, this) : null
-                                            ]
-                                        }, void 0, true, {
-                                            fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                            lineNumber: 193,
-                                            columnNumber: 19
-                                        }, this),
-                                        /*#__PURE__*/ _jsxDEV("button", {
-                                            "aria-label": t('general:remove'),
-                                            className: `${baseClass}__remove ${baseClass}__remove--overlay`,
-                                            onClick: ()=>handleRemoveFile(index),
-                                            type: "button",
-                                            children: /*#__PURE__*/ _jsxDEV(XIcon, {}, void 0, false, {
-                                                fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                                lineNumber: 226,
-                                                columnNumber: 21
-                                            }, this)
-                                        }, void 0, false, {
-                                            fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                            lineNumber: 220,
-                                            columnNumber: 19
-                                        }, this)
-                                    ]
-                                }, formID, true, {
-                                    fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                                    lineNumber: 183,
-                                    columnNumber: 17
-                                }, this);
-                            })
-                        ]
-                    }, void 0, true, {
-                        fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                        lineNumber: 167,
-                        columnNumber: 11
-                    }, this)
-                }, void 0, false, {
-                    fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                    lineNumber: 166,
-                    columnNumber: 9
-                }, this)
-            }, void 0, false, {
-                fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-                lineNumber: 165,
-                columnNumber: 7
-            }, this)
-        ]
-    }, void 0, true, {
-        fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-        lineNumber: 84,
-        columnNumber: 5
-    }, this);
+  const $ = _c(39);
+  const {
+    activeIndex,
+    addFiles,
+    forms,
+    isInitializing,
+    removeFile,
+    setActiveIndex,
+    totalErrorCount
+  } = useFormsManager();
+  const {
+    initialFiles,
+    initialForms,
+    maxFiles
+  } = useBulkUpload();
+  const {
+    i18n,
+    t
+  } = useTranslation();
+  const {
+    closeModal,
+    openModal
+  } = useModal();
+  const [showFiles, setShowFiles] = React.useState(false);
+  const {
+    breakpoints
+  } = useWindowInfo();
+  let t0;
+  if ($[0] !== removeFile) {
+    t0 = indexToRemove => {
+      removeFile(indexToRemove);
+    };
+    $[0] = removeFile;
+    $[1] = t0;
+  } else {
+    t0 = $[1];
+  }
+  const handleRemoveFile = t0;
+  let t1;
+  if ($[2] !== addFiles || $[3] !== closeModal) {
+    t1 = filelist => {
+      addFiles(filelist);
+      closeModal(addMoreFilesDrawerSlug);
+    };
+    $[2] = addFiles;
+    $[3] = closeModal;
+    $[4] = t1;
+  } else {
+    t1 = $[4];
+  }
+  const handleAddFiles = t1;
+  const getFileSize = _temp;
+  const totalFileCount = isInitializing ? initialFiles?.length ?? initialForms?.length : forms.length;
+  const {
+    collectionSlug: bulkUploadCollectionSlug,
+    selectableCollections,
+    setCollectionSlug
+  } = useBulkUpload();
+  const {
+    getEntityConfig
+  } = useConfig();
+  const t2 = showFiles && `${baseClass}__showingFiles`;
+  let t3;
+  if ($[5] !== t2) {
+    t3 = [baseClass, t2].filter(Boolean);
+    $[5] = t2;
+    $[6] = t3;
+  } else {
+    t3 = $[6];
+  }
+  const t4 = t3.join(" ");
+  let t5;
+  if ($[7] !== activeIndex || $[8] !== breakpoints.m || $[9] !== bulkUploadCollectionSlug || $[10] !== closeModal || $[11] !== forms || $[12] !== getEntityConfig || $[13] !== handleAddFiles || $[14] !== handleRemoveFile || $[15] !== i18n || $[16] !== initialFiles || $[17] !== initialForms || $[18] !== isInitializing || $[19] !== maxFiles || $[20] !== openModal || $[21] !== selectableCollections || $[22] !== setActiveIndex || $[23] !== setCollectionSlug || $[24] !== showFiles || $[25] !== t || $[26] !== t4 || $[27] !== totalErrorCount || $[28] !== totalFileCount) {
+    let t6;
+    if ($[30] === Symbol.for("react.memo_cache_sentinel")) {
+      t6 = () => setShowFiles(_temp2);
+      $[30] = t6;
+    } else {
+      t6 = $[30];
+    }
+    let t7;
+    if ($[31] !== closeModal) {
+      t7 = () => closeModal(addMoreFilesDrawerSlug);
+      $[31] = closeModal;
+      $[32] = t7;
+    } else {
+      t7 = $[32];
+    }
+    let t8;
+    if ($[33] !== activeIndex || $[34] !== handleRemoveFile || $[35] !== i18n || $[36] !== setActiveIndex || $[37] !== t) {
+      t8 = (t9, index_0) => {
+        const {
+          errorCount,
+          formID,
+          formState
+        } = t9;
+        const currentFile = formState?.file?.value || {};
+        return _jsxs("div", {
+          className: [`${baseClass}__fileRowContainer`, index_0 === activeIndex && `${baseClass}__fileRowContainer--active`, errorCount && errorCount > 0 && `${baseClass}__fileRowContainer--error`].filter(Boolean).join(" "),
+          children: [_jsxs("button", {
+            className: `${baseClass}__fileRow`,
+            onClick: () => setActiveIndex(index_0),
+            type: "button",
+            children: [_jsx(SidebarThumbnail, {
+              file: currentFile,
+              formID
+            }), _jsx("div", {
+              className: `${baseClass}__fileDetails`,
+              children: _jsx("p", {
+                className: `${baseClass}__fileName`,
+                title: currentFile.name,
+                children: currentFile.name || t("upload:noFile")
+              })
+            }), currentFile instanceof File ? _jsx("p", {
+              className: `${baseClass}__fileSize`,
+              children: getFileSize(currentFile)
+            }) : null, _jsx("div", {
+              className: `${baseClass}__remove ${baseClass}__remove--underlay`,
+              children: _jsx(XIcon, {})
+            }), errorCount ? _jsx(ErrorPill, {
+              className: `${baseClass}__errorCount`,
+              count: errorCount,
+              i18n
+            }) : null]
+          }), _jsx("button", {
+            "aria-label": t("general:remove"),
+            className: `${baseClass}__remove ${baseClass}__remove--overlay`,
+            onClick: () => handleRemoveFile(index_0),
+            type: "button",
+            children: _jsx(XIcon, {})
+          })]
+        }, formID);
+      };
+      $[33] = activeIndex;
+      $[34] = handleRemoveFile;
+      $[35] = i18n;
+      $[36] = setActiveIndex;
+      $[37] = t;
+      $[38] = t8;
+    } else {
+      t8 = $[38];
+    }
+    t5 = _jsxs("div", {
+      className: t4,
+      children: [breakpoints.m && showFiles ? _jsx("div", {
+        className: `${baseClass}__mobileBlur`
+      }) : null, _jsxs("div", {
+        className: `${baseClass}__header`,
+        children: [selectableCollections?.length > 1 && _jsx(SelectInput, {
+          className: `${baseClass}__collectionSelect`,
+          isClearable: false,
+          name: "groupBy",
+          onChange: e => {
+            const val = typeof e === "object" && "value" in e ? e?.value : e;
+            setCollectionSlug(val);
+          },
+          options: selectableCollections?.map(coll => {
+            const config = getEntityConfig({
+              collectionSlug: coll
+            });
+            return {
+              label: config.labels.singular,
+              value: config.slug
+            };
+          }) || [],
+          path: "groupBy",
+          required: true,
+          value: bulkUploadCollectionSlug
+        }), _jsxs("div", {
+          className: `${baseClass}__headerTopRow`,
+          children: [_jsxs("div", {
+            className: `${baseClass}__header__text`,
+            children: [_jsx(ErrorPill, {
+              count: totalErrorCount,
+              i18n,
+              withMessage: true
+            }), _jsx("p", {
+              children: _jsxs("strong", {
+                title: `${totalFileCount} ${t(totalFileCount > 1 ? "upload:filesToUpload" : "upload:fileToUpload")}`,
+                children: [totalFileCount, " ", t(totalFileCount > 1 ? "upload:filesToUpload" : "upload:fileToUpload")]
+              })
+            })]
+          }), _jsxs("div", {
+            className: `${baseClass}__header__actions`,
+            children: [(typeof maxFiles === "number" ? totalFileCount < maxFiles : true) ? _jsx(Pill, {
+              className: `${baseClass}__header__addFile`,
+              onClick: () => openModal(addMoreFilesDrawerSlug),
+              size: "small",
+              children: t("upload:addFile")
+            }) : null, _jsxs(Button, {
+              buttonStyle: "transparent",
+              className: `${baseClass}__toggler`,
+              onClick: t6,
+              children: [_jsx("span", {
+                className: `${baseClass}__toggler__label`,
+                children: _jsxs("strong", {
+                  title: `${totalFileCount} ${t(totalFileCount > 1 ? "upload:filesToUpload" : "upload:fileToUpload")}`,
+                  children: [totalFileCount, " ", t(totalFileCount > 1 ? "upload:filesToUpload" : "upload:fileToUpload")]
+                })
+              }), _jsx(ChevronIcon, {
+                direction: showFiles ? "down" : "up"
+              })]
+            }), _jsx(Drawer, {
+              gutter: false,
+              Header: null,
+              slug: addMoreFilesDrawerSlug,
+              children: _jsx(AddFilesView, {
+                onCancel: t7,
+                onDrop: handleAddFiles
+              })
+            })]
+          })]
+        }), _jsx("div", {
+          className: `${baseClass}__header__mobileDocActions`,
+          children: _jsx(Actions, {})
+        })]
+      }), _jsx("div", {
+        className: `${baseClass}__animateWrapper`,
+        children: _jsx(AnimateHeight, {
+          height: !breakpoints.m || showFiles ? "auto" : 0,
+          children: _jsxs("div", {
+            className: `${baseClass}__filesContainer`,
+            children: [isInitializing && forms.length === 0 && (initialFiles?.length > 0 || initialForms?.length > 0) ? (initialFiles ? Array.from(initialFiles) : initialForms).map(_temp3) : null, forms.map(t8)]
+          })
+        })
+      })]
+    });
+    $[7] = activeIndex;
+    $[8] = breakpoints.m;
+    $[9] = bulkUploadCollectionSlug;
+    $[10] = closeModal;
+    $[11] = forms;
+    $[12] = getEntityConfig;
+    $[13] = handleAddFiles;
+    $[14] = handleRemoveFile;
+    $[15] = i18n;
+    $[16] = initialFiles;
+    $[17] = initialForms;
+    $[18] = isInitializing;
+    $[19] = maxFiles;
+    $[20] = openModal;
+    $[21] = selectableCollections;
+    $[22] = setActiveIndex;
+    $[23] = setCollectionSlug;
+    $[24] = showFiles;
+    $[25] = t;
+    $[26] = t4;
+    $[27] = totalErrorCount;
+    $[28] = totalFileCount;
+    $[29] = t5;
+  } else {
+    t5 = $[29];
+  }
+  return t5;
+}
+function _temp3(file_0, index) {
+  return _jsx(ShimmerEffect, {
+    animationDelay: `calc(${index} * ${60}ms)`,
+    height: "35px"
+  }, index);
 }
-function SidebarThumbnail({ file, formID }) {
-    const [thumbnailURL, setThumbnailURL] = React.useState(null);
-    const [isLoading, setIsLoading] = React.useState(true);
-    React.useEffect(()=>{
-        let isCancelled = false;
-        async function generateThumbnail() {
-            setIsLoading(true);
-            setThumbnailURL(null);
-            try {
-                if (isImage(file.type)) {
-                    const url = await createThumbnail(file);
-                    if (!isCancelled) {
-                        setThumbnailURL(url);
-                    }
-                } else {
-                    setThumbnailURL(null);
-                }
-            } catch (_) {
-                if (!isCancelled) {
-                    setThumbnailURL(null);
-                }
-            } finally{
-                if (!isCancelled) {
-                    setIsLoading(false);
-                }
-            }
+function _temp2(prev) {
+  return !prev;
+}
+function _temp(file) {
+  const size = file.size;
+  const i = size === 0 ? 0 : Math.floor(Math.log(size) / Math.log(1024));
+  const decimals = i > 1 ? 1 : 0;
+  const formattedSize = (size / Math.pow(1024, i)).toFixed(decimals) + " " + ["B", "kB", "MB", "GB", "TB"][i];
+  return formattedSize;
+}
+function SidebarThumbnail({
+  file,
+  formID
+}) {
+  const [thumbnailURL, setThumbnailURL] = React.useState(null);
+  const [isLoading, setIsLoading] = React.useState(true);
+  React.useEffect(() => {
+    let isCancelled = false;
+    async function generateThumbnail() {
+      setIsLoading(true);
+      setThumbnailURL(null);
+      try {
+        if (isImage(file.type)) {
+          const url = await createThumbnail(file);
+          if (!isCancelled) {
+            setThumbnailURL(url);
+          }
+        } else {
+          setThumbnailURL(null);
+        }
+      } catch (_) {
+        if (!isCancelled) {
+          setThumbnailURL(null);
         }
-        void generateThumbnail();
-        return ()=>{
-            isCancelled = true;
-        };
-    }, [
-        file
-    ]);
-    if (isLoading) {
-        return /*#__PURE__*/ _jsxDEV(ShimmerEffect, {
-            className: `${baseClass}__thumbnail-shimmer`,
-            disableInlineStyles: true
-        }, void 0, false, {
-            fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-            lineNumber: 277,
-            columnNumber: 12
-        }, this);
+      } finally {
+        if (!isCancelled) {
+          setIsLoading(false);
+        }
+      }
     }
-    return /*#__PURE__*/ _jsxDEV(Thumbnail, {
-        className: `${baseClass}__thumbnail`,
-        fileSrc: thumbnailURL
-    }, `${formID}-${thumbnailURL || 'placeholder'}`, false, {
-        fileName: "src/elements/BulkUpload/FileSidebar/index.tsx",
-        lineNumber: 281,
-        columnNumber: 5
-    }, this);
+    void generateThumbnail();
+    return () => {
+      isCancelled = true;
+    };
+  }, [file]);
+  if (isLoading) {
+    return /*#__PURE__*/_jsx(ShimmerEffect, {
+      className: `${baseClass}__thumbnail-shimmer`,
+      disableInlineStyles: true
+    });
+  }
+  return /*#__PURE__*/_jsx(Thumbnail, {
+    className: `${baseClass}__thumbnail`,
+    fileSrc: thumbnailURL
+  }, `${formID}-${thumbnailURL || 'placeholder'}`);
 }
-
 //# sourceMappingURL=index.js.map