@chayns-components/gallery 5.2.4-alpha.0 → 5.2.5

package/lib/cjs/components/gallery-editor/GalleryEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryEditor.js","names":["_core","require","_chaynsApi","_react","_interopRequireWildcard","_uuid","_file","_gallery","_AddFile","_interopRequireDefault","_GalleryEditorItem","_GalleryEditor","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","GalleryEditor","forwardRef","allowDragAndDrop","addFileIcon","doubleFileDialogMessage","fileMinWidth","files","maxFiles","onAdd","onFileCountChange","onRemove","ref","fileItems","setFileItems","useState","mapFilesToInternalItems","handleClear","useCallback","handlePreviewUrlCallback","previewUrl","file","prevState","map","prevFile","id","callDuplicateFileDialog","createDialog","type","DialogType","ALERT","text","handleUploadFileCallback","uploadedFile","updatedState","_prevFile$uploadedFil","url","undefined","prevElement","find","nextUploadedFile","state","filter","Boolean","handleAddFiles","filesToAdd","newFileItems","forEach","filterDuplicateFile","newFile","push","uuidv4","limitedFileItems","slice","Math","max","length","handleDeleteFile","fileToDelete","filteredFiles","handleDrop","event","preventDefault","Array","from","dataTransfer","handleOpenFiles","openFiles","useImperativeHandle","clear","useEffect","filesToGeneratePreview","filesToUpload","includes","generateVideoThumbnail","callback","generatePreviewUrl","uploadFile","fileToUpload","externalFileItems","updatedItems","prevItem","matchingItem","item","concat","newItem","some","galleryItems","useMemo","items","createElement","key","fileItem","onClick","StyledGalleryEditor","StyledGalleryEditorGrid","$fileMinWidth","onDragOver","onDrop","displayName","_default","exports"],"sources":["../../../../src/components/gallery-editor/GalleryEditor.tsx"],"sourcesContent":["import {\n    Image,\n    uploadFile,\n    Video,\n    type FileItem,\n    type InternalFileItem,\n} from '@chayns-components/core';\nimport { createDialog, DialogType } from 'chayns-api';\nimport React, {\n    DragEvent,\n    forwardRef,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useMemo,\n    useState,\n} from 'react';\nimport { v4 as uuidv4 } from 'uuid';\nimport { filterDuplicateFile, generatePreviewUrl, generateVideoThumbnail } from '../../utils/file';\nimport { openFiles, mapFilesToInternalItems } from '../../utils/gallery';\nimport AddFile from './add-file/AddFile';\nimport GalleryEditorItem from './gallery-editor-item/GalleryEditorItem';\nimport { StyledGalleryEditor, StyledGalleryEditorGrid } from './GalleryEditor.styles';\nimport type { GalleryEditorProps, GalleryEditorRef } from './GalleryEditor.types';\n\nconst GalleryEditor = forwardRef<GalleryEditorRef, GalleryEditorProps>(\n    (\n        {\n            allowDragAndDrop = false,\n            addFileIcon = 'fa fa-plus',\n            doubleFileDialogMessage = 'Diese Datei ist bereits vorhanden',\n            fileMinWidth = 100,\n            files,\n            maxFiles,\n            onAdd,\n            onFileCountChange,\n            onRemove,\n        },\n        ref,\n    ) => {\n        const [fileItems, setFileItems] = useState<InternalFileItem[]>(() =>\n            mapFilesToInternalItems(files),\n        );\n\n        const handleClear = useCallback(() => {\n            setFileItems([]);\n        }, []);\n\n        const handlePreviewUrlCallback = useCallback(\n            (previewUrl: string, file: InternalFileItem) => {\n                setFileItems((prevState) =>\n                    prevState.map((prevFile) => {\n                        if (prevFile.id === file.id) {\n                            return { ...prevFile, previewUrl };\n                        }\n\n                        return prevFile;\n                    }),\n                );\n            },\n            [],\n        );\n\n        const callDuplicateFileDialog = useCallback(() => {\n            createDialog({ type: DialogType.ALERT, text: doubleFileDialogMessage });\n        }, [doubleFileDialogMessage]);\n\n        const handleUploadFileCallback = useCallback(\n            (file: InternalFileItem, uploadedFile: Video | Image) => {\n                setFileItems((prevState) => {\n                    const updatedState = prevState.map((prevFile) => {\n                        if (prevFile.uploadedFile?.url === uploadedFile.url) {\n                            callDuplicateFileDialog();\n\n                            return undefined;\n                        }\n\n                        if (prevFile.id === file.id) {\n                            if (typeof onAdd === 'function') {\n                                const prevElement = prevState.find(\n                                    ({ uploadedFile: nextUploadedFile }) =>\n                                        nextUploadedFile?.url === uploadedFile?.url,\n                                );\n\n                                if (!prevElement) {\n                                    onAdd({\n                                        file: uploadedFile,\n                                        id: file.id,\n                                    });\n                                }\n                            }\n\n                            return {\n                                ...prevFile,\n                                uploadedFile,\n                                state: 'uploaded',\n                            };\n                        }\n\n                        return prevFile;\n                    });\n\n                    return updatedState.filter(Boolean) as InternalFileItem[];\n                });\n            },\n            [callDuplicateFileDialog, onAdd],\n        );\n\n        const handleAddFiles = useCallback(\n            (filesToAdd: File[]) => {\n                const newFileItems: InternalFileItem[] = [];\n\n                filesToAdd.forEach((file) => {\n                    if (file && !filterDuplicateFile({ files: fileItems, newFile: file })) {\n                        newFileItems.push({\n                            id: uuidv4(),\n                            file,\n                            state: 'none',\n                        });\n                    }\n                });\n\n                let limitedFileItems = newFileItems;\n\n                if (maxFiles) {\n                    limitedFileItems = newFileItems.slice(\n                        0,\n                        Math.max(maxFiles - fileItems.length, 0),\n                    );\n                }\n\n                setFileItems((prevState) => [...prevState, ...limitedFileItems]);\n            },\n            [fileItems, maxFiles],\n        );\n\n        const handleDeleteFile = useCallback(\n            (id?: string) => {\n                let fileToDelete: FileItem | undefined;\n\n                const filteredFiles = fileItems.filter((file) => {\n                    if (file.id === id && file.uploadedFile) {\n                        fileToDelete = { file: file.uploadedFile, id };\n                    }\n\n                    return file.id !== id;\n                });\n\n                setFileItems(filteredFiles);\n\n                if (!fileToDelete || typeof onRemove !== 'function') {\n                    return;\n                }\n\n                onRemove(fileToDelete);\n            },\n            [fileItems, onRemove],\n        );\n\n        const handleDrop = useCallback(\n            (event: DragEvent<HTMLDivElement>) => {\n                if (!allowDragAndDrop) {\n                    return;\n                }\n\n                event.preventDefault();\n\n                handleAddFiles(Array.from(event.dataTransfer.files));\n            },\n            [allowDragAndDrop, handleAddFiles],\n        );\n\n        const handleOpenFiles = useCallback(\n            (file: InternalFileItem) => {\n                openFiles(fileItems, file);\n            },\n            [fileItems],\n        );\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                clear: handleClear,\n            }),\n            [handleClear],\n        );\n\n        useEffect(() => {\n            if (typeof onFileCountChange === 'function') {\n                onFileCountChange(fileItems.length);\n            }\n        }, [fileItems.length, onFileCountChange]);\n\n        useEffect(() => {\n            const filesToGeneratePreview = fileItems.filter(\n                (file) => file.file && !file.previewUrl && (file.state === 'none' || !file.state),\n            );\n\n            const filesToUpload = fileItems.filter(\n                (file) => file.file && !file.uploadedFile && file.state !== 'uploading',\n            );\n\n            filesToGeneratePreview.forEach((file) => {\n                if (!file.file) {\n                    return;\n                }\n\n                if (file.file.type.includes('video/')) {\n                    generateVideoThumbnail({\n                        file: file.file,\n                        callback: (previewUrl) => handlePreviewUrlCallback(previewUrl, file),\n                    });\n\n                    return;\n                }\n\n                generatePreviewUrl({\n                    file: file.file,\n                    callback: (previewUrl) => handlePreviewUrlCallback(previewUrl, file),\n                });\n            });\n\n            filesToUpload.forEach((file) => {\n                setFileItems((prevState) =>\n                    prevState.map((prevFile) => {\n                        if (prevFile.id === file.id) {\n                            return { ...prevFile, state: 'uploading' };\n                        }\n\n                        return prevFile;\n                    }),\n                );\n\n                void uploadFile({\n                    fileToUpload: file,\n                    callback: (uploadedFile) => handleUploadFileCallback(file, uploadedFile),\n                });\n            });\n        }, [fileItems, handlePreviewUrlCallback, handleUploadFileCallback]);\n\n        useEffect(() => {\n            const externalFileItems = mapFilesToInternalItems(files);\n\n            setFileItems((prevState) => {\n                // Keep local-only items such as pending uploads while refreshing known external media.\n                const updatedItems = prevState.map((prevItem) => {\n                    const matchingItem = externalFileItems.find(\n                        (item) =>\n                            item.uploadedFile &&\n                            item.uploadedFile.url ===\n                                (prevItem.uploadedFile && prevItem.uploadedFile.url),\n                    );\n\n                    return matchingItem || prevItem;\n                });\n\n                return updatedItems.concat(\n                    externalFileItems.filter(\n                        (newItem) =>\n                            !prevState.some(\n                                (prevItem) =>\n                                    prevItem.uploadedFile &&\n                                    newItem.uploadedFile &&\n                                    prevItem.uploadedFile.url === newItem.uploadedFile.url,\n                            ),\n                    ),\n                );\n            });\n        }, [files]);\n\n        const galleryItems = useMemo(() => {\n            const items = fileItems.map((file) => (\n                <GalleryEditorItem\n                    key={file.id}\n                    fileItem={file}\n                    onClick={handleOpenFiles}\n                    handleDeleteFile={handleDeleteFile}\n                />\n            ));\n\n            if (maxFiles && maxFiles <= fileItems.length) {\n                return items;\n            }\n\n            return [\n                ...items,\n                <AddFile key=\"add_file\" addFileIcon={addFileIcon} onAdd={handleAddFiles} />,\n            ];\n        }, [addFileIcon, fileItems, handleAddFiles, handleDeleteFile, handleOpenFiles, maxFiles]);\n\n        return (\n            <StyledGalleryEditor>\n                <StyledGalleryEditorGrid\n                    $fileMinWidth={fileMinWidth}\n                    onDragOver={(event) => event.preventDefault()}\n                    onDrop={(event) => void handleDrop(event)}\n                >\n                    {galleryItems}\n                </StyledGalleryEditorGrid>\n            </StyledGalleryEditor>\n        );\n    },\n);\n\nGalleryEditor.displayName = 'GalleryEditor';\n\nexport default GalleryEditor;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"GalleryEditor.js","names":["_react","require","_react2","_interopRequireWildcard","_AddFile","_interopRequireDefault","_GalleryEditor","_GalleryEditorItem","_GalleryEditor2","_useGalleryEditorState","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","GalleryEditor","forwardRef","allowDragAndDrop","addFileIcon","doubleFileDialogMessage","fileMinWidth","files","maxFiles","onAdd","onFileCountChange","onRemove","shouldLoadImages","ref","fileItems","handleAddFiles","handleClear","handleDeleteFile","handleDrop","handleOpenFiles","useGalleryEditorState","useImperativeHandle","clear","shouldShowAddFileTile","length","createElement","StyledGalleryEditor","StyledGalleryEditorGrid","$fileMinWidth","$gap","GALLERY_EDITOR_GRID_GAP_PX","onDragOver","event","preventDefault","onDrop","AnimatePresence","initial","map","file","key","id","fileItem","onClick","displayName","_default","exports"],"sources":["../../../../src/components/gallery-editor/GalleryEditor.tsx"],"sourcesContent":["import { AnimatePresence } from 'motion/react';\nimport React, { forwardRef, useImperativeHandle } from 'react';\nimport AddFile from './add-file/AddFile';\nimport { StyledGalleryEditor, StyledGalleryEditorGrid } from './GalleryEditor.styles';\nimport type { GalleryEditorProps, GalleryEditorRef } from './GalleryEditor.types';\nimport GalleryEditorItem from './gallery-editor-item/GalleryEditorItem';\nimport { GALLERY_EDITOR_GRID_GAP_PX } from './GalleryEditor.constants';\nimport useGalleryEditorState from './useGalleryEditorState';\n\nconst GalleryEditor = forwardRef<GalleryEditorRef, GalleryEditorProps>(\n    (\n        {\n            allowDragAndDrop = false,\n            addFileIcon = 'fa fa-plus',\n            doubleFileDialogMessage = 'Diese Datei ist bereits vorhanden',\n            fileMinWidth = 100,\n            files,\n            maxFiles,\n            onAdd,\n            onFileCountChange,\n            onRemove,\n            shouldLoadImages = true,\n        },\n        ref,\n    ) => {\n        const {\n            fileItems,\n            handleAddFiles,\n            handleClear,\n            handleDeleteFile,\n            handleDrop,\n            handleOpenFiles,\n        } = useGalleryEditorState({\n            allowDragAndDrop,\n            doubleFileDialogMessage,\n            files,\n            maxFiles,\n            onAdd,\n            onFileCountChange,\n            onRemove,\n        });\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                clear: handleClear,\n            }),\n            [handleClear],\n        );\n\n        const shouldShowAddFileTile = !maxFiles || maxFiles > fileItems.length;\n\n        return (\n            <StyledGalleryEditor>\n                <StyledGalleryEditorGrid\n                    $fileMinWidth={fileMinWidth}\n                    $gap={GALLERY_EDITOR_GRID_GAP_PX}\n                    onDragOver={(event) => event.preventDefault()}\n                    onDrop={(event) => void handleDrop(event)}\n                >\n                    <AnimatePresence initial={false}>\n                        {fileItems.map((file) => (\n                            <GalleryEditorItem\n                                key={file.id}\n                                fileItem={file}\n                                handleDeleteFile={handleDeleteFile}\n                                onClick={handleOpenFiles}\n                                shouldLoadImages={shouldLoadImages}\n                            />\n                        ))}\n                    </AnimatePresence>\n\n                    {shouldShowAddFileTile && (\n                        <AddFile addFileIcon={addFileIcon} onAdd={handleAddFiles} />\n                    )}\n                </StyledGalleryEditorGrid>\n            </StyledGalleryEditor>\n        );\n    },\n);\n\nGalleryEditor.displayName = 'GalleryEditor';\n\nexport default GalleryEditor;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/gallery-editor/GalleryEditor.styles.js

@@ -15,6 +15,8 @@ const StyledGalleryEditorGrid = exports.StyledGalleryEditorGrid = _styledCompone
   $fileMinWidth
 }) => `repeat(auto-fill, minmax(${$fileMinWidth}px, 1fr))`};
     grid-auto-rows: 1fr;
-    gap: 6px;
+    gap: ${({
+  $gap
+}) => `${$gap}px`};
 `;
 //# sourceMappingURL=GalleryEditor.styles.js.map

package/lib/cjs/components/gallery-editor/GalleryEditor.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryEditor.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledGalleryEditor","exports","styled","div","StyledGalleryEditorGrid","$fileMinWidth"],"sources":["../../../../src/components/gallery-editor/GalleryEditor.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledGalleryEditor = styled.div`\n    width: 100%;\n`;\n\nexport const StyledGalleryEditorGrid = styled.div<{\n    $fileMinWidth: number;\n}>`\n    display: grid;\n    grid-template-columns: ${({ $fileMinWidth }) =>\n        `repeat(auto-fill, minmax(${$fileMinWidth}px, 1fr))`};\n    grid-auto-rows: 1fr;\n    gap: 6px;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEhC,MAAMG,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,GAAGE,yBAAM,CAACC,GAAG;AAC7C;AACA,CAAC;AAEM,MAAMC,uBAAuB,GAAAH,OAAA,CAAAG,uBAAA,GAAGF,yBAAM,CAACC,GAE5C;AACF;AACA,6BAA6B,CAAC;EAAEE;AAAc,CAAC,KACvC,4BAA4BA,aAAa,WAAW;AAC5D;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"file":"GalleryEditor.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledGalleryEditor","exports","styled","div","StyledGalleryEditorGrid","$fileMinWidth","$gap"],"sources":["../../../../src/components/gallery-editor/GalleryEditor.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledGalleryEditor = styled.div`\n    width: 100%;\n`;\n\nexport const StyledGalleryEditorGrid = styled.div<{\n    $gap: number;\n    $fileMinWidth: number;\n}>`\n    display: grid;\n    grid-template-columns: ${({ $fileMinWidth }) =>\n        `repeat(auto-fill, minmax(${$fileMinWidth}px, 1fr))`};\n    grid-auto-rows: 1fr;\n    gap: ${({ $gap }) => `${$gap}px`};\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEhC,MAAMG,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,GAAGE,yBAAM,CAACC,GAAG;AAC7C;AACA,CAAC;AAEM,MAAMC,uBAAuB,GAAAH,OAAA,CAAAG,uBAAA,GAAGF,yBAAM,CAACC,GAG5C;AACF;AACA,6BAA6B,CAAC;EAAEE;AAAc,CAAC,KACvC,4BAA4BA,aAAa,WAAW;AAC5D;AACA,WAAW,CAAC;EAAEC;AAAK,CAAC,KAAK,GAAGA,IAAI,IAAI;AACpC,CAAC","ignoreList":[]}

