{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/kW8YjWPLDCF1jEOwUYrj/uUrOSzaVBbekm8qc7hcx/SliderGallery.js"],
  "sourcesContent": ["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useState,useEffect,useRef}from\"react\";import{addPropertyControls,ControlType}from\"framer\";import Skeleton from\"https://framerusercontent.com/modules/wrEJ8oVMagKXTJJpuvZR/aCn6i9g6yo4ByshUBVvX/Skeleton.js\";export default function SliderGallery({loading,images,mainImg,thumbnail,gap,bgColor,autoPlay,style}){const[selectedIndex,setSelectedIndex]=useState(0);const intervalRef=useRef(null);useEffect(()=>{if(images.length>0){setSelectedIndex(0);}},[images]);useEffect(()=>{startAutoplay();return()=>stopAutoplay();},[selectedIndex,images]);const startAutoplay=()=>{if(!autoPlay.active)return;stopAutoplay();intervalRef.current=setInterval(()=>{setSelectedIndex(prev=>(prev+1)%images.length);},autoPlay.sleep*1e3);};const stopAutoplay=()=>{if(intervalRef.current)clearInterval(intervalRef.current);};const handlePrev=()=>{stopAutoplay();setSelectedIndex(prev=>(prev-1+images.length)%images.length);};const handleNext=()=>{stopAutoplay();setSelectedIndex(prev=>(prev+1)%images.length);};const selectedImage=images[selectedIndex];return /*#__PURE__*/_jsxs(\"div\",{style:{display:\"flex\",flexDirection:\"column\",alignItems:\"center\",gap:gap,...style},children:[/*#__PURE__*/_jsxs(\"div\",{style:{position:\"relative\",width:\"100%\",aspectRatio:mainImg.aspectRatio,borderRadius:mainImg.borderRadius,overflow:\"hidden\",backgroundColor:bgColor,cursor:thumbnail.cursor,...mainImg.border},children:[loading||!selectedImage?/*#__PURE__*/_jsx(Skeleton,{style:{width:\"100%\",height:\"100%\"}}):/*#__PURE__*/_jsx(\"img\",{src:selectedImage,alt:\"Selected\",style:{width:\"100%\",height:\"100%\",objectFit:\"contain\"}}),/*#__PURE__*/_jsx(\"button\",{onClick:handlePrev,style:arrowStyle(\"left\"),\"aria-label\":\"Anterior\",children:\"\u2190\"}),/*#__PURE__*/_jsx(\"button\",{onClick:handleNext,style:arrowStyle(\"right\"),\"aria-label\":\"Siguiente\",children:\"\u2192\"})]}),/*#__PURE__*/_jsx(\"div\",{style:{display:\"flex\",gap:gap,flexWrap:\"wrap\"},children:images.map((img,index)=>{const isSelected=selectedIndex===index;return /*#__PURE__*/_jsx(\"div\",{onClick:()=>{stopAutoplay();setSelectedIndex(index);},style:{aspectRatio:thumbnail.aspectRatio,backgroundColor:bgColor,width:`${thumbnail.size}px`,borderRadius:thumbnail.borderRadius,overflow:\"hidden\",cursor:thumbnail.cursor,transition:\"border 0.3s ease-in-out\",...isSelected?thumbnail.selectBorder:thumbnail.border},children:loading?/*#__PURE__*/_jsx(Skeleton,{style:{width:\"100%\",height:\"100%\"}}):/*#__PURE__*/_jsx(\"img\",{src:img,alt:`Thumbnail ${index}`,style:{width:\"100%\",height:\"100%\",objectFit:\"cover\"}})},index);})})]});}// Estilos para las flechas\nconst arrowStyle=side=>({position:\"absolute\",top:\"50%\",[side]:\"10px\",transform:\"translateY(-50%)\",background:\"rgba(0, 0, 0, 0.4)\",color:\"#fff\",border:\"none\",borderRadius:\"50%\",width:\"32px\",height:\"32px\",cursor:\"pointer\",fontSize:\"18px\",zIndex:1});addPropertyControls(SliderGallery,{loading:{type:ControlType.Boolean,defaultValue:false},images:{type:ControlType.Array,title:\"Images\",control:{type:ControlType.String},defaultValue:[\"https://picsum.photos/800/800?random=1\",\"https://picsum.photos/800/800?random=2\",\"https://picsum.photos/800/800?random=3\"]},mainImg:{type:ControlType.Object,title:\"Main Img\",controls:{aspectRatio:{type:ControlType.String,defaultValue:\"1/1\"},border:{type:ControlType.Border,defaultValue:{borderColor:\"#E6E6E6\",borderStyle:\"solid\",borderWidth:2}},borderRadius:{type:ControlType.BorderRadius,defaultValue:\"8px\"},cursor:{type:ControlType.Cursor,defaultValue:\"pointer\"}}},thumbnail:{type:ControlType.Object,title:\"Thumbnail\",controls:{aspectRatio:{type:ControlType.String,defaultValue:\"1/1\"},border:{type:ControlType.Border,defaultValue:{borderColor:\"#E6E6E6\",borderStyle:\"solid\",borderWidth:2}},selectBorder:{type:ControlType.Border,title:\"Select Border\",defaultValue:{borderColor:\"black\",borderStyle:\"solid\",borderWidth:2}},borderRadius:{type:ControlType.BorderRadius,defaultValue:\"8px\"},size:{type:ControlType.Number,title:\"Size\",defaultValue:60,min:60,unit:\"px\"},cursor:{type:ControlType.Cursor,defaultValue:\"pointer\"}}},gap:{type:ControlType.Number,title:\"Gap\",defaultValue:8,unit:\"px\"},bgColor:{type:ControlType.Color,title:\"Background\",defaultValue:\"#f0f0f0\"},autoPlay:{type:ControlType.Object,title:\"AutoPlay\",controls:{active:{type:ControlType.Boolean,title:\"Active\",defaultValue:false},sleep:{type:ControlType.Number,title:\"Sleep\",defaultValue:3,unit:\"s\"}}}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"SliderGallery\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./SliderGallery.map"],
  "mappings": "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",
  "names": ["SliderGallery", "loading", "images", "mainImg", "thumbnail", "gap", "bgColor", "autoPlay", "style", "selectedIndex", "setSelectedIndex", "ye", "intervalRef", "pe", "ue", "startAutoplay", "stopAutoplay", "prev", "handlePrev", "handleNext", "selectedImage", "u", "p", "Skeleton", "arrowStyle", "img", "index", "isSelected", "side", "addPropertyControls", "ControlType"]
}