@lifesg/react-design-system 4.0.0-alpha.1 → 4.0.0-alpha.2

package/fullscreen-image-carousel/fullscreen-image-carousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"fullscreen-image-carousel.js","sources":["../../src/fullscreen-image-carousel/fullscreen-image-carousel.tsx"],"sourcesContent":["import {\n    ChevronLeftIcon,\n    ChevronRightIcon,\n    CrossIcon,\n    MagnifierMinusIcon,\n    MagnifierPlusIcon,\n} from \"@lifesg/react-icons\";\nimport {\n    forwardRef,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    useState,\n} from \"react\";\nimport type {\n    ReactZoomPanPinchContentRef,\n    ReactZoomPanPinchRef,\n} from \"react-zoom-pan-pinch\";\nimport { TransformComponent, TransformWrapper } from \"react-zoom-pan-pinch\";\n\nimport { Modal } from \"../modal\";\nimport { useEventListener } from \"../util\";\nimport {\n    ArrowButton,\n    BoxChip,\n    Chip,\n    CloseButton,\n    ImageGalleryContainer,\n    ImageGallerySlide,\n    ImageGallerySlides,\n    ImageGallerySwipe,\n    ImageGalleryWrapper,\n    MagnifierButton,\n    SlideImage,\n    SlidePlaceholderImage,\n    ThumbnailContainer,\n    ThumbnailImage,\n    ThumbnailItem,\n    ThumbnailItemContainer,\n    ThumbnailWrapper,\n} from \"./fullscreen-image-carousel.style\";\nimport type {\n    FullscreenImageCarouselProps,\n    FullscreenImageCarouselRef,\n    ImageDimension,\n} from \"./types\";\n\nconst Component = (\n    {\n        items,\n        initialActiveItemIndex,\n        hideThumbnail = false,\n        hideNavigation = false,\n        hideCounter = false,\n        hideMagnifier = false,\n        onClose,\n        insets,\n        ...otherProps\n    }: FullscreenImageCarouselProps,\n    ref: React.Ref<FullscreenImageCarouselRef>\n) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const [currentSlide, setCurrentSlide] = useState(\n        initialActiveItemIndex ?? 0\n    );\n    const [imagesDimension, setImageDimension] = useState<\n        Record<string, ImageDimension>\n    >({});\n    const [zoom, setZoom] = useState(1);\n    const [startX, setStartX] = useState<number | undefined>();\n    const [endX, setEndX] = useState<number | undefined>();\n    const containerRef = useRef<HTMLDivElement>(null);\n    const thumbnailRefs = useRef<(HTMLDivElement | null)[]>([]);\n    const zoomRefs = useRef<(ReactZoomPanPinchContentRef | null)[]>([]);\n    const diff = startX && endX ? startX - endX : 0;\n\n    useImperativeHandle<FullscreenImageCarouselRef, FullscreenImageCarouselRef>(\n        ref,\n        () => ({\n            currentItemIndex: currentSlide,\n            setCurrentItem: goToSlide,\n            goToPrevItem: goToPrevSlide,\n            goToNextItem: goToNextSlide,\n        })\n    );\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEventListener(\"keydown\", handleKeyDown, \"document\");\n\n    useEffect(() => {\n        thumbnailRefs.current?.[currentSlide]?.scrollIntoView({\n            behavior: \"smooth\",\n            inline: \"center\",\n        });\n        setZoom(1);\n    }, [currentSlide]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleTouchStart = (e: React.TouchEvent) => {\n        if (zoom <= 1) setStartX(e.touches[0].clientX);\n    };\n\n    const handleTouchMove = (e: React.TouchEvent) => {\n        if (!startX || zoom > 1) return;\n        setEndX(e.touches[0].clientX);\n    };\n\n    const handleTouchEnd = () => {\n        if (!containerRef.current) return;\n        if (Math.abs(diff) > containerRef.current.offsetWidth / 3) {\n            if (diff > 0) {\n                goToNextSlide();\n            } else {\n                goToPrevSlide();\n            }\n        }\n        setStartX(undefined);\n        setEndX(undefined);\n    };\n\n    const handleZoom = (e: ReactZoomPanPinchRef) => {\n        setZoom(e.state.scale);\n    };\n\n    function handleKeyDown(e: KeyboardEvent) {\n        if (e.key === \"ArrowRight\") {\n            goToNextSlide();\n        } else if (e.key === \"ArrowLeft\") {\n            goToPrevSlide();\n        } else if (e.key === \"Escape\") {\n            onClose?.();\n        }\n    }\n\n    const handleMagnifier = () => {\n        if (zoom === 1) {\n            const zoomRatio = getZoomRatio();\n            zoomRefs.current?.[currentSlide]?.centerView(zoomRatio);\n            setZoom(zoomRatio ?? 1);\n        } else {\n            setZoom(1);\n            zoomRefs.current?.[currentSlide]?.resetTransform();\n        }\n    };\n\n    const setDimension = ({\n        src,\n        height,\n        width,\n    }: {\n        src: string;\n        height: number;\n        width: number;\n    }) => {\n        setImageDimension((oldState) => {\n            return { ...oldState, [src]: { height, width } };\n        });\n    };\n\n    const getZoomRatio = () => {\n        const imageDimension = imagesDimension[items[currentSlide].src];\n\n        if (containerRef.current && !!imageDimension) {\n            const { clientHeight, clientWidth } = containerRef.current;\n            const { width, height } = imageDimension;\n            const isSmallImg = width < clientWidth && height < clientHeight;\n\n            const isImgLandscapeRelativeToDevice =\n                height / width < clientHeight / clientWidth;\n\n            if (isSmallImg) {\n                return isImgLandscapeRelativeToDevice\n                    ? clientWidth / width\n                    : clientHeight / height;\n            }\n\n            return isImgLandscapeRelativeToDevice\n                ? clientHeight / (height / (width / clientWidth))\n                : clientWidth / (width / (height / clientHeight));\n        }\n    };\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const goToPrevSlide = () => {\n        zoomRefs.current?.[currentSlide]?.resetTransform();\n        setCurrentSlide((prev) => (prev === 0 ? items.length - 1 : prev - 1));\n    };\n\n    const goToNextSlide = () => {\n        zoomRefs.current?.[currentSlide]?.resetTransform();\n        setCurrentSlide((prev) => (prev === items.length - 1 ? 0 : prev + 1));\n    };\n\n    const goToSlide = (index: number) => {\n        zoomRefs.current?.[currentSlide]?.resetTransform();\n        setCurrentSlide(index);\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderSlides = () => {\n        return (\n            <ImageGallerySlides\n                style={{\n                    transform: `translateX(calc(${\n                        -currentSlide * 100\n                    }% - ${diff}px))`,\n                }}\n            >\n                {items.map((item, index) => {\n                    return (\n                        <ImageGallerySlide key={index} data-testid=\"slide-item\">\n                            <TransformWrapper\n                                ref={(el) => (zoomRefs.current[index] = el)}\n                                panning={{\n                                    disabled: zoom <= 1,\n                                }}\n                                initialScale={1}\n                                onZoom={handleZoom}\n                                onZoomStop={handleZoom}\n                                onWheel={handleZoom}\n                            >\n                                <TransformComponent>\n                                    <SlideImage\n                                        src={item.src}\n                                        alt={item.alt ?? `Image ${index + 1}`}\n                                        placeholder={<SlidePlaceholderImage />}\n                                        fit=\"scale-down\"\n                                        retrieveImageDimension\n                                        setDimension={setDimension}\n                                    />\n                                </TransformComponent>\n                            </TransformWrapper>\n                        </ImageGallerySlide>\n                    );\n                })}\n            </ImageGallerySlides>\n        );\n    };\n\n    const renderThumbnails = () => {\n        return (\n            <ThumbnailContainer $insetBottom={insets?.bottom}>\n                <ThumbnailWrapper>\n                    {items.map((item, index) => {\n                        const src = item.thumbnailSrc ?? item.src;\n                        return (\n                            <ThumbnailItemContainer key={index}>\n                                <ThumbnailItem\n                                    data-testid=\"thumbnail-item\"\n                                    $active={index === currentSlide}\n                                    onClick={() => goToSlide(index)}\n                                    ref={(el) =>\n                                        (thumbnailRefs.current[index] = el)\n                                    }\n                                >\n                                    <ThumbnailImage\n                                        src={src}\n                                        alt={`Thumbnail ${index + 1}`}\n                                        fit=\"cover\"\n                                    />\n                                </ThumbnailItem>\n                            </ThumbnailItemContainer>\n                        );\n                    })}\n                </ThumbnailWrapper>\n            </ThumbnailContainer>\n        );\n    };\n\n    return (\n        <Modal {...otherProps} data-testid=\"image-carousel-modal\">\n            <CloseButton\n                aria-label=\"Close image carousel\"\n                onClick={onClose}\n                focusHighlight={false}\n                $insetTop={insets?.top}\n                $insetRight={insets?.right}\n            >\n                <CrossIcon aria-hidden />\n            </CloseButton>\n            {!hideMagnifier && (\n                <MagnifierButton\n                    aria-label={zoom === 1 ? \"Zoom in\" : \"Zoom out\"}\n                    onClick={handleMagnifier}\n                    focusHighlight={false}\n                    $insetTop={insets?.top}\n                    $insetRight={insets?.right}\n                >\n                    {zoom === 1 ? (\n                        <MagnifierPlusIcon aria-hidden />\n                    ) : (\n                        <MagnifierMinusIcon aria-hidden />\n                    )}\n                </MagnifierButton>\n            )}\n            <ImageGalleryContainer>\n                <ImageGalleryWrapper>\n                    {!hideNavigation && (\n                        <>\n                            <ArrowButton\n                                aria-label=\"View previous image\"\n                                data-testid=\"prev-btn\"\n                                $position=\"left\"\n                                onClick={goToPrevSlide}\n                                $insetLeft={insets?.left}\n                                $insetRight={insets?.right}\n                            >\n                                <ChevronLeftIcon aria-hidden />\n                            </ArrowButton>\n                            <ArrowButton\n                                aria-label=\"View next image\"\n                                data-testid=\"forward-btn\"\n                                $position=\"right\"\n                                onClick={goToNextSlide}\n                                $insetLeft={insets?.left}\n                                $insetRight={insets?.right}\n                            >\n                                <ChevronRightIcon aria-hidden />\n                            </ArrowButton>\n                        </>\n                    )}\n                    <ImageGallerySwipe\n                        ref={containerRef}\n                        onTouchStart={handleTouchStart}\n                        onTouchMove={handleTouchMove}\n                        onTouchEnd={handleTouchEnd}\n                    >\n                        {renderSlides()}\n                    </ImageGallerySwipe>\n                    {!hideCounter && (\n                        <BoxChip>\n                            <Chip weight=\"semibold\">{`${currentSlide + 1}/${\n                                items.length\n                            }`}</Chip>\n                        </BoxChip>\n                    )}\n                </ImageGalleryWrapper>\n                {!hideThumbnail && renderThumbnails()}\n            </ImageGalleryContainer>\n        </Modal>\n    );\n};\n\nexport const FullscreenImageCarousel = forwardRef<\n    FullscreenImageCarouselRef,\n    FullscreenImageCarouselProps\n>(Component);\n"],"names":["FullscreenImageCarousel","forwardRef","_a","ref","items","initialActiveItemIndex","hideThumbnail","hideNavigation","hideCounter","hideMagnifier","onClose","insets","otherProps","__rest","currentSlide","setCurrentSlide","useState","imagesDimension","setImageDimension","zoom","setZoom","startX","setStartX","endX","setEndX","containerRef","useRef","thumbnailRefs","zoomRefs","diff","useImperativeHandle","currentItemIndex","setCurrentItem","goToSlide","goToPrevItem","goToPrevSlide","goToNextItem","goToNextSlide","useEventListener","e","key","useEffect","_b","current","scrollIntoView","behavior","inline","handleZoom","state","scale","setDimension","src","height","width","oldState","Object","assign","getZoomRatio","imageDimension","clientHeight","clientWidth","isImgLandscapeRelativeToDevice","resetTransform","prev","length","index","_jsxs","Modal","children","_jsx","CloseButton","onClick","focusHighlight","$insetTop","top","$insetRight","right","CrossIcon","MagnifierButton","zoomRatio","centerView","_d","_c","MagnifierPlusIcon","MagnifierMinusIcon","ImageGalleryContainer","ImageGalleryWrapper","_Fragment","ArrowButton","$position","$insetLeft","left","ChevronLeftIcon","ChevronRightIcon","ImageGallerySwipe","onTouchStart","touches","clientX","onTouchMove","onTouchEnd","Math","abs","offsetWidth","undefined","ImageGallerySlides","style","transform","map","item","ImageGallerySlide","TransformWrapper","el","panning","disabled","initialScale","onZoom","onZoomStop","onWheel","TransformComponent","SlideImage","alt","placeholder","SlidePlaceholderImage","fit","retrieveImageDimension","BoxChip","Chip","weight","ThumbnailContainer","$insetBottom","bottom","ThumbnailWrapper","thumbnailSrc","ThumbnailItemContainer","ThumbnailItem","$active","ThumbnailImage"],"mappings":"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"}
+{"version":3,"file":"fullscreen-image-carousel.js","sources":["../../src/fullscreen-image-carousel/fullscreen-image-carousel.tsx"],"sourcesContent":["import {\n    ChevronLeftIcon,\n    ChevronRightIcon,\n    CrossIcon,\n    MagnifierMinusIcon,\n    MagnifierPlusIcon,\n} from \"@lifesg/react-icons\";\nimport { BinIcon } from \"@lifesg/react-icons/bin\";\nimport { announce, clearAnnouncer } from \"@react-aria/live-announcer\";\nimport {\n    forwardRef,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useMemo,\n    useRef,\n    useState,\n} from \"react\";\nimport type {\n    ReactZoomPanPinchContentRef,\n    ReactZoomPanPinchRef,\n} from \"react-zoom-pan-pinch\";\nimport { TransformComponent, TransformWrapper } from \"react-zoom-pan-pinch\";\n\nimport { ModalV2 } from \"../modal-v2\";\nimport { useStateCallback } from \"../shared/hooks\";\nimport { useEventListener } from \"../util\";\nimport {\n    ArrowButton,\n    BoxChip,\n    CarouselModalContent,\n    Chip,\n    CloseButton,\n    DeleteButton,\n    FileInfoFileName,\n    FileInfoFileSize,\n    FileInfoTextWrapper,\n    FocusableImageRegion,\n    ImageGalleryContainer,\n    ImageGallerySlide,\n    ImageGallerySlides,\n    ImageGallerySwipe,\n    ImageGalleryWrapper,\n    MagnifierButton,\n    SlideImage,\n    SlidePlaceholderImage,\n    ThumbnailContainer,\n    ThumbnailImage,\n    ThumbnailItem,\n    ThumbnailItemContainer,\n    ThumbnailWrapper,\n    TopActionButtons,\n} from \"./fullscreen-image-carousel.style\";\nimport type {\n    FullscreenImageCarouselCustomItemProps,\n    FullscreenImageCarouselItemProps,\n    FullscreenImageCarouselProps,\n    FullscreenImageCarouselRef,\n    ImageDimension,\n} from \"./types\";\n\nconst isCustomItem = (\n    item: FullscreenImageCarouselItemProps | undefined\n): item is FullscreenImageCarouselCustomItemProps =>\n    !!item && item.type === \"custom\";\n\nexport const Component = (\n    {\n        items,\n        initialActiveItemIndex,\n        hideThumbnail = false,\n        hideNavigation = false,\n        hideCounter = false,\n        hideMagnifier = false,\n        onDelete,\n        onClose,\n        insets,\n        show,\n        ...otherProps\n    }: FullscreenImageCarouselProps,\n    ref: React.Ref<FullscreenImageCarouselRef>\n) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const [currentSlide, setCurrentSlide] = useStateCallback(\n        initialActiveItemIndex ?? 0\n    );\n    const [imagesDimension, setImageDimension] = useState<\n        Record<string, ImageDimension>\n    >({});\n    const [zoom, setZoom] = useState(1);\n    const [startX, setStartX] = useState<number | undefined>();\n    const [endX, setEndX] = useState<number | undefined>();\n    const containerRef = useRef<HTMLDivElement>(null);\n    const thumbnailRefs = useRef<(HTMLDivElement | null)[]>([]);\n    const zoomRefs = useRef<(ReactZoomPanPinchContentRef | null)[]>([]);\n    const imageRef = useRef<HTMLDivElement>(null);\n    const diff = startX && endX ? startX - endX : 0;\n    const currentItem = items[currentSlide];\n    const hasAnyItemLabel = items.some(\n        (item) => isCustomItem(item) && !!item.itemLabel?.trim()\n    );\n    const carouselItemNoun = hasAnyItemLabel ? \"item\" : \"image\";\n    const hasFileInfo = useMemo(\n        () =>\n            items.some(\n                (item) => item.fileName?.trim() || item.fileSize?.trim()\n            ),\n        [items]\n    );\n\n    const getItemAriaLabel = useCallback(\n        (index: number) => {\n            const item = items[index];\n            const itemTypeLabel = hasAnyItemLabel ? \"Item\" : \"Image\";\n            const prefix = isCustomItem(item)\n                ? item.itemLabel?.trim() || \"\"\n                : item.alt?.trim() || \"\";\n            const positionLabel = `${itemTypeLabel} ${index + 1} of ${\n                items.length\n            }.`;\n\n            return prefix ? `${prefix}. ${positionLabel}` : positionLabel;\n        },\n        [items, hasAnyItemLabel]\n    );\n\n    useImperativeHandle<FullscreenImageCarouselRef, FullscreenImageCarouselRef>(\n        ref,\n        () => ({\n            currentItemIndex: currentSlide,\n            setCurrentItem: goToSlide,\n            goToPrevItem: goToPrevSlide,\n            goToNextItem: goToNextSlide,\n        })\n    );\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEventListener(\"keydown\", handleKeyDown, \"document\");\n\n    useEffect(() => {\n        if (show) {\n            imageRef.current?.focus();\n        }\n    }, [show]);\n\n    useEffect(() => {\n        if (items.length === 0) {\n            setCurrentSlide(0);\n            return;\n        }\n\n        if (currentSlide > items.length - 1) {\n            setCurrentSlide(items.length - 1);\n        }\n    }, [currentSlide, items.length, setCurrentSlide]);\n\n    useEffect(() => {\n        thumbnailRefs.current?.[currentSlide]?.scrollIntoView({\n            behavior: \"smooth\",\n            inline: \"center\",\n        });\n        setZoom(1);\n    }, [currentSlide]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleTouchStart = (e: React.TouchEvent) => {\n        if (zoom <= 1) setStartX(e.touches[0].clientX);\n    };\n\n    const handleTouchMove = (e: React.TouchEvent) => {\n        if (!startX || zoom > 1) return;\n        setEndX(e.touches[0].clientX);\n    };\n\n    const handleTouchEnd = () => {\n        if (!containerRef.current) return;\n        if (Math.abs(diff) > containerRef.current.offsetWidth / 3) {\n            if (diff > 0) {\n                goToNextSlide();\n            } else {\n                goToPrevSlide();\n            }\n        }\n        setStartX(undefined);\n        setEndX(undefined);\n    };\n\n    const handleZoom = (e: ReactZoomPanPinchRef) => {\n        setZoom(e.state.scale);\n    };\n\n    const handleDelete = () => {\n        if (currentItem && onDelete) {\n            onDelete(currentItem, currentSlide);\n        }\n    };\n\n    function handleKeyDown(e: KeyboardEvent) {\n        if (e.key === \"ArrowRight\") {\n            goToNextSlide();\n        } else if (e.key === \"ArrowLeft\") {\n            goToPrevSlide();\n        } else if (e.key === \"Escape\") {\n            onClose?.();\n        }\n    }\n\n    const handleMagnifier = () => {\n        if (zoom === 1) {\n            const zoomRatio = getZoomRatio();\n            zoomRefs.current?.[currentSlide]?.centerView(zoomRatio);\n            setZoom(zoomRatio ?? 1);\n        } else {\n            setZoom(1);\n            zoomRefs.current?.[currentSlide]?.resetTransform();\n        }\n    };\n\n    const setDimension = ({\n        src,\n        height,\n        width,\n    }: {\n        src: string;\n        height: number;\n        width: number;\n    }) => {\n        setImageDimension((oldState) => {\n            return { ...oldState, [src]: { height, width } };\n        });\n    };\n\n    const getZoomRatio = () => {\n        if (!currentItem || isCustomItem(currentItem)) {\n            return;\n        }\n\n        const imageDimension = imagesDimension[currentItem.src];\n\n        if (containerRef.current && !!imageDimension) {\n            const { clientHeight, clientWidth } = containerRef.current;\n            const { width, height } = imageDimension;\n            const isSmallImg = width < clientWidth && height < clientHeight;\n\n            const isImgLandscapeRelativeToDevice =\n                height / width < clientHeight / clientWidth;\n\n            if (isSmallImg) {\n                return isImgLandscapeRelativeToDevice\n                    ? clientWidth / width\n                    : clientHeight / height;\n            }\n\n            return isImgLandscapeRelativeToDevice\n                ? clientHeight / (height / (width / clientWidth))\n                : clientWidth / (width / (height / clientHeight));\n        }\n    };\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const goToPrevSlide = () => {\n        zoomRefs.current?.[currentSlide]?.resetTransform();\n        setCurrentSlide(\n            (prev) => (prev === 0 ? items.length - 1 : prev - 1),\n            (slide) => {\n                clearAnnouncer(\"polite\");\n                announce(getItemAriaLabel(slide), \"polite\");\n            }\n        );\n    };\n\n    const goToNextSlide = () => {\n        zoomRefs.current?.[currentSlide]?.resetTransform();\n        setCurrentSlide(\n            (prev) => (prev === items.length - 1 ? 0 : prev + 1),\n            (slide) => {\n                clearAnnouncer(\"polite\");\n                announce(getItemAriaLabel(slide), \"polite\");\n            }\n        );\n    };\n\n    const goToSlide = (index: number) => {\n        zoomRefs.current?.[currentSlide]?.resetTransform();\n        setCurrentSlide(index);\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderSlides = () => {\n        return (\n            <ImageGallerySlides\n                style={{\n                    transform: `translateX(calc(${\n                        -currentSlide * 100\n                    }% - ${diff}px))`,\n                }}\n            >\n                {items.map((item, index) => {\n                    const isActive = index === currentSlide;\n                    const isActiveOrAdjacent =\n                        Math.abs(index - currentSlide) <= 1 ||\n                        (currentSlide === 0 && index === items.length - 1) ||\n                        (currentSlide === items.length - 1 && index === 0);\n\n                    return (\n                        <ImageGallerySlide key={index} data-testid=\"slide-item\">\n                            <FocusableImageRegion\n                                ref={isActive ? imageRef : null}\n                                tabIndex={isActive ? 0 : -1}\n                            >\n                                {isCustomItem(item) ? (\n                                    isActiveOrAdjacent ? (\n                                        item.renderContent()\n                                    ) : (\n                                        <SlidePlaceholderImage />\n                                    )\n                                ) : (\n                                    <TransformWrapper\n                                        ref={(el) =>\n                                            (zoomRefs.current[index] = el)\n                                        }\n                                        panning={{\n                                            disabled: zoom <= 1,\n                                        }}\n                                        initialScale={1}\n                                        onZoom={handleZoom}\n                                        onZoomStop={handleZoom}\n                                        onWheel={handleZoom}\n                                    >\n                                        <TransformComponent>\n                                            <SlideImage\n                                                src={item.src}\n                                                alt={getItemAriaLabel(index)}\n                                                placeholder={\n                                                    <SlidePlaceholderImage />\n                                                }\n                                                fit=\"scale-down\"\n                                                retrieveImageDimension\n                                                setDimension={setDimension}\n                                            />\n                                        </TransformComponent>\n                                    </TransformWrapper>\n                                )}\n                            </FocusableImageRegion>\n                        </ImageGallerySlide>\n                    );\n                })}\n            </ImageGallerySlides>\n        );\n    };\n\n    const renderFileInfo = () => {\n        const { fileName, fileSize } = currentItem ?? {};\n        const trimmedName = fileName?.trim();\n        const trimmedSize = fileSize?.trim();\n\n        return (\n            <FileInfoTextWrapper\n                $centerContent={!trimmedSize}\n                aria-live=\"polite\"\n                aria-atomic=\"true\"\n                data-testid=\"file-info-bar\"\n            >\n                {trimmedName && (\n                    <FileInfoFileName\n                        weight=\"semibold\"\n                        data-testid=\"file-info-name\"\n                    >\n                        {trimmedName}\n                    </FileInfoFileName>\n                )}\n                {trimmedSize && (\n                    <FileInfoFileSize data-testid=\"file-info-size\">\n                        {trimmedSize}\n                    </FileInfoFileSize>\n                )}\n            </FileInfoTextWrapper>\n        );\n    };\n\n    const renderThumbnails = () => {\n        return (\n            <ThumbnailContainer\n                $insetBottom={insets?.bottom}\n                aria-hidden=\"true\"\n            >\n                <ThumbnailWrapper>\n                    {items.map((item, index) => {\n                        const src = isCustomItem(item)\n                            ? item.thumbnailSrc\n                            : item.thumbnailSrc ?? item.src;\n                        return (\n                            <ThumbnailItemContainer key={index}>\n                                <ThumbnailItem\n                                    data-testid=\"thumbnail-item\"\n                                    $active={index === currentSlide}\n                                    onClick={() => goToSlide(index)}\n                                    ref={(el) =>\n                                        (thumbnailRefs.current[index] = el)\n                                    }\n                                >\n                                    {src ? (\n                                        <ThumbnailImage\n                                            src={src}\n                                            alt={`Thumbnail ${index + 1}`}\n                                            fit=\"cover\"\n                                        />\n                                    ) : (\n                                        <SlidePlaceholderImage />\n                                    )}\n                                </ThumbnailItem>\n                            </ThumbnailItemContainer>\n                        );\n                    })}\n                </ThumbnailWrapper>\n            </ThumbnailContainer>\n        );\n    };\n\n    return (\n        <ModalV2\n            {...otherProps}\n            data-testid=\"image-carousel-modal\"\n            aria-label={hasAnyItemLabel ? \"Carousel\" : \"Image carousel\"}\n            show={show}\n            disableInitialFocus\n        >\n            <CarouselModalContent>\n                <ImageGalleryContainer>\n                    <ImageGalleryWrapper>\n                        <ImageGallerySwipe\n                            ref={containerRef}\n                            onTouchStart={handleTouchStart}\n                            onTouchMove={handleTouchMove}\n                            onTouchEnd={handleTouchEnd}\n                        >\n                            {renderSlides()}\n                        </ImageGallerySwipe>\n\n                        {!hideNavigation && (\n                            <>\n                                <ArrowButton\n                                    aria-label={`Previous ${carouselItemNoun}`}\n                                    data-testid=\"prev-btn\"\n                                    $position=\"left\"\n                                    onClick={goToPrevSlide}\n                                    $insetLeft={insets?.left}\n                                    $insetRight={insets?.right}\n                                >\n                                    <ChevronLeftIcon aria-hidden />\n                                </ArrowButton>\n                                <ArrowButton\n                                    aria-label={`Next ${carouselItemNoun}`}\n                                    data-testid=\"forward-btn\"\n                                    $position=\"right\"\n                                    onClick={goToNextSlide}\n                                    $insetLeft={insets?.left}\n                                    $insetRight={insets?.right}\n                                >\n                                    <ChevronRightIcon aria-hidden />\n                                </ArrowButton>\n                            </>\n                        )}\n\n                        {!hideCounter && (\n                            <BoxChip aria-hidden=\"true\">\n                                <Chip weight=\"semibold\">{`${currentSlide + 1}/${\n                                    items.length\n                                }`}</Chip>\n                            </BoxChip>\n                        )}\n                    </ImageGalleryWrapper>\n\n                    {!hideThumbnail && renderThumbnails()}\n                </ImageGalleryContainer>\n                <TopActionButtons\n                    $hasFileInfo={hasFileInfo}\n                    $insetTop={insets?.top}\n                    $insetLeft={insets?.left}\n                    $insetRight={insets?.right}\n                >\n                    {hasFileInfo && renderFileInfo()}\n                    {!hideMagnifier && !isCustomItem(currentItem) && (\n                        <MagnifierButton\n                            aria-label={zoom === 1 ? \"Zoom in\" : \"Zoom out\"}\n                            onClick={handleMagnifier}\n                        >\n                            {zoom === 1 ? (\n                                <MagnifierPlusIcon aria-hidden />\n                            ) : (\n                                <MagnifierMinusIcon aria-hidden />\n                            )}\n                        </MagnifierButton>\n                    )}\n\n                    {onDelete && (\n                        <DeleteButton\n                            aria-label={`Delete ${\n                                (isCustomItem(currentItem) &&\n                                    currentItem.itemLabel?.trim()) ||\n                                \"image\"\n                            }`}\n                            data-testid=\"delete-btn\"\n                            onClick={handleDelete}\n                        >\n                            <BinIcon aria-hidden />\n                        </DeleteButton>\n                    )}\n\n                    <CloseButton\n                        aria-label={\n                            hasAnyItemLabel\n                                ? \"Close carousel\"\n                                : \"Close image carousel\"\n                        }\n                        onClick={onClose}\n                    >\n                        <CrossIcon aria-hidden />\n                    </CloseButton>\n                </TopActionButtons>\n            </CarouselModalContent>\n        </ModalV2>\n    );\n};\n\nexport const FullscreenImageCarousel = forwardRef<\n    FullscreenImageCarouselRef,\n    FullscreenImageCarouselProps\n>(Component);\n"],"names":["isCustomItem","item","type","Component","_a","ref","items","initialActiveItemIndex","hideThumbnail","hideNavigation","hideCounter","hideMagnifier","onDelete","onClose","insets","show","otherProps","__rest","currentSlide","setCurrentSlide","useStateCallback","imagesDimension","setImageDimension","useState","zoom","setZoom","startX","setStartX","endX","setEndX","containerRef","useRef","thumbnailRefs","zoomRefs","imageRef","diff","currentItem","hasAnyItemLabel","some","itemLabel","trim","carouselItemNoun","hasFileInfo","useMemo","fileName","fileSize","_b","getItemAriaLabel","useCallback","index","itemTypeLabel","prefix","alt","positionLabel","length","useImperativeHandle","currentItemIndex","setCurrentItem","goToSlide","goToPrevItem","goToPrevSlide","goToNextItem","goToNextSlide","useEventListener","e","key","useEffect","current","focus","scrollIntoView","behavior","inline","handleZoom","state","scale","setDimension","src","height","width","oldState","Object","assign","getZoomRatio","imageDimension","clientHeight","clientWidth","isImgLandscapeRelativeToDevice","resetTransform","prev","slide","clearAnnouncer","announce","_jsx","ModalV2","disableInitialFocus","children","_jsxs","CarouselModalContent","ImageGalleryContainer","ImageGalleryWrapper","ImageGallerySwipe","onTouchStart","touches","clientX","onTouchMove","onTouchEnd","Math","abs","offsetWidth","undefined","ImageGallerySlides","style","transform","map","isActive","isActiveOrAdjacent","ImageGallerySlide","FocusableImageRegion","tabIndex","renderContent","SlidePlaceholderImage","TransformWrapper","el","panning","disabled","initialScale","onZoom","onZoomStop","onWheel","TransformComponent","SlideImage","placeholder","fit","retrieveImageDimension","_Fragment","ArrowButton","$position","onClick","$insetLeft","left","$insetRight","right","ChevronLeftIcon","ChevronRightIcon","BoxChip","Chip","weight","ThumbnailContainer","$insetBottom","bottom","ThumbnailWrapper","thumbnailSrc","ThumbnailItemContainer","ThumbnailItem","$active","ThumbnailImage","TopActionButtons","$hasFileInfo","$insetTop","top","trimmedName","trimmedSize","FileInfoTextWrapper","FileInfoFileName","FileInfoFileSize","renderFileInfo","MagnifierButton","zoomRatio","centerView","_d","_c","MagnifierPlusIcon","MagnifierMinusIcon","DeleteButton","BinIcon","CloseButton","CrossIcon","FullscreenImageCarousel","forwardRef"],"mappings":"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"}

