'use client';
import{jsx as e}from"react/jsx-runtime";import{useFeaturedImageGlobal as t,cls as o}from"@gem-sdk/core";import i from"../../../carousel-v3/components/root/Carousel.js";import l from"../../../carousel-v3/components/item/CarouselItem.js";import s from"../../../image/components/NextImage.js";import"../../../modal/components/confirm.js";import r from"../../../modal/components/Modal.js";import{useMemo as m}from"react";import{isFeatureMedia as n}from"./common/productFeaturedImage.js";let ProductImagesLightBox=({builderPropUID:d,productImages:p,open:a,imageRatio:c,onHandleClose:g})=>{let h=t(),b=m(()=>{let e=p?.findIndex(e=>e.id===h?.id);return e&&e>0?e:0},[p,h]),u={desktop:p&&p.length>1,mobile:p&&p?.length>1,tablet:p&&p?.length>1},f={desktop:!1,mobile:!1,tablet:!1};return e(r,{setting:{open:a},styles:{width:"80%"},closeOnClickOutside:!0,onClose:()=>g(),disableIframeClickEvent:!0,contentClass:"mobile:!gp-w-[100%] gp-px-2",children:e(i,{setting:{loop:f,slidesToShow:{desktop:1,tablet:1,mobile:1},defaultCurrentSlider:b,dot:{desktop:!0,mobile:!0,tablet:!0},dotStyle:{desktop:"outside",mobile:"outside",tablet:"outside"},dotColor:{desktop:"#E2E2E2",mobile:"#E2E2E2",tablet:"#E2E2E2"},dotActiveColor:{desktop:"#121212",mobile:"#121212",tablet:"#121212"},controlOverContent:{desktop:!0,mobile:!0,tablet:!0},arrow:u},styles:{sizeSetting:{desktop:{height:"80vh"},tablet:{height:"80vh"},mobile:{height:"60vh"}}},moveToIdx:b,hiddenDotWhenOnlyOne:!0,isHiddenArrowWhenDisabled:!0,builderProps:{uid:d},children:p?.map(t=>e(l,{className:`gem-slider-item gem-slider-item-${d} gp-flex gp-items-center gp-justify-center gp-px-4`,children:e(s,{src:n(t?.contentType)?t?.previewImage:t?.src,width:t?.width,height:t?.height,alt:t?.alt,"content-type":t?.contentType,setting:{aspectRatio:c},className:o("gp-h-full gp-w-full gp-object-contain")},t?.id)},t?.id))})})};export{ProductImagesLightBox as default};
