@gem-sdk/components 16.1.0-staging.1 → 17.0.0-dev.9

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

@@ -1,5 +1,5 @@
-import{template as e,RenderIf as s,isLocalEnv as t,baseAssetURL 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 ProductList=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:L,productNumber:A,isSorted:R,relatedTag:I,collectionHandle:F}=u(g),j=()=>e`
-    ${s("RelatedProduct"===L,`
+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}'
         assign assignProduct = product
         assign idAssignProduct = assignProduct.id
@@ -95,7 +95,27 @@ import{template as e,RenderIf as s,isLocalEnv as t,baseAssetURL as i}from"@gem-s
           assign products = products
         endpaginate
       `)}
-  `,w=()=>{let s=F?`
+  `,{productListWrapStyle:w,productListContentStyle:H,productListWrapAlignStyle:q}=c(g),{productListWrapClass:G}=l(g);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>`:""}
+        `,`
+        <script ${d('class="gps-link" delay',"src")}="${t}/assets-v2/gp-product-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>
+        ${p?.sameHeight?`<script ${d('class="gps-link" delay',"src")}="${t}/assets-v2/gp-same-height-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`:""}
+        `)}
+
+    ${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}"
+    >
+      <div class='gp-flex gp-w-full' style="${q}">
+        <div
+          style="${H}"
+        >
+          {%- assign gpBkProduct = product -%}
+          {%- assign gpBkProducts = products -%}
+          ${(()=>{let e=F?`
           assign target_collection = collections['${F}']
           if target_collection == empty
             for collection in collections
@@ -112,14 +132,14 @@ import{template as e,RenderIf as s,isLocalEnv as t,baseAssetURL as i}from"@gem-s
               break
             endif
           endfor
-        `;return e`
+        `;return i`
       {%- liquid
         assign productHandles = '${x.toString()}'| split: ','
         assign products = null
         assign target_collection = null
-        assign productSrc = '${L}'
+        assign productSrc = '${A}'
         assign c = 0
-        assign limit = ${A??4}
+        assign limit = ${L??4}
 
         if request.page_type == 'collection' or preview_page_type == 'collection'
           assign target_collection = collection
@@ -127,7 +147,7 @@ import{template as e,RenderIf as s,isLocalEnv as t,baseAssetURL as i}from"@gem-s
             if '${_.toLowerCase()}' == 'latest'
               assign target_collection = collections | sort: 'updated_at' ${b?"| reverse":""} | first
             else
-              ${s}
+              ${e}
             endif
           endif
           paginate target_collection.products by ${E||4}
@@ -155,7 +175,7 @@ import{template as e,RenderIf as s,isLocalEnv as t,baseAssetURL as i}from"@gem-s
             if '${_.toLowerCase()}' == 'latest'
               assign target_collection = collections | sort: 'updated_at' ${b?"| reverse":""} | first
             else
-              ${s}
+              ${e}
             endif
             paginate target_collection.products by ${E||4}
               assign products = target_collection.products ${R?S:""} ${b?"| reverse":""}
@@ -163,43 +183,23 @@ import{template as e,RenderIf as s,isLocalEnv as t,baseAssetURL as i}from"@gem-s
           endif
         endif
       -%}
-    `},{productListWrapStyle:H,productListContentStyle:q,productListWrapAlignStyle:G}=c(g),{productListWrapClass:B}=l(g),T=()=>e`
+    `})()}
+          ${i`
     {%- if products == null -%}
     {%- if count == 0 and ${k.length} == 0 -%}
-      {% if '${L}' == 'RelatedProduct' -%}
+      {% if '${A}' == 'RelatedProduct' -%}
           <div>${o("ProductList","no_related_products")}</div>
         {% else %}
           <div>${o("ProductList","no_products_found")}</div>
       {%- endif -%}
     {%- endif -%}
     {%-else-%}
-      ${r(v,e`${n({...g,productListId:k,productSrc:L})}`,e`${a({...g,productListId:k,productSrc:L})}`)}
+      ${r(v,i`${n({...g,productListId:k,productSrc:A})}`,i`${a({...g,productListId:k,productSrc:A})}`)}
     {%- endif -%}
-    `;return e`
-    ${s(t,`
-        <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>`:""}
-        `,`
-        <script ${d('class="gps-link" delay',"src")}="${i}/assets-v2/gp-product-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>
-        ${p?.sameHeight?`<script ${d('class="gps-link" delay',"src")}="${i}/assets-v2/gp-same-height-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`:""}
-        `)}
-
-    ${s(!!f?.preloadBgImage,`${s(!!f?.backgroundImage?.desktop?.image?.src,`<link rel="preload" href="${f?.backgroundImage?.desktop?.image?.src}" as="image" />`)}${s(!!f?.backgroundImage?.tablet?.image?.src,`<link rel="preload" href="${f?.backgroundImage?.tablet?.image?.src}" as="image" />`)}${s(!!f?.backgroundImage?.mobile?.image?.src,`<link rel="preload" href="${f?.backgroundImage?.mobile?.image?.src}" as="image" />`)}`)}
-    <div
-      class="${B}"
-      style="${H}"
-    >
-      <div class='gp-flex gp-w-full' style="${G}">
-        <div
-          style="${q}"
-        >
-          {%- assign gpBkProduct = product -%}
-          {%- assign gpBkProducts = products -%}
-          ${w()}
-          ${T()}
+    `}
           {%- assign product = gpBkProduct -%}
           {%- assign products = gpBkProducts -%}
         </div>
       </div>
     </div>
-  `};export{ProductList as default};
+  `};export{g as default};

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

