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

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

@@ -1,5 +1,4 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { useModal } from '@faceless-ui/modal';
 import { useWindowInfo } from '@faceless-ui/window-info';
 import { isImage } from 'payload/shared';
@@ -59,315 +58,95 @@ export function FileSidebar() {
     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);
+    return <div className={[
+        baseClass,
+        showFiles && `${baseClass}__showingFiles`
+    ].filter(Boolean).join(' ')}>
+      {breakpoints.m && showFiles ? <div className={`${baseClass}__mobileBlur`}/> : null}
+      <div className={`${baseClass}__header`}>
+        {selectableCollections?.length > 1 && <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 value={bulkUploadCollectionSlug}/>}
+        <div className={`${baseClass}__headerTopRow`}>
+          <div className={`${baseClass}__header__text`}>
+            <ErrorPill count={totalErrorCount} i18n={i18n} withMessage/>
+            <p>
+              <strong title={`${totalFileCount} ${t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}`}>
+                {totalFileCount}{' '}
+                {t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}
+              </strong>
+            </p>
+          </div>
+
+          <div className={`${baseClass}__header__actions`}>
+            {(typeof maxFiles === 'number' ? totalFileCount < maxFiles : true) ? <Pill className={`${baseClass}__header__addFile`} onClick={()=>openModal(addMoreFilesDrawerSlug)} size="small">
+                {t('upload:addFile')}
+              </Pill> : null}
+            <Button buttonStyle="transparent" className={`${baseClass}__toggler`} onClick={()=>setShowFiles((prev)=>!prev)}>
+              <span className={`${baseClass}__toggler__label`}>
+                <strong title={`${totalFileCount} ${t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}`}>
+                  {totalFileCount}{' '}
+                  {t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}
+                </strong>
+              </span>
+              <ChevronIcon direction={showFiles ? 'down' : 'up'}/>
+            </Button>
+
+            <Drawer gutter={false} Header={null} slug={addMoreFilesDrawerSlug}>
+              <AddFilesView onCancel={()=>closeModal(addMoreFilesDrawerSlug)} onDrop={handleAddFiles}/>
+            </Drawer>
+          </div>
+        </div>
+
+        <div className={`${baseClass}__header__mobileDocActions`}>
+          <Actions/>
+        </div>
+      </div>
+
+      <div className={`${baseClass}__animateWrapper`}>
+        <AnimateHeight height={!breakpoints.m || showFiles ? 'auto' : 0}>
+          <div className={`${baseClass}__filesContainer`}>
+            {isInitializing && forms.length === 0 && (initialFiles?.length > 0 || initialForms?.length > 0) ? (initialFiles ? Array.from(initialFiles) : initialForms).map((file, index)=><ShimmerEffect animationDelay={`calc(${index} * ${60}ms)`} height="35px" key={index}/>) : null}
+            {forms.map(({ errorCount, formID, formState }, index)=>{
+        const currentFile = formState?.file?.value || {};
+        return <div className={[
+            `${baseClass}__fileRowContainer`,
+            index === activeIndex && `${baseClass}__fileRowContainer--active`,
+            errorCount && errorCount > 0 && `${baseClass}__fileRowContainer--error`
+        ].filter(Boolean).join(' ')} key={formID}>
+                  <button className={`${baseClass}__fileRow`} onClick={()=>setActiveIndex(index)} type="button">
+                    <SidebarThumbnail file={currentFile} formID={formID}/>
+                    <div className={`${baseClass}__fileDetails`}>
+                      <p className={`${baseClass}__fileName`} title={currentFile.name}>
+                        {currentFile.name || t('upload:noFile')}
+                      </p>
+                    </div>
+                    {currentFile instanceof File ? <p className={`${baseClass}__fileSize`}>{getFileSize(currentFile)}</p> : null}
+                    <div className={`${baseClass}__remove ${baseClass}__remove--underlay`}>
+                      <XIcon/>
+                    </div>
+
+                    {errorCount ? <ErrorPill className={`${baseClass}__errorCount`} count={errorCount} i18n={i18n}/> : null}
+                  </button>
+
+                  <button aria-label={t('general:remove')} className={`${baseClass}__remove ${baseClass}__remove--overlay`} onClick={()=>handleRemoveFile(index)} type="button">
+                    <XIcon/>
+                  </button>
+                </div>;
+    })}
+          </div>
+        </AnimateHeight>
+      </div>
+    </div>;
 }
 function SidebarThumbnail({ file, formID }) {
     const [thumbnailURL, setThumbnailURL] = React.useState(null);
@@ -404,23 +183,9 @@ function SidebarThumbnail({ file, formID }) {
         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);
+        return <ShimmerEffect className={`${baseClass}__thumbnail-shimmer`} disableInlineStyles/>;
     }