package/lib/cjs/components/gallery-editor/GalleryEditor.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryEditor.types.js","names":[],"sources":["../../../../src/components/gallery-editor/GalleryEditor.types.ts"],"sourcesContent":["import type { FileItem } from '@chayns-components/core';\nimport type { GalleryRef } from '../Gallery.types';\n\n/**\n * Props for the editable gallery component.\n */\nexport interface GalleryEditorProps {\n    /**\n     * Enables drag and drop file selection inside the editor grid.\n     * @description\n     * When enabled, users can drop local image or video files onto the editor grid to start the upload flow.\n     * @default false\n     * @example\n     * <GalleryEditor allowDragAndDrop files={files} />\n     * @optional\n     */\n    allowDragAndDrop?: boolean;\n    /**\n     * Defines the dialog message that is shown when a duplicate upload is detected.\n     * @description\n     * The message is shown when a newly uploaded file resolves to a URL that already exists in the editor state.\n     * @default 'Diese Datei ist bereits vorhanden'\n     * @example\n     * <GalleryEditor doubleFileDialogMessage=\"This file already exists.\" files={files} />\n     * @optional\n     */\n    doubleFileDialogMessage?: string;\n    /**\n     * Defines the minimum width of one tile in the editor grid.\n     * @description\n     * The editor uses this value to size the responsive grid columns that hold uploaded items and the add-tile.\n     * @default 100\n     * @example\n     * <GalleryEditor fileMinWidth={140} files={files} />\n     * @optional\n     */\n    fileMinWidth?: number;\n    /**\n     * Defines the icon that is shown in the add-file tile.\n     * @description\n     * The editor renders this icon inside the tile that opens the file picker for adding more items.\n     * @default 'fa fa-plus'\n     * @example\n     * <GalleryEditor addFileIcon=\"fa fa-image-circle-plus\" files={files} />\n     * @optional\n     */\n    addFileIcon?: string;\n    /**\n     * Provides already uploaded media items that should be merged into the editor state.\n     * @description\n     * These files represent the externally known uploaded baseline. The editor may additionally hold local pending uploads.\n     * @example\n     * <GalleryEditor files={files} />\n     * @optional\n     */\n    files?: FileItem[];\n    /**\n     * Limits how many files can be managed by the editor.\n     * @description\n     * After the limit is reached, the add-tile is hidden and additional file selection is ignored.\n     * @example\n     * <GalleryEditor files={files} maxFiles={6} />\n     * @optional\n     */\n    maxFiles?: number;\n    /**\n     * Is called after a file has been uploaded successfully.\n     * @description\n     * The callback receives the uploaded file representation so the consuming state can persist it externally.\n     * @example\n     * <GalleryEditor onAdd={(file) => setFiles((prev) => [...prev, file])} />\n     * @optional\n     */\n    onAdd?: (file: FileItem) => void;\n    /**\n     * Is called whenever the internal item count changes, including local pending uploads.\n     * @description\n     * Use this callback when surrounding UI needs to react to the number of currently managed items.\n     * @example\n     * <GalleryEditor onFileCountChange={(count) => console.log(count)} />\n     * @optional\n     */\n    onFileCountChange?: (fileCount: number) => void;\n    /**\n     * Is called after an uploaded file has been removed.\n     * @description\n     * The callback receives the removed uploaded file so the consuming state can remove it from its controlled `files` array.\n     * @example\n     * <GalleryEditor onRemove={(file) => removeFile(file.id)} />\n     * @optional\n     */\n    onRemove?: (file: FileItem) => void;\n}\n\nexport type GalleryEditorRef = GalleryRef;\n"],"mappings":"","ignoreList":[]}
+{"version":3,"file":"GalleryEditor.types.js","names":[],"sources":["../../../../src/components/gallery-editor/GalleryEditor.types.ts"],"sourcesContent":["import type { FileItem } from '@chayns-components/core';\nimport type { GalleryRef } from '../Gallery.types';\n\n/**\n * Props for the editable gallery component.\n */\nexport interface GalleryEditorProps {\n    /**\n     * Enables drag and drop file selection inside the editor grid.\n     * @description\n     * When enabled, users can drop local image or video files onto the editor grid to start the upload flow.\n     * @default false\n     * @example\n     * <GalleryEditor allowDragAndDrop files={files} />\n     * @optional\n     */\n    allowDragAndDrop?: boolean;\n    /**\n     * Defines the dialog message that is shown when a duplicate upload is detected.\n     * @description\n     * The message is shown when a newly uploaded file resolves to a URL that already exists in the editor state.\n     * @default 'Diese Datei ist bereits vorhanden'\n     * @example\n     * <GalleryEditor doubleFileDialogMessage=\"This file already exists.\" files={files} />\n     * @optional\n     */\n    doubleFileDialogMessage?: string;\n    /**\n     * Defines the minimum width of one tile in the editor grid.\n     * @description\n     * The editor uses this value to size the responsive grid columns that hold uploaded items and the add-tile.\n     * @default 100\n     * @example\n     * <GalleryEditor fileMinWidth={140} files={files} />\n     * @optional\n     */\n    fileMinWidth?: number;\n    /**\n     * Defines the icon that is shown in the add-file tile.\n     * @description\n     * The editor renders this icon inside the tile that opens the file picker for adding more items.\n     * @default 'fa fa-plus'\n     * @example\n     * <GalleryEditor addFileIcon=\"fa fa-image-circle-plus\" files={files} />\n     * @optional\n     */\n    addFileIcon?: string;\n    /**\n     * Provides already uploaded media items that should be merged into the editor state.\n     * @description\n     * These files represent the externally known uploaded baseline. The editor may additionally hold local pending uploads.\n     * @example\n     * <GalleryEditor files={files} />\n     * @optional\n     */\n    files?: FileItem[];\n    /**\n     * Controls whether the editor may load the final media assets immediately.\n     * @description\n     * When set to `true`, the editor behaves like the current implementation and loads the final media immediately.\n     * When set to `false`, uploaded media keeps rendering previews first and delays the final image load until this flag becomes `true`.\n     * @default true\n     * @example\n     * <GalleryEditor files={files} shouldLoadImages={false} />\n     * @optional\n     */\n    shouldLoadImages?: boolean;\n    /**\n     * Limits how many files can be managed by the editor.\n     * @description\n     * After the limit is reached, the add-tile is hidden and additional file selection is ignored.\n     * @example\n     * <GalleryEditor files={files} maxFiles={6} />\n     * @optional\n     */\n    maxFiles?: number;\n    /**\n     * Is called after a file has been uploaded successfully.\n     * @description\n     * The callback receives the uploaded file representation so the consuming state can persist it externally.\n     * @example\n     * <GalleryEditor onAdd={(file) => setFiles((prev) => [...prev, file])} />\n     * @optional\n     */\n    onAdd?: (file: FileItem) => void;\n    /**\n     * Is called whenever the internal item count changes, including local pending uploads.\n     * @description\n     * Use this callback when surrounding UI needs to react to the number of currently managed items.\n     * @example\n     * <GalleryEditor onFileCountChange={(count) => console.log(count)} />\n     * @optional\n     */\n    onFileCountChange?: (fileCount: number) => void;\n    /**\n     * Is called after an uploaded file has been removed.\n     * @description\n     * The callback receives the removed uploaded file so the consuming state can remove it from its controlled `files` array.\n     * @example\n     * <GalleryEditor onRemove={(file) => removeFile(file.id)} />\n     * @optional\n     */\n    onRemove?: (file: FileItem) => void;\n}\n\nexport type GalleryEditorRef = GalleryRef;\n"],"mappings":"","ignoreList":[]}