package/fullscreen-image-carousel/fullscreen-image-carousel.style.d.ts

@@ -5,23 +5,112 @@ interface ArrowButtonStyleProps extends InsetStyleProps {
 interface ThumbnailItemStyleProps {
     $active?: boolean;
 }
-export declare const CloseButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>, InsetStyleProps>> & string;
-export declare const MagnifierButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>, InsetStyleProps>> & string;
-export declare const ArrowButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>, ArrowButtonStyleProps>> & string;
-export declare const ImageGalleryContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const ImageGalleryWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const ImageGallerySwipe: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const ImageGallerySlides: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const ImageGallerySlide: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const SlideImage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("./stateful-image").StatefulImageProps, never>> & string & Omit<({ src, className, alt, fit, placeholder, retrieveImageDimension, setDimension, }: import("./stateful-image").StatefulImageProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
-export declare const SlidePlaceholderImage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../shared/image-placeholder").ImagePlaceholderProps, never>> & string & Omit<(props: import("../shared/image-placeholder").ImagePlaceholderProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
-export declare const BoxChip: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const Chip: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").TypographyProps & {
-    ref?: import("react").RefObject<HTMLParagraphElement> | undefined;
-}, never>> & string;
-export declare const ThumbnailContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, InsetStyleProps>> & string;
-export declare const ThumbnailWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const ThumbnailItemContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const ThumbnailItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ThumbnailItemStyleProps>> & string;
-export declare const ThumbnailImage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("./stateful-image").StatefulImageProps, never>> & string & Omit<({ src, className, alt, fit, placeholder, retrieveImageDimension, setDimension, }: import("./stateful-image").StatefulImageProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
+interface TopActionButtonsStyleProps extends InsetStyleProps {
+    $hasFileInfo?: boolean | undefined;
+}
+interface FileInfoTextWrapperStyleProps {
+    $centerContent?: boolean | undefined;
+}
+export declare const TopActionButtons: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof TopActionButtonsStyleProps> & TopActionButtonsStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof TopActionButtonsStyleProps> & TopActionButtonsStyleProps, never>>> & string;
+export declare const CloseButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never> & Partial<Pick<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>> & {
+    as?: import("styled-components").WebTarget | undefined;
+    forwardedAs?: import("styled-components").WebTarget | undefined;
+}, never> & Partial<Pick<import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never> & Partial<Pick<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>> & {
+    as?: import("styled-components").WebTarget | undefined;
+    forwardedAs?: import("styled-components").WebTarget | undefined;
+}, never>>> & string;
+export declare const DeleteButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never> & Partial<Pick<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>> & {
+    as?: import("styled-components").WebTarget | undefined;
+    forwardedAs?: import("styled-components").WebTarget | undefined;
+}, never> & Partial<Pick<import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never> & Partial<Pick<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>> & {
+    as?: import("styled-components").WebTarget | undefined;
+    forwardedAs?: import("styled-components").WebTarget | undefined;
+}, never>>> & string;
+export declare const MagnifierButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never> & Partial<Pick<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>> & {
+    as?: import("styled-components").WebTarget | undefined;
+    forwardedAs?: import("styled-components").WebTarget | undefined;
+}, never> & Partial<Pick<import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never> & Partial<Pick<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>> & {
+    as?: import("styled-components").WebTarget | undefined;
+    forwardedAs?: import("styled-components").WebTarget | undefined;
+}, never>>> & string;
+export declare const ArrowButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never> & Partial<Pick<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>> & {
+    as?: import("styled-components").WebTarget | undefined;
+    forwardedAs?: import("styled-components").WebTarget | undefined;
+}, keyof ArrowButtonStyleProps> & ArrowButtonStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never> & Partial<Pick<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>> & {
+    as?: import("styled-components").WebTarget | undefined;
+    forwardedAs?: import("styled-components").WebTarget | undefined;
+}, keyof ArrowButtonStyleProps> & ArrowButtonStyleProps, never>>> & string;
+export declare const CarouselModalContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const ImageGalleryContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const ImageGalleryWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const ImageGallerySwipe: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const ImageGallerySlides: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const ImageGallerySlide: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const FocusableImageRegion: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const SlideImage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("./stateful-image").StatefulImageProps, never> & Partial<Pick<import("./stateful-image").StatefulImageProps, never>>> & string & Omit<({ src, className, alt, fit, placeholder, retrieveImageDimension, setDimension, }: import("./stateful-image").StatefulImageProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
+export declare const SlidePlaceholderImage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../shared/image-placeholder").ImagePlaceholderProps, never> & Partial<Pick<import("../shared/image-placeholder").ImagePlaceholderProps, never>>> & string & Omit<({ className }: import("../shared/image-placeholder").ImagePlaceholderProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
+export declare const BoxChip: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const Chip: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never> & Partial<Pick<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never>>> & string & Omit<(props: Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const ThumbnailContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof InsetStyleProps> & InsetStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof InsetStyleProps> & InsetStyleProps, never>>> & string;
+export declare const ThumbnailWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const ThumbnailItemContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const ThumbnailItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$active"> & ThumbnailItemStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$active"> & ThumbnailItemStyleProps, never>>> & string;
+export declare const ThumbnailImage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("./stateful-image").StatefulImageProps, never> & Partial<Pick<import("./stateful-image").StatefulImageProps, never>>> & string & Omit<({ src, className, alt, fit, placeholder, retrieveImageDimension, setDimension, }: import("./stateful-image").StatefulImageProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
+export declare const FileInfoTextWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$centerContent"> & FileInfoTextWrapperStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$centerContent"> & FileInfoTextWrapperStyleProps, never>>> & string;
+export declare const FileInfoFileName: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never> & Partial<Pick<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never>>> & string & Omit<(props: Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const FileInfoFileSize: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never> & Partial<Pick<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never>>> & string & Omit<(props: Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
 export {};