-    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);
+    return <Thumbnail className={`${baseClass}__thumbnail`} fileSrc={thumbnailURL} key={`${formID}-${thumbnailURL || 'placeholder'}`}/>;
 }
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/BulkUpload/FileSidebar/index.tsx"],"sourcesContent":["'use client'\n\nimport { useModal } from '@faceless-ui/modal'\nimport { useWindowInfo } from '@faceless-ui/window-info'\nimport { isImage } from 'payload/shared'\nimport React from 'react'\n\nimport { SelectInput } from '../../../fields/Select/Input.js'\nimport { ChevronIcon } from '../../../icons/Chevron/index.js'\nimport { XIcon } from '../../../icons/X/index.js'\nimport { useConfig } from '../../../providers/Config/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { AnimateHeight } from '../../AnimateHeight/index.js'\nimport { Button } from '../../Button/index.js'\nimport { Drawer } from '../../Drawer/index.js'\nimport { ErrorPill } from '../../ErrorPill/index.js'\nimport { Pill } from '../../Pill/index.js'\nimport { ShimmerEffect } from '../../ShimmerEffect/index.js'\nimport { createThumbnail } from '../../Thumbnail/createThumbnail.js'\nimport { Thumbnail } from '../../Thumbnail/index.js'\nimport { Actions } from '../ActionsBar/index.js'\nimport { AddFilesView } from '../AddFilesView/index.js'\nimport './index.scss'\nimport { useFormsManager } from '../FormsManager/index.js'\nimport { useBulkUpload } from '../index.js'\n\nconst addMoreFilesDrawerSlug = 'bulk-upload-drawer--add-more-files'\n\nconst baseClass = 'file-selections'\n\nexport function FileSidebar() {\n  const {\n    activeIndex,\n    addFiles,\n    forms,\n    isInitializing,\n    removeFile,\n    setActiveIndex,\n    totalErrorCount,\n  } = useFormsManager()\n  const { initialFiles, initialForms, maxFiles } = useBulkUpload()\n  const { i18n, t } = useTranslation()\n  const { closeModal, openModal } = useModal()\n  const [showFiles, setShowFiles] = React.useState(false)\n  const { breakpoints } = useWindowInfo()\n\n  const handleRemoveFile = React.useCallback(\n    (indexToRemove: number) => {\n      removeFile(indexToRemove)\n    },\n    [removeFile],\n  )\n\n  const handleAddFiles = React.useCallback(\n    (filelist: FileList) => {\n      void addFiles(filelist)\n      closeModal(addMoreFilesDrawerSlug)\n    },\n    [addFiles, closeModal],\n  )\n\n  const getFileSize = React.useCallback((file: File) => {\n    const size = file.size\n    const i = size === 0 ? 0 : Math.floor(Math.log(size) / Math.log(1024))\n    const decimals = i > 1 ? 1 : 0\n    const formattedSize =\n      (size / Math.pow(1024, i)).toFixed(decimals) + ' ' + ['B', 'kB', 'MB', 'GB', 'TB'][i]\n    return formattedSize\n  }, [])\n\n  const totalFileCount = isInitializing\n    ? (initialFiles?.length ?? initialForms?.length)\n    : forms.length\n\n  const {\n    collectionSlug: bulkUploadCollectionSlug,\n    selectableCollections,\n    setCollectionSlug,\n  } = useBulkUpload()\n\n  const { getEntityConfig } = useConfig()\n\n  return (\n    <div\n      className={[baseClass, showFiles && `${baseClass}__showingFiles`].filter(Boolean).join(' ')}\n    >\n      {breakpoints.m && showFiles ? <div className={`${baseClass}__mobileBlur`} /> : null}\n      <div className={`${baseClass}__header`}>\n        {selectableCollections?.length > 1 && (\n          <SelectInput\n            className={`${baseClass}__collectionSelect`}\n            isClearable={false}\n            name=\"groupBy\"\n            onChange={(e) => {\n              const val: string =\n                typeof e === 'object' && 'value' in e\n                  ? (e?.value as string)\n                  : (e as unknown as string)\n              setCollectionSlug(val)\n            }}\n            options={\n              selectableCollections?.map((coll) => {\n                const config = getEntityConfig({ collectionSlug: coll })\n                return { label: config.labels.singular, value: config.slug }\n              }) || []\n            }\n            path=\"groupBy\"\n            required\n            value={bulkUploadCollectionSlug}\n          />\n        )}\n        <div className={`${baseClass}__headerTopRow`}>\n          <div className={`${baseClass}__header__text`}>\n            <ErrorPill count={totalErrorCount} i18n={i18n} withMessage />\n            <p>\n              <strong\n                title={`${totalFileCount} ${t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}`}\n              >\n                {totalFileCount}{' '}\n                {t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}\n              </strong>\n            </p>\n          </div>\n\n          <div className={`${baseClass}__header__actions`}>\n            {(typeof maxFiles === 'number' ? totalFileCount < maxFiles : true) ? (\n              <Pill\n                className={`${baseClass}__header__addFile`}\n                onClick={() => openModal(addMoreFilesDrawerSlug)}\n                size=\"small\"\n              >\n                {t('upload:addFile')}\n              </Pill>\n            ) : null}\n            <Button\n              buttonStyle=\"transparent\"\n              className={`${baseClass}__toggler`}\n              onClick={() => setShowFiles((prev) => !prev)}\n            >\n              <span className={`${baseClass}__toggler__label`}>\n                <strong\n                  title={`${totalFileCount} ${t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}`}\n                >\n                  {totalFileCount}{' '}\n                  {t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}\n                </strong>\n              </span>\n              <ChevronIcon direction={showFiles ? 'down' : 'up'} />\n            </Button>\n\n            <Drawer gutter={false} Header={null} slug={addMoreFilesDrawerSlug}>\n              <AddFilesView\n                onCancel={() => closeModal(addMoreFilesDrawerSlug)}\n                onDrop={handleAddFiles}\n              />\n            </Drawer>\n          </div>\n        </div>\n\n        <div className={`${baseClass}__header__mobileDocActions`}>\n          <Actions />\n        </div>\n      </div>\n\n      <div className={`${baseClass}__animateWrapper`}>\n        <AnimateHeight height={!breakpoints.m || showFiles ? 'auto' : 0}>\n          <div className={`${baseClass}__filesContainer`}>\n            {isInitializing &&\n            forms.length === 0 &&\n            (initialFiles?.length > 0 || initialForms?.length > 0)\n              ? (initialFiles ? Array.from(initialFiles) : initialForms).map((file, index) => (\n                  <ShimmerEffect\n                    animationDelay={`calc(${index} * ${60}ms)`}\n                    height=\"35px\"\n                    key={index}\n                  />\n                ))\n              : null}\n            {forms.map(({ errorCount, formID, formState }, index) => {\n              const currentFile = (formState?.file?.value as File) || ({} as File)\n\n              return (\n                <div\n                  className={[\n                    `${baseClass}__fileRowContainer`,\n                    index === activeIndex && `${baseClass}__fileRowContainer--active`,\n                    errorCount && errorCount > 0 && `${baseClass}__fileRowContainer--error`,\n                  ]\n                    .filter(Boolean)\n                    .join(' ')}\n                  key={formID}\n                >\n                  <button\n                    className={`${baseClass}__fileRow`}\n                    onClick={() => setActiveIndex(index)}\n                    type=\"button\"\n                  >\n                    <SidebarThumbnail file={currentFile} formID={formID} />\n                    <div className={`${baseClass}__fileDetails`}>\n                      <p className={`${baseClass}__fileName`} title={currentFile.name}>\n                        {currentFile.name || t('upload:noFile')}\n                      </p>\n                    </div>\n                    {currentFile instanceof File ? (\n                      <p className={`${baseClass}__fileSize`}>{getFileSize(currentFile)}</p>\n                    ) : null}\n                    <div className={`${baseClass}__remove ${baseClass}__remove--underlay`}>\n                      <XIcon />\n                    </div>\n\n                    {errorCount ? (\n                      <ErrorPill\n                        className={`${baseClass}__errorCount`}\n                        count={errorCount}\n                        i18n={i18n}\n                      />\n                    ) : null}\n                  </button>\n\n                  <button\n                    aria-label={t('general:remove')}\n                    className={`${baseClass}__remove ${baseClass}__remove--overlay`}\n                    onClick={() => handleRemoveFile(index)}\n                    type=\"button\"\n                  >\n                    <XIcon />\n                  </button>\n                </div>\n              )\n            })}\n          </div>\n        </AnimateHeight>\n      </div>\n    </div>\n  )\n}\n\nfunction SidebarThumbnail({ file, formID }: { file: File; formID: string }) {\n  const [thumbnailURL, setThumbnailURL] = React.useState<null | string>(null)\n  const [isLoading, setIsLoading] = React.useState(true)\n\n  React.useEffect(() => {\n    let isCancelled = false\n\n    async function generateThumbnail() {\n      setIsLoading(true)\n      setThumbnailURL(null)\n\n      try {\n        if (isImage(file.type)) {\n          const url = await createThumbnail(file)\n          if (!isCancelled) {\n            setThumbnailURL(url)\n          }\n        } else {\n          setThumbnailURL(null)\n        }\n      } catch (_) {\n        if (!isCancelled) {\n          setThumbnailURL(null)\n        }\n      } finally {\n        if (!isCancelled) {\n          setIsLoading(false)\n        }\n      }\n    }\n\n    void generateThumbnail()\n\n    return () => {\n      isCancelled = true\n    }\n  }, [file])\n\n  if (isLoading) {\n    return <ShimmerEffect className={`${baseClass}__thumbnail-shimmer`} disableInlineStyles />\n  }\n\n  return (\n    <Thumbnail\n      className={`${baseClass}__thumbnail`}\n      fileSrc={thumbnailURL}\n      key={`${formID}-${thumbnailURL || 'placeholder'}`}\n    />\n  )\n}\n"],"names":["useModal","useWindowInfo","isImage","React","SelectInput","ChevronIcon","XIcon","useConfig","useTranslation","AnimateHeight","Button","Drawer","ErrorPill","Pill","ShimmerEffect","createThumbnail","Thumbnail","Actions","AddFilesView","useFormsManager","useBulkUpload","addMoreFilesDrawerSlug","baseClass","FileSidebar","activeIndex","addFiles","forms","isInitializing","removeFile","setActiveIndex","totalErrorCount","initialFiles","initialForms","maxFiles","i18n","t","closeModal","openModal","showFiles","setShowFiles","useState","breakpoints","handleRemoveFile","useCallback","indexToRemove","handleAddFiles","filelist","getFileSize","file","size","i","Math","floor","log","decimals","formattedSize","pow","toFixed","totalFileCount","length","collectionSlug","bulkUploadCollectionSlug","selectableCollections","setCollectionSlug","getEntityConfig","div","className","filter","Boolean","join","m","isClearable","name","onChange","e","val","value","options","map","coll","config","label","labels","singular","slug","path","required","count","withMessage","p","strong","title","onClick","buttonStyle","prev","span","direction","gutter","Header","onCancel","onDrop","height","Array","from","index","animationDelay","errorCount","formID","formState","currentFile","button","type","SidebarThumbnail","File","aria-label","thumbnailURL","setThumbnailURL","isLoading","setIsLoading","useEffect","isCancelled","generateThumbnail","url","_","disableInlineStyles","fileSrc"],"mappings":"AAAA;;AAEA,SAASA,QAAQ,QAAQ,qBAAoB;AAC7C,SAASC,aAAa,QAAQ,2BAA0B;AACxD,SAASC,OAAO,QAAQ,iBAAgB;AACxC,OAAOC,WAAW,QAAO;AAEzB,SAASC,WAAW,QAAQ,kCAAiC;AAC7D,SAASC,WAAW,QAAQ,kCAAiC;AAC7D,SAASC,KAAK,QAAQ,4BAA2B;AACjD,SAASC,SAAS,QAAQ,qCAAoC;AAC9D,SAASC,cAAc,QAAQ,0CAAyC;AACxE,SAASC,aAAa,QAAQ,+BAA8B;AAC5D,SAASC,MAAM,QAAQ,wBAAuB;AAC9C,SAASC,MAAM,QAAQ,wBAAuB;AAC9C,SAASC,SAAS,QAAQ,2BAA0B;AACpD,SAASC,IAAI,QAAQ,sBAAqB;AAC1C,SAASC,aAAa,QAAQ,+BAA8B;AAC5D,SAASC,eAAe,QAAQ,qCAAoC;AACpE,SAASC,SAAS,QAAQ,2BAA0B;AACpD,SAASC,OAAO,QAAQ,yBAAwB;AAChD,SAASC,YAAY,QAAQ,2BAA0B;AACvD,OAAO,eAAc;AACrB,SAASC,eAAe,QAAQ,2BAA0B;AAC1D,SAASC,aAAa,QAAQ,cAAa;AAE3C,MAAMC,yBAAyB;AAE/B,MAAMC,YAAY;AAElB,OAAO,SAASC;IACd,MAAM,EACJC,WAAW,EACXC,QAAQ,EACRC,KAAK,EACLC,cAAc,EACdC,UAAU,EACVC,cAAc,EACdC,eAAe,EAChB,GAAGX;IACJ,MAAM,EAAEY,YAAY,EAAEC,YAAY,EAAEC,QAAQ,EAAE,GAAGb;IACjD,MAAM,EAAEc,IAAI,EAAEC,CAAC,EAAE,GAAG3B;IACpB,MAAM,EAAE4B,UAAU,EAAEC,SAAS,EAAE,GAAGrC;IAClC,MAAM,CAACsC,WAAWC,aAAa,GAAGpC,MAAMqC,QAAQ,CAAC;IACjD,MAAM,EAAEC,WAAW,EAAE,GAAGxC;IAExB,MAAMyC,mBAAmBvC,MAAMwC,WAAW,CACxC,CAACC;QACChB,WAAWgB;IACb,GACA;QAAChB;KAAW;IAGd,MAAMiB,iBAAiB1C,MAAMwC,WAAW,CACtC,CAACG;QACC,KAAKrB,SAASqB;QACdV,WAAWf;IACb,GACA;QAACI;QAAUW;KAAW;IAGxB,MAAMW,cAAc5C,MAAMwC,WAAW,CAAC,CAACK;QACrC,MAAMC,OAAOD,KAAKC,IAAI;QACtB,MAAMC,IAAID,SAAS,IAAI,IAAIE,KAAKC,KAAK,CAACD,KAAKE,GAAG,CAACJ,QAAQE,KAAKE,GAAG,CAAC;QAChE,MAAMC,WAAWJ,IAAI,IAAI,IAAI;QAC7B,MAAMK,gBACJ,AAACN,CAAAA,OAAOE,KAAKK,GAAG,CAAC,MAAMN,EAAC,EAAGO,OAAO,CAACH,YAAY,MAAM;YAAC;YAAK;YAAM;YAAM;YAAM;SAAK,CAACJ,EAAE;QACvF,OAAOK;IACT,GAAG,EAAE;IAEL,MAAMG,iBAAiB/B,iBAClBI,cAAc4B,UAAU3B,cAAc2B,SACvCjC,MAAMiC,MAAM;IAEhB,MAAM,EACJC,gBAAgBC,wBAAwB,EACxCC,qBAAqB,EACrBC,iBAAiB,EAClB,GAAG3C;IAEJ,MAAM,EAAE4C,eAAe,EAAE,GAAGzD;IAE5B,qBACE,QAAC0D;QACCC,WAAW;YAAC5C;YAAWgB,aAAa,GAAGhB,UAAU,cAAc,CAAC;SAAC,CAAC6C,MAAM,CAACC,SAASC,IAAI,CAAC;;YAEtF5B,YAAY6B,CAAC,IAAIhC,0BAAY,QAAC2B;gBAAIC,WAAW,GAAG5C,UAAU,YAAY,CAAC;;;;;uBAAO;0BAC/E,QAAC2C;gBAAIC,WAAW,GAAG5C,UAAU,QAAQ,CAAC;;oBACnCwC,uBAAuBH,SAAS,mBAC/B,QAACvD;wBACC8D,WAAW,GAAG5C,UAAU,kBAAkB,CAAC;wBAC3CiD,aAAa;wBACbC,MAAK;wBACLC,UAAU,CAACC;4BACT,MAAMC,MACJ,OAAOD,MAAM,YAAY,WAAWA,IAC/BA,GAAGE,QACHF;4BACPX,kBAAkBY;wBACpB;wBACAE,SACEf,uBAAuBgB,IAAI,CAACC;4BAC1B,MAAMC,SAAShB,gBAAgB;gCAAEJ,gBAAgBmB;4BAAK;4BACtD,OAAO;gCAAEE,OAAOD,OAAOE,MAAM,CAACC,QAAQ;gCAAEP,OAAOI,OAAOI,IAAI;4BAAC;wBAC7D,MAAM,EAAE;wBAEVC,MAAK;wBACLC,QAAQ;wBACRV,OAAOf;;;;;;kCAGX,QAACI;wBAAIC,WAAW,GAAG5C,UAAU,cAAc,CAAC;;0CAC1C,QAAC2C;gCAAIC,WAAW,GAAG5C,UAAU,cAAc,CAAC;;kDAC1C,QAACV;wCAAU2E,OAAOzD;wCAAiBI,MAAMA;wCAAMsD,WAAW;;;;;;kDAC1D,QAACC;kDACC,cAAA,QAACC;4CACCC,OAAO,GAAGjC,eAAe,CAAC,EAAEvB,EAAEuB,iBAAiB,IAAI,yBAAyB,wBAAwB;;gDAEnGA;gDAAgB;gDAChBvB,EAAEuB,iBAAiB,IAAI,yBAAyB;;;;;;;;;;;;;;;;;;0CAKvD,QAACO;gCAAIC,WAAW,GAAG5C,UAAU,iBAAiB,CAAC;;oCAC3C,CAAA,OAAOW,aAAa,WAAWyB,iBAAiBzB,WAAW,IAAG,kBAC9D,QAACpB;wCACCqD,WAAW,GAAG5C,UAAU,iBAAiB,CAAC;wCAC1CsE,SAAS,IAAMvD,UAAUhB;wCACzB4B,MAAK;kDAEJd,EAAE;;;;;+CAEH;kDACJ,QAACzB;wCACCmF,aAAY;wCACZ3B,WAAW,GAAG5C,UAAU,SAAS,CAAC;wCAClCsE,SAAS,IAAMrD,aAAa,CAACuD,OAAS,CAACA;;0DAEvC,QAACC;gDAAK7B,WAAW,GAAG5C,UAAU,gBAAgB,CAAC;0DAC7C,cAAA,QAACoE;oDACCC,OAAO,GAAGjC,eAAe,CAAC,EAAEvB,EAAEuB,iBAAiB,IAAI,yBAAyB,wBAAwB;;wDAEnGA;wDAAgB;wDAChBvB,EAAEuB,iBAAiB,IAAI,yBAAyB;;;;;;;;;;;;0DAGrD,QAACrD;gDAAY2F,WAAW1D,YAAY,SAAS;;;;;;;;;;;;kDAG/C,QAAC3B;wCAAOsF,QAAQ;wCAAOC,QAAQ;wCAAMd,MAAM/D;kDACzC,cAAA,QAACH;4CACCiF,UAAU,IAAM/D,WAAWf;4CAC3B+E,QAAQvD;;;;;;;;;;;;;;;;;;;;;;;kCAMhB,QAACoB;wBAAIC,WAAW,GAAG5C,UAAU,0BAA0B,CAAC;kCACtD,cAAA,QAACL;;;;;;;;;;;;;;;;0BAIL,QAACgD;gBAAIC,WAAW,GAAG5C,UAAU,gBAAgB,CAAC;0BAC5C,cAAA,QAACb;oBAAc4F,QAAQ,CAAC5D,YAAY6B,CAAC,IAAIhC,YAAY,SAAS;8BAC5D,cAAA,QAAC2B;wBAAIC,WAAW,GAAG5C,UAAU,gBAAgB,CAAC;;4BAC3CK,kBACDD,MAAMiC,MAAM,KAAK,KAChB5B,CAAAA,cAAc4B,SAAS,KAAK3B,cAAc2B,SAAS,CAAA,IAChD,AAAC5B,CAAAA,eAAeuE,MAAMC,IAAI,CAACxE,gBAAgBC,YAAW,EAAG8C,GAAG,CAAC,CAAC9B,MAAMwD,sBAClE,QAAC1F;oCACC2F,gBAAgB,CAAC,KAAK,EAAED,MAAM,GAAG,EAAE,GAAG,GAAG,CAAC;oCAC1CH,QAAO;mCACFG;;;;4CAGT;4BACH9E,MAAMoD,GAAG,CAAC,CAAC,EAAE4B,UAAU,EAAEC,MAAM,EAAEC,SAAS,EAAE,EAAEJ;gCAC7C,MAAMK,cAAc,AAACD,WAAW5D,MAAM4B,SAAmB,CAAC;gCAE1D,qBACE,QAACX;oCACCC,WAAW;wCACT,GAAG5C,UAAU,kBAAkB,CAAC;wCAChCkF,UAAUhF,eAAe,GAAGF,UAAU,0BAA0B,CAAC;wCACjEoF,cAAcA,aAAa,KAAK,GAAGpF,UAAU,yBAAyB,CAAC;qCACxE,CACE6C,MAAM,CAACC,SACPC,IAAI,CAAC;;sDAGR,QAACyC;4CACC5C,WAAW,GAAG5C,UAAU,SAAS,CAAC;4CAClCsE,SAAS,IAAM/D,eAAe2E;4CAC9BO,MAAK;;8DAEL,QAACC;oDAAiBhE,MAAM6D;oDAAaF,QAAQA;;;;;;8DAC7C,QAAC1C;oDAAIC,WAAW,GAAG5C,UAAU,aAAa,CAAC;8DACzC,cAAA,QAACmE;wDAAEvB,WAAW,GAAG5C,UAAU,UAAU,CAAC;wDAAEqE,OAAOkB,YAAYrC,IAAI;kEAC5DqC,YAAYrC,IAAI,IAAIrC,EAAE;;;;;;;;;;;gDAG1B0E,uBAAuBI,qBACtB,QAACxB;oDAAEvB,WAAW,GAAG5C,UAAU,UAAU,CAAC;8DAAGyB,YAAY8D;;;;;2DACnD;8DACJ,QAAC5C;oDAAIC,WAAW,GAAG5C,UAAU,SAAS,EAAEA,UAAU,kBAAkB,CAAC;8DACnE,cAAA,QAAChB;;;;;;;;;;gDAGFoG,2BACC,QAAC9F;oDACCsD,WAAW,GAAG5C,UAAU,YAAY,CAAC;oDACrCiE,OAAOmB;oDACPxE,MAAMA;;;;;2DAEN;;;;;;;sDAGN,QAAC4E;4CACCI,cAAY/E,EAAE;4CACd+B,WAAW,GAAG5C,UAAU,SAAS,EAAEA,UAAU,iBAAiB,CAAC;4CAC/DsE,SAAS,IAAMlD,iBAAiB8D;4CAChCO,MAAK;sDAEL,cAAA,QAACzG;;;;;;;;;;;mCAnCEqG;;;;;4BAuCX;;;;;;;;;;;;;;;;;;;;;;;AAMZ;AAEA,SAASK,iBAAiB,EAAEhE,IAAI,EAAE2D,MAAM,EAAkC;IACxE,MAAM,CAACQ,cAAcC,gBAAgB,GAAGjH,MAAMqC,QAAQ,CAAgB;IACtE,MAAM,CAAC6E,WAAWC,aAAa,GAAGnH,MAAMqC,QAAQ,CAAC;IAEjDrC,MAAMoH,SAAS,CAAC;QACd,IAAIC,cAAc;QAElB,eAAeC;YACbH,aAAa;YACbF,gBAAgB;YAEhB,IAAI;gBACF,IAAIlH,QAAQ8C,KAAK+D,IAAI,GAAG;oBACtB,MAAMW,MAAM,MAAM3G,gBAAgBiC;oBAClC,IAAI,CAACwE,aAAa;wBAChBJ,gBAAgBM;oBAClB;gBACF,OAAO;oBACLN,gBAAgB;gBAClB;YACF,EAAE,OAAOO,GAAG;gBACV,IAAI,CAACH,aAAa;oBAChBJ,gBAAgB;gBAClB;YACF,SAAU;gBACR,IAAI,CAACI,aAAa;oBAChBF,aAAa;gBACf;YACF;QACF;QAEA,KAAKG;QAEL,OAAO;YACLD,cAAc;QAChB;IACF,GAAG;QAACxE;KAAK;IAET,IAAIqE,WAAW;QACb,qBAAO,QAACvG;YAAcoD,WAAW,GAAG5C,UAAU,mBAAmB,CAAC;YAAEsG,mBAAmB;;;;;;IACzF;IAEA,qBACE,QAAC5G;QACCkD,WAAW,GAAG5C,UAAU,WAAW,CAAC;QACpCuG,SAASV;OACJ,GAAGR,OAAO,CAAC,EAAEQ,gBAAgB,eAAe;;;;;AAGvD"}
+{"version":3,"sources":["../../../../src/elements/BulkUpload/FileSidebar/index.tsx"],"sourcesContent":["'use client'\n\nimport { useModal } from '@faceless-ui/modal'\nimport { useWindowInfo } from '@faceless-ui/window-info'\nimport { isImage } from 'payload/shared'\nimport React from 'react'\n\nimport { SelectInput } from '../../../fields/Select/Input.js'\nimport { ChevronIcon } from '../../../icons/Chevron/index.js'\nimport { XIcon } from '../../../icons/X/index.js'\nimport { useConfig } from '../../../providers/Config/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { AnimateHeight } from '../../AnimateHeight/index.js'\nimport { Button } from '../../Button/index.js'\nimport { Drawer } from '../../Drawer/index.js'\nimport { ErrorPill } from '../../ErrorPill/index.js'\nimport { Pill } from '../../Pill/index.js'\nimport { ShimmerEffect } from '../../ShimmerEffect/index.js'\nimport { createThumbnail } from '../../Thumbnail/createThumbnail.js'\nimport { Thumbnail } from '../../Thumbnail/index.js'\nimport { Actions } from '../ActionsBar/index.js'\nimport { AddFilesView } from '../AddFilesView/index.js'\nimport './index.scss'\nimport { useFormsManager } from '../FormsManager/index.js'\nimport { useBulkUpload } from '../index.js'\n\nconst addMoreFilesDrawerSlug = 'bulk-upload-drawer--add-more-files'\n\nconst baseClass = 'file-selections'\n\nexport function FileSidebar() {\n  const {\n    activeIndex,\n    addFiles,\n    forms,\n    isInitializing,\n    removeFile,\n    setActiveIndex,\n    totalErrorCount,\n  } = useFormsManager()\n  const { initialFiles, initialForms, maxFiles } = useBulkUpload()\n  const { i18n, t } = useTranslation()\n  const { closeModal, openModal } = useModal()\n  const [showFiles, setShowFiles] = React.useState(false)\n  const { breakpoints } = useWindowInfo()\n\n  const handleRemoveFile = React.useCallback(\n    (indexToRemove: number) => {\n      removeFile(indexToRemove)\n    },\n    [removeFile],\n  )\n\n  const handleAddFiles = React.useCallback(\n    (filelist: FileList) => {\n      void addFiles(filelist)\n      closeModal(addMoreFilesDrawerSlug)\n    },\n    [addFiles, closeModal],\n  )\n\n  const getFileSize = React.useCallback((file: File) => {\n    const size = file.size\n    const i = size === 0 ? 0 : Math.floor(Math.log(size) / Math.log(1024))\n    const decimals = i > 1 ? 1 : 0\n    const formattedSize =\n      (size / Math.pow(1024, i)).toFixed(decimals) + ' ' + ['B', 'kB', 'MB', 'GB', 'TB'][i]\n    return formattedSize\n  }, [])\n\n  const totalFileCount = isInitializing\n    ? (initialFiles?.length ?? initialForms?.length)\n    : forms.length\n\n  const {\n    collectionSlug: bulkUploadCollectionSlug,\n    selectableCollections,\n    setCollectionSlug,\n  } = useBulkUpload()\n\n  const { getEntityConfig } = useConfig()\n\n  return (\n    <div\n      className={[baseClass, showFiles && `${baseClass}__showingFiles`].filter(Boolean).join(' ')}\n    >\n      {breakpoints.m && showFiles ? <div className={`${baseClass}__mobileBlur`} /> : null}\n      <div className={`${baseClass}__header`}>\n        {selectableCollections?.length > 1 && (\n          <SelectInput\n            className={`${baseClass}__collectionSelect`}\n            isClearable={false}\n            name=\"groupBy\"\n            onChange={(e) => {\n              const val: string =\n                typeof e === 'object' && 'value' in e\n                  ? (e?.value as string)\n                  : (e as unknown as string)\n              setCollectionSlug(val)\n            }}\n            options={\n              selectableCollections?.map((coll) => {\n                const config = getEntityConfig({ collectionSlug: coll })\n                return { label: config.labels.singular, value: config.slug }\n              }) || []\n            }\n            path=\"groupBy\"\n            required\n            value={bulkUploadCollectionSlug}\n          />\n        )}\n        <div className={`${baseClass}__headerTopRow`}>\n          <div className={`${baseClass}__header__text`}>\n            <ErrorPill count={totalErrorCount} i18n={i18n} withMessage />\n            <p>\n              <strong\n                title={`${totalFileCount} ${t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}`}\n              >\n                {totalFileCount}{' '}\n                {t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}\n              </strong>\n            </p>\n          </div>\n\n          <div className={`${baseClass}__header__actions`}>\n            {(typeof maxFiles === 'number' ? totalFileCount < maxFiles : true) ? (\n              <Pill\n                className={`${baseClass}__header__addFile`}\n                onClick={() => openModal(addMoreFilesDrawerSlug)}\n                size=\"small\"\n              >\n                {t('upload:addFile')}\n              </Pill>\n            ) : null}\n            <Button\n              buttonStyle=\"transparent\"\n              className={`${baseClass}__toggler`}\n              onClick={() => setShowFiles((prev) => !prev)}\n            >\n              <span className={`${baseClass}__toggler__label`}>\n                <strong\n                  title={`${totalFileCount} ${t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}`}\n                >\n                  {totalFileCount}{' '}\n                  {t(totalFileCount > 1 ? 'upload:filesToUpload' : 'upload:fileToUpload')}\n                </strong>\n              </span>\n              <ChevronIcon direction={showFiles ? 'down' : 'up'} />\n            </Button>\n\n            <Drawer gutter={false} Header={null} slug={addMoreFilesDrawerSlug}>\n              <AddFilesView\n                onCancel={() => closeModal(addMoreFilesDrawerSlug)}\n                onDrop={handleAddFiles}\n              />\n            </Drawer>\n          </div>\n        </div>\n\n        <div className={`${baseClass}__header__mobileDocActions`}>\n          <Actions />\n        </div>\n      </div>\n\n      <div className={`${baseClass}__animateWrapper`}>\n        <AnimateHeight height={!breakpoints.m || showFiles ? 'auto' : 0}>\n          <div className={`${baseClass}__filesContainer`}>\n            {isInitializing &&\n            forms.length === 0 &&\n            (initialFiles?.length > 0 || initialForms?.length > 0)\n              ? (initialFiles ? Array.from(initialFiles) : initialForms).map((file, index) => (\n                  <ShimmerEffect\n                    animationDelay={`calc(${index} * ${60}ms)`}\n                    height=\"35px\"\n                    key={index}\n                  />\n                ))\n              : null}\n            {forms.map(({ errorCount, formID, formState }, index) => {\n              const currentFile = (formState?.file?.value as File) || ({} as File)\n\n              return (\n                <div\n                  className={[\n                    `${baseClass}__fileRowContainer`,\n                    index === activeIndex && `${baseClass}__fileRowContainer--active`,\n                    errorCount && errorCount > 0 && `${baseClass}__fileRowContainer--error`,\n                  ]\n                    .filter(Boolean)\n                    .join(' ')}\n                  key={formID}\n                >\n                  <button\n                    className={`${baseClass}__fileRow`}\n                    onClick={() => setActiveIndex(index)}\n                    type=\"button\"\n                  >\n                    <SidebarThumbnail file={currentFile} formID={formID} />\n                    <div className={`${baseClass}__fileDetails`}>\n                      <p className={`${baseClass}__fileName`} title={currentFile.name}>\n                        {currentFile.name || t('upload:noFile')}\n                      </p>\n                    </div>\n                    {currentFile instanceof File ? (\n                      <p className={`${baseClass}__fileSize`}>{getFileSize(currentFile)}</p>\n                    ) : null}\n                    <div className={`${baseClass}__remove ${baseClass}__remove--underlay`}>\n                      <XIcon />\n                    </div>\n\n                    {errorCount ? (\n                      <ErrorPill\n                        className={`${baseClass}__errorCount`}\n                        count={errorCount}\n                        i18n={i18n}\n                      />\n                    ) : null}\n                  </button>\n\n                  <button\n                    aria-label={t('general:remove')}\n                    className={`${baseClass}__remove ${baseClass}__remove--overlay`}\n                    onClick={() => handleRemoveFile(index)}\n                    type=\"button\"\n                  >\n                    <XIcon />\n                  </button>\n                </div>\n              )\n            })}\n          </div>\n        </AnimateHeight>\n      </div>\n    </div>\n  )\n}\n\nfunction SidebarThumbnail({ file, formID }: { file: File; formID: string }) {\n  const [thumbnailURL, setThumbnailURL] = React.useState<null | string>(null)\n  const [isLoading, setIsLoading] = React.useState(true)\n\n  React.useEffect(() => {\n    let isCancelled = false\n\n    async function generateThumbnail() {\n      setIsLoading(true)\n      setThumbnailURL(null)\n\n      try {\n        if (isImage(file.type)) {\n          const url = await createThumbnail(file)\n          if (!isCancelled) {\n            setThumbnailURL(url)\n          }\n        } else {\n          setThumbnailURL(null)\n        }\n      } catch (_) {\n        if (!isCancelled) {\n          setThumbnailURL(null)\n        }\n      } finally {\n        if (!isCancelled) {\n          setIsLoading(false)\n        }\n      }\n    }\n\n    void generateThumbnail()\n\n    return () => {\n      isCancelled = true\n    }\n  }, [file])\n\n  if (isLoading) {\n    return <ShimmerEffect className={`${baseClass}__thumbnail-shimmer`} disableInlineStyles />\n  }\n\n  return (\n    <Thumbnail\n      className={`${baseClass}__thumbnail`}\n      fileSrc={thumbnailURL}\n      key={`${formID}-${thumbnailURL || 'placeholder'}`}\n    />\n  )\n}\n"],"names":["useModal","useWindowInfo","isImage","React","SelectInput","ChevronIcon","XIcon","useConfig","useTranslation","AnimateHeight","Button","Drawer","ErrorPill","Pill","ShimmerEffect","createThumbnail","Thumbnail","Actions","AddFilesView","useFormsManager","useBulkUpload","addMoreFilesDrawerSlug","baseClass","FileSidebar","activeIndex","addFiles","forms","isInitializing","removeFile","setActiveIndex","totalErrorCount","initialFiles","initialForms","maxFiles","i18n","t","closeModal","openModal","showFiles","setShowFiles","useState","breakpoints","handleRemoveFile","useCallback","indexToRemove","handleAddFiles","filelist","getFileSize","file","size","i","Math","floor","log","decimals","formattedSize","pow","toFixed","totalFileCount","length","collectionSlug","bulkUploadCollectionSlug","selectableCollections","setCollectionSlug","getEntityConfig","div","className","filter","Boolean","join","m","isClearable","name","onChange","e","val","value","options","map","coll","config","label","labels","singular","slug","path","required","count","withMessage","p","strong","title","onClick","buttonStyle","prev","span","direction","gutter","Header","onCancel","onDrop","height","Array","from","index","animationDelay","key","errorCount","formID","formState","currentFile","button","type","SidebarThumbnail","File","aria-label","thumbnailURL","setThumbnailURL","isLoading","setIsLoading","useEffect","isCancelled","generateThumbnail","url","_","disableInlineStyles","fileSrc"],"mappings":"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"}

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