package/lib/cjs/components/gallery-editor/GalleryEditor.utils.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.mergeExternalFilesWithInternalState = exports.mapExternalFilesIntoInternalItems = exports.getPendingUploadFileItems = exports.getPendingPreviewFileItems = void 0;
+const mapExternalFilesIntoInternalItems = files => (files ?? []).map((file, index) => ({
+  id: file.id ?? file.file.id ?? file.file.url ?? `gallery-item-${index}`,
+  uploadedFile: file.file,
+  file: undefined,
+  state: 'uploaded',
+  previewUrl: undefined
+}));
+exports.mapExternalFilesIntoInternalItems = mapExternalFilesIntoInternalItems;
+const mergeExternalFilesWithInternalState = (internalItems, externalItems) => {
+  const mergedItems = internalItems.map(prevItem => {
+    const matchingItem = externalItems.find(item => item.uploadedFile && prevItem.uploadedFile && item.uploadedFile.url === prevItem.uploadedFile.url);
+    return matchingItem || prevItem;
+  });
+  return mergedItems.concat(externalItems.filter(newItem => !internalItems.some(prevItem => prevItem.uploadedFile && newItem.uploadedFile && prevItem.uploadedFile.url === newItem.uploadedFile.url)));
+};
+exports.mergeExternalFilesWithInternalState = mergeExternalFilesWithInternalState;
+const getPendingPreviewFileItems = fileItems => fileItems.filter(file => file.file && !file.previewUrl && (file.state === 'none' || !file.state));
+exports.getPendingPreviewFileItems = getPendingPreviewFileItems;
+const getPendingUploadFileItems = fileItems => fileItems.filter(file => file.file && !file.uploadedFile && file.state !== 'uploading');
+exports.getPendingUploadFileItems = getPendingUploadFileItems;
+//# sourceMappingURL=GalleryEditor.utils.js.map

package/lib/cjs/components/gallery-editor/GalleryEditor.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GalleryEditor.utils.js","names":["mapExternalFilesIntoInternalItems","files","map","file","index","id","url","uploadedFile","undefined","state","previewUrl","exports","mergeExternalFilesWithInternalState","internalItems","externalItems","mergedItems","prevItem","matchingItem","find","item","concat","filter","newItem","some","getPendingPreviewFileItems","fileItems","getPendingUploadFileItems"],"sources":["../../../../src/components/gallery-editor/GalleryEditor.utils.ts"],"sourcesContent":["import type { FileItem, InternalFileItem } from '@chayns-components/core';\n\nexport const mapExternalFilesIntoInternalItems = (files?: FileItem[]): InternalFileItem[] =>\n    (files ?? []).map((file, index) => ({\n        id: file.id ?? file.file.id ?? file.file.url ?? `gallery-item-${index}`,\n        uploadedFile: file.file,\n        file: undefined,\n        state: 'uploaded',\n        previewUrl: undefined,\n    }));\n\nexport const mergeExternalFilesWithInternalState = (\n    internalItems: InternalFileItem[],\n    externalItems: InternalFileItem[],\n): InternalFileItem[] => {\n    const mergedItems = internalItems.map((prevItem) => {\n        const matchingItem = externalItems.find(\n            (item) =>\n                item.uploadedFile &&\n                prevItem.uploadedFile &&\n                item.uploadedFile.url === prevItem.uploadedFile.url,\n        );\n\n        return matchingItem || prevItem;\n    });\n\n    return mergedItems.concat(\n        externalItems.filter(\n            (newItem) =>\n                !internalItems.some(\n                    (prevItem) =>\n                        prevItem.uploadedFile &&\n                        newItem.uploadedFile &&\n                        prevItem.uploadedFile.url === newItem.uploadedFile.url,\n                ),\n        ),\n    );\n};\n\nexport const getPendingPreviewFileItems = (fileItems: InternalFileItem[]) =>\n    fileItems.filter(\n        (file) => file.file && !file.previewUrl && (file.state === 'none' || !file.state),\n    );\n\nexport const getPendingUploadFileItems = (fileItems: InternalFileItem[]) =>\n    fileItems.filter((file) => file.file && !file.uploadedFile && file.state !== 'uploading');\n"],"mappings":";;;;;;AAEO,MAAMA,iCAAiC,GAAIC,KAAkB,IAChE,CAACA,KAAK,IAAI,EAAE,EAAEC,GAAG,CAAC,CAACC,IAAI,EAAEC,KAAK,MAAM;EAChCC,EAAE,EAAEF,IAAI,CAACE,EAAE,IAAIF,IAAI,CAACA,IAAI,CAACE,EAAE,IAAIF,IAAI,CAACA,IAAI,CAACG,GAAG,IAAI,gBAAgBF,KAAK,EAAE;EACvEG,YAAY,EAAEJ,IAAI,CAACA,IAAI;EACvBA,IAAI,EAAEK,SAAS;EACfC,KAAK,EAAE,UAAU;EACjBC,UAAU,EAAEF;AAChB,CAAC,CAAC,CAAC;AAACG,OAAA,CAAAX,iCAAA,GAAAA,iCAAA;AAED,MAAMY,mCAAmC,GAAGA,CAC/CC,aAAiC,EACjCC,aAAiC,KACZ;EACrB,MAAMC,WAAW,GAAGF,aAAa,CAACX,GAAG,CAAEc,QAAQ,IAAK;IAChD,MAAMC,YAAY,GAAGH,aAAa,CAACI,IAAI,CAClCC,IAAI,IACDA,IAAI,CAACZ,YAAY,IACjBS,QAAQ,CAACT,YAAY,IACrBY,IAAI,CAACZ,YAAY,CAACD,GAAG,KAAKU,QAAQ,CAACT,YAAY,CAACD,GACxD,CAAC;IAED,OAAOW,YAAY,IAAID,QAAQ;EACnC,CAAC,CAAC;EAEF,OAAOD,WAAW,CAACK,MAAM,CACrBN,aAAa,CAACO,MAAM,CACfC,OAAO,IACJ,CAACT,aAAa,CAACU,IAAI,CACdP,QAAQ,IACLA,QAAQ,CAACT,YAAY,IACrBe,OAAO,CAACf,YAAY,IACpBS,QAAQ,CAACT,YAAY,CAACD,GAAG,KAAKgB,OAAO,CAACf,YAAY,CAACD,GAC3D,CACR,CACJ,CAAC;AACL,CAAC;AAACK,OAAA,CAAAC,mCAAA,GAAAA,mCAAA;AAEK,MAAMY,0BAA0B,GAAIC,SAA6B,IACpEA,SAAS,CAACJ,MAAM,CACXlB,IAAI,IAAKA,IAAI,CAACA,IAAI,IAAI,CAACA,IAAI,CAACO,UAAU,KAAKP,IAAI,CAACM,KAAK,KAAK,MAAM,IAAI,CAACN,IAAI,CAACM,KAAK,CACpF,CAAC;AAACE,OAAA,CAAAa,0BAAA,GAAAA,0BAAA;AAEC,MAAME,yBAAyB,GAAID,SAA6B,IACnEA,SAAS,CAACJ,MAAM,CAAElB,IAAI,IAAKA,IAAI,CAACA,IAAI,IAAI,CAACA,IAAI,CAACI,YAAY,IAAIJ,IAAI,CAACM,KAAK,KAAK,WAAW,CAAC;AAACE,OAAA,CAAAe,yBAAA,GAAAA,yBAAA","ignoreList":[]}

package/lib/cjs/components/gallery-editor/add-file/AddFile.js

@@ -29,5 +29,5 @@ const AddFile = ({
   })));
 };
 AddFile.displayName = 'AddFile';
-var _default = exports.default = AddFile;
+var _default = exports.default = /*#__PURE__*/(0, _react.memo)(AddFile);
 //# sourceMappingURL=AddFile.js.map

package/lib/cjs/components/gallery-editor/add-file/AddFile.js.map

