@gem-sdk/components 17.0.0-dev.14 → 17.0.0-dev.141

package/dist/esm/product/components/product-images-v3/components/gallery-grid/GalleryGrid.liquid.js

@@ -1,12 +1,12 @@
-import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cls as t}from"@gem-sdk/core";import{Liquid as o,LiquidFor as s,LiquidIf as d,If as r}from"@gem-sdk/system";import l from"../../../../../image/components/Modal3d.liquid.js";import m from"../../../../../image/components/NextImage.liquid.js";import p from"../../../../../image/components/Video.liquid.js";import n from"../../../../../video/components/HTML5Embed.liquid.js";import{getStyleOfObject as g}from"../../../../helpers/function.js";import{getAspectRatio as c,getSrcImage as u}from"../../common/common.js";import{getZoomImageClass as h,getZoomLenClass as y}from"../../common/productFeaturedImage.js";import{getShapeByLayout as C,getZoomDisplay as v}from"../../common/productGallery.js";import{getProductImagesClassName as f}from"../../composables/getProductImagesClassName.js";import{getProductImagesStyles as w}from"../../composables/getProductImagesStyles.js";let _=({builderPropUID:_,wrapperStyle:$,children:b,enableLazyLoadImage:x,...L})=>{let{galleryItemClasses:F,galleryGridWrapperClasses:V}=f(L),{galleryGridStyles:q,galleryGridItemStyles:I}=w(L),M=C({shape:L.shape,shapeForBottom:L.shapeForBottom,shapeFor1Col:L.shapeFor1Col,shapeFor2Col:L.shapeFor2Col,shapeForFtOnly:L.shapeForFtOnly,shapeForInsideBottom:L.shapeForInsideBottom,shapeForInside:L.shapeForInside},L.position),j=(i=!1)=>{let t={desktop:"none",tablet:"none",mobile:"none"};return["desktop","mobile","tablet"].forEach(e=>{let o=a(L?.position,e)||"",s="one-col"===o||"two-col"===o;t[e]=(i?!s:s)?"block":"none"}),e("d",t)},k=()=>j(),S=()=>j(!0),Z=(e,a)=>i`
+import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cls as t}from"@gem-sdk/core";import{Liquid as o,LiquidFor as s,LiquidIf as d,If as r}from"@gem-sdk/system";import l from"../../../../../image/components/Modal3d.liquid.js";import m from"../../../../../image/components/NextImage.liquid.js";import p from"../../../../../image/components/Video.liquid.js";import g from"../../../../../video/components/HTML5Embed.liquid.js";import{getStyleOfObject as n}from"../../../../helpers/function.js";import{getAspectRatio as c,getSrcImage as u}from"../../common/common.js";import{getZoomImageClass as h,getZoomLenClass as y}from"../../common/productFeaturedImage.js";import{getShapeByLayout as C,getZoomDisplay as v}from"../../common/productGallery.js";import{getProductImagesClassName as f}from"../../composables/getProductImagesClassName.js";import{getProductImagesStyles as w}from"../../composables/getProductImagesStyles.js";let _=({builderPropUID:_,wrapperStyle:$,children:b,enableLazyLoadImage:x,...L})=>{let{galleryItemClasses:F,galleryGridWrapperClasses:M}=f(L),{galleryGridStyles:V,galleryGridItemStyles:q}=w(L),I=C({shape:L.shape,shapeForBottom:L.shapeForBottom,shapeFor1Col:L.shapeFor1Col,shapeFor2Col:L.shapeFor2Col,shapeForFtOnly:L.shapeForFtOnly,shapeForInsideBottom:L.shapeForInsideBottom,shapeForInside:L.shapeForInside},L.position),j=(i=!1)=>{let t={desktop:"none",tablet:"none",mobile:"none"};return["desktop","mobile","tablet"].forEach(e=>{let o=a(L?.position,e)||"",s="one-col"===o||"two-col"===o;t[e]=(i?!s:s)?"block":"none"}),e("d",t)},k=()=>j(),S=()=>j(!0),Z=(e,a)=>i`
       ${m({srcIsLiquidCode:!0,src:`${u("media.preview_image")}`,width:"{{media.width}}",height:"{{media.height}}",alt:"{{media.alt | escape}}",baseSrc:"{{media.preview_image | image_url}}",setting:e,style:a,className:"!gp-rounded-none",customLazyload:!1,enableLazyLoadImage:x})}
       ${r(L?.galleryHoverEffect!=="none",`<div class="${t("zoom-element !gp-max-w-none gp-w-full gp-h-full",h())}">
           ${m({srcIsLiquidCode:!0,src:`${u("media.preview_image")}`,width:"{{media.width}}",height:"{{media.height}}",baseSrc:"{{media.preview_image | image_url}}",alt:"{{media.alt | escape}}",setting:e,style:a,className:"!gp-rounded-none gp-w-full gp-h-full",customLazyload:!1,enableLazyLoadImage:x})}
           </div>`," ")}
-      ${r(L?.galleryHoverEffect=="zoom"&&L?.galleryZoomType=="glasses",`<div class="${t("zoom-lens-element",y())}" style="opacity: 0; background-image: url('{{media.preview_image | product_img_url: '1024x1024'}}')">
+      ${r(L?.galleryHoverEffect=="zoom"&&L?.galleryZoomType=="glasses",`<div class="${t("zoom-lens-element",y())}" style="opacity: 0; background-image: url({{media.preview_image | product_img_url: '1024x1024'}})">
             </div>
           `," ")}
-    `,z=()=>l({src:d("media.sources.first.url contains '.glb'","{{ media.sources.first.url }}","{{media.sources.last.url}}"),alt:"{{media.preview_image.alt}}",poster:"{{media.preview_image.src | product_img_url: '1024x1024'}}",cameraControls:!0,arStatus:"not-presenting",style:{width:"100%",height:"100%"},aspectRatio:c(M)}),B=()=>p({src:"{{mediaSourceVideo}}",alt:"{{media.alt | escape}}",autoplay:!1,allowfullscreen:!0,controls:!0,style:{width:"100%",height:"100%"}}),H=()=>n({src:"{{mediaSourceVideo}}",title:"{{media.alt | escape}}",autoplay:!1,controls:!0,style:{width:"100%","max-height":"100%"}}),P=()=>i`
+    `,z=()=>l({src:d("media.sources.first.url contains '.glb'","{{ media.sources.first.url }}","{{media.sources.last.url}}"),alt:"{{media.preview_image.alt}}",poster:"{{media.preview_image.src | product_img_url: '1024x1024'}}",cameraControls:!0,arStatus:"not-presenting",style:{width:"100%",height:"100%"},aspectRatio:c(I)}),B=()=>p({src:"{{mediaSourceVideo}}",alt:"{{media.alt | escape}}",autoplay:!1,allowfullscreen:!0,controls:!0,style:{width:"100%",height:"100%"}}),H=()=>g({src:"{{mediaSourceVideo}}",title:"{{media.alt | escape}}",autoplay:!1,controls:!0,thumbnail:"{{media.preview_image.src | product_img_url: '1024x1024'}}",poster:{altText:"{{media.alt | escape}}"},style:{width:"100%","max-height":"100%"}}),P=()=>i`
       ${d("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" >
           <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
             <rect opacity="0.9" width="24" height="24" rx="3" fill="#212121"/>
@@ -19,10 +19,10 @@ import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cl
             <path fill-rule="evenodd" clip-rule="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"/>
           </svg>
         </div>`)}
-      ${Z({aspectRatio:c(M),layout:L?.layout,qualityType:L?.qualityType,qualityPercent:L?.qualityPercent},{width:"100%",height:"100%"})}
+      ${Z({aspectRatio:c(I),layout:L?.layout,qualityType:L?.qualityType,qualityPercent:L?.qualityPercent},{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="${g(v(L?.clickOpenLightBox))}" >
+        style="${n(v(L?.clickOpenLightBox))}" >
         <svg
           height="100%"
           width="100%"
@@ -39,7 +39,7 @@ import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cl
           />
         </svg>
       </div>
-    `,N=i=>`
+    `,T=i=>`
     ${d("media.media_type == 'video'","{% assign mediaSourceUrl = media.sources.last.url %}")}
     ${d("media.media_type == 'external_video'","{% assign mediaSourceUrl = media | external_video_url %}{% assign mediaSource = media | json %}")}
     ${d("media.media_type == 'image'","{% assign mediaSourceUrl = media.src %}")}
@@ -54,18 +54,20 @@ import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cl
       grid-index="{{forloop.index}}"
       data-outline="none"
       class="${F(`gem-slider-item-${_}-{{product.id}} gp-gallery-image-item ${i??""} data-[outline=deactive]:after:!gp-border-transparent`)}"
-      style="${g(I)}"
+      style="${n(q)}"
       >
       ${d("media.media_type == 'external_video' or media.media_type == 'video' or media.media_type == 'model'","{% assign isMedia = true %}")}
 
       ${d("media.media_type == 'external_video' or media.media_type == 'video'","{% assign isVideo = true %}")}
 
-      <div class="gp-h-full gp-w-full" style="${d("media == null or media.media_type == 'image'","display: block !important;")} ${d("isVideo == true",g({...S()}))}">
-        ${d("media != null",P(),T())}
+      ${d("media.media_type == 'model'","{% assign isModel = true %}")}
+
+      <div class="gp-w-full" style="${d("media == null or media.media_type == 'image'","display: block !important;")} ${d("isMedia",n({...S()}))}">
+        ${d("media != null",P(),N())}
       </div>
 
-      <div class="${d("isMedia","gp-flex gp-justify-center gp-items-center")}"
-      style="${d("isMedia",g({...e("aspect",c(M))}))} ${g({...k()})}"
+      <div class="${d("isMedia","gp-flex gp-justify-center gp-items-center")} ${d("isModel","gp-w-full")}"
+      style="${d("isMedia",n({...e("aspect",c(I))}))} ${n({...k()})}"
       >
         {% case media.media_type %}
           {% when 'external_video' %}
@@ -80,14 +82,15 @@ import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cl
       </div>
       {% assign isVideo= false %}
       {% assign isMedia= false %}
-    </div>`,T=()=>i`
-    ${m({srcIsLiquidCode:!0,src:"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",alt:"No Image",sizes:"(max-width: 768px) 50vw, 100vw",setting:{aspectRatio:c(M),layout:L?.layout,qualityType:L?.qualityType,qualityPercent:L?.qualityPercent},className:"!gp-rounded-none",customLazyload:!1,enableLazyLoadImage:x})}`;return o(`
+      {% assign isModel= false %}
+    </div>`,N=()=>i`
+    ${m({srcIsLiquidCode:!0,src:"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",alt:"No Image",sizes:"(max-width: 768px) 50vw, 100vw",setting:{aspectRatio:c(I),layout:L?.layout,qualityType:L?.qualityType,qualityPercent:L?.qualityPercent},className:"!gp-rounded-none",customLazyload:!1,enableLazyLoadImage:x})}`;return o(`
   <div type="grid-gallery"
-    class="${V}"
-    style="${g(q)}}"
+    class="${M}"
+    style="${n(V)}}"
   >
     ${s("media in product.media",`${d("media.media_type == 'image'",s("image in product.images",d("image.src == media.src","{% assign imageID = image.id %}{% break %}")),"{% assign imageID = '' %}")}
-      ${d("media.id == product.featured_media.id ",N(L?.borderActive?.border!=="none"?"active":""),N())}`)}
+      ${d("media.id == product.featured_media.id ",T(L?.borderActive?.border!=="none"?"active":""),T())}`)}
     ${d("product.media.size > 0",b)}
-    ${d("product.media.size < 1",N())}
+    ${d("product.media.size < 1",T())}
   </div>`)};export{_ as default};

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

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as e,jsxs as o,Fragment as p}from"react/jsx-runtime";import{useFeaturedImageGlobal as t}from"@gem-sdk/core";import{useState as l,useMemo as i,useEffect as g}from"react";import"../../../../../modal/components/confirm.js";import n from"../../../../../modal/components/Modal.js";import s from"./LightBoxCarousel.js";import r from"./LightBoxGalleryCarousel.js";import m from"./LightBoxImageZoom.js";let a=({builderPropUID:a,productImages:c,open:d,onHandleClose:x})=>{let f=t(),[u,h]=l(!1),[I,y]=l(0),w=i(()=>(c||[]).map((e,o)=>({...e,id:e.id||`gp-lightbox-${o}`,src:e.src||e.previewImage,alt:e.alt||"Product image"})),[c]),C=i(()=>!["VIDEO","EXTERNAL_VIDEO","MODEL_3D"].includes(w[I]?.contentType||""),[w,I]),b=i(()=>{let e=w.findIndex(e=>e.id===f?.id);return e&&e>0?e:0},[w,f]);g(()=>{d&&(h(!1),y(b))},[d]);let j=()=>{h(e=>!e)};return e(n,{setting:{open:d},styles:{width:"calc(100% + 2rem)"},closeOnClickOutside:!0,closeOnEscape:!0,onKeypressEscape:()=>x(),onClose:()=>{x()},lockBodyScroll:!0,disableIframeClickEvent:!0,contentClass:"!gp--mx-4 !gp-my-auto !gp-h-screen !gp-max-w-none !gp-rounded-none !gp-bg-[#0F0F10] !gp-px-0 !gp-py-0 !gp-text-white",zoomButton:{isShowButton:C,isZoomIn:u,onToggleZoom:j},closeButtonClassName:"gp-top-[34px] gp-text-[#AAAAAA] gp-scale-125",wrapperContentClasses:"gp-size-full",children:e("div",{className:"gp-flex gp-gap-2 gp-size-full gp-min-w-0 gp-flex-col gp-items-center gp-justify-center",children:u?e(m,{image:w[I],onExitZoom:j}):o(p,{children:[e("div",{className:"gp-flex gp-w-full gp-min-w-0 gp-flex-1 gp-items-center gp-justify-center gp-overflow-hidden gp-px-[52px] gp-mt-[52px] mobile:gp-px-0",children:e(s,{builderPropUID:a,displayImages:w,activeIndex:I,imageActiveIndex:b,onChangeSlide:y,onToggleZoom:j})}),e("div",{className:"gp-flex gp-justify-center gp-w-full gp-pb-2 mobile:gp-pb-5 gp-px-[52px] mobile:gp-px-0",children:e(r,{builderPropUID:a,displayImages:w,activeIndex:I,onChangeSlide:y})})]})})})};export{a as default};
+import{jsx as e,jsxs as t,Fragment as o}from"react/jsx-runtime";import{useFeaturedImageGlobal as i,useEditorMode as l,cls as s}from"@gem-sdk/core";import d from"../../../../../carousel-v3/components/root/Carousel.js";import n from"../../../../../carousel-v3/components/item/CarouselItem.js";import r from"../../../../../image/components/NextImage.js";import"../../../../../modal/components/confirm.js";import p from"../../../../../modal/components/Modal.js";import{useMemo as m}from"react";import{isFeatureMedia as a}from"../../common/productFeaturedImage.js";import c from"../child/ProductFeatureVideo.js";import g from"../child/MediaIcon.js";let h=({builderPropUID:h,productImages:u,open:b,imageRatio:f,onHandleClose:k})=>{let y=i(),E=m(()=>{let e=u?.findIndex(e=>e.id===y?.id);return e&&e>0?e:0},[u,y]),I={desktop:u&&u.length>1,mobile:u&&u?.length>1,tablet:u&&u?.length>1},j=l(),v=e=>"edit"!==j&&["VIDEO","EXTERNAL_VIDEO"].includes(e?.contentType||"");return e(p,{setting:{open:b},styles:{width:"80%"},closeOnClickOutside:!0,onClose:()=>{k(),console.log("onHandleClose")},disableIframeClickEvent:!0,contentClass:"mobile:!gp-w-[100%] gp-px-2 gp-pb-10",children:e(d,{setting:{loop:{desktop:!1,mobile:!1,tablet:!1},slidesToShow:{desktop:1,tablet:1,mobile:1},defaultCurrentSlider:E,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"},dotSize:{desktop:12},dotGapToCarousel:{desktop:12},navigationEnable:I,navigationStyle:{desktop:"outside"},arrowIconSize:{desktop:24},initialSlide:E},styles:{sizeSetting:{desktop:{height:"80vh"},tablet:{height:"80vh"},mobile:{height:"60vh"}},playSpeed:0},moveToIdx:E,hiddenDotWhenOnlyOne:!0,isHiddenArrowWhenDisabled:!0,isDisableResetSlide:!0,builderProps:{uid:h},fullHeight:!0,children:u?.map(i=>e(n,{className:`gem-slider-item gem-slider-item-${h} gp-flex gp-items-center gp-justify-center gp-px-4`,children:v(i)?e(c,{type:i?.contentType,url:i.src??"",thumbnail:i?.previewImage,aspectRatio:f}):t(o,{children:[e(r,{src:a(i?.contentType)?i?.previewImage:i?.src,width:i?.width,height:i?.height,alt:i?.alt,"content-type":i?.contentType,setting:{aspectRatio:f},className:s("gp-h-full gp-w-full gp-object-contain")},i?.id),e(g,{contentType:i?.contentType??""})]})},i?.id))})})};export{h as default};

package/dist/esm/product/components/product-images-v3/composables/getProductImagesClassName.js

@@ -1 +1 @@
-import{createClass as e}from"@gem-sdk/system";import{getWrapperClasses as s,getGalleryWrapperClasses as r,getGalleryGridWrapperClasses as a,getFtImageWithGalleryClasses as t,getImageGalleryWrapperClasses as l,getFeaturedImageCarouselClasses as g,getFeaturedImageGalleryClasses as o,getFeaturedImageClasses as m,getFeaturedCarouselItemClasses as p,getGalleryItemClasses as d}from"../common/classes.js";import{checkAddOverFlowClass as i,setDefaultWhenUndefineSetting as u}from"../common/common.js";let C=C=>{let{setting:c,style:x}=C,f=u(C),{builderProps:$,advanced:n}=f,y=n?.cssClass,w=e(s({extraClass:`${$?.uid} ${y??""} `,isAddOverFlowClass:i(x)})),b=e(r({})),h=e(a({})),v=e(t({extraClass:`gp-product-images-feature--${$?.uid}`})),I=e(l({extraClass:`gp-product-images-gallery-${$?.uid}`})),j=e(g({extraClass:`gp-product-images-gallery-${$?.uid}`})),F=e(o({settings:c})),A=e(m({setting:c,extraClass:`gp-flex gp-relative gp-product-images-gallery-${$?.uid} gp-overflow-hidden gp-flex gp-w-full gp-items-center gp-justify-center `}));return{wrapperClasses:w,productImagesGalleryClasses:b,galleryGridWrapperClasses:h,galleryItemClasses:s=>e(d({extraClass:`${s??""}`})),ftImageGalleryClasses:v,imageGalleryWrapperClasses:I,featuredImageCarouselClasses:j,featuredImageGalleryClasses:F,featureImageOnlyOneImageClasses:A,featuredCarouselItemClasses:s=>e(p({extraClass:`${s??""}`}))}},c=(s,r,a)=>e(d({extraClass:`${a} ${s===r?"gp-border-[#5EA2FF] gp-border-[3px]":"gp-border-white/20 hover:gp-border-white/60"}`}));export{c as galleryItemClasses,C as getProductImagesClassName};
+import{createClass as e}from"@gem-sdk/system";import{getWrapperClasses as s,getGalleryWrapperClasses as a,getGalleryGridWrapperClasses as r,getFtImageWithGalleryClasses as t,getImageGalleryWrapperClasses as l,getFeaturedImageCarouselClasses as g,getFeaturedImageGalleryClasses as m,getFeaturedImageClasses as o,getFeaturedCarouselItemClasses as p,getGalleryItemClasses as i}from"../common/classes.js";import{checkAddOverFlowClass as d,setDefaultWhenUndefineSetting as u}from"../common/common.js";let C=C=>{let{setting:c,style:f}=C,x=u(C),{builderProps:n,advanced:$}=x,y=$?.cssClass,j=e(s({extraClass:`${n?.uid} ${y??""} `,isAddOverFlowClass:d(f)})),v=e(a({})),w=e(r({})),I=e(t({extraClass:`gp-product-images-feature--${n?.uid}`})),h=e(l({extraClass:`gp-product-images-gallery-${n?.uid}`})),k=e(g({extraClass:`gp-product-images-gallery-${n?.uid}`})),A=e(m({settings:c})),F=e(o({setting:c,extraClass:`gp-flex gp-relative gp-product-images-gallery-${n?.uid} gp-overflow-hidden gp-flex gp-w-full gp-items-center gp-justify-center `}));return{wrapperClasses:j,productImagesGalleryClasses:v,galleryGridWrapperClasses:w,galleryItemClasses:s=>e(i({extraClass:`${s??""}`})),ftImageGalleryClasses:I,imageGalleryWrapperClasses:h,featuredImageCarouselClasses:k,featuredImageGalleryClasses:A,featureImageOnlyOneImageClasses:F,featuredCarouselItemClasses:s=>e(p({extraClass:`${s??""}`}))}};export{C as getProductImagesClassName};

package/dist/esm/product/components/product-list/ProductList.js

@@ -1 +1 @@
-import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import o from"next/dynamic";import d from"../../../common/components/Loading.js";import{useState as a,useMemo as l,useEffect as i}from"react";import{useRenderMode as c,useCurrentDevice as s,usePageType as n,usePageStore as u,useFetchHandle as m,hasPublicStoreFrontData as g,createStoreFrontFetcher as h,useProductQuery as p,useProductsQueryAll as f,useProductsQuery as P,useCollectionQuery as b,flattenConnection as k,ProductListProvider as T,filterToolbarPreview as I}from"@gem-sdk/core";import v from"../SalePageProductListWarning.js";import y from"next/head";import O from"./ProductListGridLayout.js";import S from"./ProductListCarouselLayout.js";import{getStyle as C}from"./common/styles.js";import{If as E}from"@gem-sdk/system";import{getClass as N}from"./common/classes.js";import{getData as w}from"./common/helpers.js";import{getPropertyByDevice as L}from"../../../dialog/common/helpers.js";let W=o(()=>import("../ProductNotFound.js"),{loading:d}),j=o=>{let{children:j,styles:x,builderProps:G,setting:M,builderAttrs:B}=o,{isRelatedProduct:A,productSetting:Q}=w(o),z=Q.relatedTag&&Q.relatedTag[0],{isEditMode:D,isPreviewSharePageMode:F}=c(),H=s(),R=n(),$=u(e=>e.dynamicProduct),_=u(e=>e.dynamicCollection),[V,q]=a(1),[U,J]=a(!0),[K,X]=a(),[Y,Z]=a(!1),ee="GP_FUNNEL_PAGE"===R;"GP_COLLECTION"==R&&(Q.productSrc="DynamicCollection",Q.collectionId=_?.collectionId??"latest");let et=Q?.productSrc??"Collection",er=$?.productId&&$?.productId!==Q.relatedProductId?$?.productId:Q.relatedProductId,eo=m(),ed=u(e=>e.publicStoreFrontData),ea=l(()=>g(ed)?h(ed):eo,[ed]),{data:el}=p(A&&er?er:void 0,{revalidateOnMount:D||F},ea),ei=Q.relatedTag&&"tags"===Q.relatedTag[0]&&(!el?.tags||el?.tags.length===0),ec=Q.relatedTag&&"collection"===Q.relatedTag[0]&&(!el?.collections?.edges||el?.collections.edges.length===0),es=Q.relatedTag&&"vendor"===Q.relatedTag[0]&&!el?.vendor,en=f(K,{revalidateOnMount:D||F},ea),eu=D||F,em=P("PickProduct"===et?Q?.productIds:void 0,{revalidateOnMount:eu},{defaultSelectedProductCount:Q?.numOfSelectedProducts}),eg=l(()=>({id:Q?.collectionId??"latest",numberOfProducts:M?.numberOfProducts??4,orderBy:M?.orderBy}),[Q?.collectionId,Number(M?.numberOfProducts),M?.orderBy]),eh=b("PickProduct"!==et?eg:void 0,{revalidateOnMount:eu});i(()=>{if(A&&el&&Q.relatedTag&&"recommended-product"!==Q.relatedType){let e;switch(Z(!1),Q.hasRelatedExclude&&(e=Q?.relatedExclude&&Q.relatedExclude.split(",").map(e=>e.trim())),Q.relatedTag[0]){case"vendor":X({first:M?.numberOfProducts,vendor:Q.relatedTag&&"vendor"===Q.relatedTag[0]?el?.vendor:"",idNEQ:el.id});break;case"collection":{let t=el?.collections?.edges.map(e=>e.node?.id);if(!t||t?.length===0){Z(!0);break}X(e&&e.length>0?{first:M?.numberOfProducts,idNEQ:el.id,hasCollectionProductsWith:[{hasCollectionWith:[{idIn:t},{titleNotIn:e}]}]}:{first:M?.numberOfProducts,idNEQ:el.id,hasCollectionProductsWith:[{hasCollectionWith:[{idIn:t}]}]});break}case"tags":if(!el.tags||0===el.tags.length){Z(!0);break}X(e&&e.length>0?{first:M?.numberOfProducts,idNEQ:el.id,hasProductTagsWith:[{hasTagsWith:[{nameIn:el.tags},{nameNotIn:e}]}]}:{first:M?.numberOfProducts,idNEQ:el.id,hasProductTagsWith:[{hasTagsWith:[{nameIn:el.tags}]}]})}}},[el,Q.relatedType,Q.relatedTag,M?.numberOfProducts,Q.relatedExclude,Q.hasRelatedExclude,A]);let ep="PickProduct"===et?em.isValidating:eh.isValidating,ef="PickProduct"===et?em.isLoading:eh.isLoading,eP="PickProduct"===et?em.error:eh.error,eb=eh.data?.collections?.edges?.[0]?.node,ek="PickProduct"===et?k(em.data?.products):k(eb?.products),eT=en?.data?.products?k(en?.data?.products):void 0,eI=A&&eT?eT:"PickProduct"===et&&Q?.productIds?.length?Q?.productIds?.map(e=>ek?.find(t=>t?.baseID===e)).filter(Boolean)??ek:"PickProduct"!==et?ek:ek.filter((e,t)=>t<(Q?.numOfSelectedProducts??4)),ev=l(()=>Y&&A&&D||!eI.length&&!ef&&U&&D,[U,ef,Y,A,D,eI.length]),ey=l(()=>!eI||Y&&A,[Y,A,eI]),eO=l(()=>{if(!M?.sameHeight)return[];let e=0,t=Math.ceil((eI?.length??0)/+(M?.slidesToShow?.[H]??1));return Array.from(Array(eI?.length??0)).map((r,o)=>(o>=+(M?.slidesToShow?.[H]??1)*(e+1)&&++e,{gridRow:`${1+V*e}/${V+1+V*e}`,marginBottom:e+1<t?L(x?.horizontalGutter,H):void 0}))},[M?.sameHeight,M?.slidesToShow,V,eI?.length,H,x?.horizontalGutter]),eS=l(()=>ep||ef||eP||!eI||Y&&A,[eP,ef,Y,A,ep,eI]);i(()=>{eS||setTimeout(()=>{let{builderData:e}=G??{},t=e?.childrens?.[0];if(!t)return;let r=document.querySelector(`[data-id=${t}] div`);r&&q(r.childElementCount||1)},D?0:500)},[G,eS,D]);let eC=l(()=>({collection:eb,products:eI,settings:{loop:M?.loop??{desktop:!1},scrollMode:M?.scrollMode??{desktop:"snap"},slidesToShow:M?.slidesToShow??{desktop:4,tablet:3,mobile:1},layout:x?.layout,dot:M?.dot,dotStyle:M?.dotStyle,arrow:M?.arrow,controlOverContent:M?.controlOverContent},styles:{horizontalGutter:x?.horizontalGutter,verticalGutter:x?.verticalGutter,fullWidth:x?.fullWidth,spacing:x?.spacing,width:x?.width,height:x?.height}}),[eb,eI,M,x]);if(G?.isPreview&&ee)return e(t,{});if(ev)return e(t,{children:E(U,e(W,{builderAttrs:B,collectionHandle:eb?.handle,productSrc:et,onClose:()=>J(!1),children:j,relatedTagString:z,assignProductNoTags:ei||ec||es,noAssignedProduct:!er}))});let{productListWrapStyle:eE,productListContentStyle:eN,productListWrapAlignStyle:ew}=C(o),{productListWrapClass:eL}=N(o);return r("div",{...B,className:eL,style:eE,children:[!!x?.preloadBgImage&&r(y,{children:[!!x.backgroundImage?.desktop?.image?.src&&e("link",{rel:"preload",href:x.backgroundImage.desktop.image.src,as:"image"}),!!x.backgroundImage?.tablet?.image?.src&&e("link",{rel:"preload",href:x.backgroundImage?.tablet?.image?.src,as:"image"}),!!x.backgroundImage?.mobile?.image?.src&&e("link",{rel:"preload",href:x.backgroundImage?.mobile?.image?.src,as:"image"})]}),ep||ef?e(d,{}):eP?r("div",{children:["Error: ",eP?.message]}):ey?e("div",{children:"Products not found"}):e(T,{...eC,children:e("div",{className:"gp-flex gp-w-full",style:ew,children:r("div",{style:eN,children:[ee&&e(v,{}),e(t,{children:E(x?.layout==="grid",e(O,{...o,productSortedById:eI,generateGridRowArray:eO}),e(S,{...o,productSortedById:eI}))})]})})}),I(j,!0)]})};export{j as default};
+import{jsx as e,Fragment as t,jsxs as o}from"react/jsx-runtime";import r from"next/dynamic";import d from"../../../common/components/Loading.js";import{useState as l,useMemo as i,useEffect as a}from"react";import{useRenderMode as c,useCurrentDevice as s,usePageType as n,usePageStore as u,useFetchHandle as m,hasPublicStoreFrontData as g,createStoreFrontFetcher as h,useProductQuery as p,useProductsQueryAll as f,useProductsQuery as P,useCollectionQuery as b,flattenConnection as k,ProductListProvider as T,filterToolbarPreview as v}from"@gem-sdk/core";import y from"../SalePageProductListWarning.js";import I from"next/head";import O from"./ProductListGridLayout.js";import C from"./ProductListCarouselLayout.js";import{getStyle as S}from"./common/styles.js";import{If as E}from"@gem-sdk/system";import{getClass as N}from"./common/classes.js";import{getData as w}from"./common/helpers.js";import{getPropertyByDevice as L}from"../../../dialog/common/helpers.js";import{PRODUCT_SOURCE as j}from"../product-list-v3/constants/index.js";let x=r(()=>import("../ProductNotFound.js"),{loading:d}),W=r=>{let{children:W,styles:G,builderProps:M,setting:B,builderAttrs:A}=r,{isRelatedProduct:D,productSetting:H}=w(r),Q=H.relatedTag&&H.relatedTag[0],{isEditMode:z,isPreviewSharePageMode:F}=c(),R=s(),$=n(),_=u(e=>e.dynamicProduct),V=u(e=>e.dynamicCollection),[q,U]=l(1),[J,K]=l(!0),[X,Y]=l(),[Z,ee]=l(!1),et="GP_FUNNEL_PAGE"===$;"GP_COLLECTION"!=$||[j.Collection,j.DynamicCollection].includes(H?.productSrc)||(H.productSrc=j.DynamicCollection);let eo=H?.productSrc??j.Collection;eo===j.DynamicCollection&&(H.collectionId=V?.collectionId||"latest");let er=_?.productId&&_?.productId!==H.relatedProductId?_?.productId:H.relatedProductId,ed=m(),el=u(e=>e.publicStoreFrontData),ei=i(()=>g(el)?h(el):ed,[el]),{data:ea}=p(D&&er?er:void 0,{revalidateOnMount:z||F},ei),ec=H.relatedTag&&"tags"===H.relatedTag[0]&&(!ea?.tags||ea?.tags.length===0),es=H.relatedTag&&"collection"===H.relatedTag[0]&&(!ea?.collections?.edges||ea?.collections.edges.length===0),en=H.relatedTag&&"vendor"===H.relatedTag[0]&&!ea?.vendor,eu=f(X,{revalidateOnMount:z||F},ei),em=z||F,eg=P(eo===j.PickProduct?H?.productIds:void 0,{revalidateOnMount:em},{defaultSelectedProductCount:H?.numOfSelectedProducts}),eh=i(()=>({id:H?.collectionId??"latest",numberOfProducts:B?.numberOfProducts??4,orderBy:B?.orderBy}),[H?.collectionId,Number(B?.numberOfProducts),B?.orderBy]),ep=b(eo!==j.PickProduct?eh:void 0,{revalidateOnMount:em});a(()=>{if(D&&ea&&H.relatedTag&&"recommended-product"!==H.relatedType){let e;switch(ee(!1),H.hasRelatedExclude&&(e=H?.relatedExclude&&H.relatedExclude.split(",").map(e=>e.trim())),H.relatedTag[0]){case"vendor":Y({first:B?.numberOfProducts,vendor:H.relatedTag&&"vendor"===H.relatedTag[0]?ea?.vendor:"",idNEQ:ea.id});break;case"collection":{let t=ea?.collections?.edges.map(e=>e.node?.id);if(!t||t?.length===0){ee(!0);break}Y(e&&e.length>0?{first:B?.numberOfProducts,idNEQ:ea.id,hasCollectionProductsWith:[{hasCollectionWith:[{idIn:t},{titleNotIn:e}]}]}:{first:B?.numberOfProducts,idNEQ:ea.id,hasCollectionProductsWith:[{hasCollectionWith:[{idIn:t}]}]});break}case"tags":if(!ea.tags||0===ea.tags.length){ee(!0);break}Y(e&&e.length>0?{first:B?.numberOfProducts,idNEQ:ea.id,hasProductTagsWith:[{hasTagsWith:[{nameIn:ea.tags},{nameNotIn:e}]}]}:{first:B?.numberOfProducts,idNEQ:ea.id,hasProductTagsWith:[{hasTagsWith:[{nameIn:ea.tags}]}]})}}},[ea,H.relatedType,H.relatedTag,B?.numberOfProducts,H.relatedExclude,H.hasRelatedExclude,D]);let ef=eo===j.PickProduct?eg.isValidating:ep.isValidating,eP=eo===j.PickProduct?eg.isLoading:ep.isLoading,eb=eo===j.PickProduct?eg.error:ep.error,ek=ep.data?.collections?.edges?.[0]?.node,eT=eo===j.PickProduct?k(eg.data?.products):k(ek?.products),ev=eu?.data?.products?k(eu?.data?.products):void 0,ey=D&&ev?ev:eo===j.PickProduct&&H?.productIds?.length?H?.productIds?.map(e=>eT?.find(t=>t?.baseID===e)).filter(Boolean)??eT:eo!==j.PickProduct?eT:eT.filter((e,t)=>t<(H?.numOfSelectedProducts??4)),eI=i(()=>Z&&D&&z||!ey.length&&!eP&&J&&z,[J,eP,Z,D,z,ey.length]),eO=i(()=>!ey||Z&&D,[Z,D,ey]),eC=i(()=>{if(!B?.sameHeight)return[];let e=0,t=Math.ceil((ey?.length??0)/+(B?.slidesToShow?.[R]??1));return Array.from(Array(ey?.length??0)).map((o,r)=>(r>=+(B?.slidesToShow?.[R]??1)*(e+1)&&++e,{gridRow:`${1+q*e}/${q+1+q*e}`,marginBottom:e+1<t?L(G?.horizontalGutter,R):void 0}))},[B?.sameHeight,B?.slidesToShow,q,ey?.length,R,G?.horizontalGutter]),eS=i(()=>ef||eP||eb||!ey||Z&&D,[eb,eP,Z,D,ef,ey]);a(()=>{eS||setTimeout(()=>{let{builderData:e}=M??{},t=e?.childrens?.[0];if(!t)return;let o=document.querySelector(`[data-id=${t}] div`);o&&U(o.childElementCount||1)},z?0:500)},[M,eS,z]);let eE=i(()=>({collection:ek,products:ey,settings:{loop:B?.loop??{desktop:!1},scrollMode:B?.scrollMode??{desktop:"snap"},slidesToShow:B?.slidesToShow??{desktop:4,tablet:3,mobile:1},layout:G?.layout,dot:B?.dot,dotStyle:B?.dotStyle,arrow:B?.arrow,controlOverContent:B?.controlOverContent,sameHeight:B?.sameHeight},styles:{horizontalGutter:G?.horizontalGutter,verticalGutter:G?.verticalGutter,fullWidth:G?.fullWidth,spacing:G?.spacing,width:G?.width,height:G?.height}}),[ek,ey,B,G]);if(M?.isPreview&&et)return e(t,{});if(eI)return e(t,{children:E(J,e(x,{builderAttrs:A,collectionHandle:ek?.handle,productSrc:eo,onClose:()=>K(!1),children:W,relatedTagString:Q,assignProductNoTags:ec||es||en,noAssignedProduct:!er}))});let{productListWrapStyle:eN,productListContentStyle:ew,productListWrapAlignStyle:eL}=S(r),{productListWrapClass:ej}=N(r);return o("div",{...A,className:ej,style:eN,children:[!!G?.preloadBgImage&&o(I,{children:[!!G.backgroundImage?.desktop?.image?.src&&e("link",{rel:"preload",href:G.backgroundImage.desktop.image.src,as:"image"}),!!G.backgroundImage?.tablet?.image?.src&&e("link",{rel:"preload",href:G.backgroundImage?.tablet?.image?.src,as:"image"}),!!G.backgroundImage?.mobile?.image?.src&&e("link",{rel:"preload",href:G.backgroundImage?.mobile?.image?.src,as:"image"})]}),ef||eP?e(d,{}):eb?o("div",{children:["Error: ",eb?.message]}):eO?e("div",{children:"Products not found"}):e(T,{...eE,children:e("div",{className:"gp-flex gp-w-full",style:eL,children:o("div",{style:ew,children:[et&&e(y,{}),e(t,{children:E(G?.layout==="grid",e(O,{...r,productSortedById:ey,generateGridRowArray:eC}),e(C,{...r,productSortedById:ey}))})]})})}),v(W,!0)]})};export{W as default};

package/dist/esm/product/components/product-list/ProductList.liquid.js

@@ -1,6 +1,6 @@
-import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-sdk/core";import{getSettingPreloadData as d,getStaticLocale as o}from"../../../helpers.js";import{If as r}from"@gem-sdk/system";import a from"./ProductListCarouselLayout.liquid.js";import n from"./ProductListGridLayout.liquid.js";import{getStyle as c}from"./common/styles.js";import{getClass as l}from"./common/classes.js";import{getDataLiquid as u}from"./common/helpers.js";let g=g=>{let{setting:p,styles:f,pageContext:m}=g,$=m?.pageType==="GP_FUNNEL_PAGE";if($)return"";let{hasRelatedExclude:P,relatedExcludeTrim:h,collectionID:_,isLatestProducts:y,isGrid:v,numberOfProducts:E,productListId:k,productListHandles:x,sortedBy:S,isReverse:b,productSrc:A,productNumber:L,isSorted:R,relatedTag:I,collectionHandle:F}=u(g),j=()=>i`
-    ${e("RelatedProduct"===A,`
-        assign relatedTag = '${I}'
+import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-sdk/core";import{getSettingPreloadData as d,getStaticLocale as o}from"../../../helpers.js";import{If as r}from"@gem-sdk/system";import a from"./ProductListCarouselLayout.liquid.js";import n from"./ProductListGridLayout.liquid.js";import{getStyle as c}from"./common/styles.js";import{getClass as l}from"./common/classes.js";import{getDataLiquid as g}from"./common/helpers.js";let u=u=>{let{setting:p,styles:f,pageContext:m}=u,$=m?.pageType==="GP_FUNNEL_PAGE";if($)return"";let{hasRelatedExclude:P,relatedExcludeTrim:h,collectionID:_,isLatestProducts:y,isGrid:v,numberOfProducts:E,productListId:k,productListHandles:S,sortedBy:x,isReverse:b,productSrc:L,productNumber:A,isSorted:R,relatedTag:H,collectionHandle:I}=g(u),F=()=>i`
+    ${e("RelatedProduct"===L,`
+        assign relatedTag = '${H}'
         assign assignProduct = product
         assign idAssignProduct = assignProduct.id
         paginate collections.all.products by 10000
@@ -95,7 +95,7 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
           assign products = products
         endpaginate
       `)}
-  `,{productListWrapStyle:w,productListContentStyle:H,productListWrapAlignStyle:q}=c(g),{productListWrapClass:G}=l(g);return i`
+  `,{productListWrapStyle:j,productListContentStyle:w,productListWrapAlignStyle:q}=c(u),{productListWrapClass:G}=l(u);return i`
     ${e(s,`
         <script ${d('class="gps-link" delay',"src")}="{{ 'gp-product-v7-5.js' | asset_url }}" defer="defer"></script>
         ${p?.sameHeight?`<script ${d('class="gps-link" delay',"src")}="{{ 'gp-same-height-v7-5.js' | asset_url }}" defer="defer"></script>`:""}
@@ -107,16 +107,16 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
     ${e(!!f?.preloadBgImage,`${e(!!f?.backgroundImage?.desktop?.image?.src,`<link rel="preload" href="${f?.backgroundImage?.desktop?.image?.src}" as="image" />`)}${e(!!f?.backgroundImage?.tablet?.image?.src,`<link rel="preload" href="${f?.backgroundImage?.tablet?.image?.src}" as="image" />`)}${e(!!f?.backgroundImage?.mobile?.image?.src,`<link rel="preload" href="${f?.backgroundImage?.mobile?.image?.src}" as="image" />`)}`)}
     <div
       class="${G}"
-      style="${w}"
+      style="${j}"
     >
       <div class='gp-flex gp-w-full' style="${q}">
         <div
-          style="${H}"
+          style="${w}"
         >
           {%- assign gpBkProduct = product -%}
           {%- assign gpBkProducts = products -%}
-          ${(()=>{let e=F?`
-          assign target_collection = collections['${F}']
+          ${(()=>{let e=I?`
+          assign target_collection = collections['${I}']
           if target_collection == empty
             for collection in collections
               if collection.id == ${_}
@@ -134,12 +134,13 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
           endfor
         `;return i`
       {%- liquid
-        assign productHandles = '${x.toString()}'| split: ','
+        assign productHandles = '${S.toString()}'| split: ','
         assign products = null
         assign target_collection = null
-        assign productSrc = '${A}'
+        assign productSrc = '${L}'
         assign c = 0
-        assign limit = ${L??4}
+        assign limit = ${A??4}
+        assign isSettingSameHeightProductList = ${p?.sameHeight??!1}
 
         if request.page_type == 'collection' or preview_page_type == 'collection'
           assign target_collection = collection
@@ -151,11 +152,11 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
             endif
           endif
           paginate target_collection.products by ${E||4}
-            assign products = target_collection.products ${R?S:""} ${b?"| reverse":""}
+            assign products = target_collection.products ${R?x:""} ${b?"| reverse":""}
           endpaginate
         else
           if productSrc == 'RelatedProduct'
-            ${j()}
+            ${F()}
           elsif productSrc == 'PickProduct'
             unless ${y}
               assign products = null | sort
@@ -178,7 +179,7 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
               ${e}
             endif
             paginate target_collection.products by ${E||4}
-              assign products = target_collection.products ${R?S:""} ${b?"| reverse":""}
+              assign products = target_collection.products ${R?x:""} ${b?"| reverse":""}
             endpaginate
           endif
         endif
@@ -187,14 +188,14 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
           ${i`
     {%- if products == null -%}
     {%- if count == 0 and ${k.length} == 0 -%}
-      {% if '${A}' == 'RelatedProduct' -%}
+      {% if '${L}' == 'RelatedProduct' -%}
           <div>${o("ProductList","no_related_products")}</div>
         {% else %}
           <div>${o("ProductList","no_products_found")}</div>
       {%- endif -%}
     {%- endif -%}
     {%-else-%}
-      ${r(v,i`${n({...g,productListId:k,productSrc:A})}`,i`${a({...g,productListId:k,productSrc:A})}`)}
+      ${r(v,i`${n({...u,productListId:k,productSrc:L})}`,i`${a({...u,productListId:k,productSrc:L})}`)}
     {%- endif -%}
     `}
           {%- assign product = gpBkProduct -%}
@@ -202,4 +203,4 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
         </div>
       </div>
     </div>
-  `};export{g as default};
+  `};export{u as default};

package/dist/esm/product/components/product-list/ProductListCarouselItem.liquid.js

@@ -1,15 +1,14 @@
-import{template as t}from"@gem-sdk/core";import{getClass as e}from"./common/classes.js";import{filterPageContext as n}from"../../../helpers.js";let o=o=>{let{pageContext:a,children:r}=o,{productItemClass:i,gpProductClass:c}=e(o);return t`
+import{template as t}from"@gem-sdk/core";import{getClass as n}from"./common/classes.js";let o=o=>{let{pageContext:e,children:a}=o,{productItemClass:r,gpProductClass:i}=n(o);return t`
       <gp-product
         gp-context='{"variantSelected": {{ variant | json | escape }}, "inventory_management": {{ variant.inventory_management | json | escape  }}, "inventory_policy": {{ variant.inventory_policy | json | escape }}, "quantity": 1 , "inventoryQuantity": {{ variant.inventory_quantity | default: 0 }},  "formId": "{{ product_form_id }}"}'
-        gp-data='{"variantSelected": {{ variant | json | escape }}, "quantity": 1, "productUrl":{{ product.url | json | escape }}, "productHandle":{{ product.handle | json | escape }}, "collectionUrl": {{ collection.url | json | escape }}, "collectionHandle": {{ collection.handle | json | escape }},"pageContext" : ${JSON.stringify(n(a))}}'
-        class="${c}"
-
+        class="${i}"
       >
-        {%- form 'product', product, id: product_form_id, class: 'form contents ${i}',  data-type: 'add-to-cart-form', autocomplete: 'off' -%}
+        <script gp-data type="application/json">{"variantSelected": {{ variant | json }}, "quantity": 1, "productUrl":{{ product.url | json }}, "productHandle":{{ product.handle | json }}, "collectionUrl": {{ collection.url | json }}, "collectionHandle": {{ collection.handle | json }},"pageContext" : ${JSON.stringify(e)}}</script>
+        {%- form 'product', product, id: product_form_id, class: 'form contents ${r}',  data-type: 'add-to-cart-form', autocomplete: 'off' -%}
         <input type="hidden" name="id" value="{{ variant.id }}" />
         <input type="hidden" min="1" name="quantity"  value="{{ quantity }}" />
         <button type="submit" onclick="return false;" style="display:none;"></button>
-          ${r}
+          ${a}
         {%- endform -%}
       </gp-product>
   `};export{o as default};

package/dist/esm/product/components/product-list/ProductListGridItem.liquid.js

@@ -1,19 +1,18 @@
-import{template as t,RenderChildren as e}from"@gem-sdk/core";import{getClass as n}from"./common/classes.js";import{filterPageContext as o}from"../../../helpers.js";let a=a=>{let{pageContext:r,rawChildren:i}=a,{productItemClass:c,gpProductClass:p}=n(a);return t`
+import{template as t,RenderChildren as n}from"@gem-sdk/core";import{getClass as e}from"./common/classes.js";let o=o=>{let{pageContext:a,rawChildren:r}=o,{productItemClass:i,gpProductClass:c}=e(o);return t`
       <gp-product
         gp-context='{"variantSelected": {{ variant | json | escape }}, "inventory_management": {{ variant.inventory_management | json | escape  }}, "inventory_policy": {{ variant.inventory_policy | json | escape }}, "quantity": 1 , "inventoryQuantity": {{ variant.inventory_quantity | default: 0 }},  "formId": "{{ product_form_id }}"}'
-        gp-data='{"variantSelected": {{ variant | json | escape }}, "quantity": 1, "productUrl":{{ product.url | json | escape }}, "productHandle":{{ product.handle | json | escape }}, "collectionUrl": {{ collection.url | json | escape }}, "collectionHandle": {{ collection.handle | json | escape }},"pageContext" : ${JSON.stringify(o(r))}}'
-        class="${p}"
-
+        class="${c}"
       >
-        {%- form 'product', product, id: product_form_id, class: 'form contents ${c}',  data-type: 'add-to-cart-form', autocomplete: 'off' -%}
+        <script gp-data type="application/json">{"variantSelected": {{ variant | json }}, "quantity": 1, "productUrl":{{ product.url | json }}, "productHandle":{{ product.handle | json }}, "collectionUrl": {{ collection.url | json }}, "collectionHandle": {{ collection.handle | json }},"pageContext" : ${JSON.stringify(a)}}</script>
+        {%- form 'product', product, id: product_form_id, class: 'form contents ${i}',  data-type: 'add-to-cart-form', autocomplete: 'off' -%}
         <input type="hidden" name="id" value="{{ variant.id }}" />
         <input type="hidden" min="1" name="quantity"  value="{{ quantity }}" />
         <button type="submit" onclick="return false;" style="display:none;"></button>
           ${t`
-      ${i?.map((n,o)=>{if(n)return t`
-            ${e({...n,index:o})}
+      ${r?.map((e,o)=>{if(e)return t`
+            ${n({...e,index:o})}
           `}).join("")}
     `}
         {%- endform -%}
       </gp-product>
-  `};export{a as default};
+  `};export{o as default};

package/dist/esm/product/components/product-list/ProductListGridLayout.liquid.js

@@ -1,18 +1,18 @@
-import{RenderIf as t,template as i}from"@gem-sdk/core";import{getStyle as o}from"./common/styles.js";import{getClass as s}from"./common/classes.js";import{getAttr as r}from"./common/attrs.js";import d from"./ProductListGridItem.liquid.js";import{getStaticLocale as e}from"../../../helpers.js";let a=a=>{let{setting:n,builderProps:m,styles:c,productListId:p,productSrc:l}=a,{gridLayoutStyle:u}=o(a),{gridLayoutClass:f}=s(a),{productListAttr:g}=r(a),$=()=>i`
+import{RenderIf as t,template as i}from"@gem-sdk/core";import{getStyle as o}from"./common/styles.js";import{getClass as s}from"./common/classes.js";import{getAttr as r}from"./common/attrs.js";import e from"./ProductListGridItem.liquid.js";import{getStaticLocale as d}from"../../../helpers.js";let a=a=>{let{setting:n,builderProps:p,styles:c,productListId:m,productSrc:l}=a,{gridLayoutStyle:u}=o(a),{gridLayoutClass:f}=s(a),{productListAttr:g}=r(a),$=()=>i`
       {%- assign count = 0 -%}
       {%- for product in products limit: limit -%}
       {%- if product.id != empty -%}
       {%- assign count = count | plus: 1 -%}
       {%- assign variant = product.selected_or_first_available_variant -%}
-      {%- assign product_form_id = 'product-form-' | append: "${m?.uid}" | append: product.id -%}
-        ${d({...a})}
+      {%- assign product_form_id = 'product-form-' | append: "${p?.uid}" | append: product.id -%}
+        ${e({...a})}
       {%- endif -%}
       {% endfor %}
-      {%- if count == 0 and ${p?.length} == 0 -%}
+      {%- if count == 0 and ${m?.length} == 0 -%}
         {% if '${l}' == 'RelatedProduct' -%}
-          <div>${e("ProductList","no_related_products")}</div>
+          <div>${d("ProductList","no_related_products")}</div>
         {% else %}
-          <div>${e("ProductList","no_products_found")}</div>
+          <div>${d("ProductList","no_products_found")}</div>
         {%- endif -%}
       {%- endif -%}
     `;return i`
@@ -25,7 +25,9 @@ import{RenderIf as t,template as i}from"@gem-sdk/core";import{getStyle as o}from
       <gp-same-height
         class="gp-contents"
         style="visibility: hidden"
-        gp-data='${JSON.stringify({targetUid:m?.builderData?.childrens?.[0],slidesToShow:n?.slidesToShow,rowGap:c?.horizontalGutter})}'>
+      >
+        <script gp-data type="application/json">${JSON.stringify({targetUid:p?.builderData?.childrens?.[0],slidesToShow:n?.slidesToShow,rowGap:c?.horizontalGutter})}
+        </script>
         ${`${$()}`}
       </gp-same-height>
     `)}

package/dist/esm/product/components/product-list-v3/ProductList.js

@@ -1 +1 @@
-import{jsx as e,Fragment as o,jsxs as t}from"react/jsx-runtime";import r from"next/dynamic";import d from"../../../common/components/Loading.js";import{useState as l,useRef as i,useMemo as a,useEffect as s}from"react";import{useRenderMode as c,useCurrentDevice as n,usePageType as m,usePageStore as u,flattenConnection as g,ProductListProvider as p,filterToolbarPreview as h}from"@gem-sdk/core";import f from"../SalePageProductListWarning.js";import P from"next/head";import k from"./ProductListGridLayout.js";import y from"./ProductListCarouselLayout.js";import{getStyle as I}from"./common/styles.js";import{If as T}from"@gem-sdk/system";import{getClass as b}from"./common/classes.js";import{getData as S}from"./common/helpers.js";import{getPropertyByDevice as j}from"../../../dialog/common/helpers.js";import{useProductsQuery as v}from"./hooks/useProductsQuery.js";import{useCollectionQuery as w}from"./hooks/useCollectionQuery.js";import C from"./hooks/useProductRelatedQuery.js";import L from"./hooks/useMainRelatedProductQuery.js";let G=r(()=>import("../ProductNotFound.js"),{loading:d}),O=r=>{let{children:O,styles:A,builderProps:N,setting:x,builderAttrs:B}=r,{isRelatedProduct:E,productSetting:z}=S(r),{isEditMode:M}=c(),Q=n(),D=m(),H=u(e=>e.dynamicCollection),[R,W]=l(1),[$,_]=l(!0),F=i(),V="GP_FUNNEL_PAGE"===D;"GP_COLLECTION"==D&&(z.productSrc="DynamicCollection",z.collectionId=H?.collectionId??"latest");let q=z?.productSrc??"Collection",{mainRelatedProduct:U,relatedProductIdAssigned:J}=L({productSrc:q,relatedProductId:z.relatedProductId}),K=z.relatedTag&&z.relatedTag[0],X=z.relatedTag&&"tags"===z.relatedTag[0]&&(!U?.tags||U?.tags.length===0),Y=z.relatedTag&&"collection"===z.relatedTag[0]&&(!U?.collections?.edges||U?.collections.edges.length===0),Z=z.relatedTag&&"vendor"===z.relatedTag[0]&&!U?.vendor,{isNotFoundRelatedProduct:ee,relatedProducts:eo}=C({isRelatedProduct:E,productSetting:z,setting:x,mainRelatedProduct:U,productSrc:q}),et=v({productIds:z?.productIds,defaultSelectedProductCount:z?.numOfSelectedProducts,productSrc:q}),er=w({productSrc:q,collectionID:z?.collectionId??"latest",numberOfProducts:x?.numberOfProducts??4,orderBy:x?.orderBy??"none"}),ed="PickProduct"===q?et.isLoading:er.isLoading,el="PickProduct"===q?et.error:er.error,ei="PickProduct"===q?et.isValidating:er.isValidating,ea=er.data?.collections?.edges?.[0]?.node,es="PickProduct"===q?g(et.data?.products):g(ea?.products),ec=u(e=>e.assignedProductIds),en=u(e=>e.isApplyAllProducts),em=a(()=>(ec??[]).length>0&&!en||en,[ec,en]),eu=eo?.data?.products&&em?g(eo?.data?.products):[],eg=E?eu:"PickProduct"===q&&z?.productIds?.length?z?.productIds?.map(e=>es?.find(o=>o?.baseID===e)).filter(Boolean)??es:"PickProduct"!==q?es:es.filter((e,o)=>o<(z?.numOfSelectedProducts??4)),ep=a(()=>ee&&E&&M||!eg.length&&!ed&&$&&M,[$,ed,ee,E,M,eg.length]),eh=a(()=>!eg||ee&&E,[ee,E,eg]),ef=a(()=>{if(!x?.sameHeight)return[];let e=0,o=Math.ceil((eg?.length??0)/+(x?.slidesToShow?.[Q]??1));return Array.from(Array(eg?.length??0)).map((t,r)=>(r>=+(x?.slidesToShow?.[Q]??1)*(e+1)&&++e,{gridRow:`${1+R*e}/${R+1+R*e}`,marginBottom:e+1<o?j(A?.horizontalGutter,Q):void 0}))},[x?.sameHeight,x?.slidesToShow,R,eg?.length,Q,A?.horizontalGutter]),eP=a(()=>ei||ed||el||!eg||ee&&E,[el,ed,ee,E,ei,eg]);s(()=>{if(!eP&&!ed&&!ei)return F.current=setTimeout(()=>{let{builderData:e}=N??{},o=e?.childrens?.[0];if(!o)return;let t=document.querySelector(`[data-id=${o}] div`);t&&W(t.childElementCount||1)},M?0:500),()=>{clearTimeout(F.current)}},[N,eP,M,ed,ei,eg]);let ek=a(()=>({collection:ea,products:eg,settings:{loop:x?.loop??{desktop:!1},scrollMode:x?.scrollMode??{desktop:"snap"},slidesToShow:x?.slidesToShow??{desktop:4,tablet:3,mobile:1},layout:A?.layout,dot:x?.dot,dotStyle:x?.dotStyle,arrow:x?.arrow,controlOverContent:x?.controlOverContent},styles:{horizontalGutter:A?.horizontalGutter,verticalGutter:A?.verticalGutter,fullWidth:A?.fullWidth,spacing:A?.spacing,width:A?.width,height:A?.height}}),[ea,eg,x,A]);if(N?.isPreview&&V)return e(o,{});if(ep)return e(o,{children:T($,e(G,{builderAttrs:B,collectionHandle:ea?.handle,productSrc:q,onClose:()=>_(!1),children:O,relatedTagString:K,assignProductNoTags:X||Y||Z,noAssignedProduct:!J}))});let{productListWrapStyle:ey,productListContentStyle:eI,productListWrapAlignStyle:eT}=I(r),{productListWrapClass:eb}=b(r);return t("div",{...B,className:eb,style:ey,children:[!!A?.preloadBgImage&&t(P,{children:[!!A.backgroundImage?.desktop?.image?.src&&e("link",{rel:"preload",href:A.backgroundImage.desktop.image.src,as:"image"}),!!A.backgroundImage?.tablet?.image?.src&&e("link",{rel:"preload",href:A.backgroundImage?.tablet?.image?.src,as:"image"}),!!A.backgroundImage?.mobile?.image?.src&&e("link",{rel:"preload",href:A.backgroundImage?.mobile?.image?.src,as:"image"})]}),ed||ei?e(d,{}):el?t("div",{children:["Error: ",el?.message]}):eh?e("div",{children:"Products not found"}):e(p,{...ek,children:e("div",{className:"gp-flex gp-w-full",style:eT,children:t("div",{style:eI,children:[V&&e(f,{}),e(o,{children:T(A?.layout==="grid",e(k,{...r,productSortedById:eg,generateGridRowArray:ef}),e(y,{...r,productSortedById:eg}))})]})})}),h(O,!0)]})};export{O as default};
+import{jsx as o,Fragment as e,jsxs as t}from"react/jsx-runtime";import r from"next/dynamic";import i from"../../../common/components/Loading.js";import{useState as l,useRef as d,useMemo as s,useEffect as c}from"react";import{useRenderMode as n,useCurrentDevice as a,usePageType as m,usePageStore as u,flattenConnection as g,ProductListProvider as p,filterToolbarPreview as h}from"@gem-sdk/core";import f from"../SalePageProductListWarning.js";import P from"next/head";import y from"./ProductListGridLayout.js";import k from"./ProductListCarouselLayout.js";import{getStyle as I}from"./common/styles.js";import{If as b}from"@gem-sdk/system";import{getClass as S}from"./common/classes.js";import{getData as j}from"./common/helpers.js";import{getPropertyByDevice as C}from"../../../dialog/common/helpers.js";import{useProductsQuery as L}from"./hooks/useProductsQuery.js";import{useCollectionQuery as v}from"./hooks/useCollectionQuery.js";import w from"./hooks/useProductRelatedQuery.js";import{PRODUCT_SOURCE as N,DEFAULT_COLLECTION_NUMBER_OF_PRODUCTS as G}from"./constants/index.js";import T from"./hooks/useRelatedProductIDAssigned.js";let A=r(()=>import("../ProductNotFound.js"),{loading:i}),O=r=>{let{children:O,styles:x,builderProps:D,setting:B,builderAttrs:E}=r,{isRelatedProduct:H,productSetting:z}=j(r),{isEditMode:M}=n(),Q=a(),R=m(),W=u(o=>o.dynamicCollection),[$,_]=l(1),[F,V]=l(!0),q=d(),U="GP_FUNNEL_PAGE"===R;"GP_COLLECTION"!=R||[N.Collection,N.DynamicCollection].includes(z?.productSrc)||(z.productSrc=N.DynamicCollection);let J=z?.productSrc??N.Collection;J===N.DynamicCollection&&(z.collectionId=W?.collectionId||"latest");let{relatedProductIdAssigned:K}=T({productSetting:z}),{isNotFoundRelatedProduct:X,relatedProducts:Y,isNoRelatedProductData:Z,relatedTagString:oo,isLoading:oe}=w({setting:B,productSetting:z,isRelatedProduct:H,relatedProductIdAssigned:K}),ot=L({productIds:z?.productIds,defaultSelectedProductCount:z?.numOfSelectedProducts,productSrc:J}),or=Number(B?.numberOfProducts),oi=v({productSrc:J,collectionID:z?.collectionId??"latest",numberOfProducts:Number.isNaN(or)?G:or,orderBy:B?.orderBy??"none"}),ol=oe||(J===N.PickProduct?ot.isLoading:oi.isLoading),od=J===N.PickProduct?ot.error:oi.error,os=J===N.PickProduct?ot.isValidating:oi.isValidating,oc=oi.data?.collections?.edges?.[0]?.node,on=J===N.PickProduct?g(ot.data?.products):g(oc?.products),oa=u(o=>o.assignedProductIds),om=u(o=>o.isApplyAllProducts),ou=s(()=>(oa??[]).length>0&&!om||om,[oa,om]),og=Y?.data?.products&&ou?g(Y?.data?.products):[],op=H?og:J===N.PickProduct&&z?.productIds?.length?z?.productIds?.map(o=>on?.find(e=>e?.baseID===o)).filter(Boolean)??on:J!==N.PickProduct?on:on.filter((o,e)=>e<(z?.numOfSelectedProducts??4)),oh=s(()=>X&&H&&M||!op.length&&!ol&&F&&M,[F,ol,X,H,M,op.length]),of=s(()=>!op||X&&H,[X,H,op]),oP=s(()=>{if(!B?.sameHeight)return[];let o=0,e=Math.ceil((op?.length??0)/+(B?.slidesToShow?.[Q]??1));return Array.from(Array(op?.length??0)).map((t,r)=>(r>=+(B?.slidesToShow?.[Q]??1)*(o+1)&&++o,{gridRow:`${1+$*o}/${$+1+$*o}`,marginBottom:o+1<e?C(x?.horizontalGutter,Q):void 0}))},[B?.sameHeight,B?.slidesToShow,$,op?.length,Q,x?.horizontalGutter]),oy=s(()=>os||ol||od||!op||X&&H,[od,ol,X,H,os,op]);c(()=>{if(!oy&&!ol&&!os)return q.current=setTimeout(()=>{let{builderData:o}=D??{},e=o?.childrens?.[0];if(!e)return;let t=document.querySelector(`[data-id=${e}] div`);t&&_(t.childElementCount||1)},M?0:500),()=>{clearTimeout(q.current)}},[D,oy,M,ol,os,op]);let ok=s(()=>({collection:oc,products:op,settings:{loop:B?.loop??{desktop:!1},scrollMode:B?.scrollMode??{desktop:"snap"},slidesToShow:B?.slidesToShow??{desktop:4,tablet:3,mobile:1},layout:x?.layout,dot:B?.dot,dotStyle:B?.dotStyle,arrow:B?.arrow,controlOverContent:B?.controlOverContent,sameHeight:B?.sameHeight},styles:{horizontalGutter:x?.horizontalGutter,verticalGutter:x?.verticalGutter,fullWidth:x?.fullWidth,spacing:x?.spacing,width:x?.width,height:x?.height}}),[oc,op,B,x]);if(D?.isPreview&&U)return o(e,{});if(oh)return o(e,{children:b(F,o(A,{builderAttrs:E,collectionHandle:oc?.handle,productSrc:J,onClose:()=>V(!1),children:O,relatedTagString:oo,assignProductNoTags:Z,noAssignedProduct:!K}))});let{productListWrapStyle:oI,productListContentStyle:ob,productListWrapAlignStyle:oS}=I(r),{productListWrapClass:oj}=S(r);return t("div",{...E,className:oj,style:oI,children:[!!x?.preloadBgImage&&t(P,{children:[!!x.backgroundImage?.desktop?.image?.src&&o("link",{rel:"preload",href:x.backgroundImage.desktop.image.src,as:"image"}),!!x.backgroundImage?.tablet?.image?.src&&o("link",{rel:"preload",href:x.backgroundImage?.tablet?.image?.src,as:"image"}),!!x.backgroundImage?.mobile?.image?.src&&o("link",{rel:"preload",href:x.backgroundImage?.mobile?.image?.src,as:"image"})]}),ol||os?o(i,{}):od?t("div",{children:["Error: ",od?.message]}):of?o("div",{children:"Products not found"}):o(p,{...ok,children:o("div",{className:"gp-flex gp-w-full",style:oS,children:t("div",{style:ob,children:[U&&o(f,{}),o(e,{children:b(x?.layout==="grid",o(y,{...r,productSortedById:op,generateGridRowArray:oP}),o(k,{...r,productSortedById:op}))})]})})}),h(O,!0)]})};export{O as default};

package/dist/esm/product/components/product-list-v3/ProductList.liquid.js

@@ -1,6 +1,6 @@
-import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-sdk/core";import{getSettingPreloadData as d,getStaticLocale as o}from"../../../helpers.js";import{If as r}from"@gem-sdk/system";import n from"./ProductListCarouselLayout.liquid.js";import a from"./ProductListGridLayout.liquid.js";import{getStyle as c}from"./common/styles.js";import{getClass as l}from"./common/classes.js";import{getDataLiquid as u}from"./common/helpers.js";let g=g=>{let{setting:p,styles:f,pageContext:m}=g,$=m?.pageType==="GP_FUNNEL_PAGE";if($)return"";let{hasRelatedExclude:P,relatedExcludeTrim:h,collectionID:_,isLatestProducts:y,isGrid:v,numberOfProducts:E,productListId:k,productListHandles:x,sortedBy:S,isReverse:b,productSrc:A,productNumber:L,isSorted:R,relatedTag:I,collectionHandle:F}=u(g),j=()=>i`
-    ${e("RelatedProduct"===A,`
-        assign relatedTag = '${I}'
+import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-sdk/core";import{getSettingPreloadData as d,getStaticLocale as o}from"../../../helpers.js";import{If as r}from"@gem-sdk/system";import n from"./ProductListCarouselLayout.liquid.js";import a from"./ProductListGridLayout.liquid.js";import{getStyle as c}from"./common/styles.js";import{getClass as l}from"./common/classes.js";import{getDataLiquid as g}from"./common/helpers.js";let u=u=>{let{setting:p,styles:f,pageContext:m}=u,$=m?.pageType==="GP_FUNNEL_PAGE";if($)return"";let{hasRelatedExclude:P,relatedExcludeTrim:h,collectionID:_,isLatestProducts:y,isGrid:v,numberOfProducts:E,productListId:k,productListHandles:S,sortedBy:x,isReverse:b,productSrc:L,productNumber:A,isSorted:R,relatedTag:H,collectionHandle:I}=g(u),F=()=>i`
+    ${e("RelatedProduct"===L,`
+        assign relatedTag = '${H}'
         assign assignProduct = product
         assign idAssignProduct = assignProduct.id
         paginate collections.all.products by 10000
@@ -95,7 +95,7 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
           assign products = products
         endpaginate
       `)}
-  `,{productListWrapStyle:w,productListContentStyle:H,productListWrapAlignStyle:q}=c(g),{productListWrapClass:G}=l(g);return i`
+  `,{productListWrapStyle:j,productListContentStyle:w,productListWrapAlignStyle:q}=c(u),{productListWrapClass:G}=l(u);return i`
     ${e(s,`
         <script ${d('class="gps-link" delay',"src")}="{{ 'gp-product-v7-5.js' | asset_url }}" defer="defer"></script>
         ${p?.sameHeight?`<script ${d('class="gps-link" delay',"src")}="{{ 'gp-same-height-v7-5.js' | asset_url }}" defer="defer"></script>`:""}
@@ -107,16 +107,16 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
     ${e(!!f?.preloadBgImage,`${e(!!f?.backgroundImage?.desktop?.image?.src,`<link rel="preload" href="${f?.backgroundImage?.desktop?.image?.src}" as="image" />`)}${e(!!f?.backgroundImage?.tablet?.image?.src,`<link rel="preload" href="${f?.backgroundImage?.tablet?.image?.src}" as="image" />`)}${e(!!f?.backgroundImage?.mobile?.image?.src,`<link rel="preload" href="${f?.backgroundImage?.mobile?.image?.src}" as="image" />`)}`)}
     <div
       class="${G}"
-      style="${w}"
+      style="${j}"
     >
       <div class='gp-flex gp-w-full' style="${q}">
         <div
-          style="${H}"
+          style="${w}"
         >
           {%- assign gpBkProduct = product -%}
           {%- assign gpBkProducts = products -%}
-          ${(()=>{let e=F?`
-          assign target_collection = collections['${F}']
+          ${(()=>{let e=I?`
+          assign target_collection = collections['${I}']
           if target_collection == empty
             for collection in collections
               if collection.id == ${_}
@@ -134,17 +134,18 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
           endfor
         `;return i`
       {%- liquid
-        assign productHandles = '${x.toString()}'| split: ','
-        assign collection_handle = ${F}
+        assign productHandles = '${S.toString()}'| split: ','
+        assign collection_handle = '${I}'
         assign products = null
         assign target_collection = null
-        assign productSrc = '${A}'
+        assign productSrc = '${L}'
         assign c = 0
-        assign limit = ${L??4}
+        assign limit = ${A??4}
+        assign isSettingSameHeightProductList = ${p?.sameHeight??!1}
 
         if request.page_type == 'collection' or preview_page_type == 'collection'
           assign target_collection = collection
-          if productSrc == 'Collection' and collection_handle != empty
+          if productSrc == 'Collection' and collection_handle != blank
               ${e}
           elsif target_collection == empty or target_collection == null
             if '${_.toLowerCase()}' == 'latest'
@@ -154,11 +155,11 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
             endif
           endif
           paginate target_collection.products by ${E||4}
-            assign products = target_collection.products ${R?S:""} ${b?"| reverse":""}
+            assign products = target_collection.products ${R?x:""} ${b?"| reverse":""}
           endpaginate
         else
           if productSrc == 'RelatedProduct'
-            ${j()}
+            ${F()}
           elsif productSrc == 'PickProduct'
             unless ${y}
               assign products = null | sort
@@ -181,7 +182,7 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
               ${e}
             endif
             paginate target_collection.products by ${E||4}
-              assign products = target_collection.products ${R?S:""} ${b?"| reverse":""}
+              assign products = target_collection.products ${R?x:""} ${b?"| reverse":""}
             endpaginate
           endif
         endif
@@ -190,14 +191,14 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
           ${i`
     {%- if products == null -%}
     {%- if count == 0 and ${k.length} == 0 -%}
-      {% if '${A}' == 'RelatedProduct' -%}
+      {% if '${L}' == 'RelatedProduct' -%}
           <div>${o("ProductList","no_related_products")}</div>
         {% else %}
           <div>${o("ProductList","no_products_found")}</div>
       {%- endif -%}
     {%- endif -%}
     {%-else-%}
-      ${r(v,i`${a({...g,productListId:k,productSrc:A})}`,i`${n({...g,productListId:k,productSrc:A})}`)}
+      ${r(v,i`${a({...u,productListId:k,productSrc:L})}`,i`${n({...u,productListId:k,productSrc:L})}`)}
     {%- endif -%}
     `}
           {%- assign product = gpBkProduct -%}
@@ -205,4 +206,4 @@ import{RenderIf as e,isLocalEnv as s,baseAssetURL as t,template as i}from"@gem-s
         </div>
       </div>
     </div>
-  `};export{g as default};
+  `};export{u as default};

package/dist/esm/product/components/product-list-v3/ProductListCarouselItem.liquid.js

@@ -1,15 +1,15 @@
-import{template as t}from"@gem-sdk/core";import{getClass as e}from"./common/classes.js";import{filterPageContext as n}from"../../../helpers.js";let o=o=>{let{pageContext:a,children:r}=o,{productItemClass:i,gpProductClass:c}=e(o);return t`
+import{template as t}from"@gem-sdk/core";import{getClass as n}from"./common/classes.js";let e=e=>{let{pageContext:o,children:a}=e,{productItemClass:i,gpProductClass:r}=n(e);return t`
       <gp-product
         gp-context='{"variantSelected": {{ variant | json | escape }}, "inventory_management": {{ variant.inventory_management | json | escape  }}, "inventory_policy": {{ variant.inventory_policy | json | escape }}, "quantity": 1 ,"inventoryQuantity": {{ variant.inventory_quantity | default: 0 }},  "formId": "{{ product_form_id }}"}'
-        gp-data='{"variantSelected": {{ variant | json | escape }}, "quantity": 1, "productUrl":{{ product.url | json | escape }}, "productHandle":{{ product.handle | json | escape }}, "collectionUrl": {{ collection.url | json | escape }}, "collectionHandle": {{ collection.handle | json | escape }},"pageContext" : ${JSON.stringify(n(a))}}'
-        class="${c}"
-
+        gp-context='{"variantSelected": {{ variant | json | escape }}, "inventory_management": {{ variant.inventory_management | json | escape  }}, "inventory_policy": {{ variant.inventory_policy | json | escape }}, "quantity": 1 ,"inventoryQuantity": {{ variant.inventory_quantity }},  "formId": "{{ product_form_id }}"}'
+        class="${r}"
       >
+        <script gp-data type="application/json">{"variantSelected": {{ variant | json }}, "quantity": 1, "productUrl":{{ product.url | json }}, "productHandle":{{ product.handle | json }}, "collectionUrl": {{ collection.url | json }}, "collectionHandle": {{ collection.handle | json }},"pageContext" : ${JSON.stringify(o)}}</script>
         {%- form 'product', product, id: product_form_id, class: 'form contents ${i}',  data-type: 'add-to-cart-form', autocomplete: 'off' -%}
         <input type="hidden" name="id" value="{{ variant.id }}" />
         <input type="hidden" min="1" name="quantity"  value="{{ quantity }}" />
         <button type="submit" onclick="return false;" style="display:none;"></button>
-          ${r}
+          ${a}
         {%- endform -%}
       </gp-product>
-  `};export{o as default};
+  `};export{e as default};

package/dist/esm/product/components/product-list-v3/ProductListGridItem.liquid.js

@@ -1,19 +1,18 @@
-import{template as t,RenderChildren as e}from"@gem-sdk/core";import{getClass as n}from"./common/classes.js";import{filterPageContext as o}from"../../../helpers.js";let a=a=>{let{pageContext:r,rawChildren:i}=a,{productItemClass:c,gpProductClass:p}=n(a);return t`
+import{template as t,RenderChildren as n}from"@gem-sdk/core";import{getClass as e}from"./common/classes.js";let o=o=>{let{pageContext:a,rawChildren:r}=o,{productItemClass:i,gpProductClass:c}=e(o);return t`
       <gp-product
         gp-context='{"variantSelected": {{ variant | json | escape }}, "inventory_management": {{ variant.inventory_management | json | escape  }}, "inventory_policy": {{ variant.inventory_policy | json | escape }}, "quantity": 1 ,"inventoryQuantity": {{ variant.inventory_quantity | default: 0 }},  "formId": "{{ product_form_id }}"}'
-        gp-data='{"variantSelected": {{ variant | json | escape }}, "quantity": 1, "productUrl":{{ product.url | json | escape }}, "productHandle":{{ product.handle | json | escape }}, "collectionUrl": {{ collection.url | json | escape }}, "collectionHandle": {{ collection.handle | json | escape }},"pageContext" : ${JSON.stringify(o(r))}}'
-        class="${p}"
-
+        class="${c}"
       >
-        {%- form 'product', product, id: product_form_id, class: 'form contents ${c}',  data-type: 'add-to-cart-form', autocomplete: 'off' -%}
+        <script gp-data type="application/json">{"variantSelected": {{ variant | json }}, "quantity": 1, "productUrl":{{ product.url | json }}, "productHandle":{{ product.handle | json }}, "collectionUrl": {{ collection.url | json }}, "collectionHandle": {{ collection.handle | json }},"pageContext" : ${JSON.stringify(a)}}</script>
+        {%- form 'product', product, id: product_form_id, class: 'form contents ${i}',  data-type: 'add-to-cart-form', autocomplete: 'off' -%}
         <input type="hidden" name="id" value="{{ variant.id }}" />
         <input type="hidden" min="1" name="quantity"  value="{{ quantity }}" />
         <button type="submit" onclick="return false;" style="display:none;"></button>
           ${t`
-      ${i?.map((n,o)=>{if(n)return t`
-            ${e({...n,index:o})}
+      ${r?.map((e,o)=>{if(e)return t`
+            ${n({...e,index:o})}
           `}).join("")}
     `}
         {%- endform -%}
       </gp-product>
-  `};export{a as default};
+  `};export{o as default};