@furystack/shades-common-components 11.0.0 → 12.0.0

package/esm/components/image.js

@@ -0,0 +1,348 @@
+import { Shade, createComponent } from '@furystack/shades';
+import { buildTransition, cssVariableTheme } from '../services/css-variable-theme.js';
+import { promisifyAnimation } from '../utils/promisify-animation.js';
+import { Icon } from './icons/icon.js';
+import { close, imageBroken, rotate, search, zoomIn, zoomOut } from './icons/icon-definitions.js';
+const LIGHTBOX_Z_INDEX = '2000';
+const lightboxCleanupMap = new WeakMap();
+const closeLightbox = async (backdrop) => {
+    const storedCleanup = lightboxCleanupMap.get(backdrop);
+    storedCleanup?.();
+    lightboxCleanupMap.delete(backdrop);
+    const panel = backdrop.querySelector('.lightbox-panel');
+    if (panel) {
+        try {
+            await promisifyAnimation(panel, [{ opacity: 1 }, { opacity: 0 }], {
+                duration: 150,
+                easing: 'ease-out',
+                fill: 'forwards',
+            });
+        }
+        catch {
+            // Animation may not be available (e.g. in jsdom)
+        }
+    }
+    backdrop.remove();
+};
+const createLightbox = (src, alt, groupSrcs, initialIndex) => {
+    let zoom = 1;
+    let rotation = 0;
+    let currentIndex = initialIndex ?? 0;
+    const getCurrentSrc = () => (groupSrcs ? groupSrcs[currentIndex].src : src);
+    const getCurrentAlt = () => (groupSrcs ? groupSrcs[currentIndex].alt : alt);
+    const updateTransform = (img) => {
+        img.style.transform = `scale(${zoom}) rotate(${rotation}deg)`;
+    };
+    const backdrop = (createComponent("div", { className: "lightbox-backdrop", style: {
+            position: 'fixed',
+            top: '0',
+            left: '0',
+            width: '100%',
+            height: '100%',
+            backgroundColor: cssVariableTheme.action.backdrop,
+            zIndex: LIGHTBOX_Z_INDEX,
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            cursor: 'default',
+        }, onclick: async (ev) => {
+            if (ev.target.classList.contains('lightbox-backdrop')) {
+                await closeLightbox(ev.target);
+            }
+        } },
+        createComponent("div", { className: "lightbox-panel", style: {
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+                width: '100%',
+                height: '100%',
+                pointerEvents: 'none',
+            } },
+            createComponent("img", { className: "lightbox-image", src: getCurrentSrc(), alt: getCurrentAlt(), style: {
+                    maxWidth: '85vw',
+                    maxHeight: 'calc(100vh - 100px)',
+                    objectFit: 'contain',
+                    transition: 'transform 0.2s ease',
+                    userSelect: 'none',
+                    pointerEvents: 'auto',
+                }, draggable: false })),
+        createComponent("div", { className: "lightbox-toolbar", style: {
+                position: 'fixed',
+                bottom: cssVariableTheme.spacing.lg,
+                left: '50%',
+                transform: 'translateX(-50%)',
+                display: 'flex',
+                alignItems: 'center',
+                gap: cssVariableTheme.spacing.sm,
+                padding: `${cssVariableTheme.spacing.sm} ${cssVariableTheme.spacing.md}`,
+                borderRadius: cssVariableTheme.shape.borderRadius.md,
+                backgroundColor: cssVariableTheme.action.backdrop,
+                backdropFilter: `blur(${cssVariableTheme.effects.blurMd})`,
+                zIndex: '1',
+            } },
+            createComponent("button", { className: "lightbox-zoom-in", title: "Zoom in", style: toolbarButtonStyle(), onclick: () => {
+                    zoom = Math.min(zoom + 0.25, 5);
+                    const img = backdrop.querySelector('.lightbox-image');
+                    if (img)
+                        updateTransform(img);
+                } },
+                createComponent(Icon, { icon: zoomIn, size: "small" })),
+            createComponent("button", { className: "lightbox-zoom-out", title: "Zoom out", style: toolbarButtonStyle(), onclick: () => {
+                    zoom = Math.max(zoom - 0.25, 0.25);
+                    const img = backdrop.querySelector('.lightbox-image');
+                    if (img)
+                        updateTransform(img);
+                } },
+                createComponent(Icon, { icon: zoomOut, size: "small" })),
+            createComponent("button", { className: "lightbox-rotate", title: "Rotate", style: toolbarButtonStyle(), onclick: () => {
+                    rotation = (rotation + 90) % 360;
+                    const img = backdrop.querySelector('.lightbox-image');
+                    if (img)
+                        updateTransform(img);
+                } },
+                createComponent(Icon, { icon: rotate, size: "small" })),
+            createComponent("div", { style: { width: '1px', height: '20px', backgroundColor: cssVariableTheme.action.subtleBorder } }),
+            createComponent("button", { className: "lightbox-close", title: "Close", style: toolbarButtonStyle(), onclick: async () => {
+                    await closeLightbox(backdrop);
+                } },
+                createComponent(Icon, { icon: close, size: "small" }))),
+        groupSrcs && groupSrcs.length > 1 ? (createComponent(createComponent, null,
+            createComponent("button", { className: "lightbox-prev", title: "Previous image", style: {
+                    ...navButtonStyle(),
+                    position: 'fixed',
+                    left: cssVariableTheme.spacing.md,
+                    top: '50%',
+                    zIndex: '1',
+                }, onclick: () => {
+                    currentIndex = (currentIndex - 1 + groupSrcs.length) % groupSrcs.length;
+                    const img = backdrop.querySelector('.lightbox-image');
+                    if (img) {
+                        img.src = getCurrentSrc();
+                        img.alt = getCurrentAlt();
+                        zoom = 1;
+                        rotation = 0;
+                        updateTransform(img);
+                    }
+                    const counter = backdrop.querySelector('.lightbox-counter');
+                    if (counter)
+                        counter.textContent = `${currentIndex + 1} / ${groupSrcs.length}`;
+                } }, "\u2039"),
+            createComponent("button", { className: "lightbox-next", title: "Next image", style: {
+                    ...navButtonStyle(),
+                    position: 'fixed',
+                    right: cssVariableTheme.spacing.md,
+                    top: '50%',
+                    zIndex: '1',
+                }, onclick: () => {
+                    currentIndex = (currentIndex + 1) % groupSrcs.length;
+                    const img = backdrop.querySelector('.lightbox-image');
+                    if (img) {
+                        img.src = getCurrentSrc();
+                        img.alt = getCurrentAlt();
+                        zoom = 1;
+                        rotation = 0;
+                        updateTransform(img);
+                    }
+                    const counter = backdrop.querySelector('.lightbox-counter');
+                    if (counter)
+                        counter.textContent = `${currentIndex + 1} / ${groupSrcs.length}`;
+                } }, "\u203A"),
+            createComponent("div", { className: "lightbox-counter", style: {
+                    position: 'fixed',
+                    bottom: '72px',
+                    left: '50%',
+                    transform: 'translateX(-50%)',
+                    color: cssVariableTheme.text.secondary,
+                    fontSize: cssVariableTheme.typography.fontSize.md,
+                    zIndex: '1',
+                } },
+                currentIndex + 1,
+                " / ",
+                groupSrcs.length))) : null));
+    document.body.appendChild(backdrop);
+    const handleKeydown = (ev) => {
+        if (ev.key === 'Escape') {
+            void closeLightbox(backdrop);
+        }
+        if (groupSrcs && groupSrcs.length > 1) {
+            if (ev.key === 'ArrowLeft') {
+                const prevBtn = backdrop.querySelector('.lightbox-prev');
+                prevBtn?.click();
+            }
+            if (ev.key === 'ArrowRight') {
+                const nextBtn = backdrop.querySelector('.lightbox-next');
+                nextBtn?.click();
+            }
+        }
+    };
+    document.addEventListener('keydown', handleKeydown);
+    lightboxCleanupMap.set(backdrop, () => {
+        document.removeEventListener('keydown', handleKeydown);
+    });
+    // Animate in (may not be available in test environments)
+    const panel = backdrop.querySelector('.lightbox-panel');
+    if (panel) {
+        void promisifyAnimation(panel, [{ opacity: 0 }, { opacity: 1 }], {
+            duration: 200,
+            easing: 'ease-out',
+            fill: 'forwards',
+        }).catch(() => {
+            // Animation may not be available
+        });
+    }
+};
+const toolbarButtonStyle = () => ({
+    display: 'inline-flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    width: cssVariableTheme.spacing.xl,
+    height: cssVariableTheme.spacing.xl,
+    border: 'none',
+    background: 'transparent',
+    color: cssVariableTheme.background.paper,
+    borderRadius: cssVariableTheme.shape.borderRadius.sm,
+    cursor: 'pointer',
+    fontSize: cssVariableTheme.typography.fontSize.lg,
+    padding: '0',
+    transition: `background ${cssVariableTheme.transitions.duration.fast} ease`,
+});
+const navButtonStyle = () => ({
+    transform: 'translateY(-50%)',
+    display: 'inline-flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    width: '40px',
+    height: '40px',
+    border: 'none',
+    background: cssVariableTheme.action.backdrop,
+    color: cssVariableTheme.background.paper,
+    borderRadius: cssVariableTheme.shape.borderRadius.full,
+    cursor: 'pointer',
+    fontSize: cssVariableTheme.typography.fontSize.xl,
+    padding: '0',
+    transition: `background ${cssVariableTheme.transitions.duration.fast} ease`,
+});
+/**
+ * Image component with preview lightbox, zoom/rotate, fallback, and lazy loading support.
+ */
+export const Image = Shade({
+    shadowDomName: 'shade-image',
+    css: {
+        display: 'inline-block',
+        position: 'relative',
+        overflow: 'hidden',
+        borderRadius: cssVariableTheme.shape.borderRadius.sm,
+        transition: buildTransition([
+            'box-shadow',
+            cssVariableTheme.transitions.duration.fast,
+            cssVariableTheme.transitions.easing.default,
+        ]),
+        '&[data-preview] img': {
+            cursor: 'pointer',
+        },
+        '&[data-preview]:hover': {
+            boxShadow: cssVariableTheme.shadows.md,
+        },
+        '& img': {
+            display: 'block',
+            transition: buildTransition([
+                'opacity',
+                cssVariableTheme.transitions.duration.normal,
+                cssVariableTheme.transitions.easing.default,
+            ]),
+        },
+        '& .image-fallback': {
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            backgroundColor: `color-mix(in srgb, ${cssVariableTheme.palette.primary.main} 8%, ${cssVariableTheme.background.paper})`,
+            color: cssVariableTheme.text.secondary,
+            fontSize: cssVariableTheme.typography.fontSize.sm,
+            fontFamily: cssVariableTheme.typography.fontFamily,
+            border: `1px dashed ${cssVariableTheme.divider}`,
+            borderRadius: cssVariableTheme.shape.borderRadius.sm,
+        },
+        '& .image-preview-icon': {
+            position: 'absolute',
+            top: '50%',
+            left: '50%',
+            transform: 'translate(-50%, -50%) scale(0.8)',
+            opacity: '0',
+            transition: buildTransition(['opacity', cssVariableTheme.transitions.duration.fast, cssVariableTheme.transitions.easing.default], ['transform', cssVariableTheme.transitions.duration.fast, cssVariableTheme.transitions.easing.default]),
+            pointerEvents: 'none',
+            backgroundColor: cssVariableTheme.action.backdrop,
+            color: cssVariableTheme.background.paper,
+            borderRadius: cssVariableTheme.shape.borderRadius.full,
+            width: '40px',
+            height: '40px',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            fontSize: cssVariableTheme.typography.fontSize.lg,
+        },
+        '&[data-preview]:hover .image-preview-icon': {
+            opacity: '1',
+            transform: 'translate(-50%, -50%) scale(1)',
+        },
+    },
+    render: ({ props, useHostProps, useRef, useState }) => {
+        const imageHostRef = useRef('imageHost');
+        const { src, alt = '', width, height, objectFit = 'cover', fallback, preview = false, lazy = false, style: styleOverrides, } = props;
+        useHostProps({
+            'data-preview': preview ? '' : undefined,
+            'data-src': src,
+            'data-alt': alt,
+            ...(styleOverrides ? { style: styleOverrides } : {}),
+        });
+        const [hasError, setHasError] = useState('hasError', false);
+        const handleClick = () => {
+            if (!preview)
+                return;
+            const host = imageHostRef.current?.closest('shade-image-group');
+            if (host) {
+                const images = Array.from(host.querySelectorAll('shade-image'));
+                const groupSrcs = images.map((img) => ({
+                    src: img.getAttribute('data-src') || '',
+                    alt: img.getAttribute('data-alt') || '',
+                }));
+                const self = imageHostRef.current?.closest('shade-image');
+                const index = self ? images.indexOf(self) : -1;
+                createLightbox(src, alt, groupSrcs, index >= 0 ? index : 0);
+                return;
+            }
+            createLightbox(src, alt);
+        };
+        return (createComponent("div", { ref: imageHostRef, style: { display: 'contents' } },
+            createComponent("img", { src: src, alt: alt, loading: lazy ? 'lazy' : undefined, style: {
+                    display: hasError ? 'none' : 'block',
+                    width: width || '100%',
+                    height: height || 'auto',
+                    objectFit,
+                }, onclick: handleClick, onerror: () => setHasError(true) }),
+            createComponent("div", { className: "image-fallback", style: {
+                    display: hasError ? 'flex' : 'none',
+                    width: width || '200px',
+                    height: height || '150px',
+                } }, fallback || createComponent(Icon, { icon: imageBroken, size: "large" })),
+            preview ? (createComponent("div", { className: "image-preview-icon" },
+                createComponent(Icon, { icon: search, size: "small" }))) : null));
+    },
+});
+/**
+ * ImageGroup wraps multiple Image components and enables group preview navigation.
+ * When one image is clicked, the lightbox shows navigation controls to browse all images in the group.
+ */
+export const ImageGroup = Shade({
+    shadowDomName: 'shade-image-group',
+    css: {
+        display: 'flex',
+        flexWrap: 'wrap',
+        alignItems: 'flex-start',
+    },
+    render: ({ props, children, useHostProps }) => {
+        const { gap = cssVariableTheme.spacing.sm } = props;
+        useHostProps({ style: { gap } });
+        return createComponent(createComponent, null, children);
+    },
+});
+//# sourceMappingURL=image.js.map

package/esm/components/image.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image.js","sourceRoot":"","sources":["../../src/components/image.tsx"],"names":[],"mappings":"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"}

package/esm/components/image.spec.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=image.spec.d.ts.map

package/esm/components/image.spec.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"image.spec.d.ts","sourceRoot":"","sources":["../../src/components/image.spec.tsx"],"names":[],"mappings":""}