import{template as e,isLocalEnv as o,baseAssetURL as r,WrapRenderChildren as s,RenderChildren as t}from"@gem-sdk/core";import{getConditionRenderGalleryImages as i,getStyleInsideLayout as a,setDefaultWhenUndefineSetting as p}from"./common/common.js";import l from"./components/feature-gallery/FeatureImageWithGallery.liquid.js";import d from"./components/gallery-carousel/GalleryCarousel.liquid.js";import m from"./components/gallery-grid/GalleryGrid.liquid.js";import{filterPageContext as c,getSettingPreloadData as u}from"../../../helpers.js";import{getShapeByLayout as n,sizeSettingDefaultForNewLayout as g}from"./common/productGallery.js";import{getProductImagesClassName as f}from"./composables/getProductImagesClassName.js";import{getProductImagesStyles as $}from"./composables/getProductImagesStyles.js";import{createAttr as y,LiquidIf as h,createClass as v,If as S,Liquid as j}from"@gem-sdk/system";import{getBorderActiveCss as F}from"./common/getBorderActiveCss.js";import{getStyleOfObject as I}from"../../helpers/function.js";let ProductImages=P=>{let C=p(P),{setting:G,styles:D,builderProps:b,style:z}=C,{rawChildren:O,pageContext:_}=P,{enableLazyLoadImage:N}=_??{},A={...G,...D},B=`
    {
      "id":${JSON.stringify(b?.uid)},
      "pageContext": ${JSON.stringify(c(_))},
      "setting":${JSON.stringify(G)},
      "styles":${JSON.stringify(D)},
      "productUrl":{{product.url | json | escape}},
      "product":{{product | json | escape}},
      "collectionUrl": {{ collection.url | json | escape }},
      "collection": {{ collection | json | escape}}
    }
  `,U=y({"section-id":"{{section.id}}","data-id":`${b?.uid}`}),{isOnlyFeatureAllDevices:k,isRenderGalleryGrid:q}=i(A?.position,G?.type),E=q?{}:y({"data-only-image":h("product.media.size > 1","false","true")}),{wrapperClasses:J,productImagesGalleryClasses:w}=f(P),T=v({"gp-grid gp-w-full !gp-m-0 gp-relative":!0}),x=v({"gp-w-full !gp-m-0 gp-relative":!0}),{wrapContainerStyle:L,wrapContainerStyleOnlyOneImage:M,galleryImageStyle:R}=$(A),V=n({shape:A.shape,shapeForBottom:A.shapeForBottom,shapeFor1Col:A.shapeFor1Col,shapeFor2Col:A.shapeFor2Col,shapeForFtOnly:A.shapeForFtOnly,shapeForInsideBottom:A.shapeForInsideBottom??g,shapeForInside:A.shapeForInside??g},A.position),W=a(A.position,V,A?.spacing),H=()=>e`
      ${s({uid:b?.uid||"",customProps:O?.[0].customProps},O?.map(o=>{if(o)return e`${t({...o,isInsideProductImage:!0,imageData:{imageShape:D?.ftShape,imageAlign:D?.align,imageLayout:D?.position},dotData:{dotSize:G?.ftDotSize,dotGapToCarousel:G?.ftDotGapToCarousel,dotStyle:G?.ftDotStyle}})}`}))}
    `,K=()=>e`
      <div
        class="${w}"
        style="${I(R)}"
        ${{...E}}
      >
        ${h("product.media.size > 1",d({builderPropUID:`gp-gallery-${b?.uid}`,...A,enableLazyLoadImage:N}))}
        ${S(q,m({builderPropUID:b?.uid,wrapperStyle:{...W},children:H(),...A,enableLazyLoadImage:N}))}
      </div>
    `,Q=()=>G?.borderActive?.border!=="none";return e`
  ${S(Q(),h("product.media.size > 1",`<style>${F({settings:A,uid:b?.uid,type:"Liquid"})}</style>`),"")}
  ${j(`
    {% assign featured_image = product.featured_image %}
    ${h("variant != null and variant.featured_image != null","{% assign featured_image = variant.featured_image %}")}
  `)}
    <gp-product-images-v3
      gp-data='${B}'
      ${{...U}}
      style="${{...z}}"
      class="${J}"
    >
      <div
        class="${h("product.media.size > 1",`${T}`,`${x}`)}"
        style="${h("product.media.size > 1",I(L),I(M))}"
      >
        ${l({builderPropUID:`gp-carousel-${b?.uid}`,...A,children:H(),enableLazyLoadImage:N})}
        ${S(!k,K())}
      </div>
    </gp-product-images-v3>
    ${S(o,`<script ${u('class="gps-link" delay',"src")}="{{ 'gp-product-images-v3-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${u('class="gps-link" delay',"src")}="${r}/assets-v2/gp-product-images-v3-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
  `};export{ProductImages as default};
