"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,...m}=e,g=React.useRef(null),{ref:I,imageActive:p,imageActiveIndex:h,imageShowWhenHover:j,enableOpenLightBox:v,filteredProductImages:y,isRenderFeatureCarousel:C,genRandomKey:P,getAspectRatioFinal:x,emitUpdateActiveIndex:f}=useProductFeaturedImageCarousel.useProductFeaturedImageCarousel(e);React.useImperativeHandle(t,()=>({getSwiper:()=>g.current?.getSwiper()||null}));let R=core.useCurrentDevice(),{galleryItemClasses:A,featureImageOnlyOneImageClasses:M}=getProductImagesClassName.getProductImagesClassName(m),{featuredImageCarouselStyle:S,featureImageCarouselItemStyle:q}=getProductImagesStyles.getProductImagesStyles(m),F=system.createStyle({...styles.getFeaturedImageOnlyOneImageStyle({setting:m,options:{enableRadius:!0,enableHeight:!0}})}),{featuredImageCarouselSettingAttrs:O}=getProductImagesAttr.getProductImagesAttr(m);return jsxRuntime.jsx("div",{ref:I,"data-slot":"children",className:"product-feature-image",children:C?jsxRuntime.jsx(Carousel.default,{ref:g,parentClass:n,elmRef:s,setting:O,styles:S,builderProps:{uid:d},isHiddenArrowWhenDisabled:!0,onLoaded:e=>u&&u(e),onChangeActive:e=>f(e),onClickArrow:()=>o&&o(P()),moveToIdx:h,disableMarginAuto:!0,thumbsSwiper:`#gp-carousel-${d}-carousel`,onHandleChangeSlideByInteraction:e=>{let t=y?.length??0,r=e>=t?0:e;a(y?.[r]?.id??"",v)},children:y?.map(e=>jsxRuntime.jsx(CarouselItem.default,{contentType:"productImage",className:A("gp-ft-image-item !gp-min-w-full !gp-max-w-full"),onClickItem:()=>{let t=core.getResponsiveValueByScreen(m?.ftClickOpenLightBox,R);"none"!==t&&a(e?.id??"",v)},style:q,onMouseMove:e=>hoverAction.handleMouseMove(e,m),onMouseOut:e=>hoverAction.handleMouseOut(e),children:jsxRuntime.jsx(ProductFeaturedImageOnly.default,{image:e,imageShowWhenHover:j,setting:m,aspectRatio:x()})},e?.id))}):jsxRuntime.jsx("div",{ref:s,className:"gp-flex gp-w-full",style:{...core.makeStyleResponsive("jc",m?.align)},"data-id":d,children:jsxRuntime.jsx("div",{"aria-hidden":"true",className:M,style:F,onMouseMove:e=>hoverAction.handleMouseMove(e,m),onMouseOut:e=>hoverAction.handleMouseOut(e),onBlur:()=>void 0,onClick:()=>{a(p?.id??"",v)},children:jsxRuntime.jsx(ProductFeaturedImageOnly.default,{image:p,imageShowWhenHover:j,setting:m,aspectRatio:x(p)})})})})});var ProductFeaturedImageCarousel$1=React.memo(ProductFeaturedImageCarousel);exports.default=ProductFeaturedImageCarousel$1;
