import{cls as e,makeStyle as t,RenderIf as i,isLocalEnv as r,baseAssetURL as s,template as o,getResponsiveValueByScreen as l}from"@gem-sdk/core";import{getFlexDirection as a}from"../helpers/product-image.js";import{checkAddOverFlowClass as p,getStyleAlignment as d,getDisplayStyle as m}from"./product-images/common/helpers.js";import g from"./product-images/ProductFeaturedImage.liquid.js";import u from"./product-images/ProductGalleryCarousel.liquid.js";import c from"./product-images/ProductGalleryGrid.liquid.js";import{getStyleGallerySpacing as f,getStyleWidthForGallery as n}from"./product-images/common/productGallery.js";import{getSettingPreloadData as b}from"../../helpers.js";let y=y=>{let{setting:$,styles:j,builderProps:h,style:v}=y,S={...y.styles,...y.setting},w={...y.styles,...y.setting},x=e=>l(j?.position,e),I=`
    {
      "id":${JSON.stringify(h?.uid)},
      "setting":${JSON.stringify($)},
      "styles":${JSON.stringify(j)},
      "product":{{ product | json | escape }}
    }
  `;return o`
  {% assign featured_image = product.featured_image %}
  {%- if variant != null and variant.featured_image != null -%}
  {% assign featured_image = variant.featured_image %}
  {%- endif -%}
  <gp-product-images
    gp-data='${I}'
    style="${{...v}}"
    class="${e({"gp-overflow-hidden":p(v)})}"
  >
    <div
        class="${e("gp-flex gp-w-full",{...a(y)})}"
        style="${{...d(j?.align,j?.position)}}"
      >
        ${g({...S})}
        {%- if product.media.size > 1 -%}
          <div
            class="${e("gallery-wrapper gp-product-images-gallery gp-inline-flex gp-h-fit gp-max-w-full",{"gp-justify-start":"bottom-left"==x("desktop"),"tablet:gp-justify-start":"bottom-left"==x("tablet"),"mobile:gp-justify-start":"bottom-left"==x("mobile"),"gp-justify-center":"bottom-center"==x("desktop"),"tablet:gp-justify-center":"bottom-center"==x("tablet"),"mobile:gp-justify-center":"bottom-center"==x("mobile"),"gp-mx-auto":"bottom-center"==x("desktop"),"tablet:gp-mx-auto":"bottom-center"==x("tablet"),"mobile:gp-mx-auto":"bottom-center"==x("mobile")})}"
            style="${{...t({fs:"1.23"}),...m(e=>!!$?.galleryVisible&&!l($?.galleryVisible,e),"inline-flex"),...n({galleryVisible:$?.galleryVisible,featureImageVisible:$?.featureImageVisible,position:j?.position,width:j?.width,widthHorizontalLayout:j?.widthHorizontalLayout}),...f(j?.position,j?.gallerySpacing)}}"
          >
            ${u({builderPropUID:h?.uid,...w})}
            ${c({builderPropUID:h?.uid,...w})}
          </div>
        {%- endif -%}
      </div>
  </gp-product-images>
  ${i(r,`<script ${b('class="gps-link" delay',"src")}="{{ 'gp-product-images.js' | asset_url }}" defer="defer"></script>`,`<script ${b('class="gps-link" delay',"src")}="${s}/assets-v2/gp-product-images.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
  `};export{y as default};
