@soyfri/shared-library 3.1.0 → 3.2.1

package/components/Gallery/Gallery.js

@@ -1,492 +1,6 @@
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import { useState, useRef, useEffect } from "react";
-import { Box, IconButton, Dialog, DialogContent, Stack, Typography, DialogActions, useMediaQuery } from "@mui/material";
-import { useTheme } from "@mui/material/styles";
-import KeyboardArrowUpIcon from "@mui/icons-material/KeyboardArrowUp";
-import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
-import KeyboardArrowLeftIcon from "@mui/icons-material/KeyboardArrowLeft";
-import KeyboardArrowRightIcon from "@mui/icons-material/KeyboardArrowRight";
-import FullscreenIcon from "@mui/icons-material/Fullscreen";
-import ArrowBackIosNewIcon from "@mui/icons-material/ArrowBackIosNew";
-import ArrowForwardIosIcon from "@mui/icons-material/ArrowForwardIos";
-import ZoomInIcon from "@mui/icons-material/ZoomIn";
-import ZoomOutIcon from "@mui/icons-material/ZoomOut";
-import RotateLeftIcon from "@mui/icons-material/RotateLeft";
-import RotateRightIcon from "@mui/icons-material/RotateRight";
-import RestartAltIcon from "@mui/icons-material/RestartAlt";
-import CloseIcon from "@mui/icons-material/Close";
-import { B as Button } from "../../Button-UkkP-bNw.js";
-import { r as resolvePreset } from "../../resolvePreset-K6_BfWHD.js";
-const GalleryThumbnails = ({
-  items,
-  selectedIdx,
-  onSelect,
-  thumbStartIdx,
-  visibleCount,
-  onThumbUp,
-  onThumbDown,
-  isMobile
-}) => /* @__PURE__ */ jsxs(
-  Box,
-  {
-    sx: {
-      display: "flex",
-      flexDirection: isMobile ? "row" : "column",
-      alignItems: "center",
-      minWidth: 70,
-      width: 70,
-      borderRadius: 1,
-      bgcolor: "grey.100",
-      boxSizing: "border-box",
-      py: 1,
-      mb: isMobile ? 2 : 0,
-      px: isMobile ? 1 : 0
-    },
-    children: [
-      /* @__PURE__ */ jsx(
-        IconButton,
-        {
-          size: "small",
-          onClick: onThumbUp,
-          disabled: thumbStartIdx === 0,
-          "aria-label": isMobile ? "Miniatura anterior" : "Miniaturas arriba",
-          sx: { mb: isMobile ? 0 : 1, mr: isMobile ? 1 : 0 },
-          children: isMobile ? /* @__PURE__ */ jsx(KeyboardArrowLeftIcon, {}) : /* @__PURE__ */ jsx(KeyboardArrowUpIcon, {})
-        }
-      ),
-      items.slice(thumbStartIdx, thumbStartIdx + visibleCount).map((item, idx) => {
-        var _a;
-        const realIdx = thumbStartIdx + idx;
-        const isSelected = selectedIdx === realIdx;
-        const handleSelect = () => onSelect(realIdx);
-        return /* @__PURE__ */ jsx(
-          Box,
-          {
-            role: "button",
-            tabIndex: 0,
-            "aria-label": item.title,
-            "aria-pressed": isSelected,
-            onClick: handleSelect,
-            onKeyDown: (e) => {
-              if (e.key === "Enter" || e.key === " ") {
-                e.preventDefault();
-                handleSelect();
-              }
-            },
-            sx: {
-              cursor: "pointer",
-              width: 60,
-              height: 60,
-              borderRadius: 1,
-              border: (theme) => `2px solid ${isSelected ? theme.palette.primary.main : theme.palette.divider}`,
-              overflow: "hidden",
-              bgcolor: "action.hover",
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "center",
-              flexShrink: 0,
-              m: isMobile ? "0 4px" : "4px 0",
-              outline: "none",
-              "&:focus-visible": {
-                boxShadow: (theme) => `0 0 0 2px ${theme.palette.primary.main}`
-              }
-            },
-            children: /* @__PURE__ */ jsx(
-              Box,
-              {
-                component: "img",
-                src: (_a = item.thumbnail) != null ? _a : item.url,
-                alt: item.title,
-                sx: {
-                  width: "100%",
-                  height: "100%",
-                  objectFit: "cover"
-                }
-              }
-            )
-          },
-          `${realIdx}-${item.url}`
-        );
-      }),
-      /* @__PURE__ */ jsx(
-        IconButton,
-        {
-          size: "small",
-          onClick: onThumbDown,
-          disabled: thumbStartIdx + visibleCount >= items.length,
-          "aria-label": isMobile ? "Miniatura siguiente" : "Miniaturas abajo",
-          sx: { mt: isMobile ? 0 : 1, ml: isMobile ? 1 : 0 },
-          children: isMobile ? /* @__PURE__ */ jsx(KeyboardArrowRightIcon, {}) : /* @__PURE__ */ jsx(KeyboardArrowDownIcon, {})
-        }
-      )
-    ]
-  }
-);
-const GalleryMain = ({ item, onOpenLightbox, isMobile }) => /* @__PURE__ */ jsxs(
-  Box,
-  {
-    sx: {
-      width: isMobile ? "80%" : "100%",
-      maxHeight: 431,
-      maxWidth: isMobile ? "80%" : "100%",
-      display: "flex",
-      justifyContent: "center",
-      alignItems: "center",
-      position: "relative",
-      borderRadius: 1,
-      bgcolor: "grey.100",
-      overflow: "hidden",
-      mx: "auto"
-    },
-    children: [
-      /* @__PURE__ */ jsx(
-        Box,
-        {
-          sx: {
-            width: "100%",
-            height: "100%",
-            cursor: "pointer",
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center"
-          },
-          onClick: onOpenLightbox,
-          children: item.type === "video" ? /* @__PURE__ */ jsx(
-            Box,
-            {
-              component: "video",
-              controls: true,
-              src: item.url,
-              sx: {
-                width: "100%",
-                height: "100%",
-                objectFit: "contain",
-                bgcolor: "common.black",
-                borderRadius: 1
-              }
-            }
-          ) : /* @__PURE__ */ jsx(
-            Box,
-            {
-              component: "img",
-              src: item.url,
-              alt: item.title,
-              sx: {
-                width: "100%",
-                height: "100%",
-                objectFit: "contain",
-                borderRadius: 1
-              }
-            }
-          )
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        IconButton,
-        {
-          onClick: (e) => {
-            e.stopPropagation();
-            onOpenLightbox();
-          },
-          "aria-label": "Abrir en pantalla completa",
-          sx: {
-            position: "absolute",
-            top: 16,
-            right: 16,
-            bgcolor: "primary.main",
-            color: "primary.contrastText",
-            "&:hover": { bgcolor: "primary.dark" },
-            boxShadow: 2
-          },
-          children: /* @__PURE__ */ jsx(FullscreenIcon, {})
-        }
-      )
-    ]
-  }
-);
-const ZOOM_MIN = 0.25;
-const ZOOM_MAX = 5;
-const ZOOM_STEP = 0.25;
-const GalleryLightbox = ({
-  open,
-  onClose,
-  item,
-  onPrev,
-  onNext,
-  zoom,
-  setZoom,
-  rotation,
-  setRotation,
-  videoRef
-}) => /* @__PURE__ */ jsxs(Dialog, { open, onClose, fullWidth: true, maxWidth: "lg", children: [
-  /* @__PURE__ */ jsxs(
-    DialogContent,
-    {
-      sx: {
-        minHeight: 431,
-        display: "flex",
-        flexDirection: "column",
-        alignItems: "center",
-        justifyContent: "center",
-        gap: 2
-      },
-      children: [
-        /* @__PURE__ */ jsxs(
-          Stack,
-          {
-            direction: "row",
-            justifyContent: "space-between",
-            alignItems: "center",
-            width: "100%",
-            children: [
-              /* @__PURE__ */ jsx(IconButton, { onClick: onPrev, "aria-label": "Anterior", children: /* @__PURE__ */ jsx(ArrowBackIosNewIcon, {}) }),
-              /* @__PURE__ */ jsx(
-                Typography,
-                {
-                  variant: "subtitle1",
-                  fontWeight: 600,
-                  sx: { flex: 1, textAlign: "center" },
-                  children: item.title
-                }
-              ),
-              /* @__PURE__ */ jsx(IconButton, { onClick: onNext, "aria-label": "Siguiente", children: /* @__PURE__ */ jsx(ArrowForwardIosIcon, {}) })
-            ]
-          }
-        ),
-        item.type === "video" ? /* @__PURE__ */ jsx(
-          Box,
-          {
-            component: "video",
-            ref: videoRef,
-            src: item.url,
-            controls: true,
-            autoPlay: true,
-            sx: {
-              width: "100%",
-              maxWidth: 900,
-              maxHeight: "70vh",
-              objectFit: "contain",
-              bgcolor: "common.black",
-              borderRadius: 1
-            }
-          },
-          item.url
-        ) : /* @__PURE__ */ jsx(
-          Box,
-          {
-            component: "img",
-            src: item.url,
-            alt: item.title,
-            sx: {
-              transform: `scale(${zoom}) rotate(${rotation}deg)`,
-              transition: "transform 0.2s ease",
-              width: "100%",
-              maxWidth: 900,
-              maxHeight: "70vh",
-              objectFit: "contain",
-              borderRadius: 1
-            }
-          }
-        )
-      ]
-    }
-  ),
-  /* @__PURE__ */ jsxs(
-    DialogActions,
-    {
-      sx: {
-        display: "flex",
-        justifyContent: item.type === "image" ? "space-between" : "end",
-        flexWrap: "wrap",
-        gap: 1
-      },
-      children: [
-        item.type === "image" && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, children: [
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                variant: "outlined",
-                startIcon: /* @__PURE__ */ jsx(ZoomInIcon, {}),
-                onClick: () => setZoom((z) => Math.min(ZOOM_MAX, z + ZOOM_STEP)),
-                disabled: zoom >= ZOOM_MAX,
-                children: "Zoom +"
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                variant: "outlined",
-                startIcon: /* @__PURE__ */ jsx(ZoomOutIcon, {}),
-                onClick: () => setZoom((z) => Math.max(ZOOM_MIN, z - ZOOM_STEP)),
-                disabled: zoom <= ZOOM_MIN,
-                children: "Zoom −"
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, children: [
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                variant: "outlined",
-                "aria-label": "Rotar a la izquierda",
-                onClick: () => setRotation((r) => (r - 90) % 360),
-                children: /* @__PURE__ */ jsx(RotateLeftIcon, {})
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              Button,
-              {
-                variant: "outlined",
-                "aria-label": "Rotar a la derecha",
-                onClick: () => setRotation((r) => (r + 90) % 360),
-                children: /* @__PURE__ */ jsx(RotateRightIcon, {})
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              variant: "outlined",
-              startIcon: /* @__PURE__ */ jsx(RestartAltIcon, {}),
-              onClick: () => {
-                setZoom(1);
-                setRotation(0);
-              },
-              children: "Reset"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "contained",
-            startIcon: /* @__PURE__ */ jsx(CloseIcon, {}),
-            onClick: onClose,
-            children: "Cerrar"
-          }
-        )
-      ]
-    }
-  )
-] });
-const Gallery = ({
-  items,
-  maxWidth = "600px",
-  preset,
-  sx,
-  className
-}) => {
-  const theme = useTheme();
-  const isMobile = useMediaQuery("(max-width:700px)");
-  const [selectedIdx, setSelectedIdx] = useState(0);
-  const [openLightbox, setOpenLightbox] = useState(false);
-  const [zoom, setZoom] = useState(1);
-  const [rotation, setRotation] = useState(0);
-  const videoRef = useRef(null);
-  const [thumbStartIdx, setThumbStartIdx] = useState(0);
-  const THUMB_VISIBLE_COUNT = isMobile ? 3 : 5;
-  const handleThumbUp = () => {
-    setThumbStartIdx((prev) => Math.max(0, prev - 1));
-  };
-  const handleThumbDown = () => {
-    setThumbStartIdx(
-      (prev) => Math.max(0, Math.min(items.length - THUMB_VISIBLE_COUNT, prev + 1))
-    );
-  };
-  const handlePrev = () => {
-    setSelectedIdx((idx) => idx === 0 ? items.length - 1 : idx - 1);
-  };
-  const handleNext = () => {
-    setSelectedIdx((idx) => idx === items.length - 1 ? 0 : idx + 1);
-  };
-  useEffect(() => {
-    if (!openLightbox) return;
-    const handleKey = (e) => {
-      switch (e.key) {
-        case "ArrowLeft":
-          handlePrev();
-          break;
-        case "ArrowRight":
-          handleNext();
-          break;
-        case "Escape":
-          setOpenLightbox(false);
-          break;
-      }
-    };
-    window.addEventListener("keydown", handleKey);
-    return () => window.removeEventListener("keydown", handleKey);
-  }, [openLightbox, items.length]);
-  useEffect(() => {
-    var _a;
-    if (openLightbox && ((_a = items[selectedIdx]) == null ? void 0 : _a.type) === "video" && videoRef.current) {
-      videoRef.current.currentTime = 0;
-      videoRef.current.play().catch(() => {
-      });
-    }
-    setZoom(1);
-    setRotation(0);
-  }, [openLightbox, selectedIdx, items]);
-  if (!items || items.length === 0) return null;
-  const safeSelectedIdx = Math.max(0, Math.min(selectedIdx, items.length - 1));
-  const currentItem = items[safeSelectedIdx];
-  const presetSx = resolvePreset("Gallery", preset, theme);
-  const rootSx = [
-    { maxWidth, mx: "auto", minHeight: 300 },
-    ...presetSx ? [presetSx] : [],
-    ...Array.isArray(sx) ? sx : sx ? [sx] : []
-  ];
-  return /* @__PURE__ */ jsxs(
-    Stack,
-    {
-      direction: isMobile ? "column" : "row",
-      gap: 3,
-      className,
-      sx: rootSx,
-      children: [
-        /* @__PURE__ */ jsx(
-          GalleryThumbnails,
-          {
-            items,
-            selectedIdx: safeSelectedIdx,
-            onSelect: setSelectedIdx,
-            thumbStartIdx,
-            visibleCount: THUMB_VISIBLE_COUNT,
-            onThumbUp: handleThumbUp,
-            onThumbDown: handleThumbDown,
-            isMobile
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          GalleryMain,
-          {
-            item: currentItem,
-            onOpenLightbox: () => setOpenLightbox(true),
-            isMobile
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          GalleryLightbox,
-          {
-            open: openLightbox,
-            onClose: () => setOpenLightbox(false),
-            item: currentItem,
-            onPrev: handlePrev,
-            onNext: handleNext,
-            zoom,
-            setZoom,
-            rotation,
-            setRotation,
-            videoRef
-          }
-        )
-      ]
-    }
-  );
-};
+import { G, G as G2 } from "../../Gallery-ClBJxCMc.js";
 export {
-  Gallery,
-  Gallery as default
+  G as Gallery,
+  G2 as default
 };
 //# sourceMappingURL=Gallery.js.map

package/components/Gallery/Gallery.js.map

@@ -1 +1 @@
-{"version":3,"file":"Gallery.js","sources":["../../../src/components/Gallery/GalleryThumbnails.tsx","../../../src/components/Gallery/GalleryMain.tsx","../../../src/components/Gallery/GalleryLightbox.tsx","../../../src/components/Gallery/Gallery.tsx"],"sourcesContent":["import { Box, IconButton } from '@mui/material';\nimport KeyboardArrowUpIcon from '@mui/icons-material/KeyboardArrowUp';\nimport KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';\nimport KeyboardArrowLeftIcon from '@mui/icons-material/KeyboardArrowLeft';\nimport KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';\n\nimport type { GalleryItem } from './Gallery';\n\ninterface Props {\n  items: GalleryItem[];\n  selectedIdx: number;\n  onSelect: (idx: number) => void;\n  thumbStartIdx: number;\n  visibleCount: number;\n  onThumbUp: () => void;\n  onThumbDown: () => void;\n  isMobile: boolean;\n}\n\nexport const GalleryThumbnails = ({\n  items,\n  selectedIdx,\n  onSelect,\n  thumbStartIdx,\n  visibleCount,\n  onThumbUp,\n  onThumbDown,\n  isMobile,\n}: Props) => (\n  <Box\n    sx={{\n      display: 'flex',\n      flexDirection: isMobile ? 'row' : 'column',\n      alignItems: 'center',\n      minWidth: 70,\n      width: 70,\n      borderRadius: 1,\n      bgcolor: 'grey.100',\n      boxSizing: 'border-box',\n      py: 1,\n      mb: isMobile ? 2 : 0,\n      px: isMobile ? 1 : 0,\n    }}\n  >\n    <IconButton\n      size=\"small\"\n      onClick={onThumbUp}\n      disabled={thumbStartIdx === 0}\n      aria-label={isMobile ? 'Miniatura anterior' : 'Miniaturas arriba'}\n      sx={{ mb: isMobile ? 0 : 1, mr: isMobile ? 1 : 0 }}\n    >\n      {isMobile ? <KeyboardArrowLeftIcon /> : <KeyboardArrowUpIcon />}\n    </IconButton>\n    {items\n      .slice(thumbStartIdx, thumbStartIdx + visibleCount)\n      .map((item, idx) => {\n        const realIdx = thumbStartIdx + idx;\n        const isSelected = selectedIdx === realIdx;\n        const handleSelect = () => onSelect(realIdx);\n        return (\n          <Box\n            key={`${realIdx}-${item.url}`}\n            role=\"button\"\n            tabIndex={0}\n            aria-label={item.title}\n            aria-pressed={isSelected}\n            onClick={handleSelect}\n            onKeyDown={(e) => {\n              if (e.key === 'Enter' || e.key === ' ') {\n                e.preventDefault();\n                handleSelect();\n              }\n            }}\n            sx={{\n              cursor: 'pointer',\n              width: 60,\n              height: 60,\n              borderRadius: 1,\n              border: (theme) =>\n                `2px solid ${\n                  isSelected ? theme.palette.primary.main : theme.palette.divider\n                }`,\n              overflow: 'hidden',\n              bgcolor: 'action.hover',\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: 'center',\n              flexShrink: 0,\n              m: isMobile ? '0 4px' : '4px 0',\n              outline: 'none',\n              '&:focus-visible': {\n                boxShadow: (theme) =>\n                  `0 0 0 2px ${theme.palette.primary.main}`,\n              },\n            }}\n          >\n            <Box\n              component=\"img\"\n              src={item.thumbnail ?? item.url}\n              alt={item.title}\n              sx={{\n                width: '100%',\n                height: '100%',\n                objectFit: 'cover',\n              }}\n            />\n          </Box>\n        );\n      })}\n    <IconButton\n      size=\"small\"\n      onClick={onThumbDown}\n      disabled={thumbStartIdx + visibleCount >= items.length}\n      aria-label={isMobile ? 'Miniatura siguiente' : 'Miniaturas abajo'}\n      sx={{ mt: isMobile ? 0 : 1, ml: isMobile ? 1 : 0 }}\n    >\n      {isMobile ? <KeyboardArrowRightIcon /> : <KeyboardArrowDownIcon />}\n    </IconButton>\n  </Box>\n);\n\nexport default GalleryThumbnails;\n","import { Box, IconButton } from '@mui/material';\nimport FullscreenIcon from '@mui/icons-material/Fullscreen';\n\nimport type { GalleryItem } from './Gallery';\n\ninterface Props {\n  item: GalleryItem;\n  onOpenLightbox: () => void;\n  isMobile: boolean;\n}\n\nexport const GalleryMain = ({ item, onOpenLightbox, isMobile }: Props) => (\n  <Box\n    sx={{\n      width: isMobile ? '80%' : '100%',\n      maxHeight: 431,\n      maxWidth: isMobile ? '80%' : '100%',\n      display: 'flex',\n      justifyContent: 'center',\n      alignItems: 'center',\n      position: 'relative',\n      borderRadius: 1,\n      bgcolor: 'grey.100',\n      overflow: 'hidden',\n      mx: 'auto',\n    }}\n  >\n    <Box\n      sx={{\n        width: '100%',\n        height: '100%',\n        cursor: 'pointer',\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n      }}\n      onClick={onOpenLightbox}\n    >\n      {item.type === 'video' ? (\n        <Box\n          component=\"video\"\n          controls\n          src={item.url}\n          sx={{\n            width: '100%',\n            height: '100%',\n            objectFit: 'contain',\n            bgcolor: 'common.black',\n            borderRadius: 1,\n          }}\n        />\n      ) : (\n        <Box\n          component=\"img\"\n          src={item.url}\n          alt={item.title}\n          sx={{\n            width: '100%',\n            height: '100%',\n            objectFit: 'contain',\n            borderRadius: 1,\n          }}\n        />\n      )}\n    </Box>\n    <IconButton\n      onClick={(e) => {\n        e.stopPropagation();\n        onOpenLightbox();\n      }}\n      aria-label=\"Abrir en pantalla completa\"\n      sx={{\n        position: 'absolute',\n        top: 16,\n        right: 16,\n        bgcolor: 'primary.main',\n        color: 'primary.contrastText',\n        '&:hover': { bgcolor: 'primary.dark' },\n        boxShadow: 2,\n      }}\n    >\n      <FullscreenIcon />\n    </IconButton>\n  </Box>\n);\n\nexport default GalleryMain;\n","import React from 'react';\nimport {\n  Dialog,\n  DialogContent,\n  DialogActions,\n  Stack,\n  IconButton,\n  Box,\n  Typography,\n} from '@mui/material';\nimport ArrowBackIosNewIcon from '@mui/icons-material/ArrowBackIosNew';\nimport ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos';\nimport ZoomInIcon from '@mui/icons-material/ZoomIn';\nimport ZoomOutIcon from '@mui/icons-material/ZoomOut';\nimport RotateLeftIcon from '@mui/icons-material/RotateLeft';\nimport RotateRightIcon from '@mui/icons-material/RotateRight';\nimport RestartAltIcon from '@mui/icons-material/RestartAlt';\nimport CloseIcon from '@mui/icons-material/Close';\n\nimport { Button } from '../Button';\nimport type { GalleryItem } from './Gallery';\n\nconst ZOOM_MIN = 0.25;\nconst ZOOM_MAX = 5;\nconst ZOOM_STEP = 0.25;\n\ninterface Props {\n  open: boolean;\n  onClose: () => void;\n  item: GalleryItem;\n  onPrev: () => void;\n  onNext: () => void;\n  zoom: number;\n  setZoom: React.Dispatch<React.SetStateAction<number>>;\n  rotation: number;\n  setRotation: React.Dispatch<React.SetStateAction<number>>;\n  videoRef?: React.RefObject<HTMLVideoElement | null>;\n}\n\nexport const GalleryLightbox = ({\n  open,\n  onClose,\n  item,\n  onPrev,\n  onNext,\n  zoom,\n  setZoom,\n  rotation,\n  setRotation,\n  videoRef,\n}: Props) => (\n  <Dialog open={open} onClose={onClose} fullWidth maxWidth=\"lg\">\n    <DialogContent\n      sx={{\n        minHeight: 431,\n        display: 'flex',\n        flexDirection: 'column',\n        alignItems: 'center',\n        justifyContent: 'center',\n        gap: 2,\n      }}\n    >\n      <Stack\n        direction=\"row\"\n        justifyContent=\"space-between\"\n        alignItems=\"center\"\n        width=\"100%\"\n      >\n        <IconButton onClick={onPrev} aria-label=\"Anterior\">\n          <ArrowBackIosNewIcon />\n        </IconButton>\n        <Typography\n          variant=\"subtitle1\"\n          fontWeight={600}\n          sx={{ flex: 1, textAlign: 'center' }}\n        >\n          {item.title}\n        </Typography>\n        <IconButton onClick={onNext} aria-label=\"Siguiente\">\n          <ArrowForwardIosIcon />\n        </IconButton>\n      </Stack>\n\n      {item.type === 'video' ? (\n        <Box\n          component=\"video\"\n          key={item.url}\n          ref={videoRef}\n          src={item.url}\n          controls\n          autoPlay\n          sx={{\n            width: '100%',\n            maxWidth: 900,\n            maxHeight: '70vh',\n            objectFit: 'contain',\n            bgcolor: 'common.black',\n            borderRadius: 1,\n          }}\n        />\n      ) : (\n        <Box\n          component=\"img\"\n          src={item.url}\n          alt={item.title}\n          sx={{\n            transform: `scale(${zoom}) rotate(${rotation}deg)`,\n            transition: 'transform 0.2s ease',\n            width: '100%',\n            maxWidth: 900,\n            maxHeight: '70vh',\n            objectFit: 'contain',\n            borderRadius: 1,\n          }}\n        />\n      )}\n    </DialogContent>\n\n    <DialogActions\n      sx={{\n        display: 'flex',\n        justifyContent: item.type === 'image' ? 'space-between' : 'end',\n        flexWrap: 'wrap',\n        gap: 1,\n      }}\n    >\n      {item.type === 'image' && (\n        <>\n          <Stack direction=\"row\" spacing={1}>\n            <Button\n              variant=\"outlined\"\n              startIcon={<ZoomInIcon />}\n              onClick={() => setZoom((z) => Math.min(ZOOM_MAX, z + ZOOM_STEP))}\n              disabled={zoom >= ZOOM_MAX}\n            >\n              Zoom +\n            </Button>\n            <Button\n              variant=\"outlined\"\n              startIcon={<ZoomOutIcon />}\n              onClick={() => setZoom((z) => Math.max(ZOOM_MIN, z - ZOOM_STEP))}\n              disabled={zoom <= ZOOM_MIN}\n            >\n              Zoom −\n            </Button>\n          </Stack>\n          <Stack direction=\"row\" spacing={1}>\n            <Button\n              variant=\"outlined\"\n              aria-label=\"Rotar a la izquierda\"\n              onClick={() => setRotation((r) => (r - 90) % 360)}\n            >\n              <RotateLeftIcon />\n            </Button>\n            <Button\n              variant=\"outlined\"\n              aria-label=\"Rotar a la derecha\"\n              onClick={() => setRotation((r) => (r + 90) % 360)}\n            >\n              <RotateRightIcon />\n            </Button>\n          </Stack>\n          <Button\n            variant=\"outlined\"\n            startIcon={<RestartAltIcon />}\n            onClick={() => {\n              setZoom(1);\n              setRotation(0);\n            }}\n          >\n            Reset\n          </Button>\n        </>\n      )}\n      <Button\n        variant=\"contained\"\n        startIcon={<CloseIcon />}\n        onClick={onClose}\n      >\n        Cerrar\n      </Button>\n    </DialogActions>\n  </Dialog>\n);\n\nexport default GalleryLightbox;\n","import React, { useState, useRef, useEffect } from 'react';\nimport { Stack, useMediaQuery } from '@mui/material';\nimport { useTheme, type SxProps, type Theme } from '@mui/material/styles';\n\nimport { GalleryThumbnails } from './GalleryThumbnails';\nimport { GalleryMain } from './GalleryMain';\nimport { GalleryLightbox } from './GalleryLightbox';\nimport { resolvePreset } from '../_shared/resolvePreset';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\nexport interface GalleryItem {\n  url: string;\n  /**\n   * Tipo del item. Los literales `\"image\"` / `\"video\"` activan el render\n   * específico; cualquier otro string se trata como imagen por default.\n   */\n  type: 'image' | 'video' | (string & {});\n  title: string;\n  /** Si no se provee, se usa `url` como thumbnail. */\n  thumbnail?: string;\n}\n\nexport interface GalleryProps {\n  items: GalleryItem[];\n  /** Ancho máximo del contenedor. Default: `'600px'`. */\n  maxWidth?: string | number;\n  /**\n   * Nombre del preset de estilo registrado en `theme.styles.Gallery`.\n   * - `\"default\"` (o ausente) = estilo built-in del paquete.\n   */\n  preset?: string;\n  /** sx del contenedor raíz. Se mergea después del preset. */\n  sx?: SxProps<Theme>;\n  className?: string;\n}\n\nexport const Gallery: React.FC<GalleryProps> = ({\n  items,\n  maxWidth = '600px',\n  preset,\n  sx,\n  className,\n}) => {\n  const theme = useTheme();\n  const isMobile = useMediaQuery('(max-width:700px)');\n  const [selectedIdx, setSelectedIdx] = useState(0);\n  const [openLightbox, setOpenLightbox] = useState(false);\n  const [zoom, setZoom] = useState(1);\n  const [rotation, setRotation] = useState(0);\n  const videoRef = useRef<HTMLVideoElement | null>(null);\n\n  const [thumbStartIdx, setThumbStartIdx] = useState(0);\n  const THUMB_VISIBLE_COUNT = isMobile ? 3 : 5;\n\n  const handleThumbUp = () => {\n    setThumbStartIdx((prev) => Math.max(0, prev - 1));\n  };\n  const handleThumbDown = () => {\n    setThumbStartIdx((prev) =>\n      Math.max(0, Math.min(items.length - THUMB_VISIBLE_COUNT, prev + 1)),\n    );\n  };\n\n  const handlePrev = () => {\n    setSelectedIdx((idx) => (idx === 0 ? items.length - 1 : idx - 1));\n  };\n  const handleNext = () => {\n    setSelectedIdx((idx) => (idx === items.length - 1 ? 0 : idx + 1));\n  };\n\n  useEffect(() => {\n    if (!openLightbox) return;\n    const handleKey = (e: KeyboardEvent) => {\n      switch (e.key) {\n        case 'ArrowLeft':\n          handlePrev();\n          break;\n        case 'ArrowRight':\n          handleNext();\n          break;\n        case 'Escape':\n          setOpenLightbox(false);\n          break;\n      }\n    };\n    window.addEventListener('keydown', handleKey);\n    return () => window.removeEventListener('keydown', handleKey);\n  }, [openLightbox, items.length]);\n\n  // Reset zoom/rotación al navegar o abrir. Autoplay del video con catch\n  // para evitar unhandled rejections por políticas de autoplay del browser.\n  useEffect(() => {\n    if (\n      openLightbox &&\n      items[selectedIdx]?.type === 'video' &&\n      videoRef.current\n    ) {\n      videoRef.current.currentTime = 0;\n      videoRef.current.play().catch(() => {\n        /* autoplay bloqueado — el usuario puede dar play manualmente */\n      });\n    }\n    setZoom(1);\n    setRotation(0);\n  }, [openLightbox, selectedIdx, items]);\n\n  if (!items || items.length === 0) return null;\n\n  const safeSelectedIdx = Math.max(0, Math.min(selectedIdx, items.length - 1));\n  const currentItem = items[safeSelectedIdx];\n\n  const presetSx = resolvePreset('Gallery', preset, theme);\n\n  const rootSx: SxProps<Theme> = [\n    { maxWidth, mx: 'auto', minHeight: 300 },\n    ...(presetSx ? [presetSx] : []),\n    ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n  ];\n\n  return (\n    <Stack\n      direction={isMobile ? 'column' : 'row'}\n      gap={3}\n      className={className}\n      sx={rootSx}\n    >\n      <GalleryThumbnails\n        items={items}\n        selectedIdx={safeSelectedIdx}\n        onSelect={setSelectedIdx}\n        thumbStartIdx={thumbStartIdx}\n        visibleCount={THUMB_VISIBLE_COUNT}\n        onThumbUp={handleThumbUp}\n        onThumbDown={handleThumbDown}\n        isMobile={isMobile}\n      />\n      <GalleryMain\n        item={currentItem}\n        onOpenLightbox={() => setOpenLightbox(true)}\n        isMobile={isMobile}\n      />\n      <GalleryLightbox\n        open={openLightbox}\n        onClose={() => setOpenLightbox(false)}\n        item={currentItem}\n        onPrev={handlePrev}\n        onNext={handleNext}\n        zoom={zoom}\n        setZoom={setZoom}\n        rotation={rotation}\n        setRotation={setRotation}\n        videoRef={videoRef}\n      />\n    </Stack>\n  );\n};\n\nexport default Gallery;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Gallery.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/components/Icon/Icon.cjs

@@ -1,109 +1,6 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const jsxRuntime = require("react/jsx-runtime");
-const React = require("react");
-const material = require("@mui/material");
-const sizeMap = {
-  xs: 18,
-  sm: 24,
-  md: 36,
-  lg: 48,
-  xl: 64
-};
-const StyledIcon = material.styled("span")(({ color, fontSize, spin, outlined }) => ({
-  display: "inline-flex",
-  alignItems: "center",
-  justifyContent: "center",
-  color,
-  fontSize,
-  width: fontSize,
-  height: fontSize,
-  animation: spin ? "spin 1s linear infinite" : void 0,
-  border: outlined ? "1px solid currentColor" : void 0,
-  borderRadius: "50%",
-  padding: outlined ? 4 : 0,
-  "@keyframes spin": {
-    "0%": { transform: "rotate(0deg)" },
-    "100%": { transform: "rotate(360deg)" }
-  },
-  "& svg": {
-    width: "100%",
-    height: "100%",
-    fill: "currentColor",
-    display: "block"
-  },
-  "& img": {
-    width: "100%",
-    height: "100%",
-    display: "block"
-  }
-}));
-const Icon = ({
-  children,
-  path,
-  url,
-  alt = "icon",
-  viewBox = "0 0 24 24",
-  color = "var(--primary-color)",
-  outlined = false,
-  spin = false,
-  badge,
-  badgeColor = "primary",
-  badgePosition = { vertical: "bottom", horizontal: "right" },
-  size = "sm",
-  black,
-  white,
-  className,
-  sx
-}) => {
-  const finalColor = white ? "white" : black ? "black" : color;
-  const iconSize = sizeMap[size];
-  const content = React.useMemo(() => {
-    if (children) return children;
-    if (path) {
-      const trimmed = path.trim();
-      if (trimmed.startsWith("<svg")) {
-        return /* @__PURE__ */ jsxRuntime.jsx("span", { dangerouslySetInnerHTML: { __html: trimmed } });
-      }
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        "svg",
-        {
-          xmlns: "http://www.w3.org/2000/svg",
-          viewBox,
-          fill: "currentColor",
-          "aria-hidden": "true",
-          children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: trimmed })
-        }
-      );
-    }
-    if (url) {
-      return /* @__PURE__ */ jsxRuntime.jsx("img", { src: url, alt });
-    }
-    return null;
-  }, [children, path, url, alt, viewBox]);
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    material.Badge,
-    {
-      badgeContent: badge,
-      color: badgeColor,
-      anchorOrigin: badgePosition,
-      invisible: badge === void 0,
-      sx: { ".MuiBadge-badge": { transform: "scale(1)" } },
-      children: /* @__PURE__ */ jsxRuntime.jsx(
-        StyledIcon,
-        {
-          color: finalColor,
-          fontSize: iconSize,
-          spin,
-          outlined,
-          className: `hsi-icon ${className || ""}`,
-          sx,
-          children: content
-        }
-      )
-    }
-  );
-};
-exports.Icon = Icon;
-exports.default = Icon;
+const Icon = require("../../Icon-ChnAivGo.cjs");
+exports.Icon = Icon.Icon;
+exports.default = Icon.Icon;
 //# sourceMappingURL=Icon.cjs.map

package/components/Icon/Icon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.cjs","sources":["../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import React, { type ReactNode, useMemo } from 'react';\nimport { Badge, styled } from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\n\nexport type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport interface IconProps {\n  /**\n   * Contenido del icono. Modo legacy: acepta un elemento MUI o SVG ya armado.\n   * Si se usa junto con `path` o `url`, `children` tiene prioridad.\n   */\n  children?: ReactNode;\n  /**\n   * Ruta SVG inline. Acepta dos formatos:\n   * - Solo el valor del atributo `d` de un `<path>` (ej. `\"M12 2L2 22...\"`).\n   * - Un SVG completo (ej. `\"<svg>...</svg>\"`).\n   *\n   * ⚠️ Seguridad: cuando el string empieza con `<svg`, se inyecta vía\n   * `dangerouslySetInnerHTML`. **NUNCA pasar contenido proveniente de input\n   * de usuario o de backends no confiables** — riesgo XSS.\n   */\n  path?: string;\n  /**\n   * URL a un archivo `.svg` (asset local o remoto). Se renderiza vía `<img>`.\n   * El color del icono NO aplica en este modo (limitación de `<img>`).\n   */\n  url?: string;\n  /** Alt text cuando se usa `url`. Default: `\"icon\"`. */\n  alt?: string;\n  /**\n   * ViewBox cuando se usa `path`. Default: `\"0 0 24 24\"`. Ignorado si `path`\n   * ya viene como `<svg>` completo.\n   */\n  viewBox?: string;\n  color?: string;\n  outlined?: boolean;\n  spin?: boolean;\n  badge?: string | number;\n  badgeColor?: 'primary' | 'secondary' | 'error';\n  badgePosition?: {\n    vertical: 'top' | 'bottom';\n    horizontal: 'right' | 'left';\n  };\n  size?: IconSize;\n  black?: boolean;\n  white?: boolean;\n  className?: string;\n  sx?: SxProps<Theme>;\n}\n\nconst sizeMap: Record<IconSize, number> = {\n  xs: 18,\n  sm: 24,\n  md: 36,\n  lg: 48,\n  xl: 64,\n};\n\nconst StyledIcon = styled('span')<{\n  color?: string;\n  fontSize?: number;\n  spin?: boolean;\n  outlined?: boolean;\n}>(({ color, fontSize, spin, outlined }) => ({\n  display: 'inline-flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  color: color,\n  fontSize: fontSize,\n  width: fontSize,\n  height: fontSize,\n  animation: spin ? 'spin 1s linear infinite' : undefined,\n  border: outlined ? '1px solid currentColor' : undefined,\n  borderRadius: '50%',\n  padding: outlined ? 4 : 0,\n  '@keyframes spin': {\n    '0%': { transform: 'rotate(0deg)' },\n    '100%': { transform: 'rotate(360deg)' },\n  },\n  '& svg': {\n    width: '100%',\n    height: '100%',\n    fill: 'currentColor',\n    display: 'block',\n  },\n  '& img': {\n    width: '100%',\n    height: '100%',\n    display: 'block',\n  },\n}));\n\nexport const Icon: React.FC<IconProps> = ({\n  children,\n  path,\n  url,\n  alt = 'icon',\n  viewBox = '0 0 24 24',\n  color = 'var(--primary-color)',\n  outlined = false,\n  spin = false,\n  badge,\n  badgeColor = 'primary',\n  badgePosition = { vertical: 'bottom', horizontal: 'right' },\n  size = 'sm',\n  black,\n  white,\n  className,\n  sx,\n}) => {\n  const finalColor = white ? 'white' : black ? 'black' : color;\n  const iconSize = sizeMap[size];\n\n  const content = useMemo(() => {\n    if (children) return children;\n\n    if (path) {\n      const trimmed = path.trim();\n      if (trimmed.startsWith('<svg')) {\n        return <span dangerouslySetInnerHTML={{ __html: trimmed }} />;\n      }\n      return (\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          viewBox={viewBox}\n          fill=\"currentColor\"\n          aria-hidden=\"true\"\n        >\n          <path d={trimmed} />\n        </svg>\n      );\n    }\n\n    if (url) {\n      return <img src={url} alt={alt} />;\n    }\n\n    return null;\n  }, [children, path, url, alt, viewBox]);\n\n  return (\n    <Badge\n      badgeContent={badge}\n      color={badgeColor}\n      anchorOrigin={badgePosition}\n      invisible={badge === undefined}\n      sx={{ '.MuiBadge-badge': { transform: 'scale(1)' } }}\n    >\n      <StyledIcon\n        color={finalColor}\n        fontSize={iconSize}\n        spin={spin}\n        outlined={outlined}\n        className={`hsi-icon ${className || ''}`}\n        sx={sx}\n      >\n        {content}\n      </StyledIcon>\n    </Badge>\n  );\n};\n\nexport default Icon;\n"],"names":["styled","useMemo","jsx","Badge"],"mappings":";;;;;AAkDA,MAAM,UAAoC;AAAA,EACxC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,MAAM,aAAaA,SAAAA,OAAO,MAAM,EAK7B,CAAC,EAAE,OAAO,UAAU,MAAM,gBAAgB;AAAA,EAC3C,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,WAAW,OAAO,4BAA4B;AAAA,EAC9C,QAAQ,WAAW,2BAA2B;AAAA,EAC9C,cAAc;AAAA,EACd,SAAS,WAAW,IAAI;AAAA,EACxB,mBAAmB;AAAA,IACjB,MAAM,EAAE,WAAW,eAAA;AAAA,IACnB,QAAQ,EAAE,WAAW,iBAAA;AAAA,EAAiB;AAAA,EAExC,SAAS;AAAA,IACP,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,EAAA;AAAA,EAEX,SAAS;AAAA,IACP,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,EAAA;AAEb,EAAE;AAEK,MAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,MAAM;AAAA,EACN,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,OAAO;AAAA,EACP;AAAA,EACA,aAAa;AAAA,EACb,gBAAgB,EAAE,UAAU,UAAU,YAAY,QAAA;AAAA,EAClD,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,aAAa,QAAQ,UAAU,QAAQ,UAAU;AACvD,QAAM,WAAW,QAAQ,IAAI;AAE7B,QAAM,UAAUC,MAAAA,QAAQ,MAAM;AAC5B,QAAI,SAAU,QAAO;AAErB,QAAI,MAAM;AACR,YAAM,UAAU,KAAK,KAAA;AACrB,UAAI,QAAQ,WAAW,MAAM,GAAG;AAC9B,8CAAQ,QAAA,EAAK,yBAAyB,EAAE,QAAQ,WAAW;AAAA,MAC7D;AACA,aACEC,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN;AAAA,UACA,MAAK;AAAA,UACL,eAAY;AAAA,UAEZ,UAAAA,2BAAAA,IAAC,QAAA,EAAK,GAAG,QAAA,CAAS;AAAA,QAAA;AAAA,MAAA;AAAA,IAGxB;AAEA,QAAI,KAAK;AACP,aAAOA,2BAAAA,IAAC,OAAA,EAAI,KAAK,KAAK,IAAA,CAAU;AAAA,IAClC;AAEA,WAAO;AAAA,EACT,GAAG,CAAC,UAAU,MAAM,KAAK,KAAK,OAAO,CAAC;AAEtC,SACEA,2BAAAA;AAAAA,IAACC,SAAAA;AAAAA,IAAA;AAAA,MACC,cAAc;AAAA,MACd,OAAO;AAAA,MACP,cAAc;AAAA,MACd,WAAW,UAAU;AAAA,MACrB,IAAI,EAAE,mBAAmB,EAAE,WAAW,aAAW;AAAA,MAEjD,UAAAD,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAO;AAAA,UACP,UAAU;AAAA,UACV;AAAA,UACA;AAAA,UACA,WAAW,YAAY,aAAa,EAAE;AAAA,UACtC;AAAA,UAEC,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN;;;"}
+{"version":3,"file":"Icon.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}