@payloadcms/ui 3.68.0-internal-debug.e9b66ee → 3.68.0-internal-debug.654e4ad

package/dist/elements/Upload/index.js

@@ -1,4 +1,5 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { useModal } from '@faceless-ui/modal';
 import { isImage } from 'payload/shared';
 import React, { Fragment, useCallback, useEffect, useRef, useState } from 'react';
@@ -40,30 +41,79 @@ export const UploadActions = ({ customActions, enableAdjustments, enablePreviewS
     if (!fileTypeIsAdjustable && (!customActions || customActions.length === 0)) {
         return null;
     }
-    return <div className={`${baseClass}__upload-actions`}>
-      {fileTypeIsAdjustable && <React.Fragment>
-          {enablePreviewSizes && <Button buttonStyle="pill" className={`${baseClass}__previewSizes`} margin={false} onClick={()=>{
-        openModal(sizePreviewSlug);
-    }} size="small">
-              {t('upload:previewSizes')}
-            </Button>}
-          {enableAdjustments && <Button buttonStyle="pill" className={`${baseClass}__edit`} margin={false} onClick={()=>{
-        openModal(editDrawerSlug);
-    }} size="small">
-              {t('upload:editImage')}
-            </Button>}
-        </React.Fragment>}
-
-      {customActions && customActions.map((CustomAction, i)=>{
-        return <React.Fragment key={i}>{CustomAction}</React.Fragment>;
-    })}
-    </div>;
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: `${baseClass}__upload-actions`,
+        children: [
+            fileTypeIsAdjustable && /*#__PURE__*/ _jsxDEV(React.Fragment, {
+                children: [
+                    enablePreviewSizes && /*#__PURE__*/ _jsxDEV(Button, {
+                        buttonStyle: "pill",
+                        className: `${baseClass}__previewSizes`,
+                        margin: false,
+                        onClick: ()=>{
+                            openModal(sizePreviewSlug);
+                        },
+                        size: "small",
+                        children: t('upload:previewSizes')
+                    }, void 0, false, {
+                        fileName: "src/elements/Upload/index.tsx",
+                        lineNumber: 72,
+                        columnNumber: 13
+                    }, this),
+                    enableAdjustments && /*#__PURE__*/ _jsxDEV(Button, {
+                        buttonStyle: "pill",
+                        className: `${baseClass}__edit`,
+                        margin: false,
+                        onClick: ()=>{
+                            openModal(editDrawerSlug);
+                        },
+                        size: "small",
+                        children: t('upload:editImage')
+                    }, void 0, false, {
+                        fileName: "src/elements/Upload/index.tsx",
+                        lineNumber: 85,
+                        columnNumber: 13
+                    }, this)
+                ]
+            }, void 0, true, {
+                fileName: "src/elements/Upload/index.tsx",
+                lineNumber: 70,
+                columnNumber: 9
+            }, this),
+            customActions && customActions.map((CustomAction, i)=>{
+                return /*#__PURE__*/ _jsxDEV(React.Fragment, {
+                    children: CustomAction
+                }, i, false, {
+                    fileName: "src/elements/Upload/index.tsx",
+                    lineNumber: 102,
+                    columnNumber: 18
+                }, this);
+            })
+        ]
+    }, void 0, true, {
+        fileName: "src/elements/Upload/index.tsx",
+        lineNumber: 68,
+        columnNumber: 5
+    }, this);
 };
 export const Upload = (props)=>{
     const { resetUploadEdits, updateUploadEdits, uploadEdits } = useUploadEdits();
-    return <UploadControlsProvider>
-      <Upload_v4 {...props} resetUploadEdits={resetUploadEdits} updateUploadEdits={updateUploadEdits} uploadEdits={uploadEdits}/>
-    </UploadControlsProvider>;
+    return /*#__PURE__*/ _jsxDEV(UploadControlsProvider, {
+        children: /*#__PURE__*/ _jsxDEV(Upload_v4, {
+            ...props,
+            resetUploadEdits: resetUploadEdits,
+            updateUploadEdits: updateUploadEdits,
+            uploadEdits: uploadEdits
+        }, void 0, false, {
+            fileName: "src/elements/Upload/index.tsx",
+            lineNumber: 121,
+            columnNumber: 7
+        }, this)
+    }, void 0, false, {
+        fileName: "src/elements/Upload/index.tsx",
+        lineNumber: 120,
+        columnNumber: 5
+    }, this);
 };
 export const Upload_v4 = (props)=>{
     const { collectionSlug, customActions, initialState, onChange, resetUploadEdits, updateUploadEdits, uploadConfig, UploadControls, uploadEdits } = props;
@@ -282,94 +332,336 @@ export const Upload_v4 = (props)=>{
         uploadControlFile,
         handleFileChange
     ]);
