@gem-sdk/components 17.0.0-dev.28 → 17.0.0-staging.5

package/dist/esm/product/components/product-images/ProductFeaturedImage.liquid.js

@@ -1,4 +1,27 @@
-import{cls as e,makeStyleResponsive as i,template as a,getResponsiveValueByScreen as t}from"@gem-sdk/core";import d from"../../../image/components/NextImage.liquid.js";import{getFeatureImageAspectRatio as r,getStyleFeaturedImageWidth as s,getStyleFeatureImageJustify as l,getZoomImageClass as o,getZoomLenClass as f}from"./common/productFeaturedImage.js";import{getDisplayStyle as m}from"./common/helpers.js";import n from"../../../image/components/Modal3d.liquid.js";import u from"../../../image/components/Video.liquid.js";let g=({...g})=>{let p=r(g.ftCustomAspectRadio,g.ftAspectRatio),c=g?.clickEffect!==void 0&&g?.clickEffect=="link",v=c?"a":"div",h=()=>u({src:"{{mediaSourceVideo}}",alt:"{{mediaVideoAlt}}",autoplay:!0,allowfullscreen:!0,controls:!0,style:{width:"100%",height:"100%"}}),_=e=>a`
+import{template as e,cls as i,makeStyleResponsive as a,getResponsiveValueByScreen as t}from"@gem-sdk/core";import d from"../../../image/components/NextImage.liquid.js";import{getFeatureImageAspectRatio as r,getStyleFeatureImageJustify as s,getStyleFeaturedImageWidth as l,getZoomImageClass as o,getZoomLenClass as f}from"./common/productFeaturedImage.js";import{getDisplayStyle as m}from"./common/helpers.js";import u from"../../../image/components/Modal3d.liquid.js";import n from"../../../image/components/Video.liquid.js";let ProductFeaturedImage=({...g})=>{let p=r(g.ftCustomAspectRadio,g.ftAspectRatio),c=g?.clickEffect!==void 0&&g?.clickEffect=="link",v=c?"a":"div",h=c?{href:"#"}:{role:"presentation"},_=()=>m(e=>!!g?.featureImageVisible&&!t(g?.featureImageVisible,e),"flex"),y=()=>`
+    {% assign featureMedia = product.media.first %}
+    {%- assign variant = product.selected_or_first_available_variant -%}
+    {% assign shouldHidden = '' %}
+    {% if featureMedia.media_type == 'model' %}
+      ${w()}
+    {% endif %}
+    {% if featureMedia.media_type == 'video' %}
+      ${M()}
+    {% endif %}
+    {% if featureMedia.media_type == 'external_video' %}
+      ${M()}
+    {% endif %}
+    {% if featureMedia.media_type != 'image' %}
+      {% assign shouldHidden = 'hidden' %}
+    {% endif %}
+    ${$(i("gp-w-full gp-transition-opacity",{"group-hover:gp-opacity-0":"other"==g.hoverEffect},"{{shouldHidden}}"))}
+    ${g?.hoverEffect!=="none"?`<div class="${i("zoom-element !gp-max-w-none",o())}">
+          ${$("image-zoom")}
+        </div>`:""}
+    ${g?.hoverEffect=="zoom"&&g?.zoomType=="glasses"?`
+    <div class="${i("zoom-lens-element",f())}"
+    style="opacity: 0; background-image: url('{{ product.featured_image.src | img_url: "1024x1024"}}')"></div>`:""}
+    `,w=()=>u({src:"{{featureMedia.sources.first.url}}",alt:"{{featureMedia.preview_image.alt}}",poster:"{{featureMedia.preview_image.src | product_img_url: '1024x1024'}}",cameraControls:!0,dataShopifyFeature:"1.12",arStatus:"not-presenting",style:{width:"100%",height:"100%"}}),M=()=>n({src:"{{mediaSourceVideo}}",alt:"{{mediaVideoAlt}}",autoplay:!0,allowfullscreen:!0,controls:!0,style:{width:"100%",height:"100%"}}),$=i=>e`
     ${d({src:`{%- if variant.featured_image != null -%}
               {{ variant.featured_image.src | img_url: '1024x1024'}}
             {%- elsif variant.featured_image == null -%}
@@ -21,14 +44,14 @@ import{cls as e,makeStyleResponsive as i,template as a,getResponsiveValueByScree
               {{variant.featured_image.alt}}
             {%- elsif variant.featured_image == null -%}
               {{featureMedia.alt | escape}}
-            {%- endif -%}`,setting:{layout:g?.ftLayout,aspectRatio:p},priority:!0,className:`gp-w-full featured-image-only ${e}`})}`;return a`<div
+            {%- endif -%}`,setting:{layout:g?.ftLayout,aspectRatio:p},priority:!0,className:`gp-w-full featured-image-only ${i}`})}`;return e`<div
   class="featured-image-root gp-product-images-ft gp-flex"
-  style="${{...l(g.position),...m(e=>!!g?.featureImageVisible&&!t(g?.featureImageVisible,e),"flex"),...s(g)}}"
+  style="${{...s(g.position),..._(),...l(g)}}"
 >
-  <${v} ${{...c?{href:"#"}:{role:"presentation"}}}
+  <${v} ${{...h}}
     media-type="{{product.featured_media.media_type}}"
-    class="featured-image-wrapper ${e("gp-relative gp-flex gp-w-full",{"gp-overflow-hidden":g?.zoomType!=="glasses"})}"
-    style="${{...i("aspect",p)}}"
+    class="featured-image-wrapper ${i("gp-relative gp-flex gp-w-full",{"gp-overflow-hidden":g?.zoomType!=="glasses"})}"
+    style="${{...a("aspect",p)}}"
   >
   <div class="gp-flex gp-w-full gp-items-start gp-justify-center">
     <div class="featured-image gp-group gp-relative gp-w-full gp-h-full gp-overflow-hidden gp-flex gp-items-center gp-justify-center">
@@ -63,31 +86,8 @@ import{cls as e,makeStyleResponsive as i,template as a,getResponsiveValueByScree
       <script type="module" defer="defer" src="https://cdn.shopify.com/shopifycloud/model-viewer/v1.12/model-viewer.js"></script>
     {% endif %}
 
-    ${`
-    {% assign featureMedia = product.media.first %}
-    {%- assign variant = product.selected_or_first_available_variant -%}
-    {% assign shouldHidden = '' %}
-    {% if featureMedia.media_type == 'model' %}
-      ${n({src:"{{featureMedia.sources.first.url}}",alt:"{{featureMedia.preview_image.alt}}",poster:"{{featureMedia.preview_image.src | product_img_url: '1024x1024'}}",cameraControls:!0,dataShopifyFeature:"1.12",arStatus:"not-presenting",style:{width:"100%",height:"100%"}})}
-    {% endif %}
-    {% if featureMedia.media_type == 'video' %}
-      ${h()}
-    {% endif %}
-    {% if featureMedia.media_type == 'external_video' %}
-      ${h()}
-    {% endif %}
-    {% if featureMedia.media_type != 'image' %}
-      {% assign shouldHidden = 'hidden' %}
-    {% endif %}
-    ${_(e("gp-w-full gp-transition-opacity",{"group-hover:gp-opacity-0":"other"==g.hoverEffect},"{{shouldHidden}}"))}
-    ${g?.hoverEffect!=="none"?`<div class="${e("zoom-element !gp-max-w-none",o())}">
-          ${_("image-zoom")}
-        </div>`:""}
-    ${g?.hoverEffect=="zoom"&&g?.zoomType=="glasses"?`
-    <div class="${e("zoom-lens-element",f())}"
-    style="opacity: 0; background-image: url('{{ product.featured_image.src | img_url: "1024x1024"}}')"></div>`:""}
-    `}
+    ${y()}
     </div>
   </div>
   </${v}>
-</div>`};export{g as default};
+</div>`};export{ProductFeaturedImage as default};

package/dist/esm/product/components/product-images/ProductGalleryCarousel.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as t,jsxs as e}from"react/jsx-runtime";import{useMemo as o}from"react";import i from"../../../carousel-v3/components/root/Carousel.js";import r from"../../../carousel-v3/components/item/CarouselItem.js";import{useCurrentDevice as l,useFeaturedImageGlobal as s,getResponsiveValueByScreen as p,makeAspectRatio as a,makeStyleResponsive as n,makeWidth as c,cls as d}from"@gem-sdk/core";import{convertSpacing as g}from"./common/helpers.js";import m from"../../../image/components/NextImage.js";import{getCarouselVerticalConfigByPosition as h,getAllowDotConfig as C}from"./common/productGallery.js";import{getDotStyleConfig as u}from"../product-images-v3/common/productGallery.js";let w=({builderPropUID:w,productImages:f,onHandleClick:b,...L})=>{let v=l(),y=s(),V=o(()=>{let t=f?.findIndex(t=>t.id===y?.id);return t&&t>0?t:0},[f,y]),R=o(()=>p(L?.position,v),[v,L?.position]),k=o(()=>{let t="left"===R||"right"===R;return t?{desktop:"auto",tablet:"auto",mobile:"auto"}:L?.slidesToShow},[R,L?.slidesToShow]),x=o(()=>({desktop:L?.customAspectRadio?.desktop?.width,tablet:L?.customAspectRadio?.tablet?.width,mobile:L?.customAspectRadio?.mobile?.width}),[L?.customAspectRadio]),A=o(()=>({desktop:L?.customAspectRadio?.desktop?.height,tablet:L?.customAspectRadio?.tablet?.height,mobile:L?.customAspectRadio?.mobile?.height}),[L?.customAspectRadio]),T=o(()=>a(L?.aspectRatio,x,A),[x,L?.aspectRatio,A]);return t(i,{setting:{loop:L?.loop,slidesToShow:k,dot:C(),dotStyle:u(),controlOverContent:L?.controlOverContent,enableDrag:{desktop:L?.dragToScroll,tablet:L?.dragToScroll,mobile:L?.dragToScroll},vertical:h(L.position),dotActiveColor:L?.dotActiveColor,dotColor:L?.dotColor,arrowCustom:L?.arrowIcon},styles:{sizeSetting:{desktop:{width:"100%",height:"auto"},tablet:{width:"100%",height:"auto"},mobile:{width:"100%",height:"auto"}},spacing:g(L?.spacing)},builderProps:{uid:w},isHiddenArrowWhenDisabled:!0,children:f?.map((o,i,l)=>{let s=i===V&&l.length>1,a="VIDEO"==o.contentType||"EXTERNAL_VIDEO"==o.contentType||"MODEL_3D"==o.contentType?o?.previewImage:o?.src;return e(r,{className:d(`gem-slider-item gem-slider-item-${w} gp-group gp-flex gp-w-full gp-items-center gp-justify-center gp-overflow-hidden gp-outline-1 -gp-outline-offset-1`,{"gp-outline":s&&!!L?.showActiveStatus}),onClickItem:()=>{b(o?.id||"")},style:{outlineColor:"var(--g-c-brand, brand)"},children:[t(m,{src:a,width:o?.width,height:o?.height,alt:o?.alt,setting:{aspectRatio:T,layout:L?.layout},style:{...n("w",c(L?.width,L?.fullWidth)),...n("aspect",L?.aspectRatio)}}),("VIDEO"==o.contentType||"EXTERNAL_VIDEO"==o.contentType)&&t("div",{className:"gp-absolute gp-bottom-0 gp-right-0 gp-pb-1 gp-pr-1",children:e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t("rect",{opacity:"0.9",width:"24",height:"24",rx:"3",fill:"#212121"}),t("path",{d:"M17.6869 12.2646L17.6868 12.2646L6.78379 18.4464C6.78378 18.4464 6.78376 18.4464 6.78374 18.4464C6.52931 18.5903 6.1665 18.4179 6.1665 18.0416V5.95844C6.1665 5.58218 6.52917 5.40981 6.7836 5.55354C6.78366 5.55357 6.78373 5.55361 6.78379 5.55365L17.6868 11.7354L17.6869 11.7354C17.8819 11.846 17.8819 12.154 17.6869 12.2646Z",stroke:"#F9F9F9",strokeMiterlimit:"10"})]})}),"MODEL_3D"==o.contentType&&t("div",{className:"gp-absolute gp-bottom-0 gp-right-0 gp-pb-1 gp-pr-1",children:e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t("rect",{opacity:"0.9",width:"24",height:"24",rx:"3",fill:"#212121"}),t("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11.7441 4.57034C11.9017 4.47655 12.098 4.47655 12.2555 4.57034L18.5889 8.33957C18.7404 8.42971 18.8332 8.59296 18.8332 8.76923V15.2308C18.8332 15.407 18.7404 15.5703 18.5889 15.6604L12.2555 19.4297C12.098 19.5234 11.9017 19.5234 11.7441 19.4297L5.41079 15.6604C5.25932 15.5703 5.1665 15.407 5.1665 15.2308V8.76923C5.1665 8.59296 5.25932 8.42971 5.41079 8.33957L11.7441 4.57034ZM6.1665 9.64865V14.9465L11.4998 18.1206V12.8227L6.1665 9.64865ZM12.4998 12.8227V18.1206L17.8332 14.9465V9.64865L12.4998 12.8227ZM17.3555 8.76923L11.9998 11.9566L6.64417 8.76923L11.9998 5.58185L17.3555 8.76923Z",fill:"#F9F9F9"})]})}),p(L?.largeViewInPopup,v)&&t("div",{className:"gp-absolute gp-inset-0 gp-flex gp-cursor-pointer gp-items-center gp-justify-center gp-bg-black/50 gp-opacity-0 gp-transition-all gp-duration-100 group-hover:gp-opacity-100",children:t("svg",{height:"100%",width:"100%",xmlns:"http://www.w3.org/2000/svg",className:"gp-h-6 gp-w-6",viewBox:"0 0 512 512",color:"#fff",children:t("path",{fill:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",d:"M62.2467 345.253C43.7072 326.714 29.1474 305.116 18.9714 281.057C8.42839 256.13 3.08301 229.671 3.08301 202.418C3.08301 175.165 8.43012 148.707 18.974 123.78C29.15 99.7213 43.7098 78.123 62.2485 59.5834C80.788 41.0439 102.386 26.4841 126.445 16.3081C151.372 5.76422 177.831 0.417969 205.084 0.417969C232.337 0.417969 258.794 5.76421 283.722 16.3064C307.78 26.4823 329.379 41.0422 347.918 59.5817C366.458 78.1212 381.017 99.7196 391.194 123.778C401.737 148.706 407.083 175.163 407.083 202.417C407.083 229.671 401.737 256.129 391.194 281.056C388.406 287.648 385.277 294.048 381.839 300.257L493.397 411.815C514.091 432.511 514.091 466.187 493.395 486.883L484.272 496.006C474.245 506.032 460.915 511.553 446.738 511.553C432.559 511.553 419.228 506.032 409.202 496.006L296.022 382.824C291.996 384.854 287.898 386.762 283.721 388.528C258.794 399.073 232.336 404.419 205.082 404.419C177.828 404.419 151.371 399.071 126.443 388.528C102.385 378.352 80.7863 363.793 62.2467 345.253ZM301.699 336.166C313.928 327.317 324.896 316.835 334.282 305.034C342.149 295.142 348.9 284.325 354.355 272.775C364.433 251.432 370.076 227.586 370.076 202.419C370.076 111.296 296.206 37.4253 205.083 37.4253C113.96 37.4253 40.0895 111.294 40.0895 202.418C40.0895 293.541 113.96 367.411 205.084 367.411C227.413 367.411 248.701 362.967 268.126 354.928C280.091 349.976 291.347 343.658 301.699 336.166ZM467.229 460.716C473.507 454.439 473.507 444.26 467.229 437.982L360.595 331.348C356.601 336.153 352.378 340.794 347.919 345.253C341.671 351.502 335.068 357.286 328.147 362.615L435.371 469.839C438.511 472.977 442.624 474.547 446.739 474.547C450.853 474.547 454.967 472.978 458.106 469.839L467.229 460.716ZM223.582 183.91H281.071C291.292 183.91 299.574 192.194 299.575 202.414C299.575 206.778 298.062 210.786 295.533 213.951C292.143 218.195 286.926 220.916 281.072 220.916H228.303H223.583V225.63V278.406C223.583 287.081 217.613 294.358 209.559 296.361C208.124 296.717 206.625 296.909 205.08 296.909C194.861 296.909 186.577 288.625 186.577 278.406V220.917H129.087C118.868 220.917 110.584 212.633 110.584 202.414C110.584 192.195 118.868 183.911 129.087 183.911H186.576V126.421C186.576 116.202 194.86 107.918 205.079 107.918C215.298 107.918 223.582 116.202 223.582 126.421V183.91Z"})})})]},o?.id)})})};export{w as default};
+import{jsx as t,jsxs as e}from"react/jsx-runtime";import{useMemo as o}from"react";import i from"../../../carousel-v3/components/root/Carousel.js";import r from"../../../carousel-v3/components/item/CarouselItem.js";import{useCurrentDevice as l,useFeaturedImageGlobal as s,getResponsiveValueByScreen as p,makeAspectRatio as a,cls as n,makeStyleResponsive as c,makeWidth as d}from"@gem-sdk/core";import{convertSpacing as g}from"./common/helpers.js";import m from"../../../image/components/NextImage.js";import{getAllowDotConfig as h,getCarouselVerticalConfigByPosition as C}from"./common/productGallery.js";import{getDotStyleConfig as u}from"../product-images-v3/common/productGallery.js";let ProductGalleryCarousel=({builderPropUID:w,productImages:f,onHandleClick:b,...L})=>{let v=l(),y=s(),V=o(()=>{let t=f?.findIndex(t=>t.id===y?.id);return t&&t>0?t:0},[f,y]),R=o(()=>p(L?.position,v),[v,L?.position]),k=o(()=>{let t="left"===R||"right"===R;return t?{desktop:"auto",tablet:"auto",mobile:"auto"}:L?.slidesToShow},[R,L?.slidesToShow]),x=o(()=>({desktop:L?.customAspectRadio?.desktop?.width,tablet:L?.customAspectRadio?.tablet?.width,mobile:L?.customAspectRadio?.mobile?.width}),[L?.customAspectRadio]),A=o(()=>({desktop:L?.customAspectRadio?.desktop?.height,tablet:L?.customAspectRadio?.tablet?.height,mobile:L?.customAspectRadio?.mobile?.height}),[L?.customAspectRadio]),T=o(()=>a(L?.aspectRatio,x,A),[x,L?.aspectRatio,A]);return t(i,{setting:{loop:L?.loop,slidesToShow:k,dot:h(),dotStyle:u(),controlOverContent:L?.controlOverContent,enableDrag:{desktop:L?.dragToScroll,tablet:L?.dragToScroll,mobile:L?.dragToScroll},vertical:C(L.position),dotActiveColor:L?.dotActiveColor,dotColor:L?.dotColor,arrowCustom:L?.arrowIcon},styles:{sizeSetting:{desktop:{width:"100%",height:"auto"},tablet:{width:"100%",height:"auto"},mobile:{width:"100%",height:"auto"}},spacing:g(L?.spacing)},builderProps:{uid:w},isHiddenArrowWhenDisabled:!0,children:f?.map((o,i,l)=>{let s=i===V&&l.length>1,a="VIDEO"==o.contentType||"EXTERNAL_VIDEO"==o.contentType||"MODEL_3D"==o.contentType?o?.previewImage:o?.src;return e(r,{className:n(`gem-slider-item gem-slider-item-${w} gp-group gp-flex gp-w-full gp-items-center gp-justify-center gp-overflow-hidden gp-outline-1 -gp-outline-offset-1`,{"gp-outline":s&&!!L?.showActiveStatus}),onClickItem:()=>{b(o?.id||"")},style:{outlineColor:"var(--g-c-brand, brand)"},children:[t(m,{src:a,width:o?.width,height:o?.height,alt:o?.alt,setting:{aspectRatio:T,layout:L?.layout},style:{...c("w",d(L?.width,L?.fullWidth)),...c("aspect",L?.aspectRatio)}}),("VIDEO"==o.contentType||"EXTERNAL_VIDEO"==o.contentType)&&t("div",{className:"gp-absolute gp-bottom-0 gp-right-0 gp-pb-1 gp-pr-1",children:e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t("rect",{opacity:"0.9",width:"24",height:"24",rx:"3",fill:"#212121"}),t("path",{d:"M17.6869 12.2646L17.6868 12.2646L6.78379 18.4464C6.78378 18.4464 6.78376 18.4464 6.78374 18.4464C6.52931 18.5903 6.1665 18.4179 6.1665 18.0416V5.95844C6.1665 5.58218 6.52917 5.40981 6.7836 5.55354C6.78366 5.55357 6.78373 5.55361 6.78379 5.55365L17.6868 11.7354L17.6869 11.7354C17.8819 11.846 17.8819 12.154 17.6869 12.2646Z",stroke:"#F9F9F9",strokeMiterlimit:"10"})]})}),"MODEL_3D"==o.contentType&&t("div",{className:"gp-absolute gp-bottom-0 gp-right-0 gp-pb-1 gp-pr-1",children:e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t("rect",{opacity:"0.9",width:"24",height:"24",rx:"3",fill:"#212121"}),t("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11.7441 4.57034C11.9017 4.47655 12.098 4.47655 12.2555 4.57034L18.5889 8.33957C18.7404 8.42971 18.8332 8.59296 18.8332 8.76923V15.2308C18.8332 15.407 18.7404 15.5703 18.5889 15.6604L12.2555 19.4297C12.098 19.5234 11.9017 19.5234 11.7441 19.4297L5.41079 15.6604C5.25932 15.5703 5.1665 15.407 5.1665 15.2308V8.76923C5.1665 8.59296 5.25932 8.42971 5.41079 8.33957L11.7441 4.57034ZM6.1665 9.64865V14.9465L11.4998 18.1206V12.8227L6.1665 9.64865ZM12.4998 12.8227V18.1206L17.8332 14.9465V9.64865L12.4998 12.8227ZM17.3555 8.76923L11.9998 11.9566L6.64417 8.76923L11.9998 5.58185L17.3555 8.76923Z",fill:"#F9F9F9"})]})}),p(L?.largeViewInPopup,v)&&t("div",{className:"gp-absolute gp-inset-0 gp-flex gp-cursor-pointer gp-items-center gp-justify-center gp-bg-black/50 gp-opacity-0 gp-transition-all gp-duration-100 group-hover:gp-opacity-100",children:t("svg",{height:"100%",width:"100%",xmlns:"http://www.w3.org/2000/svg",className:"gp-h-6 gp-w-6",viewBox:"0 0 512 512",color:"#fff",children:t("path",{fill:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",d:"M62.2467 345.253C43.7072 326.714 29.1474 305.116 18.9714 281.057C8.42839 256.13 3.08301 229.671 3.08301 202.418C3.08301 175.165 8.43012 148.707 18.974 123.78C29.15 99.7213 43.7098 78.123 62.2485 59.5834C80.788 41.0439 102.386 26.4841 126.445 16.3081C151.372 5.76422 177.831 0.417969 205.084 0.417969C232.337 0.417969 258.794 5.76421 283.722 16.3064C307.78 26.4823 329.379 41.0422 347.918 59.5817C366.458 78.1212 381.017 99.7196 391.194 123.778C401.737 148.706 407.083 175.163 407.083 202.417C407.083 229.671 401.737 256.129 391.194 281.056C388.406 287.648 385.277 294.048 381.839 300.257L493.397 411.815C514.091 432.511 514.091 466.187 493.395 486.883L484.272 496.006C474.245 506.032 460.915 511.553 446.738 511.553C432.559 511.553 419.228 506.032 409.202 496.006L296.022 382.824C291.996 384.854 287.898 386.762 283.721 388.528C258.794 399.073 232.336 404.419 205.082 404.419C177.828 404.419 151.371 399.071 126.443 388.528C102.385 378.352 80.7863 363.793 62.2467 345.253ZM301.699 336.166C313.928 327.317 324.896 316.835 334.282 305.034C342.149 295.142 348.9 284.325 354.355 272.775C364.433 251.432 370.076 227.586 370.076 202.419C370.076 111.296 296.206 37.4253 205.083 37.4253C113.96 37.4253 40.0895 111.294 40.0895 202.418C40.0895 293.541 113.96 367.411 205.084 367.411C227.413 367.411 248.701 362.967 268.126 354.928C280.091 349.976 291.347 343.658 301.699 336.166ZM467.229 460.716C473.507 454.439 473.507 444.26 467.229 437.982L360.595 331.348C356.601 336.153 352.378 340.794 347.919 345.253C341.671 351.502 335.068 357.286 328.147 362.615L435.371 469.839C438.511 472.977 442.624 474.547 446.739 474.547C450.853 474.547 454.967 472.978 458.106 469.839L467.229 460.716ZM223.582 183.91H281.071C291.292 183.91 299.574 192.194 299.575 202.414C299.575 206.778 298.062 210.786 295.533 213.951C292.143 218.195 286.926 220.916 281.072 220.916H228.303H223.583V225.63V278.406C223.583 287.081 217.613 294.358 209.559 296.361C208.124 296.717 206.625 296.909 205.08 296.909C194.861 296.909 186.577 288.625 186.577 278.406V220.917H129.087C118.868 220.917 110.584 212.633 110.584 202.414C110.584 192.195 118.868 183.911 129.087 183.911H186.576V126.421C186.576 116.202 194.86 107.918 205.079 107.918C215.298 107.918 223.582 116.202 223.582 126.421V183.91Z"})})})]},o?.id)})})};export{ProductGalleryCarousel as default};

package/dist/esm/product/components/product-images/ProductGalleryCarousel.liquid.js

@@ -1,4 +1,4 @@
-import{template as e,makeStyleResponsive as i,makeWidth as t,getResponsiveValueByScreen as o}from"@gem-sdk/core";import r from"../../../image/components/NextImage.liquid.js";import{convertSpacing as a,getDisplayStyle as d}from"./common/helpers.js";import{getGalleryImageAspectRatio as l,getCarouselVerticalConfigByPosition as s,getAllowDotConfig as p,getSliderPerShowConfig as g,getZoomDisplay as n}from"./common/productGallery.js";import{getStyleOfObject as m}from"../../helpers/function.js";import{getDotStyleConfig as c}from"../product-images-v3/common/productGallery.js";import u from"../../../carousel-v3/components/root/Carousel.liquid.js";import C from"../../../carousel-v3/components/item/CarouselItem.liquid.js";let f=({builderPropUID:f,...h})=>{let v=l(h?.customAspectRadio,h?.aspectRatio),w=(i,t)=>e`${r({src:"{{media.preview_image | product_img_url: '1024x1024'}}",width:"{{media.width}}",height:"{{media.height}}",alt:"{{media.alt | escape}}",setting:i,style:t})}`,y=e=>`
+import{template as e,getResponsiveValueByScreen as i,makeStyleResponsive as t,makeWidth as o}from"@gem-sdk/core";import r from"../../../image/components/NextImage.liquid.js";import{convertSpacing as a,getDisplayStyle as l}from"./common/helpers.js";import{getGalleryImageAspectRatio as d,getSliderPerShowConfig as s,getAllowDotConfig as p,getCarouselVerticalConfigByPosition as g,getZoomDisplay as n}from"./common/productGallery.js";import{getStyleOfObject as m}from"../../helpers/function.js";import{getDotStyleConfig as c}from"../product-images-v3/common/productGallery.js";import u from"../../../carousel-v3/components/root/Carousel.liquid.js";import C from"../../../carousel-v3/components/item/CarouselItem.liquid.js";let ProductGalleryCarousel=({builderPropUID:f,...h})=>{let v=d(h?.customAspectRadio,h?.aspectRatio),w=()=>l(e=>!("slider"===i(h?.type,e)||["left","right"].includes(i(h?.position,e)||"")),"flex"),y=(i,t)=>e`${r({src:"{{media.preview_image | product_img_url: '1024x1024'}}",width:"{{media.width}}",height:"{{media.height}}",alt:"{{media.alt | escape}}",setting:i,style:t})}`,L=e=>`
     {% if media.media_type == 'video' %}
       {% assign mediaSourceUrl = media.sources.last.url %}
     {% endif %}
@@ -9,7 +9,7 @@ import{template as e,makeStyleResponsive as i,makeWidth as t,getResponsiveValueB
       {% assign mediaSourceUrl = media.src %}
     {% endif %}
     ${C({id:"{{imageID}}",className:`gp-group gp-flex gp-w-full gp-items-center gp-justify-center gp-overflow-hidden gp-outline-1 -gp-outline-offset-1 image-item data-[outline=active]:gp-outline data-[outline=active]:gp-p-[1px] ${e}`,parentId:`${f}-{{product.id}}`,builderAttrs:{"data-outline":e?"active":"deactive"},style:{"outline-color":"var(--g-c-brand, brand)"},children:`
-      ${w({aspectRatio:v,layout:h?.layout},{...i("w",t(h?.width,h?.fullWidth)),...i("aspect",h?.aspectRatio)})}
+      ${y({aspectRatio:v,layout:h?.layout},{...t("w",o(h?.width,h?.fullWidth)),...t("aspect",h?.aspectRatio)})}
 
       {% if media.media_type == 'video' or media.media_type == 'external_video' %}
       <div class="gp-absolute gp-pb-1 gp-pr-1 gp-right-0 gp-bottom-0" >
@@ -48,7 +48,7 @@ import{template as e,makeStyleResponsive as i,makeWidth as t,getResponsiveValueB
           />
         </svg>
       </div>
-    `})}`;return e`${u({rootId:`${f}-{{product.id}}`,rootClass:"gp-flex-1 gp-w-full carousel-gallery",rootAttrs:{type:"grid-carousel"},isHiddenArrowWhenDisabled:!0,setting:{navigationStyle:{desktop:"none"},loop:h?.loop,slidesToShow:g(h?.slidesToShow,h?.position),dot:p(),dotStyle:c(),controlOverContent:h?.controlOverContent,enableDrag:{desktop:h?.dragToScroll,tablet:h?.dragToScroll,mobile:h?.dragToScroll},vertical:s(h.position),dotActiveColor:h?.dotActiveColor,dotColor:h?.dotColor,arrowCustom:h?.arrowIcon},rootStyles:{...d(e=>!("slider"===o(h?.type,e)||["left","right"].includes(o(h?.position,e)||"")),"flex")},styles:{sizeSetting:{desktop:{width:"100%",height:"auto"},tablet:{width:"100%",height:"auto"},mobile:{width:"100%",height:"auto"}},spacing:a(h?.spacing)},children:`
+    `})}`;return e`${u({rootId:`${f}-{{product.id}}`,rootClass:"gp-flex-1 gp-w-full carousel-gallery",rootAttrs:{type:"grid-carousel"},isHiddenArrowWhenDisabled:!0,setting:{navigationStyle:{desktop:"none"},loop:h?.loop,slidesToShow:s(h?.slidesToShow,h?.position),dot:p(),dotStyle:c(),controlOverContent:h?.controlOverContent,enableDrag:{desktop:h?.dragToScroll,tablet:h?.dragToScroll,mobile:h?.dragToScroll},vertical:g(h.position),dotActiveColor:h?.dotActiveColor,dotColor:h?.dotColor,arrowCustom:h?.arrowIcon},rootStyles:{...w()},styles:{sizeSetting:{desktop:{width:"100%",height:"auto"},tablet:{width:"100%",height:"auto"},mobile:{width:"100%",height:"auto"}},spacing:a(h?.spacing)},children:`
     {%- if product.media.size > 1 -%}
     {%- for media in product.media -%}
     {% if media.media_type == 'image' %}
@@ -62,11 +62,11 @@ import{template as e,makeStyleResponsive as i,makeWidth as t,getResponsiveValueB
       {% assign imageID = '' %}
     {% endif %}
       {%- if media.id == product.featured_media.id -%}
-        ${y(h?.showActiveStatus?"p-[1px]":"")}
+        ${L(h?.showActiveStatus?"p-[1px]":"")}
       {% else %}
-        ${y()}
+        ${L()}
       {%- endif -%}
     {% endfor %}
     {%- endif -%}
     `})}
-  `};export{f as default};
+  `};export{ProductGalleryCarousel as default};

package/dist/esm/product/components/product-images/ProductGalleryGrid.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as t,jsxs as e}from"react/jsx-runtime";import{useCurrentDevice as o,useFeaturedImageGlobal as i,getResponsiveValueByScreen as p,makeAspectRatio as r,makeStyleResponsive as l,cls as s}from"@gem-sdk/core";import{useMemo as g}from"react";import{convertSpacingPx as a}from"./common/helpers.js";import c from"../../../image/components/NextImage.js";import{getStyleWidthForGridItem as n}from"./common/productGallery.js";let d=({builderPropUID:d,productImages:h,onHandleClick:C,...m})=>{let u=o(),w=i(),f=g(()=>{let t=h?.findIndex(t=>t.id===w?.id);return t&&t>0?t:0},[h,w]),b=g(()=>p(m?.position,u),[u,m?.position]),L=g(()=>({desktop:m?.customAspectRadio?.desktop?.width,tablet:m?.customAspectRadio?.tablet?.width,mobile:m?.customAspectRadio?.mobile?.width}),[m?.customAspectRadio]),v=g(()=>({desktop:m?.customAspectRadio?.desktop?.height,tablet:m?.customAspectRadio?.tablet?.height,mobile:m?.customAspectRadio?.mobile?.height}),[m?.customAspectRadio]),y=g(()=>r(m?.aspectRatio,L,v),[L,m?.aspectRatio,v]);return t("div",{className:s("gp-flex gp-h-fit gp-w-full gp-flex-wrap",{"!gp-flex-nowrap gp-overflow-y-auto scrollbar:gp-w-[6px] scrollbar-track:gp-rounded-2xl scrollbar-thumb:gp-rounded-2xl scrollbar-thumb:gp-bg-gray-400":"left"===b||"right"===b,"!gp-items-end":"left"===b,"!gp-items-start":"right"===b,"gp-justify-center":"bottom-center"===b}),style:{...l("gg",a(m?.spacing))},children:h?.map((o,i)=>{let r="VIDEO"==o.contentType||"EXTERNAL_VIDEO"==o.contentType||"MODEL_3D"==o.contentType?o?.previewImage:o?.src;return e("div",{"aria-hidden":!0,className:s("gp-group gp-relative gp-cursor-pointer gp-overflow-hidden gp-outline-1 -gp-outline-offset-1",{"gp-outline":i===f&&!!m?.showActiveStatus}),onClick:()=>C(o?.id||""),style:{...l("aspect",m?.aspectRatio),...n(m?.numberPerRow,m?.spacing,m?.position),maxWidth:"100%",outlineColor:"var(--g-c-brand, brand)"},children:[t(c,{src:r,width:o?.width,height:o?.height,alt:o?.alt,setting:{aspectRatio:y,layout:m?.layout},style:{width:"100%",height:"100%"}},o?.id),("VIDEO"==o.contentType||"EXTERNAL_VIDEO"==o.contentType)&&t("div",{className:"gp-absolute gp-bottom-0 gp-right-0 gp-pb-1 gp-pr-1",children:e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t("rect",{opacity:"0.9",width:"24",height:"24",rx:"3",fill:"#212121"}),t("path",{d:"M17.6869 12.2646L17.6868 12.2646L6.78379 18.4464C6.78378 18.4464 6.78376 18.4464 6.78374 18.4464C6.52931 18.5903 6.1665 18.4179 6.1665 18.0416V5.95844C6.1665 5.58218 6.52917 5.40981 6.7836 5.55354C6.78366 5.55357 6.78373 5.55361 6.78379 5.55365L17.6868 11.7354L17.6869 11.7354C17.8819 11.846 17.8819 12.154 17.6869 12.2646Z",stroke:"#F9F9F9",strokeMiterlimit:"10"})]})}),"MODEL_3D"==o.contentType&&t("div",{className:"gp-absolute gp-bottom-0 gp-right-0 gp-pb-1 gp-pr-1",children:e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t("rect",{opacity:"0.9",width:"24",height:"24",rx:"3",fill:"#212121"}),t("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11.7441 4.57034C11.9017 4.47655 12.098 4.47655 12.2555 4.57034L18.5889 8.33957C18.7404 8.42971 18.8332 8.59296 18.8332 8.76923V15.2308C18.8332 15.407 18.7404 15.5703 18.5889 15.6604L12.2555 19.4297C12.098 19.5234 11.9017 19.5234 11.7441 19.4297L5.41079 15.6604C5.25932 15.5703 5.1665 15.407 5.1665 15.2308V8.76923C5.1665 8.59296 5.25932 8.42971 5.41079 8.33957L11.7441 4.57034ZM6.1665 9.64865V14.9465L11.4998 18.1206V12.8227L6.1665 9.64865ZM12.4998 12.8227V18.1206L17.8332 14.9465V9.64865L12.4998 12.8227ZM17.3555 8.76923L11.9998 11.9566L6.64417 8.76923L11.9998 5.58185L17.3555 8.76923Z",fill:"#F9F9F9"})]})}),p(m?.largeViewInPopup,u)&&t("div",{className:"gp-absolute gp-inset-0 gp-flex gp-cursor-pointer gp-items-center gp-justify-center gp-bg-black/50 gp-opacity-0 gp-transition-all gp-duration-100 group-hover:gp-opacity-100",children:t("svg",{height:"100%",width:"100%",xmlns:"http://www.w3.org/2000/svg",className:"gp-h-6 gp-w-6",viewBox:"0 0 512 512",color:"#fff",children:t("path",{fill:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",d:"M62.2467 345.253C43.7072 326.714 29.1474 305.116 18.9714 281.057C8.42839 256.13 3.08301 229.671 3.08301 202.418C3.08301 175.165 8.43012 148.707 18.974 123.78C29.15 99.7213 43.7098 78.123 62.2485 59.5834C80.788 41.0439 102.386 26.4841 126.445 16.3081C151.372 5.76422 177.831 0.417969 205.084 0.417969C232.337 0.417969 258.794 5.76421 283.722 16.3064C307.78 26.4823 329.379 41.0422 347.918 59.5817C366.458 78.1212 381.017 99.7196 391.194 123.778C401.737 148.706 407.083 175.163 407.083 202.417C407.083 229.671 401.737 256.129 391.194 281.056C388.406 287.648 385.277 294.048 381.839 300.257L493.397 411.815C514.091 432.511 514.091 466.187 493.395 486.883L484.272 496.006C474.245 506.032 460.915 511.553 446.738 511.553C432.559 511.553 419.228 506.032 409.202 496.006L296.022 382.824C291.996 384.854 287.898 386.762 283.721 388.528C258.794 399.073 232.336 404.419 205.082 404.419C177.828 404.419 151.371 399.071 126.443 388.528C102.385 378.352 80.7863 363.793 62.2467 345.253ZM301.699 336.166C313.928 327.317 324.896 316.835 334.282 305.034C342.149 295.142 348.9 284.325 354.355 272.775C364.433 251.432 370.076 227.586 370.076 202.419C370.076 111.296 296.206 37.4253 205.083 37.4253C113.96 37.4253 40.0895 111.294 40.0895 202.418C40.0895 293.541 113.96 367.411 205.084 367.411C227.413 367.411 248.701 362.967 268.126 354.928C280.091 349.976 291.347 343.658 301.699 336.166ZM467.229 460.716C473.507 454.439 473.507 444.26 467.229 437.982L360.595 331.348C356.601 336.153 352.378 340.794 347.919 345.253C341.671 351.502 335.068 357.286 328.147 362.615L435.371 469.839C438.511 472.977 442.624 474.547 446.739 474.547C450.853 474.547 454.967 472.978 458.106 469.839L467.229 460.716ZM223.582 183.91H281.071C291.292 183.91 299.574 192.194 299.575 202.414C299.575 206.778 298.062 210.786 295.533 213.951C292.143 218.195 286.926 220.916 281.072 220.916H228.303H223.583V225.63V278.406C223.583 287.081 217.613 294.358 209.559 296.361C208.124 296.717 206.625 296.909 205.08 296.909C194.861 296.909 186.577 288.625 186.577 278.406V220.917H129.087C118.868 220.917 110.584 212.633 110.584 202.414C110.584 192.195 118.868 183.911 129.087 183.911H186.576V126.421C186.576 116.202 194.86 107.918 205.079 107.918C215.298 107.918 223.582 116.202 223.582 126.421V183.91Z"})})})]},o?.id)})})};export{d as default};
+import{jsx as t,jsxs as e}from"react/jsx-runtime";import{useCurrentDevice as o,useFeaturedImageGlobal as i,getResponsiveValueByScreen as r,makeAspectRatio as p,cls as l,makeStyleResponsive as s}from"@gem-sdk/core";import{useMemo as g}from"react";import{convertSpacingPx as a}from"./common/helpers.js";import c from"../../../image/components/NextImage.js";import{getStyleWidthForGridItem as n}from"./common/productGallery.js";let ProductGalleryGrid=({builderPropUID:d,productImages:h,onHandleClick:C,...m})=>{let u=o(),w=i(),f=g(()=>{let t=h?.findIndex(t=>t.id===w?.id);return t&&t>0?t:0},[h,w]),b=g(()=>r(m?.position,u),[u,m?.position]),L=g(()=>({desktop:m?.customAspectRadio?.desktop?.width,tablet:m?.customAspectRadio?.tablet?.width,mobile:m?.customAspectRadio?.mobile?.width}),[m?.customAspectRadio]),v=g(()=>({desktop:m?.customAspectRadio?.desktop?.height,tablet:m?.customAspectRadio?.tablet?.height,mobile:m?.customAspectRadio?.mobile?.height}),[m?.customAspectRadio]),y=g(()=>p(m?.aspectRatio,L,v),[L,m?.aspectRatio,v]);return t("div",{className:l("gp-flex gp-h-fit gp-w-full gp-flex-wrap",{"!gp-flex-nowrap gp-overflow-y-auto scrollbar:gp-w-[6px] scrollbar-track:gp-rounded-2xl scrollbar-thumb:gp-rounded-2xl scrollbar-thumb:gp-bg-gray-400":"left"===b||"right"===b,"!gp-items-end":"left"===b,"!gp-items-start":"right"===b,"gp-justify-center":"bottom-center"===b}),style:{...s("gg",a(m?.spacing))},children:h?.map((o,i)=>{let p=i===f,g="VIDEO"==o.contentType||"EXTERNAL_VIDEO"==o.contentType||"MODEL_3D"==o.contentType?o?.previewImage:o?.src;return e("div",{"aria-hidden":!0,className:l("gp-group gp-relative gp-cursor-pointer gp-overflow-hidden gp-outline-1 -gp-outline-offset-1",{"gp-outline":p&&!!m?.showActiveStatus}),onClick:()=>C(o?.id||""),style:{...s("aspect",m?.aspectRatio),...n(m?.numberPerRow,m?.spacing,m?.position),maxWidth:"100%",outlineColor:"var(--g-c-brand, brand)"},children:[t(c,{src:g,width:o?.width,height:o?.height,alt:o?.alt,setting:{aspectRatio:y,layout:m?.layout},style:{width:"100%",height:"100%"}},o?.id),("VIDEO"==o.contentType||"EXTERNAL_VIDEO"==o.contentType)&&t("div",{className:"gp-absolute gp-bottom-0 gp-right-0 gp-pb-1 gp-pr-1",children:e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t("rect",{opacity:"0.9",width:"24",height:"24",rx:"3",fill:"#212121"}),t("path",{d:"M17.6869 12.2646L17.6868 12.2646L6.78379 18.4464C6.78378 18.4464 6.78376 18.4464 6.78374 18.4464C6.52931 18.5903 6.1665 18.4179 6.1665 18.0416V5.95844C6.1665 5.58218 6.52917 5.40981 6.7836 5.55354C6.78366 5.55357 6.78373 5.55361 6.78379 5.55365L17.6868 11.7354L17.6869 11.7354C17.8819 11.846 17.8819 12.154 17.6869 12.2646Z",stroke:"#F9F9F9",strokeMiterlimit:"10"})]})}),"MODEL_3D"==o.contentType&&t("div",{className:"gp-absolute gp-bottom-0 gp-right-0 gp-pb-1 gp-pr-1",children:e("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t("rect",{opacity:"0.9",width:"24",height:"24",rx:"3",fill:"#212121"}),t("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11.7441 4.57034C11.9017 4.47655 12.098 4.47655 12.2555 4.57034L18.5889 8.33957C18.7404 8.42971 18.8332 8.59296 18.8332 8.76923V15.2308C18.8332 15.407 18.7404 15.5703 18.5889 15.6604L12.2555 19.4297C12.098 19.5234 11.9017 19.5234 11.7441 19.4297L5.41079 15.6604C5.25932 15.5703 5.1665 15.407 5.1665 15.2308V8.76923C5.1665 8.59296 5.25932 8.42971 5.41079 8.33957L11.7441 4.57034ZM6.1665 9.64865V14.9465L11.4998 18.1206V12.8227L6.1665 9.64865ZM12.4998 12.8227V18.1206L17.8332 14.9465V9.64865L12.4998 12.8227ZM17.3555 8.76923L11.9998 11.9566L6.64417 8.76923L11.9998 5.58185L17.3555 8.76923Z",fill:"#F9F9F9"})]})}),r(m?.largeViewInPopup,u)&&t("div",{className:"gp-absolute gp-inset-0 gp-flex gp-cursor-pointer gp-items-center gp-justify-center gp-bg-black/50 gp-opacity-0 gp-transition-all gp-duration-100 group-hover:gp-opacity-100",children:t("svg",{height:"100%",width:"100%",xmlns:"http://www.w3.org/2000/svg",className:"gp-h-6 gp-w-6",viewBox:"0 0 512 512",color:"#fff",children:t("path",{fill:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",d:"M62.2467 345.253C43.7072 326.714 29.1474 305.116 18.9714 281.057C8.42839 256.13 3.08301 229.671 3.08301 202.418C3.08301 175.165 8.43012 148.707 18.974 123.78C29.15 99.7213 43.7098 78.123 62.2485 59.5834C80.788 41.0439 102.386 26.4841 126.445 16.3081C151.372 5.76422 177.831 0.417969 205.084 0.417969C232.337 0.417969 258.794 5.76421 283.722 16.3064C307.78 26.4823 329.379 41.0422 347.918 59.5817C366.458 78.1212 381.017 99.7196 391.194 123.778C401.737 148.706 407.083 175.163 407.083 202.417C407.083 229.671 401.737 256.129 391.194 281.056C388.406 287.648 385.277 294.048 381.839 300.257L493.397 411.815C514.091 432.511 514.091 466.187 493.395 486.883L484.272 496.006C474.245 506.032 460.915 511.553 446.738 511.553C432.559 511.553 419.228 506.032 409.202 496.006L296.022 382.824C291.996 384.854 287.898 386.762 283.721 388.528C258.794 399.073 232.336 404.419 205.082 404.419C177.828 404.419 151.371 399.071 126.443 388.528C102.385 378.352 80.7863 363.793 62.2467 345.253ZM301.699 336.166C313.928 327.317 324.896 316.835 334.282 305.034C342.149 295.142 348.9 284.325 354.355 272.775C364.433 251.432 370.076 227.586 370.076 202.419C370.076 111.296 296.206 37.4253 205.083 37.4253C113.96 37.4253 40.0895 111.294 40.0895 202.418C40.0895 293.541 113.96 367.411 205.084 367.411C227.413 367.411 248.701 362.967 268.126 354.928C280.091 349.976 291.347 343.658 301.699 336.166ZM467.229 460.716C473.507 454.439 473.507 444.26 467.229 437.982L360.595 331.348C356.601 336.153 352.378 340.794 347.919 345.253C341.671 351.502 335.068 357.286 328.147 362.615L435.371 469.839C438.511 472.977 442.624 474.547 446.739 474.547C450.853 474.547 454.967 472.978 458.106 469.839L467.229 460.716ZM223.582 183.91H281.071C291.292 183.91 299.574 192.194 299.575 202.414C299.575 206.778 298.062 210.786 295.533 213.951C292.143 218.195 286.926 220.916 281.072 220.916H228.303H223.583V225.63V278.406C223.583 287.081 217.613 294.358 209.559 296.361C208.124 296.717 206.625 296.909 205.08 296.909C194.861 296.909 186.577 288.625 186.577 278.406V220.917H129.087C118.868 220.917 110.584 212.633 110.584 202.414C110.584 192.195 118.868 183.911 129.087 183.911H186.576V126.421C186.576 116.202 194.86 107.918 205.079 107.918C215.298 107.918 223.582 116.202 223.582 126.421V183.91Z"})})})]},o?.id)})})};export{ProductGalleryGrid as default};

package/dist/esm/product/components/product-images/ProductGalleryGrid.liquid.js

@@ -1,4 +1,4 @@
-import{cls as e,makeStyleResponsive as i,template as t,getResponsiveValueByScreen as a}from"@gem-sdk/core";import{getGalleryImageAspectRatio as r,getClassJustifyByPosition as o,getClassOverflowAndFlexWrapForGrid as d,getStyleWidthForGridItem as l,getZoomDisplay as p}from"./common/productGallery.js";import{getStyleOfObject as s}from"../../helpers/function.js";import g from"../../../image/components/NextImage.liquid.js";import{convertSpacingPx as m,getDisplayStyle as n}from"./common/helpers.js";let c=({builderPropUID:c,...u})=>{let C=r(u?.customAspectRadio,u?.aspectRatio),f=(e,i)=>t`${g({src:"{{media.preview_image | product_img_url: '1024x1024'}}",width:"{{media.width}}",height:"{{media.height}}",alt:"{{media.alt | escape}}",setting:e,style:i})}`,h=t=>`
+import{template as e,cls as i,makeStyleResponsive as t,getResponsiveValueByScreen as a}from"@gem-sdk/core";import{getGalleryImageAspectRatio as r,getClassOverflowAndFlexWrapForGrid as o,getClassJustifyByPosition as d,getStyleWidthForGridItem as l,getZoomDisplay as p}from"./common/productGallery.js";import{getStyleOfObject as s}from"../../helpers/function.js";import g from"../../../image/components/NextImage.liquid.js";import{convertSpacingPx as m,getDisplayStyle as n}from"./common/helpers.js";let ProductGalleryCarousel=({builderPropUID:c,...u})=>{let C=r(u?.customAspectRadio,u?.aspectRatio),f=()=>n(e=>"slider"===a(u?.type,e)||["left","right"].includes(a(u?.position,e)||""),"flex"),h=(i,t)=>e`${g({src:"{{media.preview_image | product_img_url: '1024x1024'}}",width:"{{media.width}}",height:"{{media.height}}",alt:"{{media.alt | escape}}",setting:i,style:t})}`,v=e=>`
     {% if media.media_type == 'video' %}
       {% assign mediaSourceUrl = media.sources.last.url %}
     {% endif %}
@@ -18,8 +18,8 @@ import{cls as e,makeStyleResponsive as i,template as t,getResponsiveValueByScree
       media-last-source-url="{{mediaSourceUrl}}"
       external-id="{{media.external_id}}"
       grid-index="{{forloop.index}}"
-      data-outline="${t?"active":"deactive"}" class="image-item ${t} data-[outline=active]:gp-outline data-[outline=active]:gp-p-[1px] ${e("gp-group gp-relative gp-overflow-hidden gp-outline-1 -gp-outline-offset-1 gp-cursor-pointer")}"
-      style="${s({...i("aspect",u?.aspectRatio),...l(u?.numberPerRow,u?.spacing,u?.position),"outline-color":"var(--g-c-brand, brand)","max-width":"100%"})}"
+      data-outline="${e?"active":"deactive"}" class="image-item ${e} data-[outline=active]:gp-outline data-[outline=active]:gp-p-[1px] ${i("gp-group gp-relative gp-overflow-hidden gp-outline-1 -gp-outline-offset-1 gp-cursor-pointer")}"
+      style="${s({...t("aspect",u?.aspectRatio),...l(u?.numberPerRow,u?.spacing,u?.position),"outline-color":"var(--g-c-brand, brand)","max-width":"100%"})}"
       >
       {% if media.media_type == 'video' or media.media_type == 'external_video' %}
         <div class="gp-absolute gp-pb-1 gp-pr-1 gp-right-0 gp-bottom-0" >
@@ -39,7 +39,7 @@ import{cls as e,makeStyleResponsive as i,template as t,getResponsiveValueByScree
       </div>
       {% endif %}
 
-      ${f({aspectRatio:C,layout:u?.layout},{width:"100%",height:"100%"})}
+      ${h({aspectRatio:C,layout:u?.layout},{width:"100%",height:"100%"})}
 
       <div class="gp-absolute gp-inset-0 gp-flex gp-cursor-pointer gp-items-center gp-justify-center gp-bg-black/50 gp-opacity-0 gp-transition-opacity gp-duration-100 group-hover:gp-opacity-100"
         style="${s(p(u?.largeViewInPopup))}" >
@@ -59,10 +59,10 @@ import{cls as e,makeStyleResponsive as i,template as t,getResponsiveValueByScree
             />
           </svg>
         </div>
-      </div>`;return t`
+      </div>`;return e`
   <div type="grid-gallery"
-    class="${e("grid-gallery gp-flex gp-h-fit gp-w-full gp-flex-wrap scrollbar-track:gp-rounded-2xl scrollbar-thumb:gp-rounded-2xl scrollbar-thumb:gp-bg-gray-400",{...d(u?.position),...o(u?.position)})}"
-    style="${{...n(e=>"slider"===a(u?.type,e)||["left","right"].includes(a(u?.position,e)||""),"flex"),...i("gg",m(u?.spacing))}}"
+    class="${i("grid-gallery gp-flex gp-h-fit gp-w-full gp-flex-wrap scrollbar-track:gp-rounded-2xl scrollbar-thumb:gp-rounded-2xl scrollbar-thumb:gp-bg-gray-400",{...o(u?.position),...d(u?.position)})}"
+    style="${{...f(),...t("gg",m(u?.spacing))}}"
   >
     {%- if product.media.size > 1 -%}
       {%- for media in product.media -%}
@@ -77,10 +77,10 @@ import{cls as e,makeStyleResponsive as i,template as t,getResponsiveValueByScree
           {% assign imageID = '' %}
         {% endif %}
         {%- if media.id == product.featured_media.id -%}
-            ${h(u?.showActiveStatus?"p-[1px]":"")}
+            ${v(u?.showActiveStatus?"p-[1px]":"")}
         {% else %}
-          ${h()}
+          ${v()}
         {%- endif -%}
       {% endfor %}
     {% endif %}
-  </div>`};export{c as default};
+  </div>`};export{ProductGalleryCarousel as default};

package/dist/esm/product/components/product-images/ProductImagesLightBox.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as e}from"react/jsx-runtime";import{useFeaturedImageGlobal as t,cls as o}from"@gem-sdk/core";import i from"../../../carousel-v3/components/root/Carousel.js";import l from"../../../carousel-v3/components/item/CarouselItem.js";import s from"../../../image/components/NextImage.js";import"../../../modal/components/confirm.js";import r from"../../../modal/components/Modal.js";import{useMemo as m}from"react";import{isFeatureMedia as n}from"./common/productFeaturedImage.js";let d=({builderPropUID:d,productImages:p,open:a,imageRatio:c,onHandleClose:g})=>{let h=t(),b=m(()=>{let e=p?.findIndex(e=>e.id===h?.id);return e&&e>0?e:0},[p,h]),u={desktop:p&&p.length>1,mobile:p&&p?.length>1,tablet:p&&p?.length>1};return e(r,{setting:{open:a},styles:{width:"80%"},closeOnClickOutside:!0,onClose:()=>g(),disableIframeClickEvent:!0,contentClass:"mobile:!gp-w-[100%] gp-px-2",children:e(i,{setting:{loop:{desktop:!1,mobile:!1,tablet:!1},slidesToShow:{desktop:1,tablet:1,mobile:1},defaultCurrentSlider:b,dot:{desktop:!0,mobile:!0,tablet:!0},dotStyle:{desktop:"outside",mobile:"outside",tablet:"outside"},dotColor:{desktop:"#E2E2E2",mobile:"#E2E2E2",tablet:"#E2E2E2"},dotActiveColor:{desktop:"#121212",mobile:"#121212",tablet:"#121212"},controlOverContent:{desktop:!0,mobile:!0,tablet:!0},arrow:u},styles:{sizeSetting:{desktop:{height:"80vh"},tablet:{height:"80vh"},mobile:{height:"60vh"}}},moveToIdx:b,hiddenDotWhenOnlyOne:!0,isHiddenArrowWhenDisabled:!0,builderProps:{uid:d},children:p?.map(t=>e(l,{className:`gem-slider-item gem-slider-item-${d} gp-flex gp-items-center gp-justify-center gp-px-4`,children:e(s,{src:n(t?.contentType)?t?.previewImage:t?.src,width:t?.width,height:t?.height,alt:t?.alt,"content-type":t?.contentType,setting:{aspectRatio:c},className:o("gp-h-full gp-w-full gp-object-contain")},t?.id)},t?.id))})})};export{d as default};
+import{jsx as e}from"react/jsx-runtime";import{useFeaturedImageGlobal as t,cls as o}from"@gem-sdk/core";import i from"../../../carousel-v3/components/root/Carousel.js";import l from"../../../carousel-v3/components/item/CarouselItem.js";import s from"../../../image/components/NextImage.js";import"../../../modal/components/confirm.js";import r from"../../../modal/components/Modal.js";import{useMemo as m}from"react";import{isFeatureMedia as n}from"./common/productFeaturedImage.js";let ProductImagesLightBox=({builderPropUID:d,productImages:p,open:a,imageRatio:c,onHandleClose:g})=>{let h=t(),b=m(()=>{let e=p?.findIndex(e=>e.id===h?.id);return e&&e>0?e:0},[p,h]),u={desktop:p&&p.length>1,mobile:p&&p?.length>1,tablet:p&&p?.length>1},f={desktop:!1,mobile:!1,tablet:!1};return e(r,{setting:{open:a},styles:{width:"80%"},closeOnClickOutside:!0,onClose:()=>g(),disableIframeClickEvent:!0,contentClass:"mobile:!gp-w-[100%] gp-px-2",children:e(i,{setting:{loop:f,slidesToShow:{desktop:1,tablet:1,mobile:1},defaultCurrentSlider:b,dot:{desktop:!0,mobile:!0,tablet:!0},dotStyle:{desktop:"outside",mobile:"outside",tablet:"outside"},dotColor:{desktop:"#E2E2E2",mobile:"#E2E2E2",tablet:"#E2E2E2"},dotActiveColor:{desktop:"#121212",mobile:"#121212",tablet:"#121212"},controlOverContent:{desktop:!0,mobile:!0,tablet:!0},arrow:u},styles:{sizeSetting:{desktop:{height:"80vh"},tablet:{height:"80vh"},mobile:{height:"60vh"}}},moveToIdx:b,hiddenDotWhenOnlyOne:!0,isHiddenArrowWhenDisabled:!0,builderProps:{uid:d},children:p?.map(t=>e(l,{className:`gem-slider-item gem-slider-item-${d} gp-flex gp-items-center gp-justify-center gp-px-4`,children:e(s,{src:n(t?.contentType)?t?.previewImage:t?.src,width:t?.width,height:t?.height,alt:t?.alt,"content-type":t?.contentType,setting:{aspectRatio:c},className:o("gp-h-full gp-w-full gp-object-contain")},t?.id)},t?.id))})})};export{ProductImagesLightBox as default};

package/dist/esm/product/components/product-images/common/helpers.js

@@ -1 +1 @@
-import{makeStyleResponsive as e,getResponsiveValueByScreen as t}from"@gem-sdk/core";let l=(e,t)=>(t?.forEach(t=>{e?.[t]=="flex-start"?e={...e,[t]:"start"}:e?.[t]=="flex-end"&&(e={...e,[t]:"end"})}),e),r=e=>{let t=e?.desktop,l=e?.tablet===void 0?t:e?.tablet,r=e?.mobile===void 0?l:e?.mobile;return{desktop:t,tablet:l,mobile:r}},o=(e,t)=>{if(!e)return t;if("number"==typeof e)return e;let l=e.replaceAll("px","").replaceAll("%","").replaceAll("rem","").replaceAll("em","");return isNaN(Number(l))?t:Number(l)},p=e=>e?{desktop:o(e.desktop,5),tablet:o(e.tablet,5),mobile:o(e.mobile,5)}:{desktop:5},b=e=>e?{desktop:`${o(e.desktop,5)}px`,tablet:`${o(e.tablet,5)}px`,mobile:`${o(e.mobile,5)}px`}:{desktop:"5px"},i=(e,t)=>{let l={};return["desktop","mobile","tablet"].forEach(r=>{l={...l,[`--d${"desktop"===r?"":`-${r}`}`]:`${e(r)?"none":t}`}}),l},n=(r,o)=>{let p={},b=["desktop","mobile","tablet"];return b.forEach(i=>{p=e("jc",l(r,b));let n=t(o,i);n?.includes("bottom")&&(p=e("ai",l(r,b)))}),p},a=e=>{let t=e?.["--radius"],l=e?.["--bblr"]||"0px",r=e?.["--bbrr"]||"0px",o=e?.["--btlr"]||"0px",p=e?.["--btrr"]||"0px";return t&&!t.toString().includes("none")&&"0"!==t.toString()||"0px"!==l||"0px"!==r||"0px"!==o||"0px"!==p};export{a as checkAddOverFlowClass,p as convertSpacing,b as convertSpacingPx,o as convertUnitToNumber,i as getDisplayStyle,n as getStyleAlignment,r as getTypeWidthDevice,l as updateAlignStyles};
+import{makeStyleResponsive as e,getResponsiveValueByScreen as t}from"@gem-sdk/core";let updateAlignStyles=(e,t)=>(t?.forEach(t=>{e?.[t]=="flex-start"?e={...e,[t]:"start"}:e?.[t]=="flex-end"&&(e={...e,[t]:"end"})}),e),getTypeWidthDevice=e=>{let t=e?.desktop,l=e?.tablet===void 0?t:e?.tablet,r=e?.mobile===void 0?l:e?.mobile;return{desktop:t,tablet:l,mobile:r}},convertUnitToNumber=(e,t)=>{if(!e)return t;if("number"==typeof e)return e;let l=e.replaceAll("px","").replaceAll("%","").replaceAll("rem","").replaceAll("em","");return isNaN(Number(l))?t:Number(l)},convertSpacing=e=>e?{desktop:convertUnitToNumber(e.desktop,5),tablet:convertUnitToNumber(e.tablet,5),mobile:convertUnitToNumber(e.mobile,5)}:{desktop:5},convertSpacingPx=e=>e?{desktop:`${convertUnitToNumber(e.desktop,5)}px`,tablet:`${convertUnitToNumber(e.tablet,5)}px`,mobile:`${convertUnitToNumber(e.mobile,5)}px`}:{desktop:"5px"},getDisplayStyle=(e,t)=>{let l={},r=["desktop","mobile","tablet"];return r.forEach(r=>{l={...l,[`--d${"desktop"===r?"":`-${r}`}`]:`${e(r)?"none":t}`}}),l},getStyleAlignment=(l,r)=>{let o={},n=["desktop","mobile","tablet"];return n.forEach(i=>{o=e("jc",updateAlignStyles(l,n));let p=t(r,i);p?.includes("bottom")&&(o=e("ai",updateAlignStyles(l,n)))}),o},checkAddOverFlowClass=e=>{let t=e?.["--radius"],l=e?.["--bblr"]||"0px",r=e?.["--bbrr"]||"0px",o=e?.["--btlr"]||"0px",n=e?.["--btrr"]||"0px";return t&&!t.toString().includes("none")&&"0"!==t.toString()||"0px"!==l||"0px"!==r||"0px"!==o||"0px"!==n};export{checkAddOverFlowClass,convertSpacing,convertSpacingPx,convertUnitToNumber,getDisplayStyle,getStyleAlignment,getTypeWidthDevice,updateAlignStyles};

package/dist/esm/product/components/product-images/common/productFeaturedImage.js

@@ -1 +1 @@
-import{makeAspectRatio as e,getResponsiveValueByScreen as t,makeStyleResponsive as l,makeWidth as o}from"@gem-sdk/core";let r=["mobile","tablet","desktop"],a=e=>!!e&&["EXTERNAL_VIDEO","MODEL_3D","VIDEO"].includes(e),i=e=>{let a=e?.ftWidth;return r.forEach(l=>{let o=t(e?.position,l),r=t(e?.galleryVisible,l);a={...a,[l]:("left"===o||"right"===o)&&r?t(e?.ftWidthHorizontalLayout,l):t(e?.ftWidth,l)}}),{...l("w",o(a,{desktop:!1,tablet:!1,mobile:!1}))}},p=(e,t)=>{if(!e)return t;if("number"==typeof e)return e;let l="string"==typeof e?e.replaceAll("px","").replaceAll("%","").replaceAll("rem","").replaceAll("em",""):t;return isNaN(Number(l))?t:Number(l)},g=e=>({desktop:e?.desktop?.width,tablet:e?.tablet?.width,mobile:e?.mobile?.width}),s=e=>({desktop:e?.desktop?.height,tablet:e?.tablet?.height,mobile:e?.mobile?.height}),b=(t,l)=>e(l,g(t),s(t)),m=e=>{let o={desktop:"flex-start",mobile:"flex-start",tablet:"flex-start"};return["desktop","mobile","tablet"].forEach(l=>{let r=t(e,l);o={...o,[`${l}`]:"bottom-left"===r?"flex-start":"bottom-center"===r?"center":"left"===r?"flex-start":"flex-end"}}),l("jc",o)},d=()=>"!gp-flex gp-absolute gp-z-1 gp-h-[150px] gp-w-[150px] gp-cursor-none gp-rounded-full gp-bg-no-repeat gp-shadow-glasses gp-bg-white",f=()=>"gp-absolute gp-left-0 gp-top-0 gp-opacity-0 gp-transition-opacity gp-bg-white";export{p as convertUnitToNumber,b as getFeatureImageAspectRatio,m as getStyleFeatureImageJustify,i as getStyleFeaturedImageWidth,f as getZoomImageClass,d as getZoomLenClass,a as isFeatureMedia};
+import{getResponsiveValueByScreen as e,makeStyleResponsive as t,makeWidth as a,makeAspectRatio as l}from"@gem-sdk/core";let DEVICES=["mobile","tablet","desktop"],isFeatureMedia=e=>!!e&&["EXTERNAL_VIDEO","MODEL_3D","VIDEO"].includes(e),getStyleFeaturedImageWidth=l=>{let o={desktop:!1,tablet:!1,mobile:!1},r=l?.ftWidth;return DEVICES.forEach(t=>{let a=e(l?.position,t),o=e(l?.galleryVisible,t),g=("left"===a||"right"===a)&&o;r={...r,[t]:g?e(l?.ftWidthHorizontalLayout,t):e(l?.ftWidth,t)}}),{...t("w",a(r,o))}},convertUnitToNumber=(e,t)=>{if(!e)return t;if("number"==typeof e)return e;let a="string"==typeof e?e.replaceAll("px","").replaceAll("%","").replaceAll("rem","").replaceAll("em",""):t;return isNaN(Number(a))?t:Number(a)},getFeatureImageAspectWidth=e=>({desktop:e?.desktop?.width,tablet:e?.tablet?.width,mobile:e?.mobile?.width}),getFeatureImageAspectHeight=e=>({desktop:e?.desktop?.height,tablet:e?.tablet?.height,mobile:e?.mobile?.height}),getFeatureImageAspectRatio=(e,t)=>l(t,getFeatureImageAspectWidth(e),getFeatureImageAspectHeight(e)),getStyleFeatureImageJustify=a=>{let l={desktop:"flex-start",mobile:"flex-start",tablet:"flex-start"},o=["desktop","mobile","tablet"];return o.forEach(t=>{let o=e(a,t);l={...l,[`${t}`]:"bottom-left"===o?"flex-start":"bottom-center"===o?"center":"left"===o?"flex-start":"flex-end"}}),t("jc",l)},getZoomLenClass=()=>"!gp-flex gp-absolute gp-z-1 gp-h-[150px] gp-w-[150px] gp-cursor-none gp-rounded-full gp-bg-no-repeat gp-shadow-glasses gp-bg-white",getZoomImageClass=()=>"gp-absolute gp-left-0 gp-top-0 gp-opacity-0 gp-transition-opacity gp-bg-white";export{convertUnitToNumber,getFeatureImageAspectRatio,getStyleFeatureImageJustify,getStyleFeaturedImageWidth,getZoomImageClass,getZoomLenClass,isFeatureMedia};

package/dist/esm/product/components/product-images/common/productGallery.js

@@ -1 +1 @@
-import{getResponsiveValueByScreen as t,makeStyleResponsive as e,makeWidth as l,makeAspectRatio as o}from"@gem-sdk/core";import{convertUnitToNumber as i,getDisplayStyle as r}from"./helpers.js";let a=t=>({desktop:t?.desktop?.width,tablet:t?.tablet?.width,mobile:t?.mobile?.width}),p=t=>({desktop:t?.desktop?.height,tablet:t?.tablet?.height,mobile:t?.mobile?.height}),s=(t,e)=>o(e,a(t),p(t)),b=e=>{let l={};return["desktop","mobile","tablet"].forEach(o=>{let i=t(e,o);l="right"==i||"left"==i?{...l,[o]:!0}:{...l,[o]:!1}}),l},d=e=>r(l=>!t(e,l),"flex"),g=e=>{let l={};return["desktop","mobile","tablet"].forEach(o=>{let i=t(e,o);l={...l,[`${"desktop"===o?"":`${o}:`}!gp-flex-nowrap`]:"left"===i||"right"===i,[`${"desktop"===o?"":`${o}:`}gp-overflow-y-auto `]:"left"===i||"right"===i,[`${"desktop"===o?"":`${o}:`}!gp-items-end`]:"left"===i,[`${"desktop"===o?"":`${o}:`}!gp-items-start`]:"right"===i}}),l},m=()=>({desktop:!1,tablet:!1,mobile:!1}),h=e=>{let l={};return["desktop","mobile","tablet"].forEach(o=>{let i=t(e,o);l={...l,[`${"desktop"===o?"":`${o}:`}!gp-justify-center`]:"bottom-center"===i}}),l},f=(l,o,r)=>{let a={desktop:`${100/(l?.desktop||1)}%`,tablet:`${100/(l?.tablet||1)}%`,mobile:`${100/(l?.mobile||1)}%`};return["desktop","mobile","tablet"].forEach(e=>{let p=t(r,e);a={...a,[e]:`${"bottom-left"!==p&&"bottom-center"!==p&&p?"100%":`calc(${100/(l?.[e]||5)}% - ${i(o?.[e],5)*((l?.[e]||5)-1)/(l?.[e]||5)}px)`}`}}),e("w",a)},k=o=>{let i=o?.width;return["desktop","mobile","tablet"].forEach(e=>{let l=t(o?.galleryVisible,e),r=t(o?.featureImageVisible,e),a=t(o?.position,e);i={...i,[e]:("left"===a||"right"===a)&&l&&r?t(o?.widthHorizontalLayout,e):t(o?.width,e)}}),{...e("w",l(i,{desktop:!1,tablet:!1,mobile:!1}))}},n=(t,e)=>`--${t}${"desktop"===e?"":`-${e}`}`,$=(e,l)=>{let o={};return["desktop","mobile","tablet"].forEach(i=>{let r=t(e,i),a=n("mt",i),p=n("mr",i),s=n("ml",i);o="left"==r?{...o,[p]:t(l,i),[a]:"0px",[s]:"0px"}:"right"==r?{...o,[s]:t(l,i),[p]:"0px",[a]:"0px"}:{...o,[a]:t(l,i),[p]:"0px",[s]:"0px"}}),o},c=(e,l)=>{let o={};return["desktop","mobile","tablet"].forEach(i=>{let r=t(e,i),a=t(l,i);o={...o,[i]:"left"===a||"right"===a?"auto":r}}),o};export{m as getAllowDotConfig,b as getCarouselVerticalConfigByPosition,h as getClassJustifyByPosition,g as getClassOverflowAndFlexWrapForGrid,s as getGalleryImageAspectRatio,c as getSliderPerShowConfig,$ as getStyleGallerySpacing,k as getStyleWidthForGallery,f as getStyleWidthForGridItem,d as getZoomDisplay};
+import{getResponsiveValueByScreen as e,makeStyleResponsive as t,makeWidth as l,makeAspectRatio as o}from"@gem-sdk/core";import{convertUnitToNumber as i,getDisplayStyle as r}from"./helpers.js";let getGalleryImageAspectWidth=e=>({desktop:e?.desktop?.width,tablet:e?.tablet?.width,mobile:e?.mobile?.width}),getGalleryImageAspectHeight=e=>({desktop:e?.desktop?.height,tablet:e?.tablet?.height,mobile:e?.mobile?.height}),getGalleryImageAspectRatio=(e,t)=>o(t,getGalleryImageAspectWidth(e),getGalleryImageAspectHeight(e)),getCarouselVerticalConfigByPosition=t=>{let l=["desktop","mobile","tablet"],o={};return l.forEach(l=>{let i=e(t,l),r="right"==i||"left"==i;o=r?{...o,[l]:!0}:{...o,[l]:!1}}),o},getZoomDisplay=t=>r(l=>!e(t,l),"flex"),getClassOverflowAndFlexWrapForGrid=t=>{let l={},o=["desktop","mobile","tablet"];return o.forEach(o=>{let i=e(t,o);l={...l,[`${"desktop"===o?"":`${o}:`}!gp-flex-nowrap`]:"left"===i||"right"===i,[`${"desktop"===o?"":`${o}:`}gp-overflow-y-auto `]:"left"===i||"right"===i,[`${"desktop"===o?"":`${o}:`}!gp-items-end`]:"left"===i,[`${"desktop"===o?"":`${o}:`}!gp-items-start`]:"right"===i}}),l},getAllowDotConfig=()=>({desktop:!1,tablet:!1,mobile:!1}),getClassJustifyByPosition=t=>{let l={},o=["desktop","mobile","tablet"];return o.forEach(o=>{let i=e(t,o);l={...l,[`${"desktop"===o?"":`${o}:`}!gp-justify-center`]:"bottom-center"===i}}),l},getStyleWidthForGridItem=(l,o,r)=>{let a={desktop:`${100/(l?.desktop||1)}%`,tablet:`${100/(l?.tablet||1)}%`,mobile:`${100/(l?.mobile||1)}%`},g=["desktop","mobile","tablet"];return g.forEach(t=>{let g=e(r,t);a={...a,[t]:`${"bottom-left"!==g&&"bottom-center"!==g&&g?"100%":`calc(${100/(l?.[t]||5)}% - ${i(o?.[t],5)*((l?.[t]||5)-1)/(l?.[t]||5)}px)`}`}}),t("w",a)},getStyleWidthForGallery=o=>{let i={desktop:!1,tablet:!1,mobile:!1},r=o?.width,a=["desktop","mobile","tablet"];return a.forEach(t=>{let l=e(o?.galleryVisible,t),i=e(o?.featureImageVisible,t),a=e(o?.position,t),g=("left"===a||"right"===a)&&l&&i;r={...r,[t]:g?e(o?.widthHorizontalLayout,t):e(o?.width,t)}}),{...t("w",l(r,i))}},getDeviceProperty=(e,t)=>`--${e}${"desktop"===t?"":`-${t}`}`,getStyleGallerySpacing=(t,l)=>{let o={},i=["desktop","mobile","tablet"];return i.forEach(i=>{let r=e(t,i),a=getDeviceProperty("mt",i),g=getDeviceProperty("mr",i),p=getDeviceProperty("ml",i);o="left"==r?{...o,[g]:e(l,i),[a]:"0px",[p]:"0px"}:"right"==r?{...o,[p]:e(l,i),[g]:"0px",[a]:"0px"}:{...o,[a]:e(l,i),[g]:"0px",[p]:"0px"}}),o},getSliderPerShowConfig=(t,l)=>{let o={},i=["desktop","mobile","tablet"];return i.forEach(i=>{let r=e(t,i),a=e(l,i),g="left"===a||"right"===a;o={...o,[i]:g?"auto":r}}),o};export{getAllowDotConfig,getCarouselVerticalConfigByPosition,getClassJustifyByPosition,getClassOverflowAndFlexWrapForGrid,getGalleryImageAspectRatio,getSliderPerShowConfig,getStyleGallerySpacing,getStyleWidthForGallery,getStyleWidthForGridItem,getZoomDisplay};

package/dist/esm/product/components/product-images-v2/ProductImageV2.js

@@ -1,5 +1,5 @@
 'use client';
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{setDefaultWhenUndefineSetting as a,getAspectRatio as i}from"./common/common.js";import{useProductShopifyEditLink as C,useProduct as o,useCurrentDevice as l,useCurrentVariant as r,useSelectedOption as d,useEditorMode as n,useProductStore as s,useI18nStore as p,getResponsiveValueByScreen as m,filterToolbarPreview as c}from"@gem-sdk/core";import{useMemo as f,useState as g,useEffect as h,Children as u,isValidElement as y}from"react";import D from"./components/feature-gallery/FeatureImageWithGallery.js";import I from"./components/feature-only/OnlyFeatureImage.js";import b from"./components/lightbox/ProductImagesLightBox.js";import M from"../../../common/components/NoDataState.js";import{getProductImagesClassName as Z}from"./composables/getProductImagesClassName.js";import{getBorderActiveCss as k}from"./common/getBorderActiveCss.js";import w from"./components/gallery-grid/GalleryGrid.js";let E=e=>e?.medias?.edges.map(e=>e?.node),v=["bottom-left","bottom-center","left","right","inside-left","inside-right","inside-bottom"],V=V=>{let x=f(()=>a(V),[V]),{redirectProductShopifyLink:H}=C(),{setting:L,styles:S,builderProps:j,builderAttrs:O,style:P,children:A}=x,B=o(),F=l(),T=r(),{isChangeSelectedOption:N}=d(),G=n(),_=s(e=>e.setProductFeaturedImage),{t:R}=p(),[z,J]=g(!1),U=e=>e?.medias?.edges.find(e=>["VIDEO","EXTERNAL_VIDEO"].includes(e?.node?.contentType??""))?.node,W=e=>e?.featuredImage,X=e=>e?.medias?.edges.find(e=>e?.node?.contentType==="MODEL_3D")?.node,q=f(()=>L?.typeDisplay==="all-images"&&!N,[N,L?.typeDisplay]),K=f(()=>{if(q){let e;switch(L?.preDisplay){case"1st-images":e=W(B);break;case"1st-3d-mode":e=X(B);break;case"1st-video":e=U(B);break;case"1st-available-variant":e=T?.media}return _(e),e}},[q,L?.preDisplay,_,B,T?.media]),Q=f(()=>{let e=E(B);return e?.length?e:[{id:B?.featuredImage?.id||"noImageError",baseID:B?.featuredImage?.baseID||"noImageError",src:B?.featuredImage?.src||"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",width:B?.featuredImage?.width||480,height:B?.featuredImage?.height||480}]},[B]),Y=f(()=>Q.reduce((e,t,a)=>t?{...e,[t.id]:a}:e,{}),[Q]),$=f(()=>m(S?.position,F),[F,S?.position]),ee=(e,t)=>{ea(e),t&&et()},et=()=>{J(!0)},ea=e=>{if(!e)return;let t=Y[e];if(void 0!==t){let e=Q[t];e&&_(e)}};h(()=>{if(T&&!q){let e=Y[T?.mediaId];if(void 0!==e){let t=Q[e]??B?.featuredImage;t&&_(t)}}},[T,Y,Q,B?.featuredImage,_,q]);let ei=f(()=>{let e="popup"===m(L?.ftClickOpenLightBox,F)||m(L?.clickOpenLightBox,F);return e||"edit"!==G||window?.parent?.postMessage?.(JSON.stringify({type:"active-modal",value:open}),"*"),e},[L?.ftClickOpenLightBox,L?.clickOpenLightBox,F,G]),eC=()=>Q.length>0?u.map(c(A),t=>y(t)?e(t.type,{...t.props,isInsideProductImage:!0,navigationPosition:L?.ftNavigationPosition,imageData:{imageShape:S?.ftShape,imageAlign:S?.align,imageLayout:S?.position},dotData:{dotSize:L?.ftDotSize,dotGapToCarousel:L?.ftDotGapToCarousel,dotStyle:L?.ftDotStyle}}):null):null,eo=`
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{setDefaultWhenUndefineSetting as a,getAspectRatio as i}from"./common/common.js";import{useProductShopifyEditLink as C,useProduct as o,useCurrentDevice as l,useCurrentVariant as r,useSelectedOption as d,useEditorMode as n,useProductStore as s,useI18nStore as p,getResponsiveValueByScreen as m,filterToolbarPreview as c}from"@gem-sdk/core";import{useMemo as g,useState as f,useEffect as h,Children as u,isValidElement as y}from"react";import I from"./components/feature-gallery/FeatureImageWithGallery.js";import D from"./components/feature-only/OnlyFeatureImage.js";import b from"./components/lightbox/ProductImagesLightBox.js";import M from"../../../common/components/NoDataState.js";import{getProductImagesClassName as E}from"./composables/getProductImagesClassName.js";import{getBorderActiveCss as Z}from"./common/getBorderActiveCss.js";import k from"./components/gallery-grid/GalleryGrid.js";let getProductGallery=e=>e?.medias?.edges.map(e=>e?.node),LAYOUT_FEATURE_IMAGE_GALLERY=["bottom-left","bottom-center","left","right","inside-left","inside-right","inside-bottom"],ProductImagesV2=w=>{let L=g(()=>a(w),[w]),{redirectProductShopifyLink:A}=C(),{setting:V,styles:v,builderProps:x,builderAttrs:H,style:P,children:G}=L,O=o(),T=l(),_=r(),{isChangeSelectedOption:S}=d(),j=n(),F=s(e=>e.setProductFeaturedImage),{t:B}=p(),[R,N]=f(!1),U=e=>e?.medias?.edges.find(e=>["VIDEO","EXTERNAL_VIDEO"].includes(e?.node?.contentType??""))?.node,Y=e=>e?.featuredImage,z=e=>e?.medias?.edges.find(e=>e?.node?.contentType==="MODEL_3D")?.node,J=g(()=>V?.typeDisplay==="all-images"&&!S,[S,V?.typeDisplay]),W=g(()=>{if(J){let e;switch(V?.preDisplay){case"1st-images":e=Y(O);break;case"1st-3d-mode":e=z(O);break;case"1st-video":e=U(O);break;case"1st-available-variant":e=_?.media}return F(e),e}},[J,V?.preDisplay,F,O,_?.media]),X=g(()=>{let e=getProductGallery(O);return e?.length?e:[{id:O?.featuredImage?.id||"noImageError",baseID:O?.featuredImage?.baseID||"noImageError",src:O?.featuredImage?.src||"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",width:O?.featuredImage?.width||480,height:O?.featuredImage?.height||480}]},[O]),q=g(()=>X.reduce((e,t,a)=>t?{...e,[t.id]:a}:e,{}),[X]),K=g(()=>m(v?.position,T),[T,v?.position]),Q=(e,t)=>{ee(e),t&&$()},$=()=>{N(!0)},ee=e=>{if(!e)return;let t=q[e];if(void 0!==t){let e=X[t];e&&F(e)}};h(()=>{if(_&&!J){let e=q[_?.mediaId];if(void 0!==e){let t=X[e]??O?.featuredImage;t&&F(t)}}},[_,q,X,O?.featuredImage,F,J]);let et=g(()=>{let e="popup"===m(V?.ftClickOpenLightBox,T)||m(V?.clickOpenLightBox,T);return e||"edit"!==j||window?.parent?.postMessage?.(JSON.stringify({type:"active-modal",value:open}),"*"),e},[V?.ftClickOpenLightBox,V?.clickOpenLightBox,T,j]),ea=()=>X.length>0?u.map(c(G),t=>y(t)?e(t.type,{...t.props,isInsideProductImage:!0,navigationPosition:V?.ftNavigationPosition,imageData:{imageShape:v?.ftShape,imageAlign:v?.align,imageLayout:v?.position},dotData:{dotSize:V?.ftDotSize,dotGapToCarousel:V?.ftDotGapToCarousel,dotStyle:V?.ftDotStyle}}):null):null,ei=`
       <svg viewBox="0 0 452 400" fill="none" xmlns="http://www.w3.org/2000/svg">
         <path d="M0 7.99999C0 3.58171 3.58172 0 8 0H444C448.418 0 452 3.58172 452 8V392C452 396.418 448.418 400 444 400H8C3.58173 400 0 396.418 0 392V7.99999Z" fill="#F9F9F9"/>
         <path d="M208.148 348.801C239.683 348.75 265.245 347.272 265.242 345.499C265.239 343.726 239.673 342.33 208.138 342.381C176.603 342.432 151.041 343.91 151.044 345.683C151.047 347.456 176.614 348.851 208.148 348.801Z" fill="#E6E6E6"/>
@@ -23,4 +23,4 @@ import{jsx as e,jsxs as t}from"react/jsx-runtime";import{setDefaultWhenUndefineS
         <path opacity="0.2" d="M293.196 231.862C306.954 231.862 318.106 217.921 318.106 200.724C318.106 183.527 306.954 169.586 293.196 169.586C279.439 169.586 268.286 183.527 268.286 200.724C268.286 217.921 279.439 231.862 293.196 231.862Z" fill="white"/>
         <path opacity="0.2" d="M293.196 247.637C313.923 247.637 330.726 226.634 330.726 200.725C330.726 174.816 313.923 153.812 293.196 153.812C272.469 153.812 255.666 174.816 255.666 200.725C255.666 226.634 272.469 247.637 293.196 247.637Z" fill="white"/>
       </svg>
-    `,el=e(M,{elementType:"secondary",description:R("Catch your customer's attention with attracted media."),descriptionActions:[{text:R("Add image"),callback:H},{text:R("sync data"),callback:"syncProduct"}],additionalMedia:eo}),{wrapperClasses:er}=Z(V);return t("div",{...O,className:er,style:P,children:[e("style",{dangerouslySetInnerHTML:{__html:k({settings:{...L,...S},uid:j?.uid,type:"React"})}}),v.includes($)&&e(D,{...x,gallery:Q,priorityFeatureImage:K,onHandleClickImage:(e,t)=>ee(e||"",t),noDataChildren:el,children:eC()}),"only-feature"===$&&e(I,{gallery:Q,...x,onHandleClickImage:(e,t)=>ee(e||"",t),noDataChildren:el,children:eC()}),["one-col","two-col"].includes($)&&e(w,{gallery:Q,...x,onHandleClickImage:(e,t)=>ee(e||"",t),noDataChildren:el,children:eC()}),ei&&e(b,{productImages:Q,builderPropUID:j?.uid,open:z,onHandleClose:()=>J(!1),imageRatio:i(S?.ftShape)}),c(A,!0)]})};export{V as default};
+    `,eC=e(M,{elementType:"secondary",description:B("Catch your customer's attention with attracted media."),descriptionActions:[{text:B("Add image"),callback:A},{text:B("sync data"),callback:"syncProduct"}],additionalMedia:ei}),{wrapperClasses:eo}=E(w);return t("div",{...H,className:eo,style:P,children:[e("style",{dangerouslySetInnerHTML:{__html:Z({settings:{...V,...v},uid:x?.uid,type:"React"})}}),LAYOUT_FEATURE_IMAGE_GALLERY.includes(K)&&e(I,{...L,gallery:X,priorityFeatureImage:W,onHandleClickImage:(e,t)=>Q(e||"",t),noDataChildren:eC,children:ea()}),"only-feature"===K&&e(D,{gallery:X,...L,onHandleClickImage:(e,t)=>Q(e||"",t),noDataChildren:eC,children:ea()}),["one-col","two-col"].includes(K)&&e(k,{gallery:X,...L,onHandleClickImage:(e,t)=>Q(e||"",t),noDataChildren:eC,children:ea()}),et&&e(b,{productImages:X,builderPropUID:x?.uid,open:R,onHandleClose:()=>N(!1),imageRatio:i(v?.ftShape)}),c(G,!0)]})};export{ProductImagesV2 as default};

package/dist/esm/product/components/product-images-v2/ProductImagesV2.liquid.js

@@ -1,4 +1,4 @@
-import{isLocalEnv as e,baseAssetURL as o,template 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 S,If as j,Liquid as v}from"@gem-sdk/system";import{getBorderActiveCss as F}from"./common/getBorderActiveCss.js";import{getStyleOfObject as I}from"../../helpers/function.js";let C=C=>{let P=p(C),{setting:G,styles:D,builderProps:b,style:z}=P,{rawChildren:O,pageContext:_}=C,{enableLazyLoadImage:N}=_??{},A={...G,...D},B=`
+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 S,If as j,Liquid as v}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(_))},
@@ -9,10 +9,19 @@ import{isLocalEnv as e,baseAssetURL as o,template as r,WrapRenderChildren as s,R
       "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(C),T=S({"gp-grid gp-w-full !gp-m-0 gp-relative":!0}),x=S({"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=()=>r`
-      ${s({uid:b?.uid||"",customProps:O?.[0].customProps},O?.map(e=>{if(e)return r`${t({...e,isInsideProductImage:!0,imageData:{imageShape:D?.ftShape,imageAlign:D?.align,imageLayout:D?.position},dotData:{dotSize:G?.ftDotSize,dotGapToCarousel:G?.ftDotGapToCarousel,dotStyle:G?.ftDotStyle}})}`}))}
-    `;return r`
-  ${j(G?.borderActive?.border!=="none",h("product.media.size > 1",`<style>${F({settings:A,uid:b?.uid,type:"Liquid"})}</style>`),"")}
+  `,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=S({"gp-grid gp-w-full !gp-m-0 gp-relative":!0}),x=S({"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}))}
+        ${j(q,m({builderPropUID:b?.uid,wrapperStyle:{...W},children:H(),...A,enableLazyLoadImage:N}))}
+      </div>
+    `,Q=()=>G?.borderActive?.border!=="none";return e`
+  ${j(Q(),h("product.media.size > 1",`<style>${F({settings:A,uid:b?.uid,type:"Liquid"})}</style>`),"")}
   ${v(`
     {% assign featured_image = product.featured_image %}
     ${h("variant != null and variant.featured_image != null","{% assign featured_image = variant.featured_image %}")}
@@ -28,17 +37,8 @@ import{isLocalEnv as e,baseAssetURL as o,template as r,WrapRenderChildren as s,R
         style="${h("product.media.size > 1",I(L),I(M))}"
       >
         ${l({builderPropUID:`gp-carousel-${b?.uid}`,...A,children:H(),enableLazyLoadImage:N})}
-        ${j(!k,r`
-      <div
-        class="${w}"
-        style="${I(R)}"
-        ${{...E}}
-      >
-        ${h("product.media.size > 1",d({builderPropUID:`gp-gallery-${b?.uid}`,...A,enableLazyLoadImage:N}))}
-        ${j(q,m({builderPropUID:b?.uid,wrapperStyle:{...W},children:H(),...A,enableLazyLoadImage:N}))}
-      </div>
-    `)}
+        ${j(!k,K())}
       </div>
     </gp-product-images>
-    ${j(e,`<script ${u('class="gps-link" delay',"src")}="{{ 'gp-product-images-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${u('class="gps-link" delay',"src")}="${o}/assets-v2/gp-product-images-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
-  `};export{C as default};
+    ${j(o,`<script ${u('class="gps-link" delay',"src")}="{{ 'gp-product-images-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${u('class="gps-link" delay',"src")}="${r}/assets-v2/gp-product-images-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
+  `};export{ProductImages as default};

package/dist/esm/product/components/product-images-v2/common/attrs.js

@@ -1 +1 @@
-import{getResponsiveValueByScreen as o}from"@gem-sdk/core";import{getShapeByLayout as t,getSliderPerShowConfig as r,getCarouselVerticalConfigByPosition as e,getDotStyleConfig as a,getAllowDotConfig as i}from"./productGallery.js";import{getDotStyleForOnlyFeaturedImage as n}from"./productFeaturedImage.js";let d=["desktop","mobile","tablet"],s=i=>{let n=t({shape:i.shape,shapeForBottom:i.shapeForBottom,shapeFor1Col:i.shapeFor1Col,shapeFor2Col:i.shapeFor2Col,shapeForFtOnly:i.shapeForFtOnly,shapeForInsideBottom:i.shapeForInsideBottom,shapeForInside:i.shapeForInside},i.position),s=r(n,i.position),l={desktop:"inside"===o(i.navigationPosition,"desktop"),tablet:"inside"===o(i.navigationPosition,"tablet"),mobile:"inside"===o(i.navigationPosition,"mobile")},p=d.reduce((o,t)=>(i.navigationPosition?.[t]&&(o[t]="none"!==i.navigationPosition[t]),o),{});return{...i?.loop&&{loop:i.loop},itemNumber:s,dot:{desktop:!1,tablet:!1,mobile:!1},dotStyle:a(),controlOverContent:l,...i?.dragToScroll&&{enableDrag:{desktop:i.dragToScroll,tablet:i.dragToScroll,mobile:i.dragToScroll}},vertical:e(i.position),...i?.arrowIcon&&{arrowCustom:i.arrowIcon},arrowIconSize:i.arrowIconSize||{desktop:24},...i?.arrowIconColor&&{arrowCustomColor:i.arrowIconColor},...i?.arrowNavColor&&{arrowBackgroundColor:i.arrowNavColor},...i?.arrowNavBorder&&{arrowBorder:{desktop:i.arrowNavBorder}},...i?.arrowNavRadius&&{roundedArrow:{desktop:i.arrowNavRadius}},...i?.arrowNavShadow&&{arrowShadow:{desktop:i.arrowNavShadow}},sneakPeakType:{desktop:"center"},arrowGapToEachSide:"16",navigationStyle:i.navigationPosition,navigationEnable:p,arrowButtonSize:{desktop:{width:void 0,height:void 0}},animationMode:i?.ftAnimationMode,enableAction:{desktop:!0}}},l=t=>{let r={desktop:"inside"===o(t.ftNavigationPosition,"desktop"),tablet:"inside"===o(t.ftNavigationPosition,"tablet"),mobile:"inside"===o(t.ftNavigationPosition,"mobile")},e=d.reduce((o,r)=>(t.ftNavigationPosition?.[r]&&(o[r]="none"!==t.ftNavigationPosition[r]),o),{});return{...t?.ftLoop&&{loop:t.ftLoop},itemNumber:{desktop:1},dot:i(),dotStyle:n({position:t.position,dotStyle:t.ftDotStyle}),dotSize:t.ftDotSize??{desktop:12},dotGapToCarousel:t.ftDotGapToCarousel??{desktop:16},dotColor:t.ftDotColor??{desktop:"bg-1"},dotActiveColor:t.ftDotActiveColor??{desktop:"line-3"},controlOverContent:r,...t?.ftDragToScroll&&{enableDrag:{desktop:t.ftDragToScroll,tablet:t.ftDragToScroll,mobile:t.ftDragToScroll}},...t?.ftArrowIcon&&{arrowCustom:t.ftArrowIcon},arrowIconSize:t.ftArrowIconSize||{desktop:24},...t?.ftArrowIconColor&&{arrowCustomColor:t.ftArrowIconColor},...t?.ftArrowNavColor&&{arrowBackgroundColor:t.ftArrowNavColor},...t?.ftArrowNavBorder&&{arrowBorder:{desktop:t.ftArrowNavBorder}},...t?.ftArrowNavRadius&&{roundedArrow:{desktop:t.ftArrowNavRadius}},...t?.ftArrowNavShadow&&{arrowShadow:{desktop:t.ftArrowNavShadow}},sneakPeakType:{desktop:"center"},arrowGapToEachSide:"16",animationMode:t?.ftAnimationMode,...t?.ftNavigationPosition&&{navigationStyle:t.ftNavigationPosition},navigationEnable:e,arrowButtonSize:{desktop:{width:void 0,height:void 0}},enableAction:{desktop:!0}}};export{l as getFeaturedCarouselSettingAttr,s as getGalleryCarouselSettingAttr};
+import{getResponsiveValueByScreen as o}from"@gem-sdk/core";import{getShapeByLayout as t,getSliderPerShowConfig as r,getDotStyleConfig as e,getCarouselVerticalConfigByPosition as a,getAllowDotConfig as i}from"./productGallery.js";import{getDotStyleForOnlyFeaturedImage as n}from"./productFeaturedImage.js";let DEVICES=["desktop","mobile","tablet"],getGalleryCarouselSettingAttr=i=>{let n=t({shape:i.shape,shapeForBottom:i.shapeForBottom,shapeFor1Col:i.shapeFor1Col,shapeFor2Col:i.shapeFor2Col,shapeForFtOnly:i.shapeForFtOnly,shapeForInsideBottom:i.shapeForInsideBottom,shapeForInside:i.shapeForInside},i.position),d=r(n,i.position),l={desktop:"inside"===o(i.navigationPosition,"desktop"),tablet:"inside"===o(i.navigationPosition,"tablet"),mobile:"inside"===o(i.navigationPosition,"mobile")},s=DEVICES.reduce((o,t)=>(i.navigationPosition?.[t]&&(o[t]="none"!==i.navigationPosition[t]),o),{});return{...i?.loop&&{loop:i.loop},itemNumber:d,dot:{desktop:!1,tablet:!1,mobile:!1},dotStyle:e(),controlOverContent:l,...i?.dragToScroll&&{enableDrag:{desktop:i.dragToScroll,tablet:i.dragToScroll,mobile:i.dragToScroll}},vertical:a(i.position),...i?.arrowIcon&&{arrowCustom:i.arrowIcon},arrowIconSize:i.arrowIconSize||{desktop:24},...i?.arrowIconColor&&{arrowCustomColor:i.arrowIconColor},...i?.arrowNavColor&&{arrowBackgroundColor:i.arrowNavColor},...i?.arrowNavBorder&&{arrowBorder:{desktop:i.arrowNavBorder}},...i?.arrowNavRadius&&{roundedArrow:{desktop:i.arrowNavRadius}},...i?.arrowNavShadow&&{arrowShadow:{desktop:i.arrowNavShadow}},sneakPeakType:{desktop:"center"},arrowGapToEachSide:"16",navigationStyle:i.navigationPosition,navigationEnable:s,arrowButtonSize:{desktop:{width:void 0,height:void 0}},animationMode:i?.ftAnimationMode,enableAction:{desktop:!0}}},getFeaturedCarouselSettingAttr=t=>{let r={desktop:"inside"===o(t.ftNavigationPosition,"desktop"),tablet:"inside"===o(t.ftNavigationPosition,"tablet"),mobile:"inside"===o(t.ftNavigationPosition,"mobile")},e=DEVICES.reduce((o,r)=>(t.ftNavigationPosition?.[r]&&(o[r]="none"!==t.ftNavigationPosition[r]),o),{});return{...t?.ftLoop&&{loop:t.ftLoop},itemNumber:{desktop:1},dot:i(),dotStyle:n({position:t.position,dotStyle:t.ftDotStyle}),dotSize:t.ftDotSize??{desktop:12},dotGapToCarousel:t.ftDotGapToCarousel??{desktop:16},dotColor:t.ftDotColor??{desktop:"bg-1"},dotActiveColor:t.ftDotActiveColor??{desktop:"line-3"},controlOverContent:r,...t?.ftDragToScroll&&{enableDrag:{desktop:t.ftDragToScroll,tablet:t.ftDragToScroll,mobile:t.ftDragToScroll}},...t?.ftArrowIcon&&{arrowCustom:t.ftArrowIcon},arrowIconSize:t.ftArrowIconSize||{desktop:24},...t?.ftArrowIconColor&&{arrowCustomColor:t.ftArrowIconColor},...t?.ftArrowNavColor&&{arrowBackgroundColor:t.ftArrowNavColor},...t?.ftArrowNavBorder&&{arrowBorder:{desktop:t.ftArrowNavBorder}},...t?.ftArrowNavRadius&&{roundedArrow:{desktop:t.ftArrowNavRadius}},...t?.ftArrowNavShadow&&{arrowShadow:{desktop:t.ftArrowNavShadow}},sneakPeakType:{desktop:"center"},arrowGapToEachSide:"16",animationMode:t?.ftAnimationMode,...t?.ftNavigationPosition&&{navigationStyle:t.ftNavigationPosition},navigationEnable:e,arrowButtonSize:{desktop:{width:void 0,height:void 0}},enableAction:{desktop:!0}}};export{getFeaturedCarouselSettingAttr,getGalleryCarouselSettingAttr};

package/dist/esm/product/components/product-images-v2/common/classes.js

@@ -1 +1 @@
-import{DEVICES as e,getResponsiveValueByScreen as l}from"@gem-sdk/core";function t(e){return e.split(" ").reduce((e,l)=>(e[l]=!0,e),{})}let r=({extraClass:e,isAddOverFlowClass:l=!1})=>{let r="gp-relative gp-w-full";return e&&(r+=` ${e}`),l&&(r+=" gp-overflow-hidden"),t(r)},g=({extraClass:e})=>{let l="gallery-wrapper gp-product-images-gallery gp-flex gp-overflow-hidden gp-max-w-full gp-max-h-full data-[only-image=true]:gp-hidden";return e&&(l+=` ${e}`),t(l)},p=({extraClass:e})=>{let l="product-feature-image grid-gallery gp-flex !gp-h-fit gp-w-full gp-flex-wrap scrollbar-track:gp-rounded-2xl scrollbar-thumb:gp-rounded-2xl scrollbar-thumb:gp-bg-gray-400";return e&&(l+=` ${e}`),t(l)},a=({extraClass:e})=>{let l="gp-flex !gp-h-fit gp-relative gp-overflow-hidden";return e&&(l+=` ${e}`),t(l)},i=({extraClass:e})=>{let l="gp-flex gp-h-fit gp-max-w-full gp-overflow-hidden";return e&&(l+=` ${e}`),t(l)},s=({extraClass:e})=>{let l="`gp-flex-1 gp-w-full gp-feature-image-carousel";return e&&(l+=` ${e}`),t(l)},o=({setting:r,extraClass:g})=>{let p=g??"";return e.forEach(e=>{let t=l(r?.ftNavigationPosition,e),g="desktop"!==e?`${e}:`:"";"outside"===t?p+=` ${g}gp-px-[16px]`:p+=` ${g}gp-px-0`}),t(p)},u=({settings:r,extraClass:g})=>{let p=g??"gp-flex-1 gp-w-full carousel-gallery";return e.forEach(e=>{let t=l(r?.navigationPosition,e),g=l(r?.type,e),a=l(r?.position,e),i="desktop"!==e?`${e}:`:"";"outside"===t&&"slider"===g&&["bottom-center"].includes(a||"")?p+=` ${i}gp-px-[16px]`:p+=` ${i}gp-px-0`}),t(p)},n=({extraClass:e})=>{let l="gp-image-item gp-flex gp-items-center gp-justify-center gp-group gp-relative gp-overflow-hidden gp-cursor-pointer data-[outline=deactive]:after:!gp-border-transparent";return e&&(l+=` ${e}`),t(l)},f=({extraClass:e})=>{let l="gp-group gp-z-0 gp-flex !gp-min-w-full !gp-max-w-full gp-w-full gp-relative gp-items-start gp-justify-center gp-overflow-hidden gp-outline-1 -gp-outline-offset-1 gp-image-item gp-ft-image-item data-[outline=active]:gp-outline";return e&&(l+=` ${e}`),t(l)};export{f as getFeaturedCarouselItemClasses,s as getFeaturedImageCarouselClasses,o as getFeaturedImageClasses,u as getFeaturedImageGalleryClasses,a as getFtImageWithGalleryClasses,p as getGalleryGridWrapperClasses,n as getGalleryItemClasses,g as getGalleryWrapperClasses,i as getImageGalleryWrapperClasses,r as getWrapperClasses};
+import{DEVICES as e,getResponsiveValueByScreen as l}from"@gem-sdk/core";function composeClasses(e){return e.split(" ").reduce((e,l)=>(e[l]=!0,e),{})}let getWrapperClasses=({extraClass:e,isAddOverFlowClass:l=!1})=>{let s="gp-relative gp-w-full";return e&&(s+=` ${e}`),l&&(s+=" gp-overflow-hidden"),composeClasses(s)},getGalleryWrapperClasses=({extraClass:e})=>{let l="gallery-wrapper gp-product-images-gallery gp-flex gp-overflow-hidden gp-max-w-full gp-max-h-full data-[only-image=true]:gp-hidden";return e&&(l+=` ${e}`),composeClasses(l)},getGalleryGridWrapperClasses=({extraClass:e})=>{let l="product-feature-image grid-gallery gp-flex !gp-h-fit gp-w-full gp-flex-wrap scrollbar-track:gp-rounded-2xl scrollbar-thumb:gp-rounded-2xl scrollbar-thumb:gp-bg-gray-400";return e&&(l+=` ${e}`),composeClasses(l)},getFtImageWithGalleryClasses=({extraClass:e})=>{let l="gp-flex !gp-h-fit gp-relative gp-overflow-hidden";return e&&(l+=` ${e}`),composeClasses(l)},getImageGalleryWrapperClasses=({extraClass:e})=>{let l="gp-flex gp-h-fit gp-max-w-full gp-overflow-hidden";return e&&(l+=` ${e}`),composeClasses(l)},getFeaturedImageCarouselClasses=({extraClass:e})=>{let l="`gp-flex-1 gp-w-full gp-feature-image-carousel";return e&&(l+=` ${e}`),composeClasses(l)},getFeaturedImageClasses=({setting:s,extraClass:r})=>{let a=r??"";return e.forEach(e=>{let r=l(s?.ftNavigationPosition,e),t="desktop"!==e?`${e}:`:"";"outside"===r?a+=` ${t}gp-px-[16px]`:a+=` ${t}gp-px-0`}),composeClasses(a)},getFeaturedImageGalleryClasses=({settings:s,extraClass:r})=>{let a=r??"gp-flex-1 gp-w-full carousel-gallery";return e.forEach(e=>{let r=l(s?.navigationPosition,e),t=l(s?.type,e),g=l(s?.position,e),p="desktop"!==e?`${e}:`:"";"outside"===r&&"slider"===t&&["bottom-center"].includes(g||"")?a+=` ${p}gp-px-[16px]`:a+=` ${p}gp-px-0`}),composeClasses(a)},getGalleryItemClasses=({extraClass:e})=>{let l="gp-image-item gp-flex gp-items-center gp-justify-center gp-group gp-relative gp-overflow-hidden gp-cursor-pointer data-[outline=deactive]:after:!gp-border-transparent";return e&&(l+=` ${e}`),composeClasses(l)},getFeaturedCarouselItemClasses=({extraClass:e})=>{let l="gp-group gp-z-0 gp-flex !gp-min-w-full !gp-max-w-full gp-w-full gp-relative gp-items-start gp-justify-center gp-overflow-hidden gp-outline-1 -gp-outline-offset-1 gp-image-item gp-ft-image-item data-[outline=active]:gp-outline";return e&&(l+=` ${e}`),composeClasses(l)};export{getFeaturedCarouselItemClasses,getFeaturedImageCarouselClasses,getFeaturedImageClasses,getFeaturedImageGalleryClasses,getFtImageWithGalleryClasses,getGalleryGridWrapperClasses,getGalleryItemClasses,getGalleryWrapperClasses,getImageGalleryWrapperClasses,getWrapperClasses};

package/dist/esm/product/components/product-images-v2/common/common.js

@@ -1 +1 @@
-import{getResponsiveValueByScreen as e,makeAspectRatio as t,DEVICES as i,makeStyleResponsive as o,removeNullUndefined as l}from"@gem-sdk/core";let r=e=>{let t=e?.desktop,i=e?.tablet===void 0?t:e?.tablet,o=e?.mobile===void 0?i:e?.mobile;return{desktop:t,tablet:i,mobile:o}},a=(e,t)=>{if(!e)return t;if("number"==typeof e)return e;let i=e.replaceAll("px","").replaceAll("%","").replaceAll("rem","").replaceAll("em","");return isNaN(Number(i))?t:Number(i)},n=e=>e?{desktop:a(e.desktop,5),tablet:a(e.tablet,5),mobile:a(e.mobile,5)}:{desktop:5},s=(e,t)=>{let i={};return["desktop","mobile","tablet"].forEach(o=>{i={...i,[`--d${"desktop"===o?"":`-${o}`}`]:`${e(o)?"none":t}`}}),i},d=e=>{let t=e?.["--radius"],i=e?.["--bblr"]||"0px",o=e?.["--bbrr"]||"0px",l=e?.["--btlr"]||"0px",r=e?.["--btrr"]||"0px";return t&&!t.toString().includes("none")&&"0"!==t.toString()||"0px"!==i||"0px"!==o||"0px"!==l||"0px"!==r},b=i=>{let o={};return["desktop","mobile","tablet"].forEach(t=>{let l=e(i,t)?.shapeValue;if(l)o={...o,[t]:l};else{let l=e(i,t)?.shape;switch(l){case"square":o={...o,[t]:"1/1"};break;case"vertical":o={...o,[t]:"3/4"};break;case"horizontal":o={...o,[t]:"4/3"};break;case"original":o={...o,[t]:""}}}}),t(o)},u=t=>{let o={"--gtc":"minmax(0, 12fr)","--gtc-tablet":"minmax(0, 12fr)","--gtc-mobile":"minmax(0, 12fr)"};if(!t.isHiddenGalleryImages){let l=!1;i.forEach(i=>{let r=e(t.position,i),a=e(t.ratioLayout,i),n=e(t.ratioLayoutRight,i),s="desktop"===i?"--gtc":`--gtc-${i}`,d="desktop"===i?"--gtr":`--gtr-${i}`,b="left"===r?a:n,u=["left","right"].includes(r||"");u&&b?(l=!0,Object.assign(o={...o,[s]:`minmax(0, ${b[0]}fr) minmax(0, ${b[1]}fr)`},{[d]:"fit-content(0)"})):l&&Object.assign(o,{[d]:"unset"})})}return o},c=t=>{let i={"--o":"0","--o-tablet":"0","--o-mobile":"0"};return["desktop","mobile","tablet"].forEach(o=>{let l=e(t.position,o),r="desktop"===o?"--o":`--o-${o}`;i={...i,[r]:"left"===l?"1":"0"}}),i},m=t=>{let i={"--o":"1","--o-tablet":"1","--o-mobile":"1"};return["desktop","mobile","tablet"].forEach(o=>{let l=e(t.position,o),r="desktop"===o?"--o":`--o-${o}`;i={...i,[r]:"left"===l?"0":"1"}}),i},p=e=>`{{${e} | image_url: width: 480}} 480w, {{${e} | image_url: width: 768}} 768w, {{${e} | image_url: width: 1024}} 1024w, {{${e} | image_url: width: 1440}} 1440w`,g=e=>{let t=parseInt(e)?`${2*parseInt(e)}px`:`${e} * 2`;return t},f=(t,i,r)=>{let a={},n={},s={},d={},b={},u={};return["desktop","mobile","tablet"].forEach(o=>{let l=e(t,o),c=e(i,o)?.width,m=e(r,o);if(a={...a,[o]:["inside-bottom","inside-left","inside-right"].includes(l)?"absolute":"static"},["inside-bottom"].includes(l)){let e=g(m);c=`calc(100% - ${e})`}["bottom-center","two-col","one-col"].includes(l)&&(c="100%"),s={...s,[o]:"inside-bottom"===l?`${m}`:"auto"},d={...d,[o]:["inside-left","inside-right"].includes(l)?`${m}`:"auto"},u={...u,[o]:["inside-bottom","inside-left"].includes(l)?`${m}`:"auto"},b={...b,[o]:"inside-right"===l?`${m}`:"auto"},n={...n,[o]:c}}),{...o("pos",a),...o("w",l(n)),...o("bottom",l(s)),...o("top",l(d)),...o("left",l(u)),...o("right",l(b))}},h=(t,i)=>{let o=!0,l=!1;return["desktop","mobile","tablet"].forEach(r=>{let a=e(t,r),n=e(i,r);a&&"only-feature"!==a&&(o=!1),(["two-col","one-col"].includes(a)||"images"===n)&&(l=!0)}),{isOnlyFeatureAllDevices:o,isRenderGalleryGrid:l}},k=e=>({...e,setting:{...e.setting}}),$=e=>{let t=e.match(/\d+/g);return t?t[0]:e},y=t=>{let i=b(t),o={desktop:"auto",mobile:"auto",tablet:"auto"};return["desktop","mobile","tablet"].forEach(l=>{let r=e(t,l),a=r?.height,n=r?.width||"",s=$(a||""),d=n.toString().match(/px/g)?$(n):n;if(a&&n&&!isNaN(Number(s))&&!isNaN(Number(d))){o={...o,[l]:`${Number(s)/Number(d)*100}%`};return}if(a&&!isNaN(Number(s))){o={...o,[l]:a};return}let b=i?.[l]!=="auto"&&i?.[l]?i?.[l]?.split("/").reverse().join("/"):"{%if largestRatio == 0%} 100 / 100 {%else%} {{largestRatio}} {%endif%}";o={...o,[l]:`calc((${b})*100%)`}}),o};export{d as checkAddOverFlowClass,n as convertSpacing,g as convertSpacingForIndisdeLayout,a as convertUnitToNumber,b as getAspectRatio,h as getConditionRenderGalleryImages,s as getDisplayStyle,y as getPaddingBottomByShapeSetting,p as getSrcImage,u as getStyleGridLayout,c as getStyleGridOrderForFeature,m as getStyleGridOrderForGallery,f as getStyleInsideLayout,r as getTypeWidthDevice,k as setDefaultWhenUndefineSetting};
+import{getResponsiveValueByScreen as e,makeAspectRatio as t,makeStyleResponsive as o,removeNullUndefined as i,DEVICES as r}from"@gem-sdk/core";let getTypeWidthDevice=e=>{let t=e?.desktop,o=e?.tablet===void 0?t:e?.tablet,i=e?.mobile===void 0?o:e?.mobile;return{desktop:t,tablet:o,mobile:i}},convertUnitToNumber=(e,t)=>{if(!e)return t;if("number"==typeof e)return e;let o=e.replaceAll("px","").replaceAll("%","").replaceAll("rem","").replaceAll("em","");return isNaN(Number(o))?t:Number(o)},convertSpacing=e=>e?{desktop:convertUnitToNumber(e.desktop,5),tablet:convertUnitToNumber(e.tablet,5),mobile:convertUnitToNumber(e.mobile,5)}:{desktop:5},getDisplayStyle=(e,t)=>{let o={},i=["desktop","mobile","tablet"];return i.forEach(i=>{o={...o,[`--d${"desktop"===i?"":`-${i}`}`]:`${e(i)?"none":t}`}}),o},checkAddOverFlowClass=e=>{let t=e?.["--radius"],o=e?.["--bblr"]||"0px",i=e?.["--bbrr"]||"0px",r=e?.["--btlr"]||"0px",l=e?.["--btrr"]||"0px";return t&&!t.toString().includes("none")&&"0"!==t.toString()||"0px"!==o||"0px"!==i||"0px"!==r||"0px"!==l},getAspectRatio=o=>{let i={},r=["desktop","mobile","tablet"];return r.forEach(t=>{let r=e(o,t)?.shapeValue;if(r)i={...i,[t]:r};else{let r=e(o,t)?.shape;switch(r){case"square":i={...i,[t]:"1/1"};break;case"vertical":i={...i,[t]:"3/4"};break;case"horizontal":i={...i,[t]:"4/3"};break;case"original":i={...i,[t]:""}}}}),t(i)},getStyleGridLayout=t=>{let o={"--gtc":"minmax(0, 12fr)","--gtc-tablet":"minmax(0, 12fr)","--gtc-mobile":"minmax(0, 12fr)"};if(!t.isHiddenGalleryImages){let i=!1;r.forEach(r=>{let l=e(t.position,r),a=e(t.ratioLayout,r),n=e(t.ratioLayoutRight,r),s="desktop"===r?"--gtc":`--gtc-${r}`,d="desktop"===r?"--gtr":`--gtr-${r}`,u="left"===l?a:n,c=["left","right"].includes(l||"");c&&u?(i=!0,Object.assign(o={...o,[s]:`minmax(0, ${u[0]}fr) minmax(0, ${u[1]}fr)`},{[d]:"fit-content(0)"})):i&&Object.assign(o,{[d]:"unset"})})}return o},getStyleGridOrderForFeature=t=>{let o={"--o":"0","--o-tablet":"0","--o-mobile":"0"},i=["desktop","mobile","tablet"];return i.forEach(i=>{let r=e(t.position,i),l="desktop"===i?"--o":`--o-${i}`;o={...o,[l]:"left"===r?"1":"0"}}),o},getStyleGridOrderForGallery=t=>{let o={"--o":"1","--o-tablet":"1","--o-mobile":"1"},i=["desktop","mobile","tablet"];return i.forEach(i=>{let r=e(t.position,i),l="desktop"===i?"--o":`--o-${i}`;o={...o,[l]:"left"===r?"0":"1"}}),o},getSrcImage=e=>`{{${e} | image_url: width: 480}} 480w, {{${e} | image_url: width: 768}} 768w, {{${e} | image_url: width: 1024}} 1024w, {{${e} | image_url: width: 1440}} 1440w`,convertSpacingForIndisdeLayout=e=>{let t=parseInt(e)?`${2*parseInt(e)}px`:`${e} * 2`;return t},getStyleInsideLayout=(t,r,l)=>{let a=["desktop","mobile","tablet"],n={},s={},d={},u={},c={},g={};return a.forEach(o=>{let i=e(t,o),a=e(r,o)?.width,m=e(l,o);if(n={...n,[o]:["inside-bottom","inside-left","inside-right"].includes(i)?"absolute":"static"},["inside-bottom"].includes(i)){let e=convertSpacingForIndisdeLayout(m);a=`calc(100% - ${e})`}["bottom-center","two-col","one-col"].includes(i)&&(a="100%"),d={...d,[o]:"inside-bottom"===i?`${m}`:"auto"},u={...u,[o]:["inside-left","inside-right"].includes(i)?`${m}`:"auto"},g={...g,[o]:["inside-bottom","inside-left"].includes(i)?`${m}`:"auto"},c={...c,[o]:"inside-right"===i?`${m}`:"auto"},s={...s,[o]:a}}),{...o("pos",n),...o("w",i(s)),...o("bottom",i(d)),...o("top",i(u)),...o("left",i(g)),...o("right",i(c))}},getConditionRenderGalleryImages=(t,o)=>{let i=["desktop","mobile","tablet"],r=!0,l=!1;return i.forEach(i=>{let a=e(t,i),n=e(o,i);a&&"only-feature"!==a&&(r=!1),(["two-col","one-col"].includes(a)||"images"===n)&&(l=!0)}),{isOnlyFeatureAllDevices:r,isRenderGalleryGrid:l}},setDefaultWhenUndefineSetting=e=>({...e,setting:{...e.setting}}),getValueFromValueContainUnit=e=>{let t=e.match(/\d+/g);return t?t[0]:e},getPaddingBottomByShapeSetting=t=>{let o=getAspectRatio(t),i={desktop:"auto",mobile:"auto",tablet:"auto"},r=["desktop","mobile","tablet"];return r.forEach(r=>{let l=e(t,r),a=l?.height,n=l?.width||"",s=getValueFromValueContainUnit(a||""),d=n.toString().match(/px/g)?getValueFromValueContainUnit(n):n;if(a&&n&&!isNaN(Number(s))&&!isNaN(Number(d))){i={...i,[r]:`${Number(s)/Number(d)*100}%`};return}if(a&&!isNaN(Number(s))){i={...i,[r]:a};return}let u=o?.[r]!=="auto"&&o?.[r]?o?.[r]?.split("/").reverse().join("/"):"{%if largestRatio == 0%} 100 / 100 {%else%} {{largestRatio}} {%endif%}";i={...i,[r]:`calc((${u})*100%)`}}),i};export{checkAddOverFlowClass,convertSpacing,convertSpacingForIndisdeLayout,convertUnitToNumber,getAspectRatio,getConditionRenderGalleryImages,getDisplayStyle,getPaddingBottomByShapeSetting,getSrcImage,getStyleGridLayout,getStyleGridOrderForFeature,getStyleGridOrderForGallery,getStyleInsideLayout,getTypeWidthDevice,setDefaultWhenUndefineSetting};

package/dist/esm/product/components/product-images-v2/common/getBorderActiveCss.js

@@ -1,4 +1,4 @@
-import{composeBorderCss as e,composeCornerCss as t}from"@gem-sdk/core";let i=({settings:i,uid:r,type:g})=>{let l="Liquid"===g?`.gem-slider-item-${r}-{{product.id}}.gp-gallery-image-item::after, .gem-slider-item-gp-gallery-${r}-{{product.id}}.gp-gallery-image-item::after`:`.gem-slider-item-active.gem-slider-item-${r}.gp-gallery-image-item::after`;return`
+import{composeBorderCss as e,composeCornerCss as t}from"@gem-sdk/core";let getBorderActiveCss=({settings:i,uid:r,type:g})=>{let l="Liquid"===g?`.gem-slider-item-${r}-{{product.id}}.gp-gallery-image-item::after, .gem-slider-item-gp-gallery-${r}-{{product.id}}.gp-gallery-image-item::after`:`.gem-slider-item-active.gem-slider-item-${r}.gp-gallery-image-item::after`;return`
     ${l} {
       content: "";
       height: 100%;
@@ -13,4 +13,4 @@ import{composeBorderCss as e,composeCornerCss as t}from"@gem-sdk/core";let i=({s
     .gem-slider-item-${r}-{{product.id}}.gp-gallery-image-item[data-outline=active]:after, .gem-slider-item-gp-gallery-${r}-{{product.id}}.gp-gallery-image-item[data-outline=active]:after {
       pointer-events: none;
     }
-  `};export{i as getBorderActiveCss};
+  `};export{getBorderActiveCss};

package/dist/esm/product/components/product-images-v2/common/hoverAction.js

@@ -1 +1 @@
-import{convertUnitToNumber as e}from"./common.js";let t=(t,i)=>{let c=i?.hoverEffect==="zoom"&&i?.zoomType==="default",f=i?.hoverEffect==="zoom"&&i?.zoomType==="glasses",y=i?.hoverEffect==="other",s=i?.hoverEffect!=="none";if(!s)return;let n=t.currentTarget.querySelector("img"),h=t.currentTarget.querySelector("img.hover-image"),p=t.currentTarget.querySelector(".room-len"),g=n?.getBoundingClientRect(),u=n?.clientWidth||0,a=n?.clientHeight||0,m=e(i?.zoom,0),x=!m||m<100?1:m/100||1,d=(u||1)*(i?.hoverEffect==="other"?1:x),v=(a||1)*(i?.hoverEffect==="other"?1:x),T=t.clientX-g?.x,z=t.clientY-g?.y;y&&o({featureImageHoverDom:h}),c&&t.clientX>=g?.x&&t.clientX<=g.right&&t.clientY>=g?.y&&t.clientY<=g.bottom&&l({featureImageDom:n,featureImageHoverDom:h,zoomSize:d,zoomSizeHeight:v,slideWidth:u,imageOffsetX:T,imageOffsetY:z,isEnableShowOtherImage:y}),f&&r({zoomLens:p,zoomSize:d,zoomValue:x,slideWidth:u,slideHeight:a,imageOffsetX:T,imageOffsetY:z})},o=({featureImageHoverDom:e})=>{e&&(e.style.opacity="1",e.style.top="0px",e.style.left="0px",e.style.width="100%",e.style.height="100%")},r=({zoomLens:e,zoomSize:t,zoomValue:o,slideWidth:r,slideHeight:l,imageOffsetX:i,imageOffsetY:c})=>{if(!e)return;e.style.opacity="1";let f=e.offsetWidth/2,y=e.offsetHeight/2,s=l||1;i>r-f/o&&(i=r-f/o),i<f/o&&(i=f/o),c>s-y/o&&(c=s-y/o),c<y/o&&(c=y/o),e.style.top=c-y+"px",e.style.left=i-f+"px",e.style.backgroundSize=t+"px "+s*o+"px",e.style.backgroundPosition=`-${i*o-f}px -${c*o-y}px`},l=({featureImageDom:e,featureImageHoverDom:t,zoomSize:o,zoomSizeHeight:r,slideWidth:l,imageOffsetX:i,imageOffsetY:c,isEnableShowOtherImage:f=!1})=>{if(!t)return;t.style.width=`${o}px`,f||(t.style.height=`${r}px`),t.style.opacity="1";let y=i/e?.offsetWidth,s=c/e?.offsetHeight;t.style.top=(e?.offsetHeight-t.offsetHeight)*s+"px",t.style.left=(l-o)*y+"px"},i=e=>{let t=e.currentTarget.querySelector("img.hover-image"),o=e.currentTarget.querySelector(".room-len");t&&(t.style.opacity="0"),o&&(o.style.opacity="0")};export{t as handleMouseMove,i as handleMouseOut};
+import{convertUnitToNumber as e}from"./common.js";let handleMouseMove=(t,o)=>{let l=o?.hoverEffect==="zoom"&&o?.zoomType==="default",r=o?.hoverEffect==="zoom"&&o?.zoomType==="glasses",i=o?.hoverEffect==="other",s=o?.hoverEffect!=="none";if(!s)return;let y=t.currentTarget.querySelector("img"),c=t.currentTarget.querySelector("img.hover-image"),n=t.currentTarget.querySelector(".room-len"),f=y?.getBoundingClientRect(),h=y?.clientWidth||0,a=y?.clientHeight||0,p=e(o?.zoom,0),g=!p||p<100?1:p/100||1,m=(h||1)*(o?.hoverEffect==="other"?1:g),u=(a||1)*(o?.hoverEffect==="other"?1:g),d=t.clientX-f?.x,x=t.clientY-f?.y;i&&displayOtherImage({featureImageHoverDom:c}),l&&t.clientX>=f?.x&&t.clientX<=f.right&&t.clientY>=f?.y&&t.clientY<=f.bottom&&displayZoomImage({featureImageDom:y,featureImageHoverDom:c,zoomSize:m,zoomSizeHeight:u,slideWidth:h,imageOffsetX:d,imageOffsetY:x,isEnableShowOtherImage:i}),r&&displayZoomLen({zoomLens:n,zoomSize:m,zoomValue:g,imagePosition:f,slideWidth:h,slideHeight:a,imageOffsetX:d,imageOffsetY:x})},displayOtherImage=({featureImageHoverDom:e})=>{e&&(e.style.opacity="1",e.style.top="0px",e.style.left="0px",e.style.width="100%",e.style.height="100%")},displayZoomLen=({zoomLens:e,zoomSize:t,zoomValue:o,slideWidth:l,slideHeight:r,imageOffsetX:i,imageOffsetY:s})=>{if(!e)return;e.style.opacity="1";let y=e.offsetWidth/2,c=e.offsetHeight/2,n=r||1;i>l-y/o&&(i=l-y/o),i<y/o&&(i=y/o),s>n-c/o&&(s=n-c/o),s<c/o&&(s=c/o),e.style.top=s-c+"px",e.style.left=i-y+"px",e.style.backgroundSize=t+"px "+n*o+"px",e.style.backgroundPosition=`-${i*o-y}px -${s*o-c}px`},displayZoomImage=({featureImageDom:e,featureImageHoverDom:t,zoomSize:o,zoomSizeHeight:l,slideWidth:r,imageOffsetX:i,imageOffsetY:s,isEnableShowOtherImage:y=!1})=>{if(!t)return;t.style.width=`${o}px`,y||(t.style.height=`${l}px`),t.style.opacity="1";let c=i/e?.offsetWidth,n=s/e?.offsetHeight;t.style.top=(e?.offsetHeight-t.offsetHeight)*n+"px",t.style.left=(r-o)*c+"px"},handleMouseOut=e=>{let t=e.currentTarget.querySelector("img.hover-image"),o=e.currentTarget.querySelector(".room-len");t&&(t.style.opacity="0"),o&&(o.style.opacity="0")};export{handleMouseMove,handleMouseOut};

package/dist/esm/product/components/product-images-v2/common/productFeaturedImage.js

@@ -1 +1 @@
-import{getResponsiveValueByScreen as e,DEVICES as t}from"@gem-sdk/core";let o=e=>!!e&&["EXTERNAL_VIDEO","MODEL_3D","VIDEO"].includes(e),p=()=>"!gp-flex gp-absolute gp-opacity-0 gp-h-[150px] gp-w-[150px] gp-cursor-none gp-rounded-full gp-bg-no-repeat gp-shadow-glasses gp-bg-white gp-pointer-events-none",n=()=>"gp-absolute gp-left-0 gp-top-0 gp-opacity-0 gp-transition-opacity gp-bg-white gp-pointer-events-none",g=o=>{let p={};return t.forEach(t=>{let n=e(o.position,t),g=e(o.dotStyle,t);p={...p,[t]:"only-feature"===n?g:"none"}}),p},r=e=>{let t=!1;return["desktop","mobile","tablet"].forEach(o=>{let p=a(e,o);a(e,o)&&(t=p)}),t},a=(t,o)=>"only-feature"!==e(t.position,o)||"none"!==e(t.ftNavigationPosition,o)||"none"!==e(t.ftDotStyle,o)||!0===e(t.ftLoop,o)||!0===t.ftDragToScroll;export{r as checkRenderFeaturedCarousel,g as getDotStyleForOnlyFeaturedImage,n as getZoomImageClass,p as getZoomLenClass,o as isFeatureMedia};
+import{getResponsiveValueByScreen as e,DEVICES as o}from"@gem-sdk/core";let isFeatureMedia=e=>!!e&&["EXTERNAL_VIDEO","MODEL_3D","VIDEO"].includes(e),getZoomLenClass=()=>"!gp-flex gp-absolute gp-opacity-0 gp-h-[150px] gp-w-[150px] gp-cursor-none gp-rounded-full gp-bg-no-repeat gp-shadow-glasses gp-bg-white gp-pointer-events-none",getZoomImageClass=()=>"gp-absolute gp-left-0 gp-top-0 gp-opacity-0 gp-transition-opacity gp-bg-white gp-pointer-events-none",getDotStyleForOnlyFeaturedImage=t=>{let a={};return o.forEach(o=>{let r=e(t.position,o),g=e(t.dotStyle,o);a={...a,[o]:"only-feature"===r?g:"none"}}),a},checkRenderFeaturedCarousel=e=>{let o=["desktop","mobile","tablet"],t=!1;return o.forEach(o=>{let a=checkShowCarousel(e,o);checkShowCarousel(e,o)&&(t=a)}),t},checkShowCarousel=(o,t)=>"only-feature"!==e(o.position,t)||"none"!==e(o.ftNavigationPosition,t)||"none"!==e(o.ftDotStyle,t)||!0===e(o.ftLoop,t)||!0===o.ftDragToScroll;export{checkRenderFeaturedCarousel,getDotStyleForOnlyFeaturedImage,getZoomImageClass,getZoomLenClass,isFeatureMedia};