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