@@ -1,4 +1,4 @@
-import{template as t}from"@gem-sdk/core";import{getClass as e}from"./common/classes.js";import{filterPageContext as n}from"../../../helpers.js";let ProductListItem=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 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`
       <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))}}'
@@ -12,4 +12,4 @@ import{template as t}from"@gem-sdk/core";import{getClass as e}from"./common/clas
           ${r}
         {%- endform -%}
       </gp-product>
-  `};export{ProductListItem as default};
+  `};export{o as default};

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

@@ -1 +1 @@
-import{jsx as o}from"react/jsx-runtime";import{useEditorMode as r,ProductProvider as t,isEmptyChildren as e}from"@gem-sdk/core";import s from"../../../carousel/components/root/Carousel.js";import m from"../../../carousel/components/item/CarouselItem.js";import i from"../../../grid/components/ChildrenDroppable.js";import{getData as l}from"./common/helpers.js";import{getAttr as a}from"./common/attrs.js";import{getStyle as c}from"./common/styles.js";import{getClass as n}from"./common/classes.js";let ProductListCarouselLayout=d=>{let{children:p,builderProps:u,productSortedById:f,advanced:j}=d,h=r(),{carouselConfigSetting:y,carouselConfigStyle:C}=l(d),{productListAttr:b,getAttrProductItemEditor:L}=a(d),{carouselItemStyle:g}=c(d),{carouselClass:D,productItemClass:I}=n(d);return o(s,{advanced:j,builderProps:{uid:u?.uid},rootAttrs:{...b},rootClass:D,setting:y,styles:C,children:f?.map(r=>o(m,{style:g,children:o(t,{product:r,readOnly:!0,children:o("div",{..."edit"===h?L(r?.baseID):{},className:I,children:e(p)?o(i,{}):p})})},r?.baseID))})};export{ProductListCarouselLayout as default};
+import{jsx as o}from"react/jsx-runtime";import{useEditorMode as r,ProductProvider as e,isEmptyChildren as s}from"@gem-sdk/core";import t from"../../../carousel/components/root/Carousel.js";import m from"../../../carousel/components/item/CarouselItem.js";import i from"../../../grid/components/ChildrenDroppable.js";import{getData as l}from"./common/helpers.js";import{getAttr as a}from"./common/attrs.js";import{getStyle as c}from"./common/styles.js";import{getClass as n}from"./common/classes.js";let p=p=>{let{children:d,builderProps:u,productSortedById:f,advanced:j}=p,h=r(),{carouselConfigSetting:y,carouselConfigStyle:C}=l(p),{productListAttr:b,getAttrProductItemEditor:g}=a(p),{carouselItemStyle:D}=c(p),{carouselClass:I,productItemClass:v}=n(p);return o(t,{advanced:j,builderProps:{uid:u?.uid},rootAttrs:{...b},rootClass:I,setting:y,styles:C,children:f?.map(r=>o(m,{style:D,children:o(e,{product:r,readOnly:!0,children:o("div",{..."edit"===h?g(r?.baseID):{},className:v,children:s(d)?o(i,{}):d})})},r?.baseID))})};export{p as default};

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

@@ -1,5 +1,5 @@
-import{template as o}from"@gem-sdk/core";import t from"../../../carousel/components/item/CarouselItem.liquid.js";import r from"../../../carousel/components/root/Carousel.liquid.js";import{getData as e}from"./common/helpers.js";import{getClass as i}from"./common/classes.js";import{getStyle as s}from"./common/styles.js";import{getStaticLocale as d}from"../../../helpers.js";import u from"./ProductListCarouselItem.liquid.js";let ProductListCarouselLayout=l=>{let{builderProps:c,advanced:a,productSrc:n,productListId:p}=l,{carouselConfigSetting:m,carouselConfigStyle:f}=e(l),{carouselItemStyle:$}=s(l),{carouselClass:g}=i(l);return o`
-    ${r({advanced:a,builderProps:{...c},rootAttrs:{"items-repeat":"true"},rootId:`product-list-carousel-${c?.uid}`,rootClass:g,setting:m,styles:f,children:`
+import{template as o}from"@gem-sdk/core";import t from"../../../carousel/components/item/CarouselItem.liquid.js";import r from"../../../carousel/components/root/Carousel.liquid.js";import{getData as e}from"./common/helpers.js";import{getClass as i}from"./common/classes.js";import{getStyle as s}from"./common/styles.js";import{getStaticLocale as d}from"../../../helpers.js";import u from"./ProductListCarouselItem.liquid.js";let l=l=>{let{builderProps:c,advanced:n,productSrc:a,productListId:p}=l,{carouselConfigSetting:m,carouselConfigStyle:f}=e(l),{carouselItemStyle:$}=s(l),{carouselClass:g}=i(l);return o`
+    ${r({advanced:n,builderProps:{...c},rootAttrs:{"items-repeat":"true"},rootId:`product-list-carousel-${c?.uid}`,rootClass:g,setting:m,styles:f,children:`
         {%- assign count = 0 -%}
         {%- for product in products limit: limit -%}
         {%- if product.id != empty -%}
@@ -12,11 +12,11 @@ import{template as o}from"@gem-sdk/core";import t from"../../../carousel/compone
         {%- endif -%}
         {% endfor %}
         {%- if count == 0 and ${p.length} == 0 -%}
-          {% if '${n}' == 'RelatedProduct' -%}
+          {% if '${a}' == 'RelatedProduct' -%}
               <div>${d("ProductList","no_related_products")}</div>
             {% else %}
               <div>${d("ProductList","no_products_found")}</div>
           {%- endif -%}
         {%- endif -%}
       `})}
-  `};export{ProductListCarouselLayout as default};
+  `};export{l as default};

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

@@ -1,8 +1,4 @@
-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 ProductListItem=a=>{let{pageContext:r,rawChildren:i}=a,{productItemClass:c,gpProductClass:p}=n(a),d=()=>t`
-      ${i?.map((n,o)=>{if(n)return t`
-            ${e({...n,index:o})}
-          `}).join("")}
-    `;return t`
+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`
       <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))}}'
