@payloadcms/ui 4.0.0-internal.9726517 → 4.0.0-internal.add4c47

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2,6 +2,7 @@
2
2
  :root {
3
3
  --spacer-0: 0;
4
4
  --spacer-1: 0.25rem; /** 4px */
5
+ --spacer-1-5: 0.375rem; /** 6px */
5
6
  --spacer-2: 0.5rem; /** 8px */
6
7
  --spacer-2-5: 0.75rem; /** 12px */
7
8
  --spacer-3: 1rem; /** 16px */
@@ -258,6 +258,10 @@
258
258
  padding-inline: var(--file-gutter-h);
259
259
  }
260
260
 
261
+ .file-selections__collectionSelect {
262
+ border-bottom: none;
263
+ }
264
+
261
265
  .file-selections__header__error {
262
266
  padding-inline: 0;
263
267
  }
@@ -1,7 +1,7 @@
1
1
  @layer payload-default {
2
2
  .file-preview {
3
3
  display: flex;
4
- flex-direction: row;
4
+ flex-direction: column-reverse;
5
5
  flex: 1 1 0;
6
6
  min-height: 0;
7
7
  /* Visible so the mini carousel can grow past the panel as the headers scroll away. */
@@ -75,9 +75,9 @@
75
75
  min-width: 0;
76
76
  }
77
77
 
78
- @container edit-main (max-width: 768px) {
78
+ @container edit-main (min-width: 768px) {
79
79
  .file-preview {
80
- flex-direction: column-reverse;
80
+ flex-direction: row;
81
81
  }
82
82
  }
83
83
  }
@@ -1,13 +1,14 @@
1
1
  @layer payload-default {
2
2
  .file-manager {
3
+ --file-fields-max-width: 600px;
3
4
  position: relative;
4
- flex: 1 0 0;
5
5
  align-self: stretch;
6
6
  width: 100%;
7
7
  margin-bottom: 0;
8
8
  border-radius: 0;
9
9
  background: var(--color-bg-secondary);
10
- min-height: 100px;
10
+ min-height: 400px;
11
+ border-bottom: var(--stroke-width-small) solid var(--color-border);
11
12
 
12
13
  .dropzone {
13
14
  border: none;
@@ -16,25 +17,23 @@
16
17
  }
17
18
 
18
19
  .file-manager__panel {
19
- position: sticky;
20
- top: var(--doc-controls-height);
21
- height: calc(
22
- 100dvh - var(--app-header-height) - var(--doc-controls-height) - var(--doc-header-height)
23
- );
20
+ position: static;
21
+ height: auto;
22
+ min-height: 400px;
24
23
  display: flex;
25
24
  flex-direction: column;
26
25
  /* Visible so the mini carousel can grow past the panel to fill the area left behind as the
27
26
  app/doc headers scroll away (see MiniCarousel). */
28
27
  overflow: visible;
29
- /* Scroll-driven: grow height as the app header and doc header scroll away, matching the
30
- extra space they free up. Mirrors the MiniCarousel approach. Falls back to static height. */
31
28
  }
32
29
 
33
30
  .file-manager__content {
34
31
  display: flex;
35
- flex-direction: row;
36
- flex: 1 1 0;
37
- min-height: 0;
32
+ flex-direction: column;
33
+ /* flex-basis: auto (not 0) so this sizes to its content when the panel's height is auto
34
+ (stacked layout) instead of collapsing — flex-basis 0 only makes sense when the panel
35
+ has a definite height to grow into (see the min-width override below). */
36
+ flex: 1 1 auto;
38
37
  overflow: visible;
39
38
  }
40
39
 
@@ -44,7 +43,8 @@
44
43
  flex-direction: column;
45
44
  align-items: center;
46
45
  justify-content: center;
47
- padding: var(--spacer-4);
46
+ gap: var(--spacer-4);
47
+ padding: var(--spacer-4) var(--gutter-h);
48
48
  position: relative;
49
49
  }
50
50
 
@@ -58,10 +58,10 @@
58
58
  justify-content: center;
59
59
  }
60
60
 
61
- .file-manager__remove {
61
+ .file-manager__upload .file-manager__remove {
62
62
  position: absolute;
63
- top: var(--spacer-2);
64
- right: var(--spacer-2);
63
+ top: var(--gutter-h);
64
+ right: var(--gutter-h);
65
65
  margin: 0;
66
66
  z-index: 1;
67
67
  }
@@ -135,20 +135,33 @@
135
135
  color: var(--color-text-tertiary);
136
136
  }
137
137
 
138
- @container edit-main (max-width: 1024px) {
138
+ @container edit-main (min-width: 1024px) {
139
139
  .file-manager {
140
- min-height: 400px;
141
- border-bottom: var(--stroke-width-small) solid var(--color-border);
140
+ min-height: 100px;
141
+ border-bottom: none;
142
+ }
143
+
144
+ .file-manager__upload {
145
+ padding: var(--spacer-4);
146
+ }
147
+
148
+ .file-manager__file-adjustments {
149
+ max-width: var(--file-fields-max-width);
142
150
  }
143
151
 
144
152
  .file-manager__panel {
145
- position: static;
146
- height: auto;
147
- min-height: 400px;
153
+ position: sticky;
154
+ top: var(--doc-controls-height);
155
+ /* Scroll-driven: grow height as the app header and doc header scroll away, matching the
156
+ extra space they free up. Mirrors the MiniCarousel approach. Falls back to static height. */
157
+ height: calc(
158
+ 100dvh - var(--app-header-height) - var(--doc-controls-height) - var(--doc-header-height)
159
+ );
148
160
  }
149
161
 
150
162
  .file-manager__content {
151
- flex-direction: column;
163
+ flex-direction: row;
164
+ min-height: 0;
152
165
  }
153
166
  }
154
167
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/FileManager/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,yBAAyB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAIrE,OAAO,KAA6D,MAAM,OAAO,CAAA;AA2BjF,OAAO,aAAa,CAAA;AAcpB,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAA;IAC/B,QAAQ,CAAC,YAAY,CAAC,EAAE,OAAO,SAAS,EAAE,SAAS,CAAA;IACnD;;;OAGG;IACH,QAAQ,CAAC,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAA;IACtC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAA;IACxD,QAAQ,CAAC,YAAY,EAAE,IAAI,CAAC,yBAAyB,CAAC,QAAQ,CAAC,EAAE,oBAAoB,CAAC,CAAA;IACtF,QAAQ,CAAC,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzC,QAAQ,CAAC,WAAW,CAAC,EAAE,WAAW,CAAA;IAClC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC7C,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAqalD,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/FileManager/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,yBAAyB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAIrE,OAAO,KAA6D,MAAM,OAAO,CAAA;AA2BjF,OAAO,aAAa,CAAA;AAcpB,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAA;IAC/B,QAAQ,CAAC,YAAY,CAAC,EAAE,OAAO,SAAS,EAAE,SAAS,CAAA;IACnD;;;OAGG;IACH,QAAQ,CAAC,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAA;IACtC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAA;IACxD,QAAQ,CAAC,YAAY,EAAE,IAAI,CAAC,yBAAyB,CAAC,QAAQ,CAAC,EAAE,oBAAoB,CAAC,CAAA;IACtF,QAAQ,CAAC,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzC,QAAQ,CAAC,WAAW,CAAC,EAAE,WAAW,CAAA;IAClC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC7C,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAkblD,CAAA"}
@@ -215,6 +215,12 @@ export const FileManager = ({
215
215
  setModified(true);
216
216
  updateUploadEdits(args);
217
217
  }, [setModified, updateUploadEdits]);
218
+ // Reset states for when replacing the file with a new upload
219
+ useEffect(() => {
220
+ setSelectedSize(null);
221
+ setRemovedFile(false);
222
+ setFileSrc('');
223
+ }, [data?.url, data?.filename]);
218
224
  useEffect(() => {
219
225
  if (initialState?.file?.value instanceof File) {
220
226
  setFileSrc(URL.createObjectURL(initialState.file.value));
@@ -228,9 +234,6 @@ export const FileManager = ({
228
234
  }
229
235
  };
230
236
  }, [fileSrc]);
231
- useEffect(() => {
232
- setSelectedSize(null);
233
- }, [data?.url, data?.filename]);
234
237
  useEffect(() => {
235
238
  const handleControlFileUrl = async () => {
236
239
  if (uploadControlFileUrl) {
@@ -350,7 +353,14 @@ export const FileManager = ({
350
353
  UploadFilePreview: UploadFilePreview
351
354
  }) : showUploadInput ? /*#__PURE__*/_jsxs("div", {
352
355
  className: `${baseClass}__upload`,
353
- children: [!value && /*#__PURE__*/_jsx(Dropzone, {
356
+ children: [!value && removedFile && data?.filename && /*#__PURE__*/_jsx(Button, {
357
+ buttonStyle: "secondary",
358
+ className: `${baseClass}__remove`,
359
+ icon: "x",
360
+ onClick: () => setRemovedFile(false),
361
+ round: true,
362
+ tooltip: t('general:cancel')
363
+ }), !value && /*#__PURE__*/_jsx(Dropzone, {
354
364
  onChange: handleFileSelection,
355
365
  children: /*#__PURE__*/_jsxs("div", {
356
366
  className: `${baseClass}__dropzone-content`,
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["useModal","formatAdminURL","formatFilesize","isImage","React","Fragment","useCallback","useEffect","useRef","useState","toast","FieldError","fieldBaseClass","TextInput","useForm","useField","useConfig","useDocumentInfo","EditDepthProvider","useTranslation","useUploadControls","useUploadEdits","Button","Drawer","Dropzone","EditUpload","PreviewSizes","Thumbnail","editDrawerSlug","sizePreviewSlug","pasteURLDrawerSlug","UploadFromURLModal","AudioPreview","FilePreview","PdfPreview","VideoPreview","FileToolbar","baseClass","validate","value","undefined","name","FileManager","collectionSlug","initialState","resetUploadEdits","resetUploadEditsFromProps","updateUploadEdits","updateUploadEditsFromProps","uploadConfig","UploadControls","uploadEdits","uploadEditsFromProps","UploadFilePreview","closeModal","openModal","t","setModified","id","data","setUploadStatus","errorMessage","setValue","showError","path","config","routes","api","setUploadControlFile","setUploadControlFileName","setUploadControlFileUrl","uploadControlFile","uploadControlFileName","uploadControlFileUrl","uploadEditsContext","fileSrc","setFileSrc","removedFile","setRemovedFile","filename","setFilename","fileUrl","setFileUrl","selectedSize","setSelectedSize","inputRef","useServerSideFetch","pasteURL","allowList","length","acceptMimeTypes","mimeTypes","join","imageCacheTag","cacheTags","updatedAt","hasImageSizes","imageSizes","hasResizeOptions","Boolean","resizeOptions","focalPointEnabled","focalPoint","crop","showCrop","showFocalPoint","selectedSizeData","sizes","sidePanelFileSrc","url","thumbnailURL","sidePanelMimeType","mimeType","fileTypeIsAdjustable","renameFile","fileToChange","newName","File","type","lastModified","handleFileChange","file","isNewFile","URL","createObjectURL","handleFileNameChange","e","updatedFileName","target","handleFileRemoval","handleFileSelection","files","isValidUrl","canParse","handleUrlSubmit","clientResponse","fetch","ok","Error","status","blob","rawSegment","split","pop","fileName","decodeURIComponent","_clientError","error","encodeURIComponent","serverResponse","apiRoute","_serverError","onEditsSave","args","startsWith","revokeObjectURL","handleControlFileUrl","renderSelectedFilePreview","src","fileType","_jsx","className","title","size","drawers","_jsxs","initialCrop","initialFocalPoint","x","focalX","y","focalY","onSave","hoverTitle","slug","label","doc","showUploadInput","hideFileInputOnCreate","filter","message","hideRemoveFile","isAdjustable","onEditImage","onReplace","onChange","buttonStyle","onClick","current","click","accept","hidden","ref","icon","round","tooltip"],"sources":["../../../src/elements/FileManager/index.tsx"],"sourcesContent":["'use client'\nimport type { SanitizedCollectionConfig, UploadEdits } from 'payload'\n\nimport { useModal } from '@faceless-ui/modal'\nimport { formatAdminURL, formatFilesize, isImage } from 'payload/shared'\nimport React, { Fragment, useCallback, useEffect, useRef, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport { FieldError } from '../../fields/FieldError/index.js'\nimport { fieldBaseClass } from '../../fields/shared/index.js'\nimport { TextInput } from '../../fields/Text/Input.js'\nimport { useForm } from '../../forms/Form/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { EditDepthProvider } from '../../providers/EditDepth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { useUploadControls } from '../../providers/UploadControls/index.js'\nimport { useUploadEdits } from '../../providers/UploadEdits/index.js'\nimport { Button } from '../Button/index.js'\nimport { Drawer } from '../Drawer/index.js'\nimport { Dropzone } from '../Dropzone/index.js'\nimport { EditUpload } from '../EditUpload/index.js'\nimport { PreviewSizes } from '../PreviewSizes/index.js'\nimport { Thumbnail } from '../Thumbnail/index.js'\nimport { editDrawerSlug, sizePreviewSlug } from '../Upload/index.js'\nimport { pasteURLDrawerSlug, UploadFromURLModal } from '../Upload/UploadFromURLModal/index.js'\nimport { AudioPreview } from './FilePreview/AudioPreview/index.js'\nimport { FilePreview } from './FilePreview/index.js'\nimport { PdfPreview } from './FilePreview/PdfPreview/index.js'\nimport { VideoPreview } from './FilePreview/VideoPreview/index.js'\nimport { FileToolbar } from './FileToolbar/index.js'\nimport './index.css'\n\nconst baseClass = 'file-manager'\n\nconst validate = (value) => {\n if (!value && value !== undefined) {\n return 'A file is required.'\n }\n if (value && (!value.name || value.name === '')) {\n return 'A file name is required.'\n }\n return true\n}\n\nexport type FileManagerProps = {\n readonly collectionSlug: string\n readonly initialState?: import('payload').FormState\n /**\n * When provided, upload edits are sourced from these props instead of the `useUploadEdits`\n * context. The bulk upload drawer uses this to drive per-file edits from its FormsManager.\n */\n readonly resetUploadEdits?: () => void\n readonly updateUploadEdits?: (args: UploadEdits) => void\n readonly uploadConfig: Omit<SanitizedCollectionConfig['upload'], 'uploadInstructions'>\n readonly UploadControls?: React.ReactNode\n readonly uploadEdits?: UploadEdits\n readonly UploadFilePreview?: React.ReactNode\n}\n\nexport const FileManager: React.FC<FileManagerProps> = ({\n collectionSlug,\n initialState,\n resetUploadEdits: resetUploadEditsFromProps,\n updateUploadEdits: updateUploadEditsFromProps,\n uploadConfig,\n UploadControls,\n uploadEdits: uploadEditsFromProps,\n UploadFilePreview,\n}) => {\n const { closeModal, openModal } = useModal()\n const { t } = useTranslation()\n const { setModified } = useForm()\n const { id, data, setUploadStatus } = useDocumentInfo()\n const { errorMessage, setValue, showError, value } = useField<File>({\n path: 'file',\n validate,\n })\n const {\n config: {\n routes: { api },\n },\n } = useConfig()\n const {\n setUploadControlFile,\n setUploadControlFileName,\n setUploadControlFileUrl,\n uploadControlFile,\n uploadControlFileName,\n uploadControlFileUrl,\n } = useUploadControls()\n const uploadEditsContext = useUploadEdits()\n const resetUploadEdits = resetUploadEditsFromProps ?? uploadEditsContext.resetUploadEdits\n const updateUploadEdits = updateUploadEditsFromProps ?? uploadEditsContext.updateUploadEdits\n const uploadEdits = uploadEditsFromProps ?? uploadEditsContext.uploadEdits\n\n const [fileSrc, setFileSrc] = useState<null | string>(null)\n const [removedFile, setRemovedFile] = useState(false)\n const [filename, setFilename] = useState<string>(value?.name || '')\n const [fileUrl, setFileUrl] = useState<string>('')\n const [selectedSize, setSelectedSize] = useState<null | string>(null)\n\n const inputRef = useRef<HTMLInputElement>(null)\n\n const useServerSideFetch =\n typeof uploadConfig?.pasteURL === 'object' && uploadConfig.pasteURL.allowList?.length > 0\n\n const acceptMimeTypes = uploadConfig.mimeTypes?.join(', ')\n const imageCacheTag = uploadConfig?.cacheTags && data?.updatedAt\n\n const hasImageSizes = uploadConfig?.imageSizes?.length > 0\n const hasResizeOptions = Boolean(uploadConfig?.resizeOptions)\n const focalPointEnabled = uploadConfig?.focalPoint === true\n const { crop: showCrop = true, focalPoint = true } = uploadConfig\n const showFocalPoint = focalPoint && (hasImageSizes || hasResizeOptions || focalPointEnabled)\n\n const selectedSizeData = selectedSize\n ? (data?.sizes?.[selectedSize] as Record<string, unknown>)\n : null\n const sidePanelFileSrc = (selectedSizeData?.url ?? data?.thumbnailURL ?? data?.url ?? null) as\n | null\n | string\n const sidePanelMimeType = data?.mimeType as string | undefined\n const fileTypeIsAdjustable =\n !!sidePanelMimeType &&\n isImage(sidePanelMimeType) &&\n sidePanelMimeType !== 'image/svg+xml' &&\n sidePanelMimeType !== 'image/jxl'\n\n const renameFile = (fileToChange: File, newName: string): File =>\n new File([fileToChange], newName, {\n type: fileToChange.type,\n lastModified: fileToChange.lastModified,\n })\n\n const handleFileChange = useCallback(\n ({ file, isNewFile = true }: { file: File | null; isNewFile?: boolean }) => {\n if (isNewFile && file instanceof File) {\n setFileSrc(URL.createObjectURL(file))\n }\n setValue(file)\n setUploadControlFileUrl('')\n setUploadControlFileName(null)\n setUploadControlFile(null)\n },\n [setValue, setUploadControlFile, setUploadControlFileName, setUploadControlFileUrl],\n )\n\n const handleFileNameChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n const updatedFileName = e.target.value\n if (value) {\n handleFileChange({ file: renameFile(value, updatedFileName), isNewFile: false })\n setFilename(updatedFileName)\n }\n },\n [handleFileChange, value],\n )\n\n const handleFileRemoval = useCallback(() => {\n setRemovedFile(true)\n handleFileChange({ file: null })\n setFileSrc('')\n setFileUrl('')\n setSelectedSize(null)\n resetUploadEdits()\n setUploadControlFileUrl('')\n setUploadControlFileName(null)\n setUploadControlFile(null)\n }, [\n handleFileChange,\n resetUploadEdits,\n setUploadControlFile,\n setUploadControlFileName,\n setUploadControlFileUrl,\n ])\n\n const handleFileSelection = useCallback(\n (files: FileList) => handleFileChange({ file: files?.[0] }),\n [handleFileChange],\n )\n\n const isValidUrl = Boolean(fileUrl && URL.canParse(fileUrl))\n\n const handleUrlSubmit = useCallback(async () => {\n if (!fileUrl || !URL.canParse(fileUrl) || uploadConfig?.pasteURL === false) {\n return\n }\n setUploadStatus('uploading')\n try {\n const clientResponse = await fetch(fileUrl)\n if (!clientResponse.ok) {\n throw new Error(`Fetch failed: ${clientResponse.status}`)\n }\n const blob = await clientResponse.blob()\n const rawSegment = fileUrl.split('/').pop() || ''\n const fileName = uploadControlFileName || decodeURIComponent(rawSegment.split('?')[0])\n handleFileChange({ file: new File([blob], fileName, { type: blob.type }) })\n setUploadStatus('idle')\n closeModal(pasteURLDrawerSlug)\n setFileUrl('')\n return\n } catch (_clientError) {\n if (!useServerSideFetch) {\n toast.error('Failed to fetch the file.')\n setUploadStatus('failed')\n return\n }\n }\n try {\n const pasteURL: `/${string}` = `/${collectionSlug}/paste-url${id ? `/${id}?` : '?'}src=${encodeURIComponent(fileUrl)}`\n const serverResponse = await fetch(formatAdminURL({ apiRoute: api, path: pasteURL }))\n if (!serverResponse.ok) {\n throw new Error(`Fetch failed: ${serverResponse.status}`)\n }\n const blob = await serverResponse.blob()\n const rawSegment = fileUrl.split('/').pop() || ''\n const fileName = decodeURIComponent(rawSegment.split('?')[0])\n handleFileChange({ file: new File([blob], fileName, { type: blob.type }) })\n setUploadStatus('idle')\n closeModal(pasteURLDrawerSlug)\n setFileUrl('')\n } catch (_serverError) {\n toast.error('The provided URL is not allowed.')\n setUploadStatus('failed')\n }\n }, [\n api,\n closeModal,\n collectionSlug,\n fileUrl,\n handleFileChange,\n id,\n setUploadStatus,\n uploadConfig,\n uploadControlFileName,\n useServerSideFetch,\n ])\n\n const onEditsSave = useCallback(\n (args: UploadEdits) => {\n setModified(true)\n updateUploadEdits(args)\n },\n [setModified, updateUploadEdits],\n )\n\n useEffect(() => {\n if (initialState?.file?.value instanceof File) {\n setFileSrc(URL.createObjectURL(initialState.file.value))\n setRemovedFile(false)\n }\n }, [initialState])\n\n useEffect(() => {\n return () => {\n if (fileSrc?.startsWith('blob:')) {\n URL.revokeObjectURL(fileSrc)\n }\n }\n }, [fileSrc])\n\n useEffect(() => {\n setSelectedSize(null)\n }, [data?.url, data?.filename])\n\n useEffect(() => {\n const handleControlFileUrl = async () => {\n if (uploadControlFileUrl) {\n setFileUrl(uploadControlFileUrl)\n await handleUrlSubmit()\n }\n }\n void handleControlFileUrl()\n }, [uploadControlFileUrl, handleUrlSubmit])\n\n useEffect(() => {\n if (uploadControlFile) {\n handleFileChange({ file: uploadControlFile })\n }\n }, [uploadControlFile, handleFileChange])\n\n // Preview a freshly-selected (not-yet-saved) file from its local object URL, so video/audio/PDF\n // are playable/viewable just like images. Sizing is capped in CSS so large files stay contained.\n const renderSelectedFilePreview = (src: string) => {\n const fileType = value?.type ?? ''\n\n if (fileType.startsWith('video/')) {\n return (\n <div className={`${baseClass}__selected-preview`}>\n <VideoPreview fileSrc={src} />\n </div>\n )\n }\n\n if (fileType.startsWith('audio/')) {\n return (\n <div className={`${baseClass}__selected-preview ${baseClass}__selected-preview--audio`}>\n <AudioPreview fileSrc={src} />\n </div>\n )\n }\n\n if (fileType === 'application/pdf') {\n return (\n <div className={`${baseClass}__selected-preview`}>\n <PdfPreview fileSrc={src} title={value?.name} />\n </div>\n )\n }\n\n return (\n <div className={`${baseClass}__selected-preview`}>\n <Thumbnail\n collectionSlug={collectionSlug}\n fileSrc={isImage(fileType) ? src : null}\n size=\"expand\"\n />\n </div>\n )\n }\n\n const drawers = (\n <Fragment>\n {(value || data?.filename) && (\n <EditDepthProvider>\n <EditUpload\n fileName={value?.name || (data?.filename as string)}\n fileSrc={(data?.url as string) || fileSrc}\n imageCacheTag={imageCacheTag}\n initialCrop={uploadEdits?.crop ?? undefined}\n initialFocalPoint={{\n x: uploadEdits?.focalPoint?.x || (data?.focalX as number) || 50,\n y: uploadEdits?.focalPoint?.y || (data?.focalY as number) || 50,\n }}\n onSave={onEditsSave}\n showCrop={showCrop}\n showFocalPoint={showFocalPoint}\n />\n </EditDepthProvider>\n )}\n {data && hasImageSizes && (\n <Drawer\n className={`${baseClass}__preview-drawer`}\n hoverTitle\n slug={sizePreviewSlug}\n title={t('upload:sizesFor', { label: data.filename })}\n >\n <PreviewSizes doc={data} imageCacheTag={imageCacheTag} uploadConfig={uploadConfig} />\n </Drawer>\n )}\n {uploadConfig?.pasteURL !== false && (\n <UploadFromURLModal\n fileUrl={fileUrl}\n handleUrlSubmit={handleUrlSubmit}\n isValidUrl={isValidUrl}\n setFileUrl={setFileUrl}\n />\n )}\n </Fragment>\n )\n\n // Hide the create file input when the collection opts out of it (unless the user has explicitly\n // removed an existing file or already selected a new one).\n const showUploadInput = Boolean(value) || removedFile || !uploadConfig?.hideFileInputOnCreate\n\n return (\n <div className={[fieldBaseClass, baseClass].filter(Boolean).join(' ')}>\n <FieldError message={errorMessage} showError={showError} />\n <div className={`${baseClass}__panel`}>\n {data?.filename && !removedFile && (\n <FileToolbar\n filename={data.filename as string}\n fileSrc={sidePanelFileSrc}\n fileUrl={data?.url as string}\n hideRemoveFile={uploadConfig?.hideRemoveFile}\n isAdjustable={fileTypeIsAdjustable}\n onEditImage={() => openModal(editDrawerSlug)}\n onReplace={handleFileRemoval}\n />\n )}\n <div className={`${baseClass}__content`}>\n {data?.filename && !removedFile ? (\n <FilePreview\n collectionSlug={collectionSlug}\n data={data as Record<string, unknown>}\n imageCacheTag={imageCacheTag}\n selectedSize={selectedSize}\n selectedSizeData={selectedSizeData}\n setSelectedSize={setSelectedSize}\n uploadConfig={uploadConfig}\n UploadFilePreview={UploadFilePreview}\n />\n ) : showUploadInput ? (\n <div className={`${baseClass}__upload`}>\n {!value && (\n <Dropzone onChange={handleFileSelection}>\n <div className={`${baseClass}__dropzone-content`}>\n <div className={`${baseClass}__dropzone-buttons`}>\n <Button\n buttonStyle=\"secondary\"\n onClick={() => inputRef.current?.click()}\n size=\"medium\"\n >\n {t('upload:selectFile')}\n </Button>\n <input\n accept={acceptMimeTypes}\n aria-hidden=\"true\"\n className={`${baseClass}__hidden-input`}\n hidden\n onChange={(e) => {\n if (e.target.files && e.target.files.length > 0) {\n handleFileSelection(e.target.files)\n }\n }}\n ref={inputRef}\n type=\"file\"\n />\n {uploadConfig?.pasteURL !== false && (\n <Fragment>\n <span className={`${baseClass}__or-text`}>{t('general:or')}</span>\n <Button\n buttonStyle=\"secondary\"\n onClick={() => {\n openModal(pasteURLDrawerSlug)\n setUploadControlFileUrl('')\n setUploadControlFile(null)\n setUploadControlFileName(null)\n }}\n size=\"medium\"\n >\n {t('upload:pasteURL')}\n </Button>\n </Fragment>\n )}\n {UploadControls ?? null}\n </div>\n <p className={`${baseClass}__drag-text`}>\n {t('general:or')} {t('upload:dragAndDrop')}\n </p>\n </div>\n </Dropzone>\n )}\n {value && fileSrc && (\n <Fragment>\n <Button\n buttonStyle=\"secondary\"\n className={`${baseClass}__remove`}\n icon=\"x\"\n onClick={handleFileRemoval}\n round\n tooltip={t('general:cancel')}\n />\n {renderSelectedFilePreview(fileSrc)}\n <div className={`${baseClass}__file-adjustments`}>\n {/* Custom id so this editor doesn't collide with the hidden auto `filename` field. */}\n <TextInput\n id=\"field-filemanager-filename\"\n label={t('upload:fileName')}\n onChange={handleFileNameChange}\n path=\"filename\"\n value={filename || value.name}\n />\n {(value.size || value.type) && (\n <span className={`${baseClass}__selected-meta`}>\n {[value.size ? formatFilesize(value.size) : null, value.type]\n .filter(Boolean)\n .join(' – ')}\n </span>\n )}\n </div>\n </Fragment>\n )}\n </div>\n ) : null}\n </div>\n </div>\n {drawers}\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["useModal","formatAdminURL","formatFilesize","isImage","React","Fragment","useCallback","useEffect","useRef","useState","toast","FieldError","fieldBaseClass","TextInput","useForm","useField","useConfig","useDocumentInfo","EditDepthProvider","useTranslation","useUploadControls","useUploadEdits","Button","Drawer","Dropzone","EditUpload","PreviewSizes","Thumbnail","editDrawerSlug","sizePreviewSlug","pasteURLDrawerSlug","UploadFromURLModal","AudioPreview","FilePreview","PdfPreview","VideoPreview","FileToolbar","baseClass","validate","value","undefined","name","FileManager","collectionSlug","initialState","resetUploadEdits","resetUploadEditsFromProps","updateUploadEdits","updateUploadEditsFromProps","uploadConfig","UploadControls","uploadEdits","uploadEditsFromProps","UploadFilePreview","closeModal","openModal","t","setModified","id","data","setUploadStatus","errorMessage","setValue","showError","path","config","routes","api","setUploadControlFile","setUploadControlFileName","setUploadControlFileUrl","uploadControlFile","uploadControlFileName","uploadControlFileUrl","uploadEditsContext","fileSrc","setFileSrc","removedFile","setRemovedFile","filename","setFilename","fileUrl","setFileUrl","selectedSize","setSelectedSize","inputRef","useServerSideFetch","pasteURL","allowList","length","acceptMimeTypes","mimeTypes","join","imageCacheTag","cacheTags","updatedAt","hasImageSizes","imageSizes","hasResizeOptions","Boolean","resizeOptions","focalPointEnabled","focalPoint","crop","showCrop","showFocalPoint","selectedSizeData","sizes","sidePanelFileSrc","url","thumbnailURL","sidePanelMimeType","mimeType","fileTypeIsAdjustable","renameFile","fileToChange","newName","File","type","lastModified","handleFileChange","file","isNewFile","URL","createObjectURL","handleFileNameChange","e","updatedFileName","target","handleFileRemoval","handleFileSelection","files","isValidUrl","canParse","handleUrlSubmit","clientResponse","fetch","ok","Error","status","blob","rawSegment","split","pop","fileName","decodeURIComponent","_clientError","error","encodeURIComponent","serverResponse","apiRoute","_serverError","onEditsSave","args","startsWith","revokeObjectURL","handleControlFileUrl","renderSelectedFilePreview","src","fileType","_jsx","className","title","size","drawers","_jsxs","initialCrop","initialFocalPoint","x","focalX","y","focalY","onSave","hoverTitle","slug","label","doc","showUploadInput","hideFileInputOnCreate","filter","message","hideRemoveFile","isAdjustable","onEditImage","onReplace","buttonStyle","icon","onClick","round","tooltip","onChange","current","click","accept","hidden","ref"],"sources":["../../../src/elements/FileManager/index.tsx"],"sourcesContent":["'use client'\nimport type { SanitizedCollectionConfig, UploadEdits } from 'payload'\n\nimport { useModal } from '@faceless-ui/modal'\nimport { formatAdminURL, formatFilesize, isImage } from 'payload/shared'\nimport React, { Fragment, useCallback, useEffect, useRef, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport { FieldError } from '../../fields/FieldError/index.js'\nimport { fieldBaseClass } from '../../fields/shared/index.js'\nimport { TextInput } from '../../fields/Text/Input.js'\nimport { useForm } from '../../forms/Form/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { EditDepthProvider } from '../../providers/EditDepth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { useUploadControls } from '../../providers/UploadControls/index.js'\nimport { useUploadEdits } from '../../providers/UploadEdits/index.js'\nimport { Button } from '../Button/index.js'\nimport { Drawer } from '../Drawer/index.js'\nimport { Dropzone } from '../Dropzone/index.js'\nimport { EditUpload } from '../EditUpload/index.js'\nimport { PreviewSizes } from '../PreviewSizes/index.js'\nimport { Thumbnail } from '../Thumbnail/index.js'\nimport { editDrawerSlug, sizePreviewSlug } from '../Upload/index.js'\nimport { pasteURLDrawerSlug, UploadFromURLModal } from '../Upload/UploadFromURLModal/index.js'\nimport { AudioPreview } from './FilePreview/AudioPreview/index.js'\nimport { FilePreview } from './FilePreview/index.js'\nimport { PdfPreview } from './FilePreview/PdfPreview/index.js'\nimport { VideoPreview } from './FilePreview/VideoPreview/index.js'\nimport { FileToolbar } from './FileToolbar/index.js'\nimport './index.css'\n\nconst baseClass = 'file-manager'\n\nconst validate = (value) => {\n if (!value && value !== undefined) {\n return 'A file is required.'\n }\n if (value && (!value.name || value.name === '')) {\n return 'A file name is required.'\n }\n return true\n}\n\nexport type FileManagerProps = {\n readonly collectionSlug: string\n readonly initialState?: import('payload').FormState\n /**\n * When provided, upload edits are sourced from these props instead of the `useUploadEdits`\n * context. The bulk upload drawer uses this to drive per-file edits from its FormsManager.\n */\n readonly resetUploadEdits?: () => void\n readonly updateUploadEdits?: (args: UploadEdits) => void\n readonly uploadConfig: Omit<SanitizedCollectionConfig['upload'], 'uploadInstructions'>\n readonly UploadControls?: React.ReactNode\n readonly uploadEdits?: UploadEdits\n readonly UploadFilePreview?: React.ReactNode\n}\n\nexport const FileManager: React.FC<FileManagerProps> = ({\n collectionSlug,\n initialState,\n resetUploadEdits: resetUploadEditsFromProps,\n updateUploadEdits: updateUploadEditsFromProps,\n uploadConfig,\n UploadControls,\n uploadEdits: uploadEditsFromProps,\n UploadFilePreview,\n}) => {\n const { closeModal, openModal } = useModal()\n const { t } = useTranslation()\n const { setModified } = useForm()\n const { id, data, setUploadStatus } = useDocumentInfo()\n const { errorMessage, setValue, showError, value } = useField<File>({\n path: 'file',\n validate,\n })\n const {\n config: {\n routes: { api },\n },\n } = useConfig()\n const {\n setUploadControlFile,\n setUploadControlFileName,\n setUploadControlFileUrl,\n uploadControlFile,\n uploadControlFileName,\n uploadControlFileUrl,\n } = useUploadControls()\n const uploadEditsContext = useUploadEdits()\n const resetUploadEdits = resetUploadEditsFromProps ?? uploadEditsContext.resetUploadEdits\n const updateUploadEdits = updateUploadEditsFromProps ?? uploadEditsContext.updateUploadEdits\n const uploadEdits = uploadEditsFromProps ?? uploadEditsContext.uploadEdits\n\n const [fileSrc, setFileSrc] = useState<null | string>(null)\n const [removedFile, setRemovedFile] = useState(false)\n const [filename, setFilename] = useState<string>(value?.name || '')\n const [fileUrl, setFileUrl] = useState<string>('')\n const [selectedSize, setSelectedSize] = useState<null | string>(null)\n\n const inputRef = useRef<HTMLInputElement>(null)\n\n const useServerSideFetch =\n typeof uploadConfig?.pasteURL === 'object' && uploadConfig.pasteURL.allowList?.length > 0\n\n const acceptMimeTypes = uploadConfig.mimeTypes?.join(', ')\n const imageCacheTag = uploadConfig?.cacheTags && data?.updatedAt\n\n const hasImageSizes = uploadConfig?.imageSizes?.length > 0\n const hasResizeOptions = Boolean(uploadConfig?.resizeOptions)\n const focalPointEnabled = uploadConfig?.focalPoint === true\n const { crop: showCrop = true, focalPoint = true } = uploadConfig\n const showFocalPoint = focalPoint && (hasImageSizes || hasResizeOptions || focalPointEnabled)\n\n const selectedSizeData = selectedSize\n ? (data?.sizes?.[selectedSize] as Record<string, unknown>)\n : null\n const sidePanelFileSrc = (selectedSizeData?.url ?? data?.thumbnailURL ?? data?.url ?? null) as\n | null\n | string\n const sidePanelMimeType = data?.mimeType as string | undefined\n const fileTypeIsAdjustable =\n !!sidePanelMimeType &&\n isImage(sidePanelMimeType) &&\n sidePanelMimeType !== 'image/svg+xml' &&\n sidePanelMimeType !== 'image/jxl'\n\n const renameFile = (fileToChange: File, newName: string): File =>\n new File([fileToChange], newName, {\n type: fileToChange.type,\n lastModified: fileToChange.lastModified,\n })\n\n const handleFileChange = useCallback(\n ({ file, isNewFile = true }: { file: File | null; isNewFile?: boolean }) => {\n if (isNewFile && file instanceof File) {\n setFileSrc(URL.createObjectURL(file))\n }\n setValue(file)\n setUploadControlFileUrl('')\n setUploadControlFileName(null)\n setUploadControlFile(null)\n },\n [setValue, setUploadControlFile, setUploadControlFileName, setUploadControlFileUrl],\n )\n\n const handleFileNameChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n const updatedFileName = e.target.value\n if (value) {\n handleFileChange({ file: renameFile(value, updatedFileName), isNewFile: false })\n setFilename(updatedFileName)\n }\n },\n [handleFileChange, value],\n )\n\n const handleFileRemoval = useCallback(() => {\n setRemovedFile(true)\n handleFileChange({ file: null })\n setFileSrc('')\n setFileUrl('')\n setSelectedSize(null)\n resetUploadEdits()\n setUploadControlFileUrl('')\n setUploadControlFileName(null)\n setUploadControlFile(null)\n }, [\n handleFileChange,\n resetUploadEdits,\n setUploadControlFile,\n setUploadControlFileName,\n setUploadControlFileUrl,\n ])\n\n const handleFileSelection = useCallback(\n (files: FileList) => handleFileChange({ file: files?.[0] }),\n [handleFileChange],\n )\n\n const isValidUrl = Boolean(fileUrl && URL.canParse(fileUrl))\n\n const handleUrlSubmit = useCallback(async () => {\n if (!fileUrl || !URL.canParse(fileUrl) || uploadConfig?.pasteURL === false) {\n return\n }\n setUploadStatus('uploading')\n try {\n const clientResponse = await fetch(fileUrl)\n if (!clientResponse.ok) {\n throw new Error(`Fetch failed: ${clientResponse.status}`)\n }\n const blob = await clientResponse.blob()\n const rawSegment = fileUrl.split('/').pop() || ''\n const fileName = uploadControlFileName || decodeURIComponent(rawSegment.split('?')[0])\n handleFileChange({ file: new File([blob], fileName, { type: blob.type }) })\n setUploadStatus('idle')\n closeModal(pasteURLDrawerSlug)\n setFileUrl('')\n return\n } catch (_clientError) {\n if (!useServerSideFetch) {\n toast.error('Failed to fetch the file.')\n setUploadStatus('failed')\n return\n }\n }\n try {\n const pasteURL: `/${string}` = `/${collectionSlug}/paste-url${id ? `/${id}?` : '?'}src=${encodeURIComponent(fileUrl)}`\n const serverResponse = await fetch(formatAdminURL({ apiRoute: api, path: pasteURL }))\n if (!serverResponse.ok) {\n throw new Error(`Fetch failed: ${serverResponse.status}`)\n }\n const blob = await serverResponse.blob()\n const rawSegment = fileUrl.split('/').pop() || ''\n const fileName = decodeURIComponent(rawSegment.split('?')[0])\n handleFileChange({ file: new File([blob], fileName, { type: blob.type }) })\n setUploadStatus('idle')\n closeModal(pasteURLDrawerSlug)\n setFileUrl('')\n } catch (_serverError) {\n toast.error('The provided URL is not allowed.')\n setUploadStatus('failed')\n }\n }, [\n api,\n closeModal,\n collectionSlug,\n fileUrl,\n handleFileChange,\n id,\n setUploadStatus,\n uploadConfig,\n uploadControlFileName,\n useServerSideFetch,\n ])\n\n const onEditsSave = useCallback(\n (args: UploadEdits) => {\n setModified(true)\n updateUploadEdits(args)\n },\n [setModified, updateUploadEdits],\n )\n\n // Reset states for when replacing the file with a new upload\n useEffect(() => {\n setSelectedSize(null)\n setRemovedFile(false)\n setFileSrc('')\n }, [data?.url, data?.filename])\n\n useEffect(() => {\n if (initialState?.file?.value instanceof File) {\n setFileSrc(URL.createObjectURL(initialState.file.value))\n setRemovedFile(false)\n }\n }, [initialState])\n\n useEffect(() => {\n return () => {\n if (fileSrc?.startsWith('blob:')) {\n URL.revokeObjectURL(fileSrc)\n }\n }\n }, [fileSrc])\n\n useEffect(() => {\n const handleControlFileUrl = async () => {\n if (uploadControlFileUrl) {\n setFileUrl(uploadControlFileUrl)\n await handleUrlSubmit()\n }\n }\n void handleControlFileUrl()\n }, [uploadControlFileUrl, handleUrlSubmit])\n\n useEffect(() => {\n if (uploadControlFile) {\n handleFileChange({ file: uploadControlFile })\n }\n }, [uploadControlFile, handleFileChange])\n\n // Preview a freshly-selected (not-yet-saved) file from its local object URL, so video/audio/PDF\n // are playable/viewable just like images. Sizing is capped in CSS so large files stay contained.\n const renderSelectedFilePreview = (src: string) => {\n const fileType = value?.type ?? ''\n\n if (fileType.startsWith('video/')) {\n return (\n <div className={`${baseClass}__selected-preview`}>\n <VideoPreview fileSrc={src} />\n </div>\n )\n }\n\n if (fileType.startsWith('audio/')) {\n return (\n <div className={`${baseClass}__selected-preview ${baseClass}__selected-preview--audio`}>\n <AudioPreview fileSrc={src} />\n </div>\n )\n }\n\n if (fileType === 'application/pdf') {\n return (\n <div className={`${baseClass}__selected-preview`}>\n <PdfPreview fileSrc={src} title={value?.name} />\n </div>\n )\n }\n\n return (\n <div className={`${baseClass}__selected-preview`}>\n <Thumbnail\n collectionSlug={collectionSlug}\n fileSrc={isImage(fileType) ? src : null}\n size=\"expand\"\n />\n </div>\n )\n }\n\n const drawers = (\n <Fragment>\n {(value || data?.filename) && (\n <EditDepthProvider>\n <EditUpload\n fileName={value?.name || (data?.filename as string)}\n fileSrc={(data?.url as string) || fileSrc}\n imageCacheTag={imageCacheTag}\n initialCrop={uploadEdits?.crop ?? undefined}\n initialFocalPoint={{\n x: uploadEdits?.focalPoint?.x || (data?.focalX as number) || 50,\n y: uploadEdits?.focalPoint?.y || (data?.focalY as number) || 50,\n }}\n onSave={onEditsSave}\n showCrop={showCrop}\n showFocalPoint={showFocalPoint}\n />\n </EditDepthProvider>\n )}\n {data && hasImageSizes && (\n <Drawer\n className={`${baseClass}__preview-drawer`}\n hoverTitle\n slug={sizePreviewSlug}\n title={t('upload:sizesFor', { label: data.filename })}\n >\n <PreviewSizes doc={data} imageCacheTag={imageCacheTag} uploadConfig={uploadConfig} />\n </Drawer>\n )}\n {uploadConfig?.pasteURL !== false && (\n <UploadFromURLModal\n fileUrl={fileUrl}\n handleUrlSubmit={handleUrlSubmit}\n isValidUrl={isValidUrl}\n setFileUrl={setFileUrl}\n />\n )}\n </Fragment>\n )\n\n // Hide the create file input when the collection opts out of it (unless the user has explicitly\n // removed an existing file or already selected a new one).\n const showUploadInput = Boolean(value) || removedFile || !uploadConfig?.hideFileInputOnCreate\n\n return (\n <div className={[fieldBaseClass, baseClass].filter(Boolean).join(' ')}>\n <FieldError message={errorMessage} showError={showError} />\n <div className={`${baseClass}__panel`}>\n {data?.filename && !removedFile && (\n <FileToolbar\n filename={data.filename as string}\n fileSrc={sidePanelFileSrc}\n fileUrl={data?.url as string}\n hideRemoveFile={uploadConfig?.hideRemoveFile}\n isAdjustable={fileTypeIsAdjustable}\n onEditImage={() => openModal(editDrawerSlug)}\n onReplace={handleFileRemoval}\n />\n )}\n <div className={`${baseClass}__content`}>\n {data?.filename && !removedFile ? (\n <FilePreview\n collectionSlug={collectionSlug}\n data={data as Record<string, unknown>}\n imageCacheTag={imageCacheTag}\n selectedSize={selectedSize}\n selectedSizeData={selectedSizeData}\n setSelectedSize={setSelectedSize}\n uploadConfig={uploadConfig}\n UploadFilePreview={UploadFilePreview}\n />\n ) : showUploadInput ? (\n <div className={`${baseClass}__upload`}>\n {!value && removedFile && data?.filename && (\n <Button\n buttonStyle=\"secondary\"\n className={`${baseClass}__remove`}\n icon=\"x\"\n onClick={() => setRemovedFile(false)}\n round\n tooltip={t('general:cancel')}\n />\n )}\n {!value && (\n <Dropzone onChange={handleFileSelection}>\n <div className={`${baseClass}__dropzone-content`}>\n <div className={`${baseClass}__dropzone-buttons`}>\n <Button\n buttonStyle=\"secondary\"\n onClick={() => inputRef.current?.click()}\n size=\"medium\"\n >\n {t('upload:selectFile')}\n </Button>\n <input\n accept={acceptMimeTypes}\n aria-hidden=\"true\"\n className={`${baseClass}__hidden-input`}\n hidden\n onChange={(e) => {\n if (e.target.files && e.target.files.length > 0) {\n handleFileSelection(e.target.files)\n }\n }}\n ref={inputRef}\n type=\"file\"\n />\n {uploadConfig?.pasteURL !== false && (\n <Fragment>\n <span className={`${baseClass}__or-text`}>{t('general:or')}</span>\n <Button\n buttonStyle=\"secondary\"\n onClick={() => {\n openModal(pasteURLDrawerSlug)\n setUploadControlFileUrl('')\n setUploadControlFile(null)\n setUploadControlFileName(null)\n }}\n size=\"medium\"\n >\n {t('upload:pasteURL')}\n </Button>\n </Fragment>\n )}\n {UploadControls ?? null}\n </div>\n <p className={`${baseClass}__drag-text`}>\n {t('general:or')} {t('upload:dragAndDrop')}\n </p>\n </div>\n </Dropzone>\n )}\n {value && fileSrc && (\n <Fragment>\n <Button\n buttonStyle=\"secondary\"\n className={`${baseClass}__remove`}\n icon=\"x\"\n onClick={handleFileRemoval}\n round\n tooltip={t('general:cancel')}\n />\n {renderSelectedFilePreview(fileSrc)}\n <div className={`${baseClass}__file-adjustments`}>\n {/* Custom id so this editor doesn't collide with the hidden auto `filename` field. */}\n <TextInput\n id=\"field-filemanager-filename\"\n label={t('upload:fileName')}\n onChange={handleFileNameChange}\n path=\"filename\"\n value={filename || value.name}\n />\n {(value.size || value.type) && (\n <span className={`${baseClass}__selected-meta`}>\n {[value.size ? formatFilesize(value.size) : null, value.type]\n .filter(Boolean)\n .join(' – ')}\n </span>\n )}\n </div>\n </Fragment>\n )}\n </div>\n ) : null}\n </div>\n </div>\n {drawers}\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,21 +1,23 @@
1
1
  @layer payload-default {
2
2
  .mini-carousel {
3
+ --carousel-item-width: 48px;
4
+ --carousel-item-height: 48px;
5
+ --carousel-divider-height: 48px;
3
6
  display: flex;
4
- flex-direction: column;
5
- align-items: stretch;
7
+ flex-direction: row;
8
+ align-items: center;
6
9
  gap: var(--spacer-3);
7
10
  padding: var(--spacer-2-5);
8
- height: 100%;
11
+ width: 100%;
12
+ height: auto;
9
13
  flex-shrink: 0;
10
- overflow-y: auto;
14
+ overflow-x: auto;
15
+ overflow-y: hidden;
11
16
  background: var(--color-bg-secondary);
12
- border-right: var(--stroke-width-small) solid var(--color-border);
13
- /* Honor the scroll-driven height below instead of stretching to the flex line. */
14
- align-self: flex-start;
15
- /* Scroll-driven: grow to fill the gap as the header scrolls away. Falls back to static height. */
16
- animation: mini-carousel-fill-scrolled-chrome linear both;
17
- animation-timeline: scroll(root block);
18
- animation-range: 0 calc(var(--app-header-height) + var(--doc-header-height));
17
+ border-top: var(--stroke-width-small) solid var(--color-border);
18
+ /* Stacked layout: no scroll-driven growth, fill via stretch instead. */
19
+ align-self: stretch;
20
+ animation: none;
19
21
  }
20
22
 
21
23
  @keyframes mini-carousel-fill-scrolled-chrome {
@@ -36,8 +38,8 @@
36
38
  background: var(--color-bg-secondary);
37
39
  cursor: pointer;
38
40
  overflow: hidden;
39
- width: 48px;
40
- height: 48px;
41
+ width: var(--carousel-item-width);
42
+ height: var(--carousel-item-height);
41
43
  }
42
44
 
43
45
  .mini-carousel__item img {
@@ -55,40 +57,40 @@
55
57
  }
56
58
 
57
59
  .mini-carousel__divider {
58
- width: 100%;
59
- height: var(--stroke-width-small);
60
+ width: var(--stroke-width-small);
61
+ height: var(--carousel-divider-height);
62
+ margin: 0 var(--spacer-2);
60
63
  background: var(--color-border);
61
64
  flex-shrink: 0;
62
65
  }
63
66
 
64
- /* Stacked layout: disable scroll-driven growth and fill via stretch. */
65
- @container edit-main (max-width: 1024px) {
67
+ @container edit-main (min-width: 768px) {
66
68
  .mini-carousel {
67
- align-self: stretch;
68
- height: auto;
69
- animation: none;
69
+ flex-direction: column;
70
+ align-items: stretch;
71
+ width: auto;
72
+ overflow-x: visible;
73
+ overflow-y: auto;
74
+ border-top: none;
75
+ border-right: var(--stroke-width-small) solid var(--color-border);
70
76
  }
71
- }
72
77
 
73
- @container edit-main (max-width: 768px) {
74
- .mini-carousel {
75
- flex-direction: row;
76
- align-items: center;
78
+ .mini-carousel__divider {
77
79
  width: 100%;
78
- overflow-x: auto;
79
- overflow-y: hidden;
80
- border-right: 0;
81
- border-top: var(--stroke-width-small) solid var(--color-border);
82
- }
83
-
84
- .mini-carousel__item {
85
- width: 48px;
80
+ height: var(--stroke-width-small);
81
+ margin: 0;
86
82
  }
83
+ }
87
84
 
88
- .mini-carousel__divider {
89
- width: var(--stroke-width-small);
90
- height: 48px;
91
- margin: 0 var(--spacer-2);
85
+ @container edit-main (min-width: 1024px) {
86
+ .mini-carousel {
87
+ height: 100%;
88
+ /* Honor the scroll-driven height below instead of stretching to the flex line. */
89
+ align-self: flex-start;
90
+ /* Scroll-driven: grow to fill the gap as the header scrolls away. Falls back to static height. */
91
+ animation: mini-carousel-fill-scrolled-chrome linear both;
92
+ animation-timeline: scroll(root block);
93
+ animation-range: 0 calc(var(--app-header-height) + var(--doc-header-height));
92
94
  }
93
95
  }
94
96
  }
@@ -8,11 +8,11 @@
8
8
  align-items: center;
9
9
  max-width: 9.375rem;
10
10
  color: currentColor;
11
- padding-left: var(--spacer-1);
11
+ padding-left: var(--spacer-1-5);
12
12
  }
13
13
 
14
14
  .multi-value-label--disabled {
15
- padding-right: var(--spacer-1);
15
+ padding-right: var(--spacer-1-5);
16
16
  }
17
17
 
18
18
  .multi-value-label__text {
@@ -1,7 +1,7 @@
1
1
  @layer payload-default {
2
2
  .relationship--multi-value-label {
3
3
  display: flex;
4
- padding-inline-start: var(--spacer-2);
4
+ padding-inline-start: var(--spacer-1-5);
5
5
  gap: var(--spacer-1);
6
6
  }
7
7
 
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Slug/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAG9C,OAAO,KAAgC,MAAM,OAAO,CAAA;AAepD,OAAO,aAAa,CAAA;AAIpB,KAAK,cAAc,GAAG;IACpB,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAA;IAC/B,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;AAwJD,eAAO,MAAM,SAAS,0BAAoC,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Slug/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAG9C,OAAO,KAAgC,MAAM,OAAO,CAAA;AAgBpD,OAAO,aAAa,CAAA;AAIpB,KAAK,cAAc,GAAG;IACpB,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAA;IAC/B,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;AAgKD,eAAO,MAAM,SAAS,0BAAoC,CAAA"}
@@ -4,6 +4,7 @@ import { c as _c } from "react/compiler-runtime";
4
4
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
5
5
  import { getTranslation } from '@payloadcms/translations';
6
6
  import React, { useCallback, useState } from 'react';
7
+ import { toast } from 'sonner';
7
8
  import { Button } from '../../elements/Button/index.js';
8
9
  import { FieldDescription } from '../../fields/FieldDescription/index.js';
9
10
  import { FieldError } from '../../fields/FieldError/index.js';
@@ -23,7 +24,7 @@ const baseClass = 'slug-field-component';
23
24
  * @experimental This component is experimental and may change or be removed in the future. Use at your own risk.
24
25
  */
25
26
  const SlugFieldComponent = t0 => {
26
- const $ = _c(17);
27
+ const $ = _c(18);
27
28
  const {
28
29
  field,
29
30
  path
@@ -73,17 +74,24 @@ const SlugFieldComponent = t0 => {
73
74
  } = useForm();
74
75
  const [isLocked, setIsLocked] = useState(true);
75
76
  let t3;
76
- if ($[2] !== collectionSlug || $[3] !== fieldPath || $[4] !== getData || $[5] !== getDataByPath || $[6] !== globalSlug || $[7] !== setValue || $[8] !== slugify || $[9] !== useAsSlug || $[10] !== value) {
77
+ if ($[2] !== collectionSlug || $[3] !== fieldPath || $[4] !== getData || $[5] !== getDataByPath || $[6] !== globalSlug || $[7] !== setValue || $[8] !== slugify || $[9] !== t || $[10] !== useAsSlug || $[11] !== value) {
77
78
  t3 = async e => {
78
79
  e.preventDefault();
79
80
  const valueToSlugify = getDataByPath(useAsSlug);
80
- const formattedSlug = await slugify({
81
- collectionSlug,
82
- data: getData(),
83
- globalSlug,
84
- path: fieldPath,
85
- valueToSlugify
86
- });
81
+ let formattedSlug;
82
+ ;
83
+ try {
84
+ formattedSlug = await slugify({
85
+ collectionSlug,
86
+ data: getData(),
87
+ globalSlug,
88
+ path: fieldPath,
89
+ valueToSlugify
90
+ });
91
+ } catch (t4) {
92
+ toast.error(t("error:unspecific"));
93
+ return;
94
+ }
87
95
  if (formattedSlug === null || formattedSlug === undefined) {
88
96
  setValue("");
89
97
  return;
@@ -99,33 +107,34 @@ const SlugFieldComponent = t0 => {
99
107
  $[6] = globalSlug;
100
108
  $[7] = setValue;
101
109
  $[8] = slugify;
102
- $[9] = useAsSlug;
103
- $[10] = value;
104
- $[11] = t3;
110
+ $[9] = t;
111
+ $[10] = useAsSlug;
112
+ $[11] = value;
113
+ $[12] = t3;
105
114
  } else {
106
- t3 = $[11];
115
+ t3 = $[12];
107
116
  }
108
117
  const handleGenerate = t3;
109
118
  let t4;
110
- if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
119
+ if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
111
120
  t4 = e_0 => {
112
121
  e_0.preventDefault();
113
122
  setIsLocked(_temp);
114
123
  };
115
- $[12] = t4;
124
+ $[13] = t4;
116
125
  } else {
117
- t4 = $[12];
126
+ t4 = $[13];
118
127
  }
119
128
  const toggleLock = t4;
120
129
  let t5;
121
- if ($[13] !== setValue) {
130
+ if ($[14] !== setValue) {
122
131
  t5 = e_1 => {
123
132
  setValue(e_1.target.value);
124
133
  };
125
- $[13] = setValue;
126
- $[14] = t5;
134
+ $[14] = setValue;
135
+ $[15] = t5;
127
136
  } else {
128
- t5 = $[14];
137
+ t5 = $[15];
129
138
  }
130
139
  const handleChange = t5;
131
140
  const isReadOnly = Boolean(readOnlyFromProps || isLocked);
@@ -141,12 +150,12 @@ const SlugFieldComponent = t0 => {
141
150
  });
142
151
  const t9 = showError && "form-input-group-error";
143
152
  let t10;
144
- if ($[15] !== t9) {
153
+ if ($[16] !== t9) {
145
154
  t10 = ["form-input-group", `${baseClass}__input-container`, t9].filter(Boolean);
146
- $[15] = t9;
147
- $[16] = t10;
155
+ $[16] = t9;
156
+ $[17] = t10;
148
157
  } else {
149
- t10 = $[16];
158
+ t10 = $[17];
150
159
  }
151
160
  return _jsxs("div", {
152
161
  className: t6,