-    return <div className={[
-        fieldBaseClass,
-        baseClass
-    ].filter(Boolean).join(' ')}>
-      <FieldError message={errorMessage} showError={showError}/>
-      {data && data.filename && !removedFile && <FileDetails collectionSlug={collectionSlug} customUploadActions={customActions} doc={data} enableAdjustments={showCrop || showFocalPoint} handleRemove={canRemoveUpload ? handleFileRemoval : undefined} hasImageSizes={hasImageSizes} hideRemoveFile={uploadConfig.hideRemoveFile} imageCacheTag={imageCacheTag} uploadConfig={uploadConfig}/>}
-      {(!uploadConfig.hideFileInputOnCreate && !data?.filename || removedFile) && <div className={`${baseClass}__upload`}>
-          {!value && !showUrlInput && <Dropzone onChange={handleFileSelection}>
-              <div className={`${baseClass}__dropzoneContent`}>
-                <div className={`${baseClass}__dropzoneButtons`}>
-                  <Button buttonStyle="pill" onClick={()=>{
-        if (inputRef.current) {
-            inputRef.current.click();
-        }
-    }} size="small">
-                    {t('upload:selectFile')}
-                  </Button>
-                  <input accept={acceptMimeTypes} aria-hidden="true" className={`${baseClass}__hidden-input`} hidden onChange={(e)=>{
-        if (e.target.files && e.target.files.length > 0) {
-            handleFileSelection(e.target.files);
-        }
-    }} ref={inputRef} type="file"/>
-                  {uploadConfig?.pasteURL !== false && <Fragment>
-                      <span className={`${baseClass}__orText`}>{t('general:or')}</span>
-                      <Button buttonStyle="pill" onClick={()=>{
-        setShowUrlInput(true);
-        setUploadControlFileUrl('');
-        setUploadControlFile(null);
-        setUploadControlFileName(null);
-    }} size="small">
-                        {t('upload:pasteURL')}
-                      </Button>
-                    </Fragment>}
-
-                  {UploadControls ? UploadControls : null}
-                </div>
-                <p className={`${baseClass}__dragAndDropText`}>
-                  {t('general:or')} {t('upload:dragAndDrop')}
-                </p>
-              </div>
-            </Dropzone>}
-          {showUrlInput && <React.Fragment>
-              <div className={`${baseClass}__remote-file-wrap`}>
-                {}
-                <input className={`${baseClass}__remote-file`} onChange={(e)=>{
-        setFileUrl(e.target.value);
-    }} ref={urlInputRef} title={fileUrl} type="text" value={fileUrl}/>
-                <div className={`${baseClass}__add-file-wrap`}>
-                  <button className={`${baseClass}__add-file`} onClick={()=>{
-        void handleUrlSubmit();
-    }} type="button">
-                    {t('upload:addFile')}
-                  </button>
-                </div>
-              </div>
-              <Button buttonStyle="icon-label" className={`${baseClass}__remove`} icon="x" iconStyle="with-border" onClick={()=>{
-        setShowUrlInput(false);
-        setUploadControlFileUrl('');
-        setUploadControlFile(null);
-        setUploadControlFileName(null);
-    }} round tooltip={t('general:cancel')}/>
-            </React.Fragment>}
-          {value && fileSrc && <React.Fragment>
-              <div className={`${baseClass}__thumbnail-wrap`}>
-                <Thumbnail collectionSlug={collectionSlug} fileSrc={isImage(value.type) ? fileSrc : null}/>
-              </div>
-              <div className={`${baseClass}__file-adjustments`}>
-                {}
-                <input className={`${baseClass}__filename`} onChange={handleFileNameChange} title={filename || value.name} type="text" value={filename || value.name}/>
-                <UploadActions customActions={customActions} enableAdjustments={showCrop || showFocalPoint} enablePreviewSizes={hasImageSizes && data?.filename && !removedFile} mimeType={value.type}/>
-              </div>
-              <Button buttonStyle="icon-label" className={`${baseClass}__remove`} icon="x" iconStyle="with-border" onClick={handleFileRemoval} round tooltip={t('general:cancel')}/>
-            </React.Fragment>}
-        </div>}
-      {(value || data?.filename) && <EditDepthProvider>
-          <Drawer Header={null} slug={editDrawerSlug}>
-            <EditUpload fileName={value?.name || data?.filename} fileSrc={data?.url || fileSrc} imageCacheTag={imageCacheTag} initialCrop={uploadEdits?.crop ?? undefined} initialFocalPoint={{
-        x: uploadEdits?.focalPoint?.x || data?.focalX || 50,
-        y: uploadEdits?.focalPoint?.y || data?.focalY || 50
-    }} onSave={onEditsSave} showCrop={showCrop} showFocalPoint={showFocalPoint}/>
-          </Drawer>
-        </EditDepthProvider>}
-      {data && hasImageSizes && <Drawer className={`${baseClass}__previewDrawer`} hoverTitle slug={sizePreviewSlug} title={t('upload:sizesFor', {
-        label: data.filename
-    })}>
-          <PreviewSizes doc={data} imageCacheTag={imageCacheTag} uploadConfig={uploadConfig}/>
-        </Drawer>}
-    </div>;
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: [
+            fieldBaseClass,
+            baseClass
+        ].filter(Boolean).join(' '),
+        children: [
+            /*#__PURE__*/ _jsxDEV(FieldError, {
+                message: errorMessage,
+                showError: showError
+            }, void 0, false, {
+                fileName: "src/elements/Upload/index.tsx",
+                lineNumber: 380,
+                columnNumber: 7
+            }, this),
+            data && data.filename && !removedFile && /*#__PURE__*/ _jsxDEV(FileDetails, {
+                collectionSlug: collectionSlug,
+                customUploadActions: customActions,
+                doc: data,
+                enableAdjustments: showCrop || showFocalPoint,
+                handleRemove: canRemoveUpload ? handleFileRemoval : undefined,
+                hasImageSizes: hasImageSizes,
+                hideRemoveFile: uploadConfig.hideRemoveFile,
+                imageCacheTag: imageCacheTag,
+                uploadConfig: uploadConfig
+            }, void 0, false, {
+                fileName: "src/elements/Upload/index.tsx",
+                lineNumber: 382,
+                columnNumber: 9
+            }, this),
+            (!uploadConfig.hideFileInputOnCreate && !data?.filename || removedFile) && /*#__PURE__*/ _jsxDEV("div", {
+                className: `${baseClass}__upload`,
+                children: [
+                    !value && !showUrlInput && /*#__PURE__*/ _jsxDEV(Dropzone, {
+                        onChange: handleFileSelection,
+                        children: /*#__PURE__*/ _jsxDEV("div", {
+                            className: `${baseClass}__dropzoneContent`,
+                            children: [
+                                /*#__PURE__*/ _jsxDEV("div", {
+                                    className: `${baseClass}__dropzoneButtons`,
+                                    children: [
+                                        /*#__PURE__*/ _jsxDEV(Button, {
+                                            buttonStyle: "pill",
+                                            onClick: ()=>{
+                                                if (inputRef.current) {
+                                                    inputRef.current.click();
+                                                }
+                                            },
+                                            size: "small",
+                                            children: t('upload:selectFile')
+                                        }, void 0, false, {
+                                            fileName: "src/elements/Upload/index.tsx",
+                                            lineNumber: 400,
+                                            columnNumber: 19
+                                        }, this),
+                                        /*#__PURE__*/ _jsxDEV("input", {
+                                            accept: acceptMimeTypes,
+                                            "aria-hidden": "true",
+                                            className: `${baseClass}__hidden-input`,
+                                            hidden: true,
+                                            onChange: (e)=>{
+                                                if (e.target.files && e.target.files.length > 0) {
+                                                    handleFileSelection(e.target.files);
+                                                }
+                                            },
+                                            ref: inputRef,
+                                            type: "file"
+                                        }, void 0, false, {
+                                            fileName: "src/elements/Upload/index.tsx",
+                                            lineNumber: 411,
+                                            columnNumber: 19
+                                        }, this),
+                                        uploadConfig?.pasteURL !== false && /*#__PURE__*/ _jsxDEV(Fragment, {
+                                            children: [
+                                                /*#__PURE__*/ _jsxDEV("span", {
+                                                    className: `${baseClass}__orText`,
+                                                    children: t('general:or')
+                                                }, void 0, false, {
+                                                    fileName: "src/elements/Upload/index.tsx",
+                                                    lineNumber: 426,
+                                                    columnNumber: 23
+                                                }, this),
+                                                /*#__PURE__*/ _jsxDEV(Button, {
+                                                    buttonStyle: "pill",
+                                                    onClick: ()=>{
+                                                        setShowUrlInput(true);
+                                                        setUploadControlFileUrl('');
+                                                        setUploadControlFile(null);
+                                                        setUploadControlFileName(null);
+                                                    },
+                                                    size: "small",
+                                                    children: t('upload:pasteURL')
+                                                }, void 0, false, {
+                                                    fileName: "src/elements/Upload/index.tsx",
+                                                    lineNumber: 427,
+                                                    columnNumber: 23
+                                                }, this)
+                                            ]
+                                        }, void 0, true, {
+                                            fileName: "src/elements/Upload/index.tsx",
+                                            lineNumber: 425,
+                                            columnNumber: 21
+                                        }, this),
+                                        UploadControls ? UploadControls : null
+                                    ]
+                                }, void 0, true, {
+                                    fileName: "src/elements/Upload/index.tsx",
+                                    lineNumber: 399,
+                                    columnNumber: 17
+                                }, this),
+                                /*#__PURE__*/ _jsxDEV("p", {
+                                    className: `${baseClass}__dragAndDropText`,
+                                    children: [
+                                        t('general:or'),
+                                        " ",
+                                        t('upload:dragAndDrop')
+                                    ]
+                                }, void 0, true, {
+                                    fileName: "src/elements/Upload/index.tsx",
+                                    lineNumber: 444,
+                                    columnNumber: 17
+                                }, this)
+                            ]
+                        }, void 0, true, {
+                            fileName: "src/elements/Upload/index.tsx",
+                            lineNumber: 398,
+                            columnNumber: 15
+                        }, this)
+                    }, void 0, false, {
+                        fileName: "src/elements/Upload/index.tsx",
+                        lineNumber: 397,
+                        columnNumber: 13
+                    }, this),
+                    showUrlInput && /*#__PURE__*/ _jsxDEV(React.Fragment, {
+                        children: [
+                            /*#__PURE__*/ _jsxDEV("div", {
+                                className: `${baseClass}__remote-file-wrap`,
+                                children: [
+                                    /* eslint-disable-next-line jsx-a11y/control-has-associated-label */ /*#__PURE__*/ _jsxDEV("input", {
+                                        className: `${baseClass}__remote-file`,
+                                        onChange: (e)=>{
+                                            setFileUrl(e.target.value);
+                                        },
+                                        ref: urlInputRef,
+                                        title: fileUrl,
+                                        type: "text",
+                                        value: fileUrl
+                                    }, void 0, false, {
+                                        fileName: "src/elements/Upload/index.tsx",
+                                        lineNumber: 454,
+                                        columnNumber: 17
+                                    }, this),
+                                    /*#__PURE__*/ _jsxDEV("div", {
+                                        className: `${baseClass}__add-file-wrap`,
+                                        children: /*#__PURE__*/ _jsxDEV("button", {
+                                            className: `${baseClass}__add-file`,
+                                            onClick: ()=>{
+                                                void handleUrlSubmit();
+                                            },
+                                            type: "button",
+                                            children: t('upload:addFile')
+                                        }, void 0, false, {
+                                            fileName: "src/elements/Upload/index.tsx",
+                                            lineNumber: 465,
+                                            columnNumber: 19
+                                        }, this)
+                                    }, void 0, false, {
+                                        fileName: "src/elements/Upload/index.tsx",
+                                        lineNumber: 464,
+                                        columnNumber: 17
+                                    }, this)
+                                ]
+                            }, void 0, true, {
+                                fileName: "src/elements/Upload/index.tsx",
+                                lineNumber: 452,
+                                columnNumber: 15
+                            }, this),
+                            /*#__PURE__*/ _jsxDEV(Button, {
+                                buttonStyle: "icon-label",
+                                className: `${baseClass}__remove`,
+                                icon: "x",
+                                iconStyle: "with-border",
+                                onClick: ()=>{
+                                    setShowUrlInput(false);
+                                    setUploadControlFileUrl('');
+                                    setUploadControlFile(null);
+                                    setUploadControlFileName(null);
+                                },
+                                round: true,
+                                tooltip: t('general:cancel')
+                            }, void 0, false, {
+                                fileName: "src/elements/Upload/index.tsx",
+                                lineNumber: 476,
+                                columnNumber: 15
+                            }, this)
+                        ]
+                    }, void 0, true, {
+                        fileName: "src/elements/Upload/index.tsx",
+                        lineNumber: 451,
+                        columnNumber: 13
+                    }, this),
+                    value && fileSrc && /*#__PURE__*/ _jsxDEV(React.Fragment, {
+                        children: [
+                            /*#__PURE__*/ _jsxDEV("div", {
+                                className: `${baseClass}__thumbnail-wrap`,
+                                children: /*#__PURE__*/ _jsxDEV(Thumbnail, {
+                                    collectionSlug: collectionSlug,
+                                    fileSrc: isImage(value.type) ? fileSrc : null
+                                }, void 0, false, {
+                                    fileName: "src/elements/Upload/index.tsx",
+                                    lineNumber: 495,
+                                    columnNumber: 17
+                                }, this)
+                            }, void 0, false, {
+                                fileName: "src/elements/Upload/index.tsx",
+                                lineNumber: 494,
+                                columnNumber: 15
+                            }, this),
+                            /*#__PURE__*/ _jsxDEV("div", {
+                                className: `${baseClass}__file-adjustments`,
+                                children: [
+                                    /* eslint-disable-next-line jsx-a11y/control-has-associated-label */ /*#__PURE__*/ _jsxDEV("input", {
+                                        className: `${baseClass}__filename`,
+                                        onChange: handleFileNameChange,
+                                        title: filename || value.name,
+                                        type: "text",
+                                        value: filename || value.name
+                                    }, void 0, false, {
+                                        fileName: "src/elements/Upload/index.tsx",
+                                        lineNumber: 502,
+                                        columnNumber: 17
+                                    }, this),
+                                    /*#__PURE__*/ _jsxDEV(UploadActions, {
+                                        customActions: customActions,
+                                        enableAdjustments: showCrop || showFocalPoint,
+                                        enablePreviewSizes: hasImageSizes && data?.filename && !removedFile,
+                                        mimeType: value.type
+                                    }, void 0, false, {
+                                        fileName: "src/elements/Upload/index.tsx",
+                                        lineNumber: 509,
+                                        columnNumber: 17
+                                    }, this)
+                                ]
+                            }, void 0, true, {
+                                fileName: "src/elements/Upload/index.tsx",
+                                lineNumber: 500,
+                                columnNumber: 15
+                            }, this),
+                            /*#__PURE__*/ _jsxDEV(Button, {
+                                buttonStyle: "icon-label",
+                                className: `${baseClass}__remove`,
+                                icon: "x",
+                                iconStyle: "with-border",
+                                onClick: handleFileRemoval,
+                                round: true,
+                                tooltip: t('general:cancel')
+                            }, void 0, false, {
+                                fileName: "src/elements/Upload/index.tsx",
+                                lineNumber: 516,
+                                columnNumber: 15
+                            }, this)
+                        ]
+                    }, void 0, true, {
+                        fileName: "src/elements/Upload/index.tsx",
+                        lineNumber: 493,
+                        columnNumber: 13
+                    }, this)
+                ]
+            }, void 0, true, {
+                fileName: "src/elements/Upload/index.tsx",
+                lineNumber: 395,
+                columnNumber: 9
+            }, this),
+            (value || data?.filename) && /*#__PURE__*/ _jsxDEV(EditDepthProvider, {
+                children: /*#__PURE__*/ _jsxDEV(Drawer, {
+                    Header: null,
+                    slug: editDrawerSlug,
+                    children: /*#__PURE__*/ _jsxDEV(EditUpload, {
+                        fileName: value?.name || data?.filename,
+                        fileSrc: data?.url || fileSrc,
+                        imageCacheTag: imageCacheTag,
+                        initialCrop: uploadEdits?.crop ?? undefined,
+                        initialFocalPoint: {
+                            x: uploadEdits?.focalPoint?.x || data?.focalX || 50,
+                            y: uploadEdits?.focalPoint?.y || data?.focalY || 50
+                        },
+                        onSave: onEditsSave,
+                        showCrop: showCrop,
+                        showFocalPoint: showFocalPoint
+                    }, void 0, false, {
+                        fileName: "src/elements/Upload/index.tsx",
+                        lineNumber: 532,
+                        columnNumber: 13
+                    }, this)
+                }, void 0, false, {
+                    fileName: "src/elements/Upload/index.tsx",
+                    lineNumber: 531,
+                    columnNumber: 11
+                }, this)
+            }, void 0, false, {
+                fileName: "src/elements/Upload/index.tsx",
+                lineNumber: 530,
+                columnNumber: 9
+            }, this),
+            data && hasImageSizes && /*#__PURE__*/ _jsxDEV(Drawer, {
+                className: `${baseClass}__previewDrawer`,
+                hoverTitle: true,
+                slug: sizePreviewSlug,
+                title: t('upload:sizesFor', {
+                    label: data.filename
+                }),
+                children: /*#__PURE__*/ _jsxDEV(PreviewSizes, {
+                    doc: data,
+                    imageCacheTag: imageCacheTag,
+                    uploadConfig: uploadConfig
+                }, void 0, false, {
+                    fileName: "src/elements/Upload/index.tsx",
+                    lineNumber: 555,
+                    columnNumber: 11
+                }, this)
+            }, void 0, false, {
+                fileName: "src/elements/Upload/index.tsx",
+                lineNumber: 549,
+                columnNumber: 9
+            }, this)
+        ]
+    }, void 0, true, {
+        fileName: "src/elements/Upload/index.tsx",
+        lineNumber: 379,
+        columnNumber: 5
+    }, this);
 };
 
 //# sourceMappingURL=index.js.map