@gem-sdk/components 12.0.0-dev.133 → 12.0.0-dev.139

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

@@ -1,18 +1,18 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),classes=require("./common/classes.js");const ProductListItem=t=>{let{pageContext:e,rawChildren:n}=t,{productItemClass:o,gpProductClass:r}=classes.getClass(t),a=()=>core.template`
-      ${n?.map((t,e)=>{if(t)return core.template`
-            ${core.RenderChildren({...t,index:e})}
-          `}).join("")}
-    `;return core.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@gem-sdk/core"),e=require("./common/classes.js");exports.default=n=>{let{pageContext:o,rawChildren:a}=n,{productItemClass:r,gpProductClass:i}=e.getClass(n);return t.template`
       <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 }}"}'
-        class="${r}"
+        class="${i}"
       >
-        <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 ${o}',  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(o)}}</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>
-          ${a()}
+          ${t.template`
+      ${a?.map((e,n)=>{if(e)return t.template`
+            ${t.RenderChildren({...e,index:n})}
+          `}).join("")}
+    `}
         {%- endform -%}
       </gp-product>
-  `};exports.default=ProductListItem;
+  `};

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

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

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

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

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

@@ -1 +1 @@
-"use strict";var system=require("@gem-sdk/system");const getAttr=t=>{let{builderProps:e}=t,r=system.createAttr({"items-repeat":!0,"data-id":e?.uid??""}),a=t=>system.createAttr({"data-component-type":"component","data-component-tag":"Product","data-component-label":"Product","data-component-no-setting":!0,"data-product-id":t?.replace("gid://shopify/Product/","")??""});return{productListAttr:r,getAttrProductItemEditor:a}};exports.getAttr=getAttr;
+"use strict";var t=require("@gem-sdk/system");exports.getAttr=e=>{let{builderProps:r}=e,a=t.createAttr({"items-repeat":!0,"data-id":r?.uid??""});return{productListAttr:a,getAttrProductItemEditor:e=>t.createAttr({"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/","")??""})}};

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

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

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

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

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

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

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),dynamic=require("next/dynamic"),Loading=require("../../../common/components/Loading.js"),React=require("react"),core=require("@gem-sdk/core"),SalePageProductListWarning=require("../SalePageProductListWarning.js"),Head=require("next/head"),ProductListGridLayout=require("./ProductListGridLayout.js"),ProductListCarouselLayout=require("./ProductListCarouselLayout.js"),styles=require("./common/styles.js"),system=require("@gem-sdk/system"),classes=require("./common/classes.js"),helpers=require("./common/helpers.js"),helpers$1=require("../../../dialog/common/helpers.js"),useProductsQuery=require("./hooks/useProductsQuery.js"),useCollectionQuery=require("./hooks/useCollectionQuery.js"),useProductRelatedQuery=require("./hooks/useProductRelatedQuery.js"),useMainRelatedProductQuery=require("./hooks/useMainRelatedProductQuery.js");const ProductNotFound=dynamic(()=>Promise.resolve().then(function(){return require("../ProductNotFound.js")}),{loading:Loading.default}),ProductList=e=>{let{children:t,styles:r,builderProps:o,setting:s,builderAttrs:d}=e,{isRelatedProduct:u,productSetting:i}=helpers.getData(e),{isEditMode:a,isPreviewSharePageMode:l}=core.useRenderMode(),c=core.useCurrentDevice(),n=core.usePageType(),g=core.usePageStore(e=>e.dynamicCollection),[m,P]=React.useState(1),[h,j]=React.useState(!0),y="GP_FUNNEL_PAGE"===n,x="GP_COLLECTION"==n;x&&(i.productSrc="DynamicCollection",i.collectionId=g?.collectionId??"latest");let p=i?.productSrc??"Collection",{mainRelatedProduct:R,relatedProductIdAssigned:f}=useMainRelatedProductQuery.default({isEditMode:a,isPreviewSharePageMode:l,isRelatedProduct:u,relatedProductId:i.relatedProductId}),k=i.relatedTag&&i.relatedTag[0],L=i.relatedTag&&"tags"===i.relatedTag[0]&&(!R?.tags||R?.tags.length===0),v=i.relatedTag&&"collection"===i.relatedTag[0]&&(!R?.collections?.edges||R?.collections.edges.length===0),S=i.relatedTag&&"vendor"===i.relatedTag[0]&&!R?.vendor,C=L||v||S,{isNotFoundRelatedProduct:I,relatedProducts:b}=useProductRelatedQuery.default({isEditMode:a,isPreviewSharePageMode:l,isRelatedProduct:u,productSetting:i,setting:s,mainRelatedProduct:R}),q=useProductsQuery.useProductsQuery({productIds:"PickProduct"===p?i?.productIds:void 0,defaultSelectedProductCount:i?.numOfSelectedProducts}),T=React.useMemo(()=>({id:i?.collectionId??"latest",numberOfProducts:s?.numberOfProducts??4,orderBy:s?.orderBy}),[i?.collectionId,Number(s?.numberOfProducts),s?.orderBy]),M=useCollectionQuery.useCollectionQuery({variables:"PickProduct"!==p?T:void 0}),Q="PickProduct"===p?q.isLoading:M.isLoading,w="PickProduct"===p?q.error:M.error,G="PickProduct"===p?q.isValidating:M.isValidating,N=M.data?.collections?.edges?.[0]?.node,O="PickProduct"===p?core.flattenConnection(q.data?.products):core.flattenConnection(N?.products),A=core.usePageStore(e=>e.assignedProductIds),B=core.usePageStore(e=>e.isApplyAllProducts),F=React.useMemo(()=>(A??[]).length>0&&!B||B,[A,B]),E=b?.data?.products&&F?core.flattenConnection(b?.data?.products):[],D=u?E:"PickProduct"===p&&i?.productIds?.length?i?.productIds?.map(e=>O?.find(t=>t?.baseID===e)).filter(Boolean)??O:"PickProduct"!==p?O:O.filter((e,t)=>t<(i?.numOfSelectedProducts??4)),H=React.useMemo(()=>I&&u&&a||!D.length&&!Q&&h&&a,[h,Q,I,u,a,D.length]),W=React.useMemo(()=>!D||I&&u,[I,u,D]),$=React.useMemo(()=>{if(!s?.sameHeight)return[];let e=0,t=Math.ceil((D?.length??0)/+(s?.slidesToShow?.[c]??1));return Array.from(Array(D?.length??0)).map((o,d)=>(d>=+(s?.slidesToShow?.[c]??1)*(e+1)&&++e,{gridRow:`${1+m*e}/${m+1+m*e}`,marginBottom:e+1<t?helpers$1.getPropertyByDevice(r?.horizontalGutter,c):void 0}))},[s?.sameHeight,s?.slidesToShow,m,D?.length,c,r?.horizontalGutter]),_=React.useMemo(()=>G||Q||w||!D||I&&u,[w,Q,I,u,G,D]),z=React.useMemo(()=>R?.collections?.edges.map(e=>e.node?.id)??[],[R?.collections?.edges]);React.useEffect(()=>{_||setTimeout(()=>{let{builderData:e}=o??{},t=e?.childrens?.[0];if(!t)return;let r=document.querySelector(`[data-id=${t}] div`);r&&P(r.childElementCount||1)},a?0:500)},[o,_,a,z]);let V=React.useMemo(()=>({collection:N,products:D,settings:{loop:s?.loop??{desktop:!1},scrollMode:s?.scrollMode??{desktop:"snap"},slidesToShow:s?.slidesToShow??{desktop:4,tablet:3,mobile:1},layout:r?.layout,dot:s?.dot,dotStyle:s?.dotStyle,arrow:s?.arrow,controlOverContent:s?.controlOverContent},styles:{horizontalGutter:r?.horizontalGutter,verticalGutter:r?.verticalGutter,fullWidth:r?.fullWidth,spacing:r?.spacing,width:r?.width,height:r?.height}}),[N,D,s,r]);if(o?.isPreview&&y)return jsxRuntime.jsx(jsxRuntime.Fragment,{});if(H)return jsxRuntime.jsx(jsxRuntime.Fragment,{children:system.If(h,jsxRuntime.jsx(ProductNotFound,{builderAttrs:d,collectionHandle:N?.handle,productSrc:p,onClose:()=>j(!1),children:t,relatedTagString:k,assignProductNoTags:C,noAssignedProduct:!f}))});let{productListWrapStyle:U,productListContentStyle:J,productListWrapAlignStyle:K}=styles.getStyle(e),{productListWrapClass:X}=classes.getClass(e),Y=()=>jsxRuntime.jsx(jsxRuntime.Fragment,{children:system.If(r?.layout==="grid",jsxRuntime.jsx(ProductListGridLayout.default,{...e,productSortedById:D,generateGridRowArray:$}),jsxRuntime.jsx(ProductListCarouselLayout.default,{...e,productSortedById:D}))});return jsxRuntime.jsxs("div",{...d,className:X,style:U,children:[!!r?.preloadBgImage&&jsxRuntime.jsxs(Head,{children:[!!r.backgroundImage?.desktop?.image?.src&&jsxRuntime.jsx("link",{rel:"preload",href:r.backgroundImage.desktop.image.src,as:"image"}),!!r.backgroundImage?.tablet?.image?.src&&jsxRuntime.jsx("link",{rel:"preload",href:r.backgroundImage?.tablet?.image?.src,as:"image"}),!!r.backgroundImage?.mobile?.image?.src&&jsxRuntime.jsx("link",{rel:"preload",href:r.backgroundImage?.mobile?.image?.src,as:"image"})]}),Q||G?jsxRuntime.jsx(Loading.default,{}):w?jsxRuntime.jsxs("div",{children:["Error: ",w?.message]}):W?jsxRuntime.jsx("div",{children:"Products not found"}):jsxRuntime.jsx(core.ProductListProvider,{...V,children:jsxRuntime.jsx("div",{className:"gp-flex gp-w-full",style:K,children:jsxRuntime.jsxs("div",{style:J,children:[y&&jsxRuntime.jsx(SalePageProductListWarning.default,{}),Y()]})})}),core.filterToolbarPreview(t,!0)]})};exports.default=ProductList;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("next/dynamic"),r=require("../../../common/components/Loading.js"),o=require("react"),s=require("@gem-sdk/core"),d=require("../SalePageProductListWarning.js"),l=require("next/head"),i=require("./ProductListGridLayout.js"),a=require("./ProductListCarouselLayout.js"),u=require("./common/styles.js"),c=require("@gem-sdk/system"),n=require("./common/classes.js"),g=require("./common/helpers.js"),m=require("../../../dialog/common/helpers.js"),h=require("./hooks/useProductsQuery.js"),P=require("./hooks/useCollectionQuery.js"),p=require("./hooks/useProductRelatedQuery.js"),f=require("./hooks/useMainRelatedProductQuery.js");const y=t(()=>Promise.resolve().then(function(){return require("../ProductNotFound.js")}),{loading:r.default});exports.default=t=>{let{children:j,styles:k,builderProps:x,setting:v,builderAttrs:I}=t,{isRelatedProduct:S,productSetting:b}=g.getData(t),{isEditMode:q,isPreviewSharePageMode:T}=s.useRenderMode(),C=s.useCurrentDevice(),M=s.usePageType(),w=s.usePageStore(e=>e.dynamicCollection),[L,G]=o.useState(1),[O,N]=o.useState(!0),A="GP_FUNNEL_PAGE"===M;"GP_COLLECTION"==M&&(b.productSrc="DynamicCollection",b.collectionId=w?.collectionId??"latest");let B=b?.productSrc??"Collection",{mainRelatedProduct:E,relatedProductIdAssigned:Q}=f.default({isEditMode:q,isPreviewSharePageMode:T,isRelatedProduct:S,relatedProductId:b.relatedProductId}),D=b.relatedTag&&b.relatedTag[0],F=b.relatedTag&&"tags"===b.relatedTag[0]&&(!E?.tags||E?.tags.length===0),_=b.relatedTag&&"collection"===b.relatedTag[0]&&(!E?.collections?.edges||E?.collections.edges.length===0),z=b.relatedTag&&"vendor"===b.relatedTag[0]&&!E?.vendor,{isNotFoundRelatedProduct:R,relatedProducts:H}=p.default({isEditMode:q,isPreviewSharePageMode:T,isRelatedProduct:S,productSetting:b,setting:v,mainRelatedProduct:E}),W=h.useProductsQuery({productIds:b?.productIds,defaultSelectedProductCount:b?.numOfSelectedProducts,productSrc:B}),$=o.useMemo(()=>({id:b?.collectionId??"latest",numberOfProducts:v?.numberOfProducts??4,orderBy:v?.orderBy}),[b?.collectionId,Number(v?.numberOfProducts),v?.orderBy]),V=P.useCollectionQuery({variables:"PickProduct"!==B?$:void 0}),U="PickProduct"===B?W.isLoading:V.isLoading,J="PickProduct"===B?W.error:V.error,K="PickProduct"===B?W.isValidating:V.isValidating,X=V.data?.collections?.edges?.[0]?.node,Y="PickProduct"===B?s.flattenConnection(W.data?.products):s.flattenConnection(X?.products),Z=s.usePageStore(e=>e.assignedProductIds),ee=s.usePageStore(e=>e.isApplyAllProducts),et=o.useMemo(()=>(Z??[]).length>0&&!ee||ee,[Z,ee]),er=H?.data?.products&&et?s.flattenConnection(H?.data?.products):[],eo=S?er:"PickProduct"===B&&b?.productIds?.length?b?.productIds?.map(e=>Y?.find(t=>t?.baseID===e)).filter(Boolean)??Y:"PickProduct"!==B?Y:Y.filter((e,t)=>t<(b?.numOfSelectedProducts??4)),es=o.useMemo(()=>R&&S&&q||!eo.length&&!U&&O&&q,[O,U,R,S,q,eo.length]),ed=o.useMemo(()=>!eo||R&&S,[R,S,eo]),el=o.useMemo(()=>{if(!v?.sameHeight)return[];let e=0,t=Math.ceil((eo?.length??0)/+(v?.slidesToShow?.[C]??1));return Array.from(Array(eo?.length??0)).map((r,o)=>(o>=+(v?.slidesToShow?.[C]??1)*(e+1)&&++e,{gridRow:`${1+L*e}/${L+1+L*e}`,marginBottom:e+1<t?m.getPropertyByDevice(k?.horizontalGutter,C):void 0}))},[v?.sameHeight,v?.slidesToShow,L,eo?.length,C,k?.horizontalGutter]),ei=o.useMemo(()=>K||U||J||!eo||R&&S,[J,U,R,S,K,eo]),ea=o.useMemo(()=>E?.collections?.edges.map(e=>e.node?.id)??[],[E?.collections?.edges]);o.useEffect(()=>{ei||setTimeout(()=>{let{builderData:e}=x??{},t=e?.childrens?.[0];if(!t)return;let r=document.querySelector(`[data-id=${t}] div`);r&&G(r.childElementCount||1)},q?0:500)},[x,ei,q,ea]);let eu=o.useMemo(()=>({collection:X,products:eo,settings:{loop:v?.loop??{desktop:!1},scrollMode:v?.scrollMode??{desktop:"snap"},slidesToShow:v?.slidesToShow??{desktop:4,tablet:3,mobile:1},layout:k?.layout,dot:v?.dot,dotStyle:v?.dotStyle,arrow:v?.arrow,controlOverContent:v?.controlOverContent},styles:{horizontalGutter:k?.horizontalGutter,verticalGutter:k?.verticalGutter,fullWidth:k?.fullWidth,spacing:k?.spacing,width:k?.width,height:k?.height}}),[X,eo,v,k]);if(x?.isPreview&&A)return e.jsx(e.Fragment,{});if(es)return e.jsx(e.Fragment,{children:c.If(O,e.jsx(y,{builderAttrs:I,collectionHandle:X?.handle,productSrc:B,onClose:()=>N(!1),children:j,relatedTagString:D,assignProductNoTags:F||_||z,noAssignedProduct:!Q}))});let{productListWrapStyle:ec,productListContentStyle:en,productListWrapAlignStyle:eg}=u.getStyle(t),{productListWrapClass:em}=n.getClass(t);return e.jsxs("div",{...I,className:em,style:ec,children:[!!k?.preloadBgImage&&e.jsxs(l,{children:[!!k.backgroundImage?.desktop?.image?.src&&e.jsx("link",{rel:"preload",href:k.backgroundImage.desktop.image.src,as:"image"}),!!k.backgroundImage?.tablet?.image?.src&&e.jsx("link",{rel:"preload",href:k.backgroundImage?.tablet?.image?.src,as:"image"}),!!k.backgroundImage?.mobile?.image?.src&&e.jsx("link",{rel:"preload",href:k.backgroundImage?.mobile?.image?.src,as:"image"})]}),U||K?e.jsx(r.default,{}):J?e.jsxs("div",{children:["Error: ",J?.message]}):ed?e.jsx("div",{children:"Products not found"}):e.jsx(s.ProductListProvider,{...eu,children:e.jsx("div",{className:"gp-flex gp-w-full",style:eg,children:e.jsxs("div",{style:en,children:[A&&e.jsx(d.default,{}),e.jsx(e.Fragment,{children:c.If(k?.layout==="grid",e.jsx(i.default,{...t,productSortedById:eo,generateGridRowArray:el}),e.jsx(a.default,{...t,productSortedById:eo}))})]})})}),s.filterToolbarPreview(j,!0)]})};

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

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),helpers$1=require("../../../helpers.js"),system=require("@gem-sdk/system"),ProductListCarouselLayout_liquid=require("./ProductListCarouselLayout.liquid.js"),ProductListGridLayout_liquid=require("./ProductListGridLayout.liquid.js"),styles=require("./common/styles.js"),classes=require("./common/classes.js"),helpers=require("./common/helpers.js");const ProductList=e=>{let{setting:s,styles:t,pageContext:i}=e,r=i?.pageType==="GP_FUNNEL_PAGE";if(r)return"";let{hasRelatedExclude:d,relatedExcludeTrim:a,collectionID:o,isLatestProducts:c,isGrid:l,numberOfProducts:n,productListId:u,productListHandles:g,sortedBy:p,isReverse:f,productSrc:m,productNumber:P,isSorted:$,relatedTag:h,collectionHandle:y}=helpers.getDataLiquid(e),_=()=>core.template`
-    ${core.RenderIf("RelatedProduct"===m,`
-        assign relatedTag = '${h}'
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../../helpers.js"),s=require("@gem-sdk/system"),i=require("./ProductListCarouselLayout.liquid.js"),d=require("./ProductListGridLayout.liquid.js"),a=require("./common/styles.js"),r=require("./common/classes.js"),n=require("./common/helpers.js");exports.default=o=>{let{setting:l,styles:c,pageContext:u}=o,g=u?.pageType==="GP_FUNNEL_PAGE";if(g)return"";let{hasRelatedExclude:p,relatedExcludeTrim:f,collectionID:m,isLatestProducts:P,isGrid:$,numberOfProducts:_,productListId:h,productListHandles:y,sortedBy:v,isReverse:E,productSrc:S,productNumber:k,isSorted:L,relatedTag:b,collectionHandle:x}=n.getDataLiquid(o),R=()=>e.template`
+    ${e.RenderIf("RelatedProduct"===S,`
+        assign relatedTag = '${b}'
         assign assignProduct = product
         assign idAssignProduct = assignProduct.id
         paginate collections.all.products by 10000
@@ -9,9 +9,9 @@
         assign handleAssignProduct = assignProduct.handle
         case relatedTag
           when 'collection'
-            assign hasRelatedExclude = ${d}
+            assign hasRelatedExclude = ${p}
             if hasRelatedExclude
-              assign relatedExclude = '${a}'
+              assign relatedExclude = '${f}'
             else
               assign relatedExclude = ''
             endif
@@ -63,9 +63,9 @@
             endfor
           when 'tags'
             assign tagsAssignProduct = assignProduct.tags
-            assign hasRelatedExclude = ${d}
+            assign hasRelatedExclude = ${p}
             if hasRelatedExclude
-              assign relatedExclude = '${a}'
+              assign relatedExclude = '${f}'
             else
               assign relatedExclude = ''
             endif
@@ -91,15 +91,35 @@
               endfor
             assign products = products | uniq
         endcase
-        paginate products by ${n||4}
+        paginate products by ${_||4}
           assign products = products
         endpaginate
       `)}
-  `,L=()=>{let e=y?`
-          assign target_collection = collections['${y}']
+  `,{productListWrapStyle:A,productListContentStyle:I,productListWrapAlignStyle:q}=a.getStyle(o),{productListWrapClass:j}=r.getClass(o);return e.template`
+    ${e.RenderIf(e.isLocalEnv,`
+        <script ${t.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-product-v7-5.js' | asset_url }}" defer="defer"></script>
+        ${l?.sameHeight?`<script ${t.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-same-height-v7-5.js' | asset_url }}" defer="defer"></script>`:""}
+        `,`
+        <script ${t.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-product-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>
+        ${l?.sameHeight?`<script ${t.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-same-height-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`:""}
+        `)}
+
+    ${e.RenderIf(!!c?.preloadBgImage,`${e.RenderIf(!!c?.backgroundImage?.desktop?.image?.src,`<link rel="preload" href="${c?.backgroundImage?.desktop?.image?.src}" as="image" />`)}${e.RenderIf(!!c?.backgroundImage?.tablet?.image?.src,`<link rel="preload" href="${c?.backgroundImage?.tablet?.image?.src}" as="image" />`)}${e.RenderIf(!!c?.backgroundImage?.mobile?.image?.src,`<link rel="preload" href="${c?.backgroundImage?.mobile?.image?.src}" as="image" />`)}`)}
+    <div
+      class="${j}"
+      style="${A}"
+    >
+      <div class='gp-flex gp-w-full' style="${q}">
+        <div
+          style="${I}"
+        >
+          {%- assign gpBkProduct = product -%}
+          {%- assign gpBkProducts = products -%}
+          ${(()=>{let t=x?`
+          assign target_collection = collections['${x}']
           if target_collection == empty
             for collection in collections
-              if collection.id == ${o}
+              if collection.id == ${m}
                 assign target_collection = collection
                 break
               endif
@@ -107,37 +127,37 @@
           endif
         `:`
           for collection in collections
-            if collection.id == ${o}
+            if collection.id == ${m}
               assign target_collection = collection
               break
             endif
           endfor
-        `;return core.template`
+        `;return e.template`
       {%- liquid
-        assign productHandles = '${g.toString()}'| split: ','
+        assign productHandles = '${y.toString()}'| split: ','
         assign products = null
         assign target_collection = null
-        assign productSrc = '${m}'
+        assign productSrc = '${S}'
         assign c = 0
-        assign limit = ${P??4}
+        assign limit = ${k??4}
 
         if request.page_type == 'collection' or preview_page_type == 'collection'
           assign target_collection = collection
           if target_collection == empty or target_collection == null
-            if '${o.toLowerCase()}' == 'latest'
-              assign target_collection = collections | sort: 'updated_at' ${f?"| reverse":""} | first
+            if '${m.toLowerCase()}' == 'latest'
+              assign target_collection = collections | sort: 'updated_at' ${E?"| reverse":""} | first
             else
-              ${e}
+              ${t}
             endif
           endif
-          paginate target_collection.products by ${n||4}
-            assign products = target_collection.products ${$?p:""} ${f?"| reverse":""}
+          paginate target_collection.products by ${_||4}
+            assign products = target_collection.products ${L?v:""} ${E?"| reverse":""}
           endpaginate
         else
           if productSrc == 'RelatedProduct'
-            ${_()}
+            ${R()}
           elsif productSrc == 'PickProduct'
-            unless ${c}
+            unless ${P}
               assign products = null | sort
               for handle in productHandles
                 assign productH = all_products[handle] | sort
@@ -145,61 +165,41 @@
               endfor
               assign limit = products.length
             else
-              if ${u.length} == 0
+              if ${h.length} == 0
                 paginate collections.all.products by 100000
                   assign products = collections.all.products  | sort : "created_at"  | reverse
                 endpaginate
               endif
             endunless
           else
-            if '${o.toLowerCase()}' == 'latest'
-              assign target_collection = collections | sort: 'updated_at' ${f?"| reverse":""} | first
+            if '${m.toLowerCase()}' == 'latest'
+              assign target_collection = collections | sort: 'updated_at' ${E?"| reverse":""} | first
             else
-              ${e}
+              ${t}
             endif
-            paginate target_collection.products by ${n||4}
-              assign products = target_collection.products ${$?p:""} ${f?"| reverse":""}
+            paginate target_collection.products by ${_||4}
+              assign products = target_collection.products ${L?v:""} ${E?"| reverse":""}
             endpaginate
           endif
         endif
       -%}
-    `},{productListWrapStyle:v,productListContentStyle:E,productListWrapAlignStyle:S}=styles.getStyle(e),{productListWrapClass:k}=classes.getClass(e),b=()=>core.template`
+    `})()}
+          ${e.template`
     {%- if products == null -%}
-    {%- if count == 0 and ${u.length} == 0 -%}
-      {% if '${m}' == 'RelatedProduct' -%}
-          <div>${helpers$1.getStaticLocale("ProductList","no_related_products")}</div>
+    {%- if count == 0 and ${h.length} == 0 -%}
+      {% if '${S}' == 'RelatedProduct' -%}
+          <div>${t.getStaticLocale("ProductList","no_related_products")}</div>
         {% else %}
-          <div>${helpers$1.getStaticLocale("ProductList","no_products_found")}</div>
+          <div>${t.getStaticLocale("ProductList","no_products_found")}</div>
       {%- endif -%}
     {%- endif -%}
     {%-else-%}
-      ${system.If(l,core.template`${ProductListGridLayout_liquid.default({...e,productListId:u,productSrc:m})}`,core.template`${ProductListCarouselLayout_liquid.default({...e,productListId:u,productSrc:m})}`)}
+      ${s.If($,e.template`${d.default({...o,productListId:h,productSrc:S})}`,e.template`${i.default({...o,productListId:h,productSrc:S})}`)}
     {%- endif -%}
-    `;return core.template`
-    ${core.RenderIf(core.isLocalEnv,`
-        <script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-product-v7-5.js' | asset_url }}" defer="defer"></script>
-        ${s?.sameHeight?`<script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-same-height-v7-5.js' | asset_url }}" defer="defer"></script>`:""}
-        `,`
-        <script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="${core.baseAssetURL}/assets-v2/gp-product-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>
-        ${s?.sameHeight?`<script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="${core.baseAssetURL}/assets-v2/gp-same-height-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`:""}
-        `)}
-
-    ${core.RenderIf(!!t?.preloadBgImage,`${core.RenderIf(!!t?.backgroundImage?.desktop?.image?.src,`<link rel="preload" href="${t?.backgroundImage?.desktop?.image?.src}" as="image" />`)}${core.RenderIf(!!t?.backgroundImage?.tablet?.image?.src,`<link rel="preload" href="${t?.backgroundImage?.tablet?.image?.src}" as="image" />`)}${core.RenderIf(!!t?.backgroundImage?.mobile?.image?.src,`<link rel="preload" href="${t?.backgroundImage?.mobile?.image?.src}" as="image" />`)}`)}
-    <div
-      class="${k}"
-      style="${v}"
-    >
-      <div class='gp-flex gp-w-full' style="${S}">
-        <div
-          style="${E}"
-        >
-          {%- assign gpBkProduct = product -%}
-          {%- assign gpBkProducts = products -%}
-          ${L()}
-          ${b()}
+    `}
           {%- assign product = gpBkProduct -%}
           {%- assign products = gpBkProducts -%}
         </div>
       </div>
     </div>
-  `};exports.default=ProductList;
+  `};

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

@@ -1,14 +1,14 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),classes=require("./common/classes.js");const ProductListItem=t=>{let{pageContext:e,children:n}=t,{productItemClass:o,gpProductClass:a}=classes.getClass(t);return core.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@gem-sdk/core"),e=require("./common/classes.js");exports.default=n=>{let{pageContext:o,children:a}=n,{productItemClass:r,gpProductClass:i}=e.getClass(n);return t.template`
       <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 }}"}'
-        class="${a}"
+        class="${i}"
       >
-        <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 ${o}',  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(o)}}</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>
-          ${n}
+          ${a}
         {%- endform -%}
       </gp-product>
-  `};exports.default=ProductListItem;
+  `};

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

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

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

@@ -1,22 +1,22 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),CarouselItem_liquid=require("../../../carousel-v3/components/item/CarouselItem.liquid.js"),Carousel_liquid=require("../../../carousel-v3/components/root/Carousel.liquid.js"),helpers=require("./common/helpers.js"),classes=require("./common/classes.js"),styles=require("./common/styles.js"),helpers$1=require("../../../helpers.js"),ProductListCarouselItem_liquid=require("./ProductListCarouselItem.liquid.js");const ProductListCarouselLayout=e=>{let{builderProps:t,advanced:r,productSrc:s,productListId:i}=e,{carouselConfigSetting:o,carouselConfigStyle:u}=helpers.getData(e),{carouselItemStyle:l}=styles.getStyle(e),{carouselClass:d}=classes.getClass(e);return core.template`
-    ${Carousel_liquid.default({advanced:r,builderProps:{...t},rootAttrs:{"items-repeat":"true"},rootId:`product-list-carousel-${t?.uid}`,rootClass:d,setting:o,styles:u,isProductList:!0,children:`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../../carousel-v3/components/item/CarouselItem.liquid.js"),r=require("../../../carousel-v3/components/root/Carousel.liquid.js"),i=require("./common/helpers.js"),o=require("./common/classes.js"),s=require("./common/styles.js"),d=require("../../../helpers.js"),u=require("./ProductListCarouselItem.liquid.js");exports.default=a=>{let{builderProps:l,advanced:c,productSrc:n,productListId:p}=a,{carouselConfigSetting:m,carouselConfigStyle:f}=i.getData(a),{carouselItemStyle:g}=s.getStyle(a),{carouselClass:v}=o.getClass(a);return e.template`
+    ${r.default({advanced:c,builderProps:{...l},rootAttrs:{"items-repeat":"true"},rootId:`product-list-carousel-${l?.uid}`,rootClass:v,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: "${t?.uid}" | append: product.id -%}
-        ${CarouselItem_liquid.default({builderProps:{...t},style:l,parentId:`product-list-carousel-${t?.uid} gp-child-item-${t?.uid}`,parentStyle:u,parentSettings:o,background:o?.background,children:`
-            ${ProductListCarouselItem_liquid.default({...e})}
+        {%- assign product_form_id = 'product-form-' | append: "${l?.uid}" | append: product.id -%}
+        ${t.default({builderProps:{...l},style:g,parentId:`product-list-carousel-${l?.uid} gp-child-item-${l?.uid}`,parentStyle:f,parentSettings:m,background:m?.background,children:`
+            ${u.default({...a})}
           `})}
         {%- endif -%}
         {% endfor %}
-        {%- if count == 0 and ${i.length} == 0 -%}
-          {% if '${s}' == 'RelatedProduct' -%}
-              <div>${helpers$1.getStaticLocale("ProductList","no_related_products")}</div>
+        {%- if count == 0 and ${p.length} == 0 -%}
+          {% if '${n}' == 'RelatedProduct' -%}
+              <div>${d.getStaticLocale("ProductList","no_related_products")}</div>
             {% else %}
-              <div>${helpers$1.getStaticLocale("ProductList","no_products_found")}</div>
+              <div>${d.getStaticLocale("ProductList","no_products_found")}</div>
           {%- endif -%}
         {%- endif -%}
       `})}
-  `};exports.default=ProductListCarouselLayout;
+  `};

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

@@ -1,18 +1,18 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),classes=require("./common/classes.js");const ProductListItem=t=>{let{pageContext:e,rawChildren:n}=t,{productItemClass:o,gpProductClass:r}=classes.getClass(t),a=()=>core.template`
-      ${n?.map((t,e)=>{if(t)return core.template`
-            ${core.RenderChildren({...t,index:e})}
-          `}).join("")}
-    `;return core.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@gem-sdk/core"),e=require("./common/classes.js");exports.default=n=>{let{pageContext:o,rawChildren:a}=n,{productItemClass:r,gpProductClass:i}=e.getClass(n);return t.template`
       <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 }}"}'
-        class="${r}"
+        class="${i}"
       >
-        <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 ${o}',  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(o)}}</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>
-          ${a()}
+          ${t.template`
+      ${a?.map((e,n)=>{if(e)return t.template`
+            ${t.RenderChildren({...e,index:n})}
+          `}).join("")}
+    `}
         {%- endform -%}
       </gp-product>
-  `};exports.default=ProductListItem;
+  `};

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

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

package/dist/cjs/product/components/product-list-v3/ProductListGridLayout.liquid.js

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

package/dist/cjs/product/components/product-list-v3/common/attrs.js

@@ -1 +1 @@
-"use strict";var system=require("@gem-sdk/system");const getAttr=t=>{let{builderProps:e}=t,r=system.createAttr({"items-repeat":!0,"data-id":e?.uid??""}),a=t=>system.createAttr({"data-component-type":"component","data-component-tag":"Product","data-component-label":"Product","data-component-no-setting":!0,"data-product-id":t?.replace("gid://shopify/Product/","")??""});return{productListAttr:r,getAttrProductItemEditor:a}};exports.getAttr=getAttr;
+"use strict";var t=require("@gem-sdk/system");exports.getAttr=e=>{let{builderProps:r}=e,a=t.createAttr({"items-repeat":!0,"data-id":r?.uid??""});return{productListAttr:a,getAttrProductItemEditor:e=>t.createAttr({"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/","")??""})}};