@@ -1 +1 @@
-{"version":3,"file":"AddFile.js","names":["_core","require","_react","_interopRequireWildcard","_AddFile","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","AddFile","addFileIcon","onAdd","openSelectDialog","useCallback","files","selectFiles","multiple","type","createElement","StyledAddFile","key","StyledAddFIleIconWrapper","onClick","Icon","size","icons","displayName","_default","exports"],"sources":["../../../../../src/components/gallery-editor/add-file/AddFile.tsx"],"sourcesContent":["import { Icon, selectFiles } from '@chayns-components/core';\nimport React, { FC, useCallback } from 'react';\nimport { StyledAddFile, StyledAddFIleIconWrapper } from './AddFile.styles';\nimport type { AddFileProps } from './AddFile.types';\n\nconst AddFile: FC<AddFileProps> = ({ addFileIcon = 'fa fa-plus', onAdd }) => {\n    const openSelectDialog = useCallback(async () => {\n        const files = await selectFiles({\n            multiple: true,\n            type: 'image/*, video/*',\n        });\n\n        onAdd(files);\n    }, [onAdd]);\n\n    return (\n        <StyledAddFile key=\"addButton\">\n            <StyledAddFIleIconWrapper onClick={() => void openSelectDialog()}>\n                <Icon size={40} icons={[addFileIcon]} />\n            </StyledAddFIleIconWrapper>\n        </StyledAddFile>\n    );\n};\n\nAddFile.displayName = 'AddFile';\n\nexport default AddFile;\n"],"mappings":";;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AAA2E,SAAAE,wBAAAE,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAJ,uBAAA,YAAAA,CAAAE,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAG3E,MAAMkB,OAAyB,GAAGA,CAAC;EAAEC,WAAW,GAAG,YAAY;EAAEC;AAAM,CAAC,KAAK;EACzE,MAAMC,gBAAgB,GAAG,IAAAC,kBAAW,EAAC,YAAY;IAC7C,MAAMC,KAAK,GAAG,MAAM,IAAAC,iBAAW,EAAC;MAC5BC,QAAQ,EAAE,IAAI;MACdC,IAAI,EAAE;IACV,CAAC,CAAC;IAEFN,KAAK,CAACG,KAAK,CAAC;EAChB,CAAC,EAAE,CAACH,KAAK,CAAC,CAAC;EAEX,oBACIxB,MAAA,CAAAa,OAAA,CAAAkB,aAAA,CAAC7B,QAAA,CAAA8B,aAAa;IAACC,GAAG,EAAC;EAAW,gBAC1BjC,MAAA,CAAAa,OAAA,CAAAkB,aAAA,CAAC7B,QAAA,CAAAgC,wBAAwB;IAACC,OAAO,EAAEA,CAAA,KAAM,KAAKV,gBAAgB,CAAC;EAAE,gBAC7DzB,MAAA,CAAAa,OAAA,CAAAkB,aAAA,CAACjC,KAAA,CAAAsC,IAAI;IAACC,IAAI,EAAE,EAAG;IAACC,KAAK,EAAE,CAACf,WAAW;EAAE,CAAE,CACjB,CACf,CAAC;AAExB,CAAC;AAEDD,OAAO,CAACiB,WAAW,GAAG,SAAS;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA5B,OAAA,GAEjBS,OAAO","ignoreList":[]}
+{"version":3,"file":"AddFile.js","names":["_core","require","_react","_interopRequireWildcard","_AddFile","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","AddFile","addFileIcon","onAdd","openSelectDialog","useCallback","files","selectFiles","multiple","type","createElement","StyledAddFile","key","StyledAddFIleIconWrapper","onClick","Icon","size","icons","displayName","_default","exports","memo"],"sources":["../../../../../src/components/gallery-editor/add-file/AddFile.tsx"],"sourcesContent":["import { Icon, selectFiles } from '@chayns-components/core';\nimport React, { FC, memo, useCallback } from 'react';\nimport { StyledAddFile, StyledAddFIleIconWrapper } from './AddFile.styles';\nimport type { AddFileProps } from './AddFile.types';\n\nconst AddFile: FC<AddFileProps> = ({ addFileIcon = 'fa fa-plus', onAdd }) => {\n    const openSelectDialog = useCallback(async () => {\n        const files = await selectFiles({\n            multiple: true,\n            type: 'image/*, video/*',\n        });\n\n        onAdd(files);\n    }, [onAdd]);\n\n    return (\n        <StyledAddFile key=\"addButton\">\n            <StyledAddFIleIconWrapper onClick={() => void openSelectDialog()}>\n                <Icon size={40} icons={[addFileIcon]} />\n            </StyledAddFIleIconWrapper>\n        </StyledAddFile>\n    );\n};\n\nAddFile.displayName = 'AddFile';\n\nexport default memo(AddFile);\n"],"mappings":";;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AAA2E,SAAAE,wBAAAE,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAJ,uBAAA,YAAAA,CAAAE,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAG3E,MAAMkB,OAAyB,GAAGA,CAAC;EAAEC,WAAW,GAAG,YAAY;EAAEC;AAAM,CAAC,KAAK;EACzE,MAAMC,gBAAgB,GAAG,IAAAC,kBAAW,EAAC,YAAY;IAC7C,MAAMC,KAAK,GAAG,MAAM,IAAAC,iBAAW,EAAC;MAC5BC,QAAQ,EAAE,IAAI;MACdC,IAAI,EAAE;IACV,CAAC,CAAC;IAEFN,KAAK,CAACG,KAAK,CAAC;EAChB,CAAC,EAAE,CAACH,KAAK,CAAC,CAAC;EAEX,oBACIxB,MAAA,CAAAa,OAAA,CAAAkB,aAAA,CAAC7B,QAAA,CAAA8B,aAAa;IAACC,GAAG,EAAC;EAAW,gBAC1BjC,MAAA,CAAAa,OAAA,CAAAkB,aAAA,CAAC7B,QAAA,CAAAgC,wBAAwB;IAACC,OAAO,EAAEA,CAAA,KAAM,KAAKV,gBAAgB,CAAC;EAAE,gBAC7DzB,MAAA,CAAAa,OAAA,CAAAkB,aAAA,CAACjC,KAAA,CAAAsC,IAAI;IAACC,IAAI,EAAE,EAAG;IAACC,KAAK,EAAE,CAACf,WAAW;EAAE,CAAE,CACjB,CACf,CAAC;AAExB,CAAC;AAEDD,OAAO,CAACiB,WAAW,GAAG,SAAS;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA5B,OAAA,gBAEjB,IAAA6B,WAAI,EAACpB,OAAO,CAAC","ignoreList":[]}

package/lib/cjs/components/gallery-editor/gallery-editor-item/GalleryEditorItem.js

@@ -5,37 +5,66 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _core = require("@chayns-components/core");
-var _react = require("motion/react");
-var _react2 = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _GalleryEditorItem = require("./GalleryEditorItem.styles");
 var _GalleryEditorMediaItem = _interopRequireDefault(require("./gallery-editor-media-item/GalleryEditorMediaItem"));
 var _GalleryEditorPreviewItem = _interopRequireDefault(require("./gallery-editor-preview-item/GalleryEditorPreviewItem"));
+var _GalleryEditor = require("../GalleryEditor.constants");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const GalleryEditorItem = ({
   fileItem,
   handleDeleteFile,
+  shouldLoadImages = true,
   ratio = 1,
   onClick
 }) => {
-  const mediaContent = !fileItem.state || fileItem.state === 'none' || !fileItem.previewUrl && !fileItem.uploadedFile ? null : fileItem.state === 'uploading' ? /*#__PURE__*/_react2.default.createElement(_GalleryEditorPreviewItem.default, {
-    ratio: ratio,
-    key: `uploading_${fileItem.id ?? ''}`,
-    fileItem: fileItem
-  }) : /*#__PURE__*/_react2.default.createElement(_GalleryEditorMediaItem.default, {
-    key: `uploaded_${fileItem.id ?? ''}`,
-    fileItem: fileItem,
-    ratio: ratio,
-    openSelectedFile: onClick
-  });
-  return /*#__PURE__*/_react2.default.createElement(_GalleryEditorItem.StyledGalleryEditorItem, null, /*#__PURE__*/_react2.default.createElement(_GalleryEditorItem.StyledGalleryEditorItemDeleteButton, {
-    onClick: () => handleDeleteFile(fileItem.id)
-  }, /*#__PURE__*/_react2.default.createElement(_core.Icon, {
+  const shouldRenderPreview = fileItem.state === 'uploading';
+  const shouldRenderMedia = fileItem.state !== 'none' && (Boolean(fileItem.previewUrl) || Boolean(fileItem.uploadedFile));
+  let mediaContent = null;
+  if (shouldRenderPreview) {
+    mediaContent = /*#__PURE__*/_react.default.createElement(_GalleryEditorPreviewItem.default, {
+      ratio: ratio,
+      fileItem: fileItem
+    });
+  } else if (shouldRenderMedia) {
+    mediaContent = /*#__PURE__*/_react.default.createElement(_GalleryEditorMediaItem.default, {
+      fileItem: fileItem,
+      ratio: ratio,
+      openSelectedFile: onClick,
+      previewUrl: fileItem.previewUrl,
+      shouldLoadImages: shouldLoadImages
+    });
+  }
+  return /*#__PURE__*/_react.default.createElement(_GalleryEditorItem.StyledMotionGalleryEditorItem, {
+    initial: {
+      opacity: 0,
+      scale: 0.98
+    },
+    animate: {
+      opacity: 1,
+      scale: 1
+    },
+    exit: {
+      opacity: 0,
+      scale: 0.98
+    },
+    transition: {
+      duration: _GalleryEditor.GALLERY_EDITOR_ITEM_FADE_DURATION_S
+    }
+  }, mediaContent, /*#__PURE__*/_react.default.createElement(_GalleryEditorItem.StyledGalleryEditorItemDeleteButton, {
+    type: "button",
+    onClick: event => {
+      event.stopPropagation();
+      handleDeleteFile(fileItem.id);
+    },
+    $zIndex: _GalleryEditor.GALLERY_EDITOR_DELETE_BUTTON_Z_INDEX,
+    "aria-label": "Bild entfernen"
+  }, /*#__PURE__*/_react.default.createElement(_core.Icon, {
     size: 20,
     icons: ['ts-wrong']
-  })), /*#__PURE__*/_react2.default.createElement(_react.AnimatePresence, {
-    initial: false
-  }, mediaContent));
+  })));
 };
 GalleryEditorItem.displayName = 'GalleryEditorItem';
-var _default = exports.default = GalleryEditorItem;
+var _default = exports.default = /*#__PURE__*/(0, _react.memo)(GalleryEditorItem);
 //# sourceMappingURL=GalleryEditorItem.js.map