@@ -13,7 +9,11 @@ import{template as t,RenderChildren as e}from"@gem-sdk/core";import{getClass as
         <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>
-          ${d()}
+          ${t`
+      ${i?.map((n,o)=>{if(n)return t`
+            ${e({...n,index:o})}
+          `}).join("")}
+    `}
         {%- endform -%}
       </gp-product>
-  `};export{ProductListItem as default};
+  `};export{a as default};

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

@@ -1 +1 @@
-import{jsx as r}from"react/jsx-runtime";import{Children as o,isValidElement as t,createElement as e}from"react";import{useEditorMode as m,ProductProvider as i,isEmptyChildren as s}from"@gem-sdk/core";import l from"../../../grid/components/ChildrenDroppable.js";import{getStyle as a}from"./common/styles.js";import{getClass as d}from"./common/classes.js";import{getAttr as c}from"./common/attrs.js";let ProductListGridLayout=p=>{let{children:n,productSortedById:u,generateGridRowArray:y,setting:f}=p,h=m(),{gridLayoutStyle:g}=a(p),{gridLayoutClass:j,productItemClass:b}=d(p),{productListAttr:L,getAttrProductItemEditor:k}=c(p);return r("div",{...L,style:g,className:j,children:u?.length?u?.map((m,a)=>r(i,{product:m,readOnly:!0,children:r("div",{..."edit"===h?k(m?.baseID):{},className:b,style:{"--grchild":f?.sameHeight?y?.[a]?.gridRow:void 0,"--mbchild":y?.[a]?.marginBottom},children:s(n)?r(l,{}):o.map(n,r=>t(r)?e(r.type,{...r.props,key:r.key}):null)})},m?.baseID)):null})};export{ProductListGridLayout as default};
+import{jsx as r}from"react/jsx-runtime";import{Children as o,isValidElement as e,createElement as m}from"react";import{useEditorMode as t,ProductProvider as s,isEmptyChildren as i}from"@gem-sdk/core";import l from"../../../grid/components/ChildrenDroppable.js";import{getStyle as a}from"./common/styles.js";import{getClass as d}from"./common/classes.js";import{getAttr as c}from"./common/attrs.js";let p=p=>{let{children:n,productSortedById:f,generateGridRowArray:h,setting:u}=p,y=t(),{gridLayoutStyle:g}=a(p),{gridLayoutClass:j,productItemClass:b}=d(p),{productListAttr:k,getAttrProductItemEditor:v}=c(p);return r("div",{...k,style:g,className:j,children:f?.length?f?.map((t,a)=>r(s,{product:t,readOnly:!0,children:r("div",{..."edit"===y?v(t?.baseID):{},className:b,style:{"--grchild":u?.sameHeight?h?.[a]?.gridRow:void 0,"--mbchild":h?.[a]?.marginBottom},children:i(n)?r(l,{}):o.map(n,r=>e(r)?m(r.type,{...r.props,key:r.key}):null)})},t?.baseID)):null})};export{p as default};

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

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

package/dist/esm/product/components/product-list/common/attrs.js

@@ -1 +1 @@
-import{createAttr as t}from"@gem-sdk/system";let getAttr=e=>{let{builderProps:o}=e,a=t({"items-repeat":!0,"data-id":o?.uid??""}),d=e=>t({"data-component-type":"component","data-component-tag":"Product","data-component-label":"Product","data-component-no-setting":!0,"data-product-id":e?.replace("gid://shopify/Product/","")??""});return{productListAttr:a,getAttrProductItemEditor:d}};export{getAttr};
+import{createAttr as t}from"@gem-sdk/system";let e=e=>{let{builderProps:o}=e,d=t({"items-repeat":!0,"data-id":o?.uid??""});return{productListAttr:d,getAttrProductItemEditor:e=>t({"data-component-type":"component","data-component-tag":"Product","data-component-label":"Product","data-component-no-setting":!0,"data-product-id":e?.replace("gid://shopify/Product/","")??""})}};export{e as getAttr};

package/dist/esm/product/components/product-list/common/classes.js

