"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),React=require("react"),core=require("@gem-sdk/core"),hoverAction=require("../../common/hoverAction.js"),getProductImagesStyles=require("../../composables/getProductImagesStyles.js"),getProductImagesClassName=require("../../composables/getProductImagesClassName.js"),getProductImagesAttr=require("../../composables/getProductImagesAttr.js"),system=require("@gem-sdk/system"),styles=require("../../common/styles.js"),Carousel=require("../../../../../carousel-v3/components/root/Carousel.js"),CarouselItem=require("../../../../../carousel-v3/components/item/CarouselItem.js"),ProductFeaturedImageOnly=require("./ProductFeaturedImageOnly.js"),useProductFeaturedImageCarousel=require("../../hooks/useProductFeaturedImageCarousel.js");const ProductFeaturedImageCarousel=React.forwardRef((e,t)=>{let{productImages:r,imgRef:s,onHandleClick:a,onClickArrow:o,onHandleLoaded:u,onHandleUpdateActiveIndex:l,swiperUpdateTrigger:i,builderPropUID:d,builderPropsClass:n,parentUid:c,isFilterByVariantEnabled:m,...g}=e,I=React.useRef(null),{ref:p,imageActive:h,imageActiveIndex:j,imageShowWhenHover:v,enableOpenLightBox:y,filteredProductImages:C,isRenderFeatureCarousel:P,genRandomKey:x,getAspectRatioFinal:f,emitUpdateActiveIndex:R}=useProductFeaturedImageCarousel.useProductFeaturedImageCarousel(e);React.useImperativeHandle(t,()=>({getSwiper:()=>I.current?.getSwiper()||null}));let A=core.useCurrentDevice(),{galleryItemClasses:M,featureImageOnlyOneImageClasses:S}=getProductImagesClassName.getProductImagesClassName(g),{featuredImageCarouselStyle:q,featureImageCarouselItemStyle:F}=getProductImagesStyles.getProductImagesStyles(g),O=system.createStyle({...styles.getFeaturedImageOnlyOneImageStyle({setting:g,options:{enableRadius:!0,enableHeight:!0}})}),{featuredImageCarouselSettingAttrs:w}=getProductImagesAttr.getProductImagesAttr(g);return jsxRuntime.jsx("div",{ref:p,"data-slot":"children",className:"product-feature-image",children:P?jsxRuntime.jsx(Carousel.default,{ref:I,parentClass:n,elmRef:s,setting:w,styles:q,builderProps:{uid:d},isHiddenArrowWhenDisabled:!0,onLoaded:e=>u&&u(e),onChangeActive:e=>R(e),onClickArrow:()=>o&&o(x()),moveToIdx:j,disableMarginAuto:!0,thumbsSwiper:`#gp-carousel-${d}-carousel`,onHandleChangeSlideByInteraction:e=>{let t=C?.length??0,r=e>=t?0:e;a(C?.[r]?.id??"",y)},children:C?.map(e=>jsxRuntime.jsx(CarouselItem.default,{contentType:"productImage",className:M("gp-ft-image-item !gp-min-w-full !gp-max-w-full"),onClickItem:()=>{let t=core.getResponsiveValueByScreen(g?.ftClickOpenLightBox,A);"none"!==t&&a(e?.id??"",y)},style:F,onMouseMove:e=>hoverAction.handleMouseMove(e,g),onMouseOut:e=>hoverAction.handleMouseOut(e),children:jsxRuntime.jsx(ProductFeaturedImageOnly.default,{image:e,imageShowWhenHover:v,setting:g,aspectRatio:f()})},e?.id))}):jsxRuntime.jsx("div",{ref:s,className:"gp-flex gp-w-full",style:{...core.makeStyleResponsive("jc",g?.align)},"data-id":d,children:jsxRuntime.jsx("div",{"aria-hidden":"true",className:S,style:O,onMouseMove:e=>hoverAction.handleMouseMove(e,g),onMouseOut:e=>hoverAction.handleMouseOut(e),onBlur:()=>void 0,onClick:()=>{a(h?.id??"",y)},children:jsxRuntime.jsx(ProductFeaturedImageOnly.default,{image:m?r?.[0]:h,imageShowWhenHover:v,setting:g,aspectRatio:f(m?r?.[0]:h)})})})})});var ProductFeaturedImageCarousel$1=React.memo(ProductFeaturedImageCarousel);exports.default=ProductFeaturedImageCarousel$1;