package/lib/cjs/components/gallery-editor/gallery-editor-item/GalleryEditorItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryEditorItem.js","names":["_core","require","_react","_react2","_interopRequireDefault","_GalleryEditorItem","_GalleryEditorMediaItem","_GalleryEditorPreviewItem","e","__esModule","default","GalleryEditorItem","fileItem","handleDeleteFile","ratio","onClick","mediaContent","state","previewUrl","uploadedFile","createElement","key","id","openSelectedFile","StyledGalleryEditorItem","StyledGalleryEditorItemDeleteButton","Icon","size","icons","AnimatePresence","initial","displayName","_default","exports"],"sources":["../../../../../src/components/gallery-editor/gallery-editor-item/GalleryEditorItem.tsx"],"sourcesContent":["import { Icon } from '@chayns-components/core';\nimport { AnimatePresence } from 'motion/react';\nimport React, { FC } from 'react';\nimport {\n    StyledGalleryEditorItem,\n    StyledGalleryEditorItemDeleteButton,\n} from './GalleryEditorItem.styles';\nimport GalleryEditorMediaItem from './gallery-editor-media-item/GalleryEditorMediaItem';\nimport GalleryEditorPreviewItem from './gallery-editor-preview-item/GalleryEditorPreviewItem';\nimport type { GalleryEditorItemProps } from './GalleryEditorItem.types';\n\nconst GalleryEditorItem: FC<GalleryEditorItemProps> = ({\n    fileItem,\n    handleDeleteFile,\n    ratio = 1,\n    onClick,\n}) => {\n    const mediaContent =\n        !fileItem.state ||\n        fileItem.state === 'none' ||\n        (!fileItem.previewUrl && !fileItem.uploadedFile) ? null : fileItem.state === 'uploading' ? (\n            <GalleryEditorPreviewItem\n                ratio={ratio}\n                key={`uploading_${fileItem.id ?? ''}`}\n                fileItem={fileItem}\n            />\n        ) : (\n            <GalleryEditorMediaItem\n                key={`uploaded_${fileItem.id ?? ''}`}\n                fileItem={fileItem}\n                ratio={ratio}\n                openSelectedFile={onClick}\n            />\n        );\n\n    return (\n        <StyledGalleryEditorItem>\n            <StyledGalleryEditorItemDeleteButton onClick={() => handleDeleteFile(fileItem.id)}>\n                <Icon size={20} icons={['ts-wrong']} />\n            </StyledGalleryEditorItemDeleteButton>\n            <AnimatePresence initial={false}>{mediaContent}</AnimatePresence>\n        </StyledGalleryEditorItem>\n    );\n};\n\nGalleryEditorItem.displayName = 'GalleryEditorItem';\n\nexport default GalleryEditorItem;\n"],"mappings":";;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,kBAAA,GAAAJ,OAAA;AAIA,IAAAK,uBAAA,GAAAF,sBAAA,CAAAH,OAAA;AACA,IAAAM,yBAAA,GAAAH,sBAAA,CAAAH,OAAA;AAA8F,SAAAG,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAG9F,MAAMG,iBAA6C,GAAGA,CAAC;EACnDC,QAAQ;EACRC,gBAAgB;EAChBC,KAAK,GAAG,CAAC;EACTC;AACJ,CAAC,KAAK;EACF,MAAMC,YAAY,GACd,CAACJ,QAAQ,CAACK,KAAK,IACfL,QAAQ,CAACK,KAAK,KAAK,MAAM,IACxB,CAACL,QAAQ,CAACM,UAAU,IAAI,CAACN,QAAQ,CAACO,YAAa,GAAG,IAAI,GAAGP,QAAQ,CAACK,KAAK,KAAK,WAAW,gBACpFd,OAAA,CAAAO,OAAA,CAAAU,aAAA,CAACb,yBAAA,CAAAG,OAAwB;IACrBI,KAAK,EAAEA,KAAM;IACbO,GAAG,EAAE,aAAaT,QAAQ,CAACU,EAAE,IAAI,EAAE,EAAG;IACtCV,QAAQ,EAAEA;EAAS,CACtB,CAAC,gBAEFT,OAAA,CAAAO,OAAA,CAAAU,aAAA,CAACd,uBAAA,CAAAI,OAAsB;IACnBW,GAAG,EAAE,YAAYT,QAAQ,CAACU,EAAE,IAAI,EAAE,EAAG;IACrCV,QAAQ,EAAEA,QAAS;IACnBE,KAAK,EAAEA,KAAM;IACbS,gBAAgB,EAAER;EAAQ,CAC7B,CACJ;EAEL,oBACIZ,OAAA,CAAAO,OAAA,CAAAU,aAAA,CAACf,kBAAA,CAAAmB,uBAAuB,qBACpBrB,OAAA,CAAAO,OAAA,CAAAU,aAAA,CAACf,kBAAA,CAAAoB,mCAAmC;IAACV,OAAO,EAAEA,CAAA,KAAMF,gBAAgB,CAACD,QAAQ,CAACU,EAAE;EAAE,gBAC9EnB,OAAA,CAAAO,OAAA,CAAAU,aAAA,CAACpB,KAAA,CAAA0B,IAAI;IAACC,IAAI,EAAE,EAAG;IAACC,KAAK,EAAE,CAAC,UAAU;EAAE,CAAE,CACL,CAAC,eACtCzB,OAAA,CAAAO,OAAA,CAAAU,aAAA,CAAClB,MAAA,CAAA2B,eAAe;IAACC,OAAO,EAAE;EAAM,GAAEd,YAA8B,CAC3C,CAAC;AAElC,CAAC;AAEDL,iBAAiB,CAACoB,WAAW,GAAG,mBAAmB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAvB,OAAA,GAErCC,iBAAiB","ignoreList":[]}
+{"version":3,"file":"GalleryEditorItem.js","names":["_core","require","_react","_interopRequireWildcard","_GalleryEditorItem","_GalleryEditorMediaItem","_interopRequireDefault","_GalleryEditorPreviewItem","_GalleryEditor","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","GalleryEditorItem","fileItem","handleDeleteFile","shouldLoadImages","ratio","onClick","shouldRenderPreview","state","shouldRenderMedia","Boolean","previewUrl","uploadedFile","mediaContent","createElement","openSelectedFile","StyledMotionGalleryEditorItem","initial","opacity","scale","animate","exit","transition","duration","GALLERY_EDITOR_ITEM_FADE_DURATION_S","StyledGalleryEditorItemDeleteButton","type","event","stopPropagation","id","$zIndex","GALLERY_EDITOR_DELETE_BUTTON_Z_INDEX","Icon","size","icons","displayName","_default","exports","memo"],"sources":["../../../../../src/components/gallery-editor/gallery-editor-item/GalleryEditorItem.tsx"],"sourcesContent":["import { Icon } from '@chayns-components/core';\nimport React, { FC, ReactNode, memo } from 'react';\nimport {\n    StyledMotionGalleryEditorItem,\n    StyledGalleryEditorItemDeleteButton,\n} from './GalleryEditorItem.styles';\nimport GalleryEditorMediaItem from './gallery-editor-media-item/GalleryEditorMediaItem';\nimport GalleryEditorPreviewItem from './gallery-editor-preview-item/GalleryEditorPreviewItem';\nimport type { GalleryEditorItemProps } from './GalleryEditorItem.types';\nimport {\n    GALLERY_EDITOR_DELETE_BUTTON_Z_INDEX,\n    GALLERY_EDITOR_ITEM_FADE_DURATION_S,\n} from '../GalleryEditor.constants';\n\nconst GalleryEditorItem: FC<GalleryEditorItemProps> = ({\n    fileItem,\n    handleDeleteFile,\n    shouldLoadImages = true,\n    ratio = 1,\n    onClick,\n}) => {\n    const shouldRenderPreview = fileItem.state === 'uploading';\n    const shouldRenderMedia =\n        fileItem.state !== 'none' &&\n        (Boolean(fileItem.previewUrl) || Boolean(fileItem.uploadedFile));\n\n    let mediaContent: ReactNode = null;\n\n    if (shouldRenderPreview) {\n        mediaContent = <GalleryEditorPreviewItem ratio={ratio} fileItem={fileItem} />;\n    } else if (shouldRenderMedia) {\n        mediaContent = (\n            <GalleryEditorMediaItem\n                fileItem={fileItem}\n                ratio={ratio}\n                openSelectedFile={onClick}\n                previewUrl={fileItem.previewUrl}\n                shouldLoadImages={shouldLoadImages}\n            />\n        );\n    }\n\n    return (\n        <StyledMotionGalleryEditorItem\n            initial={{ opacity: 0, scale: 0.98 }}\n            animate={{ opacity: 1, scale: 1 }}\n            exit={{ opacity: 0, scale: 0.98 }}\n            transition={{ duration: GALLERY_EDITOR_ITEM_FADE_DURATION_S }}\n        >\n            {mediaContent}\n            <StyledGalleryEditorItemDeleteButton\n                type=\"button\"\n                onClick={(event) => {\n                    event.stopPropagation();\n                    handleDeleteFile(fileItem.id);\n                }}\n                $zIndex={GALLERY_EDITOR_DELETE_BUTTON_Z_INDEX}\n                aria-label=\"Bild entfernen\"\n            >\n                <Icon size={20} icons={['ts-wrong']} />\n            </StyledGalleryEditorItemDeleteButton>\n        </StyledMotionGalleryEditorItem>\n    );\n};\n\nGalleryEditorItem.displayName = 'GalleryEditorItem';\n\nexport default memo(GalleryEditorItem);\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/gallery-editor/gallery-editor-item/GalleryEditorItem.styles.js

@@ -3,14 +3,16 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.StyledGalleryEditorItemDeleteButton = exports.StyledGalleryEditorItem = void 0;
+exports.StyledMotionGalleryEditorItem = exports.StyledGalleryEditorItemDeleteButton = void 0;
+var _react = require("motion/react");
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const StyledGalleryEditorItem = exports.StyledGalleryEditorItem = _styledComponents.default.div`
+const StyledMotionGalleryEditorItem = exports.StyledMotionGalleryEditorItem = (0, _styledComponents.default)(_react.motion.div)`
     display: flex;
     position: relative;
     height: 100%;
     width: 100%;
+    overflow: hidden;
 `;
 const StyledGalleryEditorItemDeleteButton = exports.StyledGalleryEditorItemDeleteButton = _styledComponents.default.button`
     background-color: rgba(
@@ -27,9 +29,14 @@ const StyledGalleryEditorItemDeleteButton = exports.StyledGalleryEditorItemDelet
     position: absolute;
     top: 0;
     right: 0;
-    z-index: 2;
+    z-index: ${({
+  $zIndex
+}) => $zIndex};
     height: 30px;
     width: 30px;
+    border: 0;
+    padding: 0;
+    cursor: pointer;
     display: flex;
     justify-content: center;
     align-items: center;

package/lib/cjs/components/gallery-editor/gallery-editor-item/GalleryEditorItem.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryEditorItem.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledGalleryEditorItem","exports","styled","div","StyledGalleryEditorItemDeleteButton","button","theme"],"sources":["../../../../../src/components/gallery-editor/gallery-editor-item/GalleryEditorItem.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport styled from 'styled-components';\n\nexport const StyledGalleryEditorItem = styled.div`\n    display: flex;\n    position: relative;\n    height: 100%;\n    width: 100%;\n`;\n\ntype StyledGalleryEditorItemDeleteButtonProps = WithTheme<unknown>;\n\nexport const StyledGalleryEditorItemDeleteButton = styled.button<StyledGalleryEditorItemDeleteButtonProps>`\n    background-color: rgba(\n        ${({ theme }: StyledGalleryEditorItemDeleteButtonProps) => theme['000-rgb']},\n        0.75\n    );\n    box-shadow: 0 0 0 1px\n        rgba(${({ theme }: StyledGalleryEditorItemDeleteButtonProps) => theme['009-rgb']}, 0.08)\n        inset;\n    position: absolute;\n    top: 0;\n    right: 0;\n    z-index: 2;\n    height: 30px;\n    width: 30px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n`;\n"],"mappings":";;;;;;AACA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEhC,MAAMG,uBAAuB,GAAAC,OAAA,CAAAD,uBAAA,GAAGE,yBAAM,CAACC,GAAG;AACjD;AACA;AACA;AACA;AACA,CAAC;AAIM,MAAMC,mCAAmC,GAAAH,OAAA,CAAAG,mCAAA,GAAGF,yBAAM,CAACG,MAAgD;AAC1G;AACA,UAAU,CAAC;EAAEC;AAAgD,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AACnF;AACA;AACA;AACA,eAAe,CAAC;EAAEA;AAAgD,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AACxF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"file":"GalleryEditorItem.styles.js","names":["_react","require","_styledComponents","_interopRequireDefault","e","__esModule","default","StyledMotionGalleryEditorItem","exports","styled","motion","div","StyledGalleryEditorItemDeleteButton","button","theme","$zIndex"],"sources":["../../../../../src/components/gallery-editor/gallery-editor-item/GalleryEditorItem.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport { motion } from 'motion/react';\nimport styled from 'styled-components';\n\nexport const StyledMotionGalleryEditorItem = styled(motion.div)`\n    display: flex;\n    position: relative;\n    height: 100%;\n    width: 100%;\n    overflow: hidden;\n`;\n\ntype StyledGalleryEditorItemDeleteButtonProps = WithTheme<unknown>;\n\nexport const StyledGalleryEditorItemDeleteButton = styled.button<\n    StyledGalleryEditorItemDeleteButtonProps & {\n        $zIndex: number;\n    }\n>`\n    background-color: rgba(\n        ${({ theme }: StyledGalleryEditorItemDeleteButtonProps) => theme['000-rgb']},\n        0.75\n    );\n    box-shadow: 0 0 0 1px\n        rgba(${({ theme }: StyledGalleryEditorItemDeleteButtonProps) => theme['009-rgb']}, 0.08)\n        inset;\n    position: absolute;\n    top: 0;\n    right: 0;\n    z-index: ${({ $zIndex }) => $zIndex};\n    height: 30px;\n    width: 30px;\n    border: 0;\n    padding: 0;\n    cursor: pointer;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n`;\n"],"mappings":";;;;;;AACA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AAAuC,SAAAE,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEhC,MAAMG,6BAA6B,GAAAC,OAAA,CAAAD,6BAAA,GAAG,IAAAE,yBAAM,EAACC,aAAM,CAACC,GAAG,CAAC;AAC/D;AACA;AACA;AACA;AACA;AACA,CAAC;AAIM,MAAMC,mCAAmC,GAAAJ,OAAA,CAAAI,mCAAA,GAAGH,yBAAM,CAACI,MAIzD;AACD;AACA,UAAU,CAAC;EAAEC;AAAgD,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AACnF;AACA;AACA;AACA,eAAe,CAAC;EAAEA;AAAgD,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AACxF;AACA;AACA;AACA;AACA,eAAe,CAAC;EAAEC;AAAQ,CAAC,KAAKA,OAAO;AACvC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/lib/cjs/components/gallery-editor/gallery-editor-item/GalleryEditorItem.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryEditorItem.types.js","names":[],"sources":["../../../../../src/components/gallery-editor/gallery-editor-item/GalleryEditorItem.types.ts"],"sourcesContent":["import type { InternalFileItem } from '@chayns-components/core';\n\n/**\n * Props for a single editable gallery tile.\n */\nexport interface GalleryEditorItemProps {\n    /**\n     * Provides the media item that should be rendered inside the tile.\n     * @description\n     * The item may represent a pending local upload or an already uploaded media file managed by the editor.\n     * @example\n     * <GalleryEditorItem fileItem={fileItem} handleDeleteFile={handleDeleteFile} onClick={handleOpen} />\n     */\n    fileItem: InternalFileItem;\n    /**\n     * Is called when the delete button is clicked in edit mode.\n     * @description\n     * The callback receives the internal item identifier so the editor can remove the item from its local state.\n     * @example\n     * <GalleryEditorItem handleDeleteFile={(id) => console.log(id)} fileItem={fileItem} onClick={handleOpen} />\n     */\n    handleDeleteFile: (id?: string) => void;\n    /**\n     * Defines the aspect ratio that should be reserved for the rendered media.\n     * @description\n     * Use this when the editor item should reserve a fixed tile ratio for uploaded previews.\n     * @default 1\n     * @example\n     * <GalleryEditorItem fileItem={fileItem} handleDeleteFile={handleDeleteFile} onClick={handleOpen} ratio={1.5} />\n     * @optional\n     */\n    ratio?: number;\n    /**\n     * Is called when the tile is clicked.\n     * @description\n     * The editor uses this callback to open the currently selected media within the slideshow flow.\n     * @example\n     * <GalleryEditorItem fileItem={fileItem} handleDeleteFile={handleDeleteFile} onClick={handleOpen} />\n     */\n    onClick: (file: InternalFileItem) => void;\n}\n"],"mappings":"","ignoreList":[]}
+{"version":3,"file":"GalleryEditorItem.types.js","names":[],"sources":["../../../../../src/components/gallery-editor/gallery-editor-item/GalleryEditorItem.types.ts"],"sourcesContent":["import type { InternalFileItem } from '@chayns-components/core';\n\n/**\n * Props for a single editable gallery tile.\n */\nexport interface GalleryEditorItemProps {\n    /**\n     * Provides the media item that should be rendered inside the tile.\n     * @description\n     * The item may represent a pending local upload or an already uploaded media file managed by the editor.\n     * @example\n     * <GalleryEditorItem fileItem={fileItem} handleDeleteFile={handleDeleteFile} onClick={handleOpen} />\n     */\n    fileItem: InternalFileItem;\n    /**\n     * Controls whether the item may load the final media source immediately.\n     * @description\n     * The item forwards this flag to the shared media renderer so uploaded media can stay on the preview until loading is allowed.\n     * @default true\n     * @optional\n     */\n    shouldLoadImages?: boolean;\n    /**\n     * Is called when the delete button is clicked in edit mode.\n     * @description\n     * The callback receives the internal item identifier so the editor can remove the item from its local state.\n     * @example\n     * <GalleryEditorItem handleDeleteFile={(id) => console.log(id)} fileItem={fileItem} onClick={handleOpen} />\n     */\n    handleDeleteFile: (id?: string) => void;\n    /**\n     * Defines the aspect ratio that should be reserved for the rendered media.\n     * @description\n     * Use this when the editor item should reserve a fixed tile ratio for uploaded previews.\n     * @default 1\n     * @example\n     * <GalleryEditorItem fileItem={fileItem} handleDeleteFile={handleDeleteFile} onClick={handleOpen} ratio={1.5} />\n     * @optional\n     */\n    ratio?: number;\n    /**\n     * Is called when the tile is clicked.\n     * @description\n     * The editor uses this callback to open the currently selected media within the slideshow flow.\n     * @example\n     * <GalleryEditorItem fileItem={fileItem} handleDeleteFile={handleDeleteFile} onClick={handleOpen} />\n     */\n    onClick: (file: InternalFileItem) => void;\n}\n"],"mappings":"","ignoreList":[]}

package/lib/cjs/components/gallery-editor/gallery-editor-item/gallery-editor-media-item/GalleryEditorMediaItem.js

@@ -4,13 +4,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _MediaContent = _interopRequireDefault(require("../../../media-content/MediaContent"));
 var _GalleryEditorMediaItem = require("./GalleryEditorMediaItem.styles");
+var _GalleryEditor = require("../../GalleryEditor.constants");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const GalleryEditorMediaItem = ({
   fileItem,
   openSelectedFile,
+  previewUrl,
+  shouldLoadImages = true,
   ratio
 }) => /*#__PURE__*/_react.default.createElement(_GalleryEditorMediaItem.StyledMotionGalleryEditorMediaItem, {
   animate: {
@@ -23,14 +27,16 @@ const GalleryEditorMediaItem = ({
     opacity: 0
   },
   transition: {
-    duration: 3.2
+    duration: _GalleryEditor.GALLERY_EDITOR_MEDIA_FADE_DURATION_S
   }
 }, fileItem.uploadedFile && /*#__PURE__*/_react.default.createElement(_MediaContent.default, {
   file: fileItem.uploadedFile,
   onClick: () => openSelectedFile(fileItem),
   playIconSize: 30,
-  ratio: ratio
+  previewUrl: previewUrl,
+  ratio: ratio,
+  shouldLoadImages: shouldLoadImages
 }));
 GalleryEditorMediaItem.displayName = 'GalleryEditorMediaItem';
-var _default = exports.default = GalleryEditorMediaItem;
+var _default = exports.default = /*#__PURE__*/(0, _react.memo)(GalleryEditorMediaItem);
 //# sourceMappingURL=GalleryEditorMediaItem.js.map

package/lib/cjs/components/gallery-editor/gallery-editor-item/gallery-editor-media-item/GalleryEditorMediaItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryEditorMediaItem.js","names":["_react","_interopRequireDefault","require","_MediaContent","_GalleryEditorMediaItem","e","__esModule","default","GalleryEditorMediaItem","fileItem","openSelectedFile","ratio","createElement","StyledMotionGalleryEditorMediaItem","animate","opacity","initial","exit","transition","duration","uploadedFile","file","onClick","playIconSize","displayName","_default","exports"],"sources":["../../../../../../src/components/gallery-editor/gallery-editor-item/gallery-editor-media-item/GalleryEditorMediaItem.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport MediaContent from '../../../media-content/MediaContent';\nimport { StyledMotionGalleryEditorMediaItem } from './GalleryEditorMediaItem.styles';\nimport type { GalleryEditorMediaItemProps } from './GalleryEditorMediaItem.types';\n\nconst GalleryEditorMediaItem: FC<GalleryEditorMediaItemProps> = ({\n    fileItem,\n    openSelectedFile,\n    ratio,\n}) => (\n    <StyledMotionGalleryEditorMediaItem\n        animate={{ opacity: 1 }}\n        initial={{ opacity: 0 }}\n        exit={{ opacity: 0 }}\n        transition={{ duration: 3.2 }}\n    >\n        {fileItem.uploadedFile && (\n            <MediaContent\n                file={fileItem.uploadedFile}\n                onClick={() => openSelectedFile(fileItem)}\n                playIconSize={30}\n                ratio={ratio}\n            />\n        )}\n    </StyledMotionGalleryEditorMediaItem>\n);\n\nGalleryEditorMediaItem.displayName = 'GalleryEditorMediaItem';\n\nexport default GalleryEditorMediaItem;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,uBAAA,GAAAF,OAAA;AAAqF,SAAAD,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAGrF,MAAMG,sBAAuD,GAAGA,CAAC;EAC7DC,QAAQ;EACRC,gBAAgB;EAChBC;AACJ,CAAC,kBACGX,MAAA,CAAAO,OAAA,CAAAK,aAAA,CAACR,uBAAA,CAAAS,kCAAkC;EAC/BC,OAAO,EAAE;IAAEC,OAAO,EAAE;EAAE,CAAE;EACxBC,OAAO,EAAE;IAAED,OAAO,EAAE;EAAE,CAAE;EACxBE,IAAI,EAAE;IAAEF,OAAO,EAAE;EAAE,CAAE;EACrBG,UAAU,EAAE;IAAEC,QAAQ,EAAE;EAAI;AAAE,GAE7BV,QAAQ,CAACW,YAAY,iBAClBpB,MAAA,CAAAO,OAAA,CAAAK,aAAA,CAACT,aAAA,CAAAI,OAAY;EACTc,IAAI,EAAEZ,QAAQ,CAACW,YAAa;EAC5BE,OAAO,EAAEA,CAAA,KAAMZ,gBAAgB,CAACD,QAAQ,CAAE;EAC1Cc,YAAY,EAAE,EAAG;EACjBZ,KAAK,EAAEA;AAAM,CAChB,CAE2B,CACvC;AAEDH,sBAAsB,CAACgB,WAAW,GAAG,wBAAwB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAnB,OAAA,GAE/CC,sBAAsB","ignoreList":[]}
+{"version":3,"file":"GalleryEditorMediaItem.js","names":["_react","_interopRequireWildcard","require","_MediaContent","_interopRequireDefault","_GalleryEditorMediaItem","_GalleryEditor","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","GalleryEditorMediaItem","fileItem","openSelectedFile","previewUrl","shouldLoadImages","ratio","createElement","StyledMotionGalleryEditorMediaItem","animate","opacity","initial","exit","transition","duration","GALLERY_EDITOR_MEDIA_FADE_DURATION_S","uploadedFile","file","onClick","playIconSize","displayName","_default","exports","memo"],"sources":["../../../../../../src/components/gallery-editor/gallery-editor-item/gallery-editor-media-item/GalleryEditorMediaItem.tsx"],"sourcesContent":["import React, { FC, memo } from 'react';\nimport MediaContent from '../../../media-content/MediaContent';\nimport { StyledMotionGalleryEditorMediaItem } from './GalleryEditorMediaItem.styles';\nimport type { GalleryEditorMediaItemProps } from './GalleryEditorMediaItem.types';\nimport { GALLERY_EDITOR_MEDIA_FADE_DURATION_S } from '../../GalleryEditor.constants';\n\nconst GalleryEditorMediaItem: FC<GalleryEditorMediaItemProps> = ({\n    fileItem,\n    openSelectedFile,\n    previewUrl,\n    shouldLoadImages = true,\n    ratio,\n}) => (\n    <StyledMotionGalleryEditorMediaItem\n        animate={{ opacity: 1 }}\n        initial={{ opacity: 0 }}\n        exit={{ opacity: 0 }}\n        transition={{ duration: GALLERY_EDITOR_MEDIA_FADE_DURATION_S }}\n    >\n        {fileItem.uploadedFile && (\n            <MediaContent\n                file={fileItem.uploadedFile}\n                onClick={() => openSelectedFile(fileItem)}\n                playIconSize={30}\n                previewUrl={previewUrl}\n                ratio={ratio}\n                shouldLoadImages={shouldLoadImages}\n            />\n        )}\n    </StyledMotionGalleryEditorMediaItem>\n);\n\nGalleryEditorMediaItem.displayName = 'GalleryEditorMediaItem';\n\nexport default memo(GalleryEditorMediaItem);\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,uBAAA,GAAAH,OAAA;AAEA,IAAAI,cAAA,GAAAJ,OAAA;AAAqF,SAAAE,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAN,wBAAAM,CAAA,EAAAG,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAV,uBAAA,YAAAA,CAAAM,CAAA,EAAAG,CAAA,SAAAA,CAAA,IAAAH,CAAA,IAAAA,CAAA,CAAAC,UAAA,SAAAD,CAAA,MAAAO,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAR,OAAA,EAAAF,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAS,CAAA,MAAAF,CAAA,GAAAJ,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAE,CAAA,CAAAI,GAAA,CAAAX,CAAA,UAAAO,CAAA,CAAAK,GAAA,CAAAZ,CAAA,GAAAO,CAAA,CAAAM,GAAA,CAAAb,CAAA,EAAAS,CAAA,gBAAAN,CAAA,IAAAH,CAAA,gBAAAG,CAAA,OAAAW,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAG,CAAA,OAAAK,CAAA,IAAAD,CAAA,GAAAS,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAG,CAAA,OAAAK,CAAA,CAAAI,GAAA,IAAAJ,CAAA,CAAAK,GAAA,IAAAN,CAAA,CAAAE,CAAA,EAAAN,CAAA,EAAAK,CAAA,IAAAC,CAAA,CAAAN,CAAA,IAAAH,CAAA,CAAAG,CAAA,WAAAM,CAAA,KAAAT,CAAA,EAAAG,CAAA;AAErF,MAAMgB,sBAAuD,GAAGA,CAAC;EAC7DC,QAAQ;EACRC,gBAAgB;EAChBC,UAAU;EACVC,gBAAgB,GAAG,IAAI;EACvBC;AACJ,CAAC,kBACG/B,MAAA,CAAAS,OAAA,CAAAuB,aAAA,CAAC3B,uBAAA,CAAA4B,kCAAkC;EAC/BC,OAAO,EAAE;IAAEC,OAAO,EAAE;EAAE,CAAE;EACxBC,OAAO,EAAE;IAAED,OAAO,EAAE;EAAE,CAAE;EACxBE,IAAI,EAAE;IAAEF,OAAO,EAAE;EAAE,CAAE;EACrBG,UAAU,EAAE;IAAEC,QAAQ,EAAEC;EAAqC;AAAE,GAE9Db,QAAQ,CAACc,YAAY,iBAClBzC,MAAA,CAAAS,OAAA,CAAAuB,aAAA,CAAC7B,aAAA,CAAAM,OAAY;EACTiC,IAAI,EAAEf,QAAQ,CAACc,YAAa;EAC5BE,OAAO,EAAEA,CAAA,KAAMf,gBAAgB,CAACD,QAAQ,CAAE;EAC1CiB,YAAY,EAAE,EAAG;EACjBf,UAAU,EAAEA,UAAW;EACvBE,KAAK,EAAEA,KAAM;EACbD,gBAAgB,EAAEA;AAAiB,CACtC,CAE2B,CACvC;AAEDJ,sBAAsB,CAACmB,WAAW,GAAG,wBAAwB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAtC,OAAA,gBAE/C,IAAAuC,WAAI,EAACtB,sBAAsB,CAAC","ignoreList":[]}

package/lib/cjs/components/gallery-editor/gallery-editor-item/gallery-editor-media-item/GalleryEditorMediaItem.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryEditorMediaItem.types.js","names":[],"sources":["../../../../../../src/components/gallery-editor/gallery-editor-item/gallery-editor-media-item/GalleryEditorMediaItem.types.ts"],"sourcesContent":["import type { InternalFileItem } from '@chayns-components/core';\n\n/**\n * Props for a rendered uploaded media item.\n */\nexport interface GalleryEditorMediaItemProps {\n    /**\n     * Provides the uploaded media item that should be rendered.\n     * @description\n     * This item is expected to contain an `uploadedFile` because pending uploads are rendered by the preview component instead.\n     * @example\n     * <GalleryEditorMediaItem fileItem={fileItem} onClick={handleOpen} ratio={1} />\n     */\n    fileItem: InternalFileItem;\n    /**\n     * Is called when the media tile is selected.\n     * @description\n     * The editor uses this callback to open the uploaded media in the slideshow flow.\n     * @example\n     * <GalleryEditorMediaItem fileItem={fileItem} openSelectedFile={handleOpen} ratio={1} />\n     */\n    openSelectedFile: (file: InternalFileItem) => void;\n    /**\n     * Defines the aspect ratio that should be reserved for the media.\n     * @description\n     * The media tile keeps this ratio reserved so the editor grid remains visually stable.\n     * @example\n     * <GalleryEditorMediaItem fileItem={fileItem} openSelectedFile={handleOpen} ratio={1.5} />\n     */\n    ratio: number;\n}\n"],"mappings":"","ignoreList":[]}
+{"version":3,"file":"GalleryEditorMediaItem.types.js","names":[],"sources":["../../../../../../src/components/gallery-editor/gallery-editor-item/gallery-editor-media-item/GalleryEditorMediaItem.types.ts"],"sourcesContent":["import type { InternalFileItem } from '@chayns-components/core';\n\n/**\n * Props for a rendered uploaded media item.\n */\nexport interface GalleryEditorMediaItemProps {\n    /**\n     * Provides the uploaded media item that should be rendered.\n     * @description\n     * This item is expected to contain an `uploadedFile` because pending uploads are rendered by the preview component instead.\n     * @example\n     * <GalleryEditorMediaItem fileItem={fileItem} onClick={handleOpen} ratio={1} />\n     */\n    fileItem: InternalFileItem;\n    /**\n     * Controls whether the media renderer may load the final uploaded source immediately.\n     * @description\n     * When disabled, the shared media renderer keeps showing the preview until the parent gallery allows the final load.\n     * @default true\n     * @optional\n     */\n    shouldLoadImages?: boolean;\n    /**\n     * Is called when the media tile is selected.\n     * @description\n     * The editor uses this callback to open the uploaded media in the slideshow flow.\n     * @example\n     * <GalleryEditorMediaItem fileItem={fileItem} openSelectedFile={handleOpen} ratio={1} />\n     */\n    openSelectedFile: (file: InternalFileItem) => void;\n    /**\n     * Defines the aspect ratio that should be reserved for the media.\n     * @description\n     * The media tile keeps this ratio reserved so the editor grid remains visually stable.\n     * @example\n     * <GalleryEditorMediaItem fileItem={fileItem} openSelectedFile={handleOpen} ratio={1.5} />\n     */\n    ratio: number;\n    /**\n     * Provides an optional preview source that can be shown before the final uploaded media loads.\n     * @description\n     * This is typically the local base64 preview generated while the file is still being uploaded.\n     * @optional\n     */\n    previewUrl?: string;\n}\n"],"mappings":"","ignoreList":[]}

package/lib/cjs/components/gallery-editor/gallery-editor-item/gallery-editor-preview-item/GalleryEditorPreviewItem.js

@@ -5,9 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _core = require("@chayns-components/core");
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _GalleryEditorPreviewItem = require("./GalleryEditorPreviewItem.styles");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _GalleryEditor = require("../../GalleryEditor.constants");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const GalleryEditorPreviewItem = ({
   fileItem,
   ratio
@@ -19,14 +20,10 @@ const GalleryEditorPreviewItem = ({
     opacity: 0
   },
   exit: {
-    opacity: 0,
-    transition: {
-      duration: 3.2,
-      delay: 3.2
-    }
+    opacity: 0
   },
   transition: {
-    duration: 3.2
+    duration: _GalleryEditor.GALLERY_EDITOR_PREVIEW_FADE_DURATION_S
   },
   style: {
     position: 'absolute'
@@ -36,10 +33,10 @@ const GalleryEditorPreviewItem = ({
 }, /*#__PURE__*/_react.default.createElement(_GalleryEditorPreviewItem.StyledGalleryEditorPreviewItemLoadingIcon, null, /*#__PURE__*/_react.default.createElement(_core.SmallWaitCursor, {
   shouldHideWaitCursor: false,
   shouldHideBackground: true
-})), /*#__PURE__*/_react.default.createElement(_GalleryEditorPreviewItem.StyledGalleryEditorPreviewItemImage, {
+})), fileItem.previewUrl && /*#__PURE__*/_react.default.createElement(_GalleryEditorPreviewItem.StyledGalleryEditorPreviewItemImage, {
   draggable: false,
   src: fileItem.previewUrl
 })));
 GalleryEditorPreviewItem.displayName = 'GalleryEditorPreviewItem';
-var _default = exports.default = GalleryEditorPreviewItem;
+var _default = exports.default = /*#__PURE__*/(0, _react.memo)(GalleryEditorPreviewItem);
 //# sourceMappingURL=GalleryEditorPreviewItem.js.map

package/lib/cjs/components/gallery-editor/gallery-editor-item/gallery-editor-preview-item/GalleryEditorPreviewItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryEditorPreviewItem.js","names":["_core","require","_react","_interopRequireDefault","_GalleryEditorPreviewItem","e","__esModule","default","GalleryEditorPreviewItem","fileItem","ratio","createElement","StyledMotionGalleryEditorPreviewItem","animate","opacity","initial","exit","transition","duration","delay","style","position","StyledGalleryEditorPreviewItemImageWrapper","$ratio","StyledGalleryEditorPreviewItemLoadingIcon","SmallWaitCursor","shouldHideWaitCursor","shouldHideBackground","StyledGalleryEditorPreviewItemImage","draggable","src","previewUrl","displayName","_default","exports"],"sources":["../../../../../../src/components/gallery-editor/gallery-editor-item/gallery-editor-preview-item/GalleryEditorPreviewItem.tsx"],"sourcesContent":["import { SmallWaitCursor } from '@chayns-components/core';\nimport React, { FC } from 'react';\nimport {\n    StyledGalleryEditorPreviewItemImage,\n    StyledGalleryEditorPreviewItemImageWrapper,\n    StyledGalleryEditorPreviewItemLoadingIcon,\n    StyledMotionGalleryEditorPreviewItem,\n} from './GalleryEditorPreviewItem.styles';\nimport type { GalleryEditorPreviewItemProps } from './GalleryEditorPreviewItem.types';\n\nconst GalleryEditorPreviewItem: FC<GalleryEditorPreviewItemProps> = ({ fileItem, ratio }) => (\n    <StyledMotionGalleryEditorPreviewItem\n        animate={{ opacity: 1 }}\n        initial={{ opacity: 0 }}\n        exit={{\n            opacity: 0,\n            transition: { duration: 3.2, delay: 3.2 },\n        }}\n        transition={{ duration: 3.2 }}\n        style={{ position: 'absolute' }}\n    >\n        <StyledGalleryEditorPreviewItemImageWrapper $ratio={ratio}>\n            <StyledGalleryEditorPreviewItemLoadingIcon>\n                <SmallWaitCursor shouldHideWaitCursor={false} shouldHideBackground />\n            </StyledGalleryEditorPreviewItemLoadingIcon>\n            <StyledGalleryEditorPreviewItemImage draggable={false} src={fileItem.previewUrl} />\n        </StyledGalleryEditorPreviewItemImageWrapper>\n    </StyledMotionGalleryEditorPreviewItem>\n);\n\nGalleryEditorPreviewItem.displayName = 'GalleryEditorPreviewItem';\n\nexport default GalleryEditorPreviewItem;\n"],"mappings":";;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,yBAAA,GAAAH,OAAA;AAK2C,SAAAE,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAG3C,MAAMG,wBAA2D,GAAGA,CAAC;EAAEC,QAAQ;EAAEC;AAAM,CAAC,kBACpFR,MAAA,CAAAK,OAAA,CAAAI,aAAA,CAACP,yBAAA,CAAAQ,oCAAoC;EACjCC,OAAO,EAAE;IAAEC,OAAO,EAAE;EAAE,CAAE;EACxBC,OAAO,EAAE;IAAED,OAAO,EAAE;EAAE,CAAE;EACxBE,IAAI,EAAE;IACFF,OAAO,EAAE,CAAC;IACVG,UAAU,EAAE;MAAEC,QAAQ,EAAE,GAAG;MAAEC,KAAK,EAAE;IAAI;EAC5C,CAAE;EACFF,UAAU,EAAE;IAAEC,QAAQ,EAAE;EAAI,CAAE;EAC9BE,KAAK,EAAE;IAAEC,QAAQ,EAAE;EAAW;AAAE,gBAEhCnB,MAAA,CAAAK,OAAA,CAAAI,aAAA,CAACP,yBAAA,CAAAkB,0CAA0C;EAACC,MAAM,EAAEb;AAAM,gBACtDR,MAAA,CAAAK,OAAA,CAAAI,aAAA,CAACP,yBAAA,CAAAoB,yCAAyC,qBACtCtB,MAAA,CAAAK,OAAA,CAAAI,aAAA,CAACX,KAAA,CAAAyB,eAAe;EAACC,oBAAoB,EAAE,KAAM;EAACC,oBAAoB;AAAA,CAAE,CAC7B,CAAC,eAC5CzB,MAAA,CAAAK,OAAA,CAAAI,aAAA,CAACP,yBAAA,CAAAwB,mCAAmC;EAACC,SAAS,EAAE,KAAM;EAACC,GAAG,EAAErB,QAAQ,CAACsB;AAAW,CAAE,CAC1C,CACV,CACzC;AAEDvB,wBAAwB,CAACwB,WAAW,GAAG,0BAA0B;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA3B,OAAA,GAEnDC,wBAAwB","ignoreList":[]}
+{"version":3,"file":"GalleryEditorPreviewItem.js","names":["_core","require","_react","_interopRequireWildcard","_GalleryEditorPreviewItem","_GalleryEditor","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","GalleryEditorPreviewItem","fileItem","ratio","createElement","StyledMotionGalleryEditorPreviewItem","animate","opacity","initial","exit","transition","duration","GALLERY_EDITOR_PREVIEW_FADE_DURATION_S","style","position","StyledGalleryEditorPreviewItemImageWrapper","$ratio","StyledGalleryEditorPreviewItemLoadingIcon","SmallWaitCursor","shouldHideWaitCursor","shouldHideBackground","previewUrl","StyledGalleryEditorPreviewItemImage","draggable","src","displayName","_default","exports","memo"],"sources":["../../../../../../src/components/gallery-editor/gallery-editor-item/gallery-editor-preview-item/GalleryEditorPreviewItem.tsx"],"sourcesContent":["import { SmallWaitCursor } from '@chayns-components/core';\nimport React, { FC, memo } from 'react';\nimport {\n    StyledGalleryEditorPreviewItemImage,\n    StyledGalleryEditorPreviewItemImageWrapper,\n    StyledGalleryEditorPreviewItemLoadingIcon,\n    StyledMotionGalleryEditorPreviewItem,\n} from './GalleryEditorPreviewItem.styles';\nimport type { GalleryEditorPreviewItemProps } from './GalleryEditorPreviewItem.types';\nimport { GALLERY_EDITOR_PREVIEW_FADE_DURATION_S } from '../../GalleryEditor.constants';\n\nconst GalleryEditorPreviewItem: FC<GalleryEditorPreviewItemProps> = ({ fileItem, ratio }) => (\n    <StyledMotionGalleryEditorPreviewItem\n        animate={{ opacity: 1 }}\n        initial={{ opacity: 0 }}\n        exit={{ opacity: 0 }}\n        transition={{ duration: GALLERY_EDITOR_PREVIEW_FADE_DURATION_S }}\n        style={{ position: 'absolute' }}\n    >\n        <StyledGalleryEditorPreviewItemImageWrapper $ratio={ratio}>\n            <StyledGalleryEditorPreviewItemLoadingIcon>\n                <SmallWaitCursor shouldHideWaitCursor={false} shouldHideBackground />\n            </StyledGalleryEditorPreviewItemLoadingIcon>\n            {fileItem.previewUrl && (\n                <StyledGalleryEditorPreviewItemImage draggable={false} src={fileItem.previewUrl} />\n            )}\n        </StyledGalleryEditorPreviewItemImageWrapper>\n    </StyledMotionGalleryEditorPreviewItem>\n);\n\nGalleryEditorPreviewItem.displayName = 'GalleryEditorPreviewItem';\n\nexport default memo(GalleryEditorPreviewItem);\n"],"mappings":";;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,yBAAA,GAAAH,OAAA;AAOA,IAAAI,cAAA,GAAAJ,OAAA;AAAuF,SAAAE,wBAAAG,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAL,uBAAA,YAAAA,CAAAG,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAEvF,MAAMkB,wBAA2D,GAAGA,CAAC;EAAEC,QAAQ;EAAEC;AAAM,CAAC,kBACpFzB,MAAA,CAAAc,OAAA,CAAAY,aAAA,CAACxB,yBAAA,CAAAyB,oCAAoC;EACjCC,OAAO,EAAE;IAAEC,OAAO,EAAE;EAAE,CAAE;EACxBC,OAAO,EAAE;IAAED,OAAO,EAAE;EAAE,CAAE;EACxBE,IAAI,EAAE;IAAEF,OAAO,EAAE;EAAE,CAAE;EACrBG,UAAU,EAAE;IAAEC,QAAQ,EAAEC;EAAuC,CAAE;EACjEC,KAAK,EAAE;IAAEC,QAAQ,EAAE;EAAW;AAAE,gBAEhCpC,MAAA,CAAAc,OAAA,CAAAY,aAAA,CAACxB,yBAAA,CAAAmC,0CAA0C;EAACC,MAAM,EAAEb;AAAM,gBACtDzB,MAAA,CAAAc,OAAA,CAAAY,aAAA,CAACxB,yBAAA,CAAAqC,yCAAyC,qBACtCvC,MAAA,CAAAc,OAAA,CAAAY,aAAA,CAAC5B,KAAA,CAAA0C,eAAe;EAACC,oBAAoB,EAAE,KAAM;EAACC,oBAAoB;AAAA,CAAE,CAC7B,CAAC,EAC3ClB,QAAQ,CAACmB,UAAU,iBAChB3C,MAAA,CAAAc,OAAA,CAAAY,aAAA,CAACxB,yBAAA,CAAA0C,mCAAmC;EAACC,SAAS,EAAE,KAAM;EAACC,GAAG,EAAEtB,QAAQ,CAACmB;AAAW,CAAE,CAE9C,CACV,CACzC;AAEDpB,wBAAwB,CAACwB,WAAW,GAAG,0BAA0B;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAnC,OAAA,gBAEnD,IAAAoC,WAAI,EAAC3B,wBAAwB,CAAC","ignoreList":[]}