@@ -1 +1 @@
-import{createClass as e}from"@gem-sdk/system";let getClass=g=>{let{setting:s,className:t,builderProps:i,advanced:p,styles:r}=g,l=e({...t&&{[t]:!0},...p?.cssClass&&{[p.cssClass]:!0},"!gp-m-auto gp-grid gp-w-full":!0,"gp-grid-flow-row":s?.sameHeight}),a=e({"gp-relative gp-flex":!0,[`${i?.builderData?.uid}`]:!0}),d=e({"gp-contents":s?.sameHeight&&r?.layout==="grid"}),o=e({"gp-justify-center":!0,"gp-overflow-hidden":!s?.sameHeight}),m=e({"gp-contents [&>*>div]:gp-contents [&>*]:gp-grid-rows-[subgrid] [&>*]:gp-gap-y-0":s?.sameHeight,[`gp-child-item-${i?.uid}`]:!0});return{gridLayoutClass:l,productItemClass:m,carouselClass:o,productListWrapClass:a,gpProductClass:d}};export{getClass};
+import{createClass as e}from"@gem-sdk/system";let g=g=>{let{setting:t,className:s,builderProps:i,advanced:p,styles:r}=g,l=e({...s&&{[s]:!0},...p?.cssClass&&{[p.cssClass]:!0},"!gp-m-auto gp-grid gp-w-full":!0,"gp-grid-flow-row":t?.sameHeight}),a=e({"gp-relative gp-flex":!0,[`${i?.builderData?.uid}`]:!0}),d=e({"gp-contents":t?.sameHeight&&r?.layout==="grid"}),o=e({"gp-justify-center":!0,"gp-overflow-hidden":!t?.sameHeight}),m=e({"gp-contents [&>*>div]:gp-contents [&>*]:gp-grid-rows-[subgrid] [&>*]:gp-gap-y-0":t?.sameHeight,[`gp-child-item-${i?.uid}`]:!0});return{gridLayoutClass:l,productItemClass:m,carouselClass:o,productListWrapClass:a,gpProductClass:d}};export{g as getClass};

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

@@ -1 +1 @@
-import{getSizeSetting as t}from"../../../helpers/product.js";import{convertUnitToNumber as e}from"../../product-images/common/productFeaturedImage.js";import{getUpdatedDotStyle as o}from"../../../../carousel/components/dot/common/helpers.js";let getData=e=>{let{setting:d,styles:r}=e,c=d?.productSetting??{},l="RelatedProduct"===c.productSrc,i=o(d?.dot,d?.dotStyle),a={dotSize:{desktop:12},dotGapToCarousel:{desktop:16},arrowIconSize:{desktop:24},showWhenHover:!1,rtl:!1,...d};delete a.childItem;let u={...r,sizeSetting:{...t({adaptiveHeight:r?.adaptiveHeight,height:r?.height,fullWidth:{desktop:!0}})},spacing:r?.spacing};return delete u.backgroundColor,delete u.backgroundImage,{isRelatedProduct:l,productSetting:c,dotStyle:i,carouselConfigSetting:a,carouselConfigStyle:u}},getDataLiquid=t=>{let{setting:o,styles:d}=t,r=o?.productSetting,c=r?.relatedTag,l=r?.hasRelatedExclude,i=(c&&"collection"===c[0]?r?.relatedCollectionExclude:r?.relatedTagsExclude)??"",a=i?.split(",").map(t=>t.trim()).toString(),u=r?.productSrc??"Collection",p=r?.collectionId?.replace(PREFIX_COLLECTION_ID,"")??"latest",n=r?.productSrc==="PickProduct"&&r?.productIds?.length===0,s=d?.layout==="grid",g=e(o?.numberOfProducts,4),I="PickProduct"===u&&r?.productIds?.length?r?.productIds.map(t=>t.replace(PREFIX_PRODUCT_ID,"")):[],m="PickProduct"===u&&r?.productHandles?.length?r?.productHandles:[],P=o?.orderBy&&o?.orderBy!=="none",h=(r?.productSrc==="Collection"||r?.productSrc==="DynamicCollection")&&P?o?.orderBy?.split("_"):"none",C=P&&h?.[0]==="TITLE"?"| sort: 'title'":"| sort: 'updated_at'",D=h?.[h.length-1]==="DESC",E=()=>"PickProduct"===u?n?4:r?.numOfSelectedProducts??4:g;return{hasRelatedExclude:l,relatedExcludeTrim:a,collectionID:p,isLatestProducts:n,isGrid:s,numberOfProducts:g,productListId:I,productListHandles:m,sortedBy:C,isReverse:D,productSrc:u,productSetting:r,isSorted:P,relatedTag:c,productNumber:E(),collectionHandle:r?.collectionHandle}},PREFIX_COLLECTION_ID="gid://shopify/Collection/",PREFIX_PRODUCT_ID="gid://shopify/Product/";export{PREFIX_COLLECTION_ID,PREFIX_PRODUCT_ID,getData,getDataLiquid};
+import{getSizeSetting as t}from"../../../helpers/product.js";import{convertUnitToNumber as e}from"../../product-images/common/productFeaturedImage.js";import{getUpdatedDotStyle as o}from"../../../../carousel/components/dot/common/helpers.js";let r=e=>{let{setting:r,styles:d}=e,c=r?.productSetting??{},l="RelatedProduct"===c.productSrc,i=o(r?.dot,r?.dotStyle),a={dotSize:{desktop:12},dotGapToCarousel:{desktop:16},arrowIconSize:{desktop:24},showWhenHover:!1,rtl:!1,...r};delete a.childItem;let p={...d,sizeSetting:{...t({adaptiveHeight:d?.adaptiveHeight,height:d?.height,fullWidth:{desktop:!0}})},spacing:d?.spacing};return delete p.backgroundColor,delete p.backgroundImage,{isRelatedProduct:l,productSetting:c,dotStyle:i,carouselConfigSetting:a,carouselConfigStyle:p}},d=t=>{let{setting:o,styles:r}=t,d=o?.productSetting,i=d?.relatedTag,a=d?.hasRelatedExclude,p=(i&&"collection"===i[0]?d?.relatedCollectionExclude:d?.relatedTagsExclude)??"",u=p?.split(",").map(t=>t.trim()).toString(),n=d?.productSrc??"Collection",s=d?.collectionId?.replace(c,"")??"latest",g=d?.productSrc==="PickProduct"&&d?.productIds?.length===0,m=r?.layout==="grid",h=e(o?.numberOfProducts,4),P="PickProduct"===n&&d?.productIds?.length?d?.productIds.map(t=>t.replace(l,"")):[],I="PickProduct"===n&&d?.productHandles?.length?d?.productHandles:[],S=o?.orderBy&&o?.orderBy!=="none",C=(d?.productSrc==="Collection"||d?.productSrc==="DynamicCollection")&&S?o?.orderBy?.split("_"):"none",k=S&&C?.[0]==="TITLE"?"| sort: 'title'":"| sort: 'updated_at'",f=C?.[C.length-1]==="DESC";return{hasRelatedExclude:a,relatedExcludeTrim:u,collectionID:s,isLatestProducts:g,isGrid:m,numberOfProducts:h,productListId:P,productListHandles:I,sortedBy:k,isReverse:f,productSrc:n,productSetting:d,isSorted:S,relatedTag:i,productNumber:"PickProduct"===n?g?4:d?.numOfSelectedProducts??4:h,collectionHandle:d?.collectionHandle}},c="gid://shopify/Collection/",l="gid://shopify/Product/";export{c as PREFIX_COLLECTION_ID,l as PREFIX_PRODUCT_ID,r as getData,d as getDataLiquid};