@@ -1,5 +1,4 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { useModal } from '@faceless-ui/modal';
 import * as qs from 'qs-esm';
 import React from 'react';
@@ -17,7 +16,7 @@ import { useLoadingOverlay } from '../../LoadingOverlay/index.js';
 import { useBulkUpload } from '../index.js';
 import { createFormData } from './createFormData.js';
 import { formsManagementReducer } from './reducer.js';
-const Context = /*#__PURE__*/ React.createContext({
+const Context = React.createContext({
     activeIndex: 0,
     addFiles: ()=>Promise.resolve(),
     bulkUpdateForm: ()=>null,
@@ -490,46 +489,30 @@ export function FormsManagerProvider({ children }) {
         hasInitializedDocPermissions,
         initialForms
     ]);
-    return /*#__PURE__*/ _jsxDEV(Context, {
-        value: {
-            activeIndex: state.activeIndex,
-            addFiles,
-            bulkUpdateForm,
-            collectionSlug,
-            docPermissions,
-            documentSlots,
-            forms,
-            getFormDataRef,
-            hasPublishPermission,
-            hasSavePermission,
-            hasSubmitted,
-            isInitializing,
-            removeFile,
-            resetUploadEdits,
-            saveAllDocs,
-            setActiveIndex,
-            setFormTotalErrorCount,
-            totalErrorCount,
-            updateUploadEdits
-        },
-        children: [
-            isUploading && /*#__PURE__*/ _jsxDEV(LoadingOverlay, {
-                animationDuration: "250ms",
-                loadingText: loadingText,
-                overlayType: "fullscreen",
-                show: true
-            }, void 0, false, {
-                fileName: "src/elements/BulkUpload/FormsManager/index.tsx",
-                lineNumber: 638,
-                columnNumber: 9
-            }, this),
-            children
-        ]
-    }, void 0, true, {
-        fileName: "src/elements/BulkUpload/FormsManager/index.tsx",
-        lineNumber: 614,
-        columnNumber: 5
-    }, this);
+    return <Context value={{
+        activeIndex: state.activeIndex,
+        addFiles,
+        bulkUpdateForm,
+        collectionSlug,
+        docPermissions,
+        documentSlots,
+        forms,
+        getFormDataRef,
+        hasPublishPermission,
+        hasSavePermission,
+        hasSubmitted,
+        isInitializing,
+        removeFile,
+        resetUploadEdits,
+        saveAllDocs,
+        setActiveIndex,
+        setFormTotalErrorCount,
+        totalErrorCount,
+        updateUploadEdits
+    }}>
+      {isUploading && <LoadingOverlay animationDuration="250ms" loadingText={loadingText} overlayType="fullscreen" show/>}
+      {children}
+    </Context>;
 }
 export function useFormsManager() {
     return React.use(Context);