import{jsx as e,Fragment as o,jsxs as t}from"react/jsx-runtime";import{useCurrentDevice as r,cls as i,getResponsiveValueByScreen as a,makeStyle as m}from"@gem-sdk/core";import{memo as l}from"react";import{getAspectRatio as s}from"../../common/common.js";import c from"../../../../../image/components/NextImage.js";import n from"../lightbox/ButtonOpenLightBox.js";import d from"./MediaIcon.js";import{isFeatureMedia as g,getZoomImageClass as p,getZoomLenClass as h}from"../../common/productFeaturedImage.js";import{handleMouseOut as y,handleMouseMove as f}from"../../common/hoverAction.js";import{getProductImagesClassName as u}from"../../composables/getProductImagesClassName.js";import{getProductImagesStyles as v}from"../../composables/getProductImagesStyles.js";import{useProductGalleryGrid as j}from"../../hooks/useProductGalleryGrid.js";var w=l(l=>{let{builderPropUID:w,productImages:T,onHandleClick:x,activeIndexFromFeatureImage:b,children:I,isHiddenInteraction:N,...k}=l,{isDisplay:E,shapeByLayout:G,imageActiveIndex:M,enableOpenLightBox:P,isEnableBorderActive:$,filteredProductImages:z}=j(l),B=r(),{galleryGridWrapperClasses:H,galleryItemClasses:O}=u(k),{galleryGridStyles:Z,galleryGridItemStyles:A}=v(k);return e(o,{children:E&&t("div",{"data-slot":"children","data-id":w,className:H,style:Z,"gp-data-hidden":`${N}`,children:[z?.map((o,r)=>{let l=r===M,u=g(o.contentType)?o.previewImage:o.src;return t("div",{"aria-hidden":!0,className:O(`gp-gallery-image-item gem-slider-item-${w}
                  ${l&&$?"gem-slider-item-active":""}`),onClick:()=>x(o?.id||"",P),style:A,onMouseMove:e=>f(e,{hoverEffect:k.galleryHoverEffect,zoom:k.galleryZoom,zoomType:k.galleryZoomType}),onMouseOut:e=>y(e),"data-border":l&&k?.borderActive?"active":"deactive",children:[e(c,{src:u,width:o?.width,height:o?.height,alt:o?.alt,setting:{aspectRatio:s(G),layout:k?.layout},style:{width:"100%",height:"100%"}},o?.id),e(d,{contentType:o?.contentType||""}),k?.galleryHoverEffect!=="none"&&!g(o?.contentType)&&e(c,{src:u,width:o?.width,height:o?.height,alt:o?.alt,setting:{layout:k.layout,aspectRatio:s(G)},className:i("hover-image !gp-max-w-none",p())}),k?.galleryHoverEffect=="zoom"&&k?.galleryZoomType=="glasses"&&["one-col","two-col"].includes(a(k.position,B)||"")&&!g(o?.contentType)&&e("div",{className:i(h(),"room-len"),style:{...m({bgi:`url("${o?.src}")`})}}),a(k?.clickOpenLightBox,B)&&e(n,{})]},o?.id)}),I]})})});export{w as default};