package/dist/esm/product/components/product-list/common/styles.js

@@ -1 +1 @@
-import{splitStyle as o,makeGlobalSize as e,makeStyleResponsive as t,getBgByDevice as r,getResponsiveValueByScreen as s,makeStyle as d,getSingleColorVariable as m,getRadiusStyleActiveState as i,getStyleShadow as a,getStyleBackgroundByDevice as l,getGradientBgrStyleByDevice as n}from"@gem-sdk/core";import{createStyle as b}from"@gem-sdk/system";import{createStyleObject as c}from"../../../../grid/components/row/common/helpers.js";import{getInitialWidthForCarouselItem as p}from"../../../../carousel/common/helpers.js";let getStyle=g=>{let{setting:h,styles:w,style:u}=g,{background:S}=h??{},[k,f]=o(["pos","top","left","bottom","right","z","mb","mt","mb","ml","mr","d"],u),T=e(w?.itemPadding),C=b({...k}),x=b({...t("jc",w?.align||{desktop:"center"})}),y=b({...f,...t("w",c(w?.width).content),...r({backgroundColor:w?.backgroundColor,backgroundImage:w?.backgroundImage})}),v=b({...!h?.sameHeight&&t("rg",w?.horizontalGutter),...t("cg",w?.verticalGutter),...t("gtc",{desktop:`repeat(${s(h?.slidesToShow,"desktop")}, minmax(0, 1fr))`,tablet:h?.slidesToShow?.tablet&&`repeat(${s(h?.slidesToShow,"tablet")}, minmax(0, 1fr))`,mobile:h?.slidesToShow?.mobile&&`repeat(${s(h?.slidesToShow,"mobile")}, minmax(0, 1fr))`})}),j=b({...p({spacing:w?.spacing,slidesToShow:h?.slidesToShow})}),$={...T&&T.padding,...d({bs:w?.borderContent?.border,bw:w?.borderContent?.width,bc:m(w?.borderContent?.color)}),...i({...w?.roundedContent,active:{...w?.roundedContent||{},radiusType:"custom"}}),...a({value:w?.carouselShadow,styleAppliedFor:"box-shadow",isEnableShadow:w?.hasActiveShadow}),...l(S),...n(S,{desktop:!0,tablet:!0,mobile:!0})},z=b({...$});return{gridLayoutStyle:v,carouselItemStyle:j,productListWrapStyle:C,productListContentStyle:y,productListWrapAlignStyle:x,productItemStyle:z}};export{getStyle};
+import{splitStyle as o,makeGlobalSize as e,makeStyleResponsive as t,getBgByDevice as r,getResponsiveValueByScreen as s,getGradientBgrStyleByDevice as d,getStyleBackgroundByDevice as m,getStyleShadow as i,getRadiusStyleActiveState as a,makeStyle as l,getSingleColorVariable as n}from"@gem-sdk/core";import{createStyle as b}from"@gem-sdk/system";import{createStyleObject as c}from"../../../../grid/components/row/common/helpers.js";import{getInitialWidthForCarouselItem as p}from"../../../../carousel/common/helpers.js";let g=g=>{let{setting:h,styles:w,style:u}=g,{background:S}=h??{},[k,f]=o(["pos","top","left","bottom","right","z","mb","mt","mb","ml","mr","d"],u),T=e(w?.itemPadding),C=b({...k}),x=b({...t("jc",w?.align||{desktop:"center"})}),v=b({...f,...t("w",c(w?.width).content),...r({backgroundColor:w?.backgroundColor,backgroundImage:w?.backgroundImage})}),y=b({...!h?.sameHeight&&t("rg",w?.horizontalGutter),...t("cg",w?.verticalGutter),...t("gtc",{desktop:`repeat(${s(h?.slidesToShow,"desktop")}, minmax(0, 1fr))`,tablet:h?.slidesToShow?.tablet&&`repeat(${s(h?.slidesToShow,"tablet")}, minmax(0, 1fr))`,mobile:h?.slidesToShow?.mobile&&`repeat(${s(h?.slidesToShow,"mobile")}, minmax(0, 1fr))`})}),j=b({...p({spacing:w?.spacing,slidesToShow:h?.slidesToShow})}),$={...T&&T.padding,...l({bs:w?.borderContent?.border,bw:w?.borderContent?.width,bc:n(w?.borderContent?.color)}),...a({...w?.roundedContent,active:{...w?.roundedContent||{},radiusType:"custom"}}),...i({value:w?.carouselShadow,styleAppliedFor:"box-shadow",isEnableShadow:w?.hasActiveShadow}),...m(S),...d(S,{desktop:!0,tablet:!0,mobile:!0})},z=b({...$});return{gridLayoutStyle:y,carouselItemStyle:j,productListWrapStyle:C,productListContentStyle:v,productListWrapAlignStyle:x,productItemStyle:z}};export{g as getStyle};

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

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

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

@@ -1,5 +1,5 @@
-import{template as e,RenderIf as s,isLocalEnv as t,baseAssetURL 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 ProductList=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:L,productNumber:A,isSorted:R,relatedTag:I,collectionHandle:F}=u(g),j=()=>e`
-    ${s("RelatedProduct"===L,`
+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}'
         assign assignProduct = product
         assign idAssignProduct = assignProduct.id
@@ -95,7 +95,27 @@ import{template as e,RenderIf as s,isLocalEnv as t,baseAssetURL as i}from"@gem-s
           assign products = products
         endpaginate
       `)}
-  `,w=()=>{let s=F?`
+  `,{productListWrapStyle:w,productListContentStyle:H,productListWrapAlignStyle:q}=c(g),{productListWrapClass:G}=l(g);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>`:""}
+        `,`
+        <script ${d('class="gps-link" delay',"src")}="${t}/assets-v2/gp-product-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>
+        ${p?.sameHeight?`<script ${d('class="gps-link" delay',"src")}="${t}/assets-v2/gp-same-height-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`:""}
+        `)}
+
+    ${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}"
+    >
+      <div class='gp-flex gp-w-full' style="${q}">
+        <div
+          style="${H}"
+        >
+          {%- assign gpBkProduct = product -%}
+          {%- assign gpBkProducts = products -%}
+          ${(()=>{let e=F?`
           assign target_collection = collections['${F}']
           if target_collection == empty
             for collection in collections
@@ -112,22 +132,25 @@ import{template as e,RenderIf as s,isLocalEnv as t,baseAssetURL as i}from"@gem-s
               break
             endif
           endfor
-        `;return e`
+        `;return i`
       {%- liquid
         assign productHandles = '${x.toString()}'| split: ','
+        assign collection_handle = ${F}
         assign products = null
         assign target_collection = null
-        assign productSrc = '${L}'
+        assign productSrc = '${A}'
         assign c = 0
-        assign limit = ${A??4}
+        assign limit = ${L??4}
 
         if request.page_type == 'collection' or preview_page_type == 'collection'
           assign target_collection = collection
-          if target_collection == empty or target_collection == null
+          if productSrc == 'Collection' and collection_handle != empty
+              ${e}
+          elsif target_collection == empty or target_collection == null
             if '${_.toLowerCase()}' == 'latest'
               assign target_collection = collections | sort: 'updated_at' ${b?"| reverse":""} | first
             else
-              ${s}
+              ${e}
             endif
           endif
           paginate target_collection.products by ${E||4}
@@ -155,7 +178,7 @@ import{template as e,RenderIf as s,isLocalEnv as t,baseAssetURL as i}from"@gem-s
             if '${_.toLowerCase()}' == 'latest'
               assign target_collection = collections | sort: 'updated_at' ${b?"| reverse":""} | first
             else
-              ${s}
+              ${e}
             endif
             paginate target_collection.products by ${E||4}
               assign products = target_collection.products ${R?S:""} ${b?"| reverse":""}
@@ -163,43 +186,23 @@ import{template as e,RenderIf as s,isLocalEnv as t,baseAssetURL as i}from"@gem-s
           endif
         endif
       -%}
-    `},{productListWrapStyle:H,productListContentStyle:q,productListWrapAlignStyle:G}=c(g),{productListWrapClass:B}=l(g),T=()=>e`
+    `})()}
+          ${i`
     {%- if products == null -%}
     {%- if count == 0 and ${k.length} == 0 -%}
-      {% if '${L}' == 'RelatedProduct' -%}
+      {% if '${A}' == 'RelatedProduct' -%}
           <div>${o("ProductList","no_related_products")}</div>
         {% else %}
           <div>${o("ProductList","no_products_found")}</div>
       {%- endif -%}
     {%- endif -%}
     {%-else-%}
-      ${r(v,e`${n({...g,productListId:k,productSrc:L})}`,e`${a({...g,productListId:k,productSrc:L})}`)}
+      ${r(v,i`${a({...g,productListId:k,productSrc:A})}`,i`${n({...g,productListId:k,productSrc:A})}`)}
     {%- endif -%}
-    `;return e`
-    ${s(t,`
-        <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>`:""}
-        `,`
-        <script ${d('class="gps-link" delay',"src")}="${i}/assets-v2/gp-product-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>
-        ${p?.sameHeight?`<script ${d('class="gps-link" delay',"src")}="${i}/assets-v2/gp-same-height-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`:""}
-        `)}
-
-    ${s(!!f?.preloadBgImage,`${s(!!f?.backgroundImage?.desktop?.image?.src,`<link rel="preload" href="${f?.backgroundImage?.desktop?.image?.src}" as="image" />`)}${s(!!f?.backgroundImage?.tablet?.image?.src,`<link rel="preload" href="${f?.backgroundImage?.tablet?.image?.src}" as="image" />`)}${s(!!f?.backgroundImage?.mobile?.image?.src,`<link rel="preload" href="${f?.backgroundImage?.mobile?.image?.src}" as="image" />`)}`)}
-    <div
-      class="${B}"
-      style="${H}"
-    >
-      <div class='gp-flex gp-w-full' style="${G}">
-        <div
-          style="${q}"
-        >
-          {%- assign gpBkProduct = product -%}
-          {%- assign gpBkProducts = products -%}
-          ${w()}
-          ${T()}
+    `}
           {%- assign product = gpBkProduct -%}
           {%- assign products = gpBkProducts -%}
         </div>
       </div>
     </div>
-  `};export{ProductList as default};
+  `};export{g as default};

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

@@ -1,4 +1,4 @@
-import{template as t}from"@gem-sdk/core";import{getClass as e}from"./common/classes.js";import{filterPageContext as n}from"../../../helpers.js";let ProductListItem=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 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`
       <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))}}'
@@ -12,4 +12,4 @@ import{template as t}from"@gem-sdk/core";import{getClass as e}from"./common/clas
           ${r}
         {%- endform -%}
       </gp-product>
-  `};export{ProductListItem as default};
+  `};export{o as default};

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

@@ -1 +1 @@
-import{jsx as o}from"react/jsx-runtime";import{useEditorMode as r,ProductProvider as t,isEmptyChildren as s}from"@gem-sdk/core";import e from"../../../carousel-v3/components/root/Carousel.js";import m from"../../../carousel-v3/components/item/CarouselItem.js";import i from"../../../grid/components/ChildrenDroppable.js";import{getData as l}from"./common/helpers.js";import{getAttr as a}from"./common/attrs.js";import{getStyle as c}from"./common/styles.js";import{getClass as d}from"./common/classes.js";let ProductListCarouselLayout=n=>{let{children:p,builderProps:u,productSortedById:f,advanced:j}=n,h=r(),{carouselConfigSetting:y,carouselConfigStyle:C}=l(n),{productListAttr:L,getAttrProductItemEditor:b}=a(n),{carouselItemStyle:v}=c(n),{carouselClass:P,productItemClass:g}=d(n);return o(e,{advanced:j,builderProps:{uid:u?.uid},rootAttrs:{...L},rootClass:P,setting:y,styles:C,isProductList:!0,children:f?.map(r=>o(m,{style:v,children:o(t,{product:r,readOnly:!0,children:o("div",{..."edit"===h?b(r?.baseID):{},className:g,children:s(p)?o(i,{}):p})})},r?.baseID))})};export{ProductListCarouselLayout as default};
+import{jsx as o}from"react/jsx-runtime";import{useEditorMode as r,ProductProvider as s,isEmptyChildren as t}from"@gem-sdk/core";import e from"../../../carousel-v3/components/root/Carousel.js";import m from"../../../carousel-v3/components/item/CarouselItem.js";import i from"../../../grid/components/ChildrenDroppable.js";import{getData as l}from"./common/helpers.js";import{getAttr as a}from"./common/attrs.js";import{getStyle as c}from"./common/styles.js";import{getClass as n}from"./common/classes.js";let d=d=>{let{children:p,builderProps:u,productSortedById:f,advanced:j}=d,h=r(),{carouselConfigSetting:y,carouselConfigStyle:C}=l(d),{productListAttr:b,getAttrProductItemEditor:v}=a(d),{carouselItemStyle:g}=c(d),{carouselClass:D,productItemClass:I}=n(d);return o(e,{advanced:j,builderProps:{uid:u?.uid},rootAttrs:{...b},rootClass:D,setting:y,styles:C,isProductList:!0,children:f?.map(r=>o(m,{style:g,children:o(s,{product:r,readOnly:!0,children:o("div",{..."edit"===h?v(r?.baseID):{},className:I,children:t(p)?o(i,{}):p})})},r?.baseID))})};export{d as default};

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

@@ -1,13 +1,13 @@
-import{template as o}from"@gem-sdk/core";import t from"../../../carousel-v3/components/item/CarouselItem.liquid.js";import r from"../../../carousel-v3/components/root/Carousel.liquid.js";import{getData as e}from"./common/helpers.js";import{getClass as i}from"./common/classes.js";import{getStyle as s}from"./common/styles.js";import{getStaticLocale as d}from"../../../helpers.js";import u from"./ProductListCarouselItem.liquid.js";let ProductListCarouselLayout=c=>{let{builderProps:l,advanced:n,productSrc:a,productListId:p}=c,{carouselConfigSetting:m,carouselConfigStyle:f}=e(c),{carouselItemStyle:g}=s(c),{carouselClass:$}=i(c);return o`
-    ${r({advanced:n,builderProps:{...l},rootAttrs:{"items-repeat":"true"},rootId:`product-list-carousel-${l?.uid}`,rootClass:$,setting:m,styles:f,isProductList:!0,children:`
+import{template as o}from"@gem-sdk/core";import t from"../../../carousel-v3/components/item/CarouselItem.liquid.js";import r from"../../../carousel-v3/components/root/Carousel.liquid.js";import{getData as e}from"./common/helpers.js";import{getClass as i}from"./common/classes.js";import{getStyle as s}from"./common/styles.js";import{getStaticLocale as d}from"../../../helpers.js";import u from"./ProductListCarouselItem.liquid.js";let n=n=>{let{builderProps:c,advanced:l,productSrc:a,productListId:p}=n,{carouselConfigSetting:m,carouselConfigStyle:f}=e(n),{carouselItemStyle:g}=s(n),{carouselClass:$}=i(n);return o`
+    ${r({advanced:l,builderProps:{...c},rootAttrs:{"items-repeat":"true"},rootId:`product-list-carousel-${c?.uid}`,rootClass:$,setting:m,styles:f,isProductList:!0,children:`
         {%- 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: "${l?.uid}" | append: product.id -%}
-        ${t({builderProps:{...l},style:g,parentId:`product-list-carousel-${l?.uid} gp-child-item-${l?.uid}`,parentStyle:f,parentSettings:m,background:m?.background,children:`
-            ${u({...c})}
+        {%- assign product_form_id = 'product-form-' | append: "${c?.uid}" | append: product.id -%}
+        ${t({builderProps:{...c},style:g,parentId:`product-list-carousel-${c?.uid} gp-child-item-${c?.uid}`,parentStyle:f,parentSettings:m,background:m?.background,children:`
+            ${u({...n})}
           `})}
         {%- endif -%}
         {% endfor %}
@@ -19,4 +19,4 @@ import{template as o}from"@gem-sdk/core";import t from"../../../carousel-v3/comp
           {%- endif -%}
         {%- endif -%}
       `})}
-  `};export{ProductListCarouselLayout as default};
+  `};export{n as default};

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

@@ -1,8 +1,4 @@
-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 ProductListItem=a=>{let{pageContext:r,rawChildren:i}=a,{productItemClass:c,gpProductClass:p}=n(a),d=()=>t`
-      ${i?.map((n,o)=>{if(n)return t`
-            ${e({...n,index:o})}
-          `}).join("")}
-    `;return t`
+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`
       <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))}}'
@@ -13,7 +9,11 @@ import{template as t,RenderChildren as e}from"@gem-sdk/core";import{getClass as
         <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>
-          ${d()}
+          ${t`
+      ${i?.map((n,o)=>{if(n)return t`
+            ${e({...n,index:o})}
+          `}).join("")}
+    `}
         {%- endform -%}
       </gp-product>
-  `};export{ProductListItem as default};
+  `};export{a as default};

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

@@ -1 +1 @@
-import{jsx as r}from"react/jsx-runtime";import{Children as o,isValidElement as t,createElement as e}from"react";import{useEditorMode as m,ProductProvider as i,isEmptyChildren as s}from"@gem-sdk/core";import l from"../../../grid/components/ChildrenDroppable.js";import{getStyle as a}from"./common/styles.js";import{getClass as d}from"./common/classes.js";import{getAttr as c}from"./common/attrs.js";let ProductListGridLayout=p=>{let{children:n,productSortedById:u,generateGridRowArray:y,setting:f}=p,h=m(),{gridLayoutStyle:g}=a(p),{gridLayoutClass:j,productItemClass:b}=d(p),{productListAttr:L,getAttrProductItemEditor:k}=c(p);return r("div",{...L,style:g,className:j,children:u?.length?u?.map((m,a)=>r(i,{product:m,readOnly:!0,children:r("div",{..."edit"===h?k(m?.baseID):{},className:b,style:{"--grchild":f?.sameHeight?y?.[a]?.gridRow:void 0,"--mbchild":y?.[a]?.marginBottom},children:s(n)?r(l,{}):o.map(n,r=>t(r)?e(r.type,{...r.props,key:r.key}):null)})},m?.baseID)):null})};export{ProductListGridLayout as default};
+import{jsx as r}from"react/jsx-runtime";import{Children as o,isValidElement as e,createElement as m}from"react";import{useEditorMode as t,ProductProvider as s,isEmptyChildren as i}from"@gem-sdk/core";import l from"../../../grid/components/ChildrenDroppable.js";import{getStyle as a}from"./common/styles.js";import{getClass as d}from"./common/classes.js";import{getAttr as c}from"./common/attrs.js";let p=p=>{let{children:n,productSortedById:f,generateGridRowArray:h,setting:u}=p,y=t(),{gridLayoutStyle:g}=a(p),{gridLayoutClass:j,productItemClass:b}=d(p),{productListAttr:k,getAttrProductItemEditor:v}=c(p);return r("div",{...k,style:g,className:j,children:f?.length?f?.map((t,a)=>r(s,{product:t,readOnly:!0,children:r("div",{..."edit"===y?v(t?.baseID):{},className:b,style:{"--grchild":u?.sameHeight?h?.[a]?.gridRow:void 0,"--mbchild":h?.[a]?.marginBottom},children:i(n)?r(l,{}):o.map(n,r=>e(r)?m(r.type,{...r.props,key:r.key}):null)})},t?.baseID)):null})};export{p as default};