@gem-sdk/components 12.0.0-staging.8 → 12.0.0-staging.80

package/dist/esm/product/components/product-button/ProductButton.liquid.js

@@ -1,4 +1,4 @@
-import{getSplitStyle as t}from"./common/styles.js";import{getGPProductButtonState as o}from"./common/helpers.js";import{template as s,isLocalEnv as e,baseAssetURL as r}from"@gem-sdk/core";import{createStateOrContext as a,Liquid as i,LiquidFor as l,If as n}from"@gem-sdk/system";import{getInsertLinkData as p,getSettingPreloadData as u}from"../../../helpers.js";import{getButtonDynamicSourceLocales as c}from"./helpers/getButtonDynamicSourceLocales.js";import{SoldOutButton as m}from"./SoldOutButton.liquid.js";import{AddToCartButton as d}from"./AddToCartButton.liquid.js";let ProductButton=f=>{let{setting:g,builderProps:$,style:b,styles:v,pageContext:y}=f,{wrapStyle:_,restStyle:j}=t(b),{outOfStockButtonLabel:S,unavailableButtonLabel:h,variantSelectionRequiredMessage:k}=c({setting:g,pageContext:y,builderProps:$}),{urlData:q}=p("",g?.actionEffect==="open-cart-drawer"?{link:"/cart",target:"_self"}:g?.customURL),B=a(o(v,g)),E=()=>d({...f,style:j}),A=()=>m({...f,style:j,label:S}),w=()=>n(e,`<script ${u('class="gps-link" delay',"src")}="{{ 'gp-product-button-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${u('class="gps-link" delay',"src")}="${r}/assets-v2/gp-product-button-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`);return s`
+import{getSplitStyle as t}from"./common/styles.js";import{getGPProductButtonState as e}from"./common/helpers.js";import{template as o,isLocalEnv as s,baseAssetURL as r}from"@gem-sdk/core";import{createStateOrContext as a,Liquid as i,LiquidFor as l,If as n}from"@gem-sdk/system";import{getInsertLinkData as p,getSettingPreloadData as c}from"../../../helpers.js";import{getButtonDynamicSourceLocales as u}from"./helpers/getButtonDynamicSourceLocales.js";import{SoldOutButton as d}from"./SoldOutButton.liquid.js";import{AddToCartButton as m}from"./AddToCartButton.liquid.js";let ProductButton=f=>{let{setting:g,builderProps:b,style:y,styles:$,pageContext:v}=f,{wrapStyle:_,restStyle:h}=t(y),{outOfStockButtonLabel:S,unavailableButtonLabel:j,variantSelectionRequiredMessage:k,successMessage:E,errorMessage:q}=u({setting:g,pageContext:v,builderProps:b}),{urlData:A}=p("",g?.actionEffect==="open-cart-drawer"?{link:"/cart",target:"_self"}:g?.customURL),B=a(e({styles:$,setting:g,successMessage:E,errorMessage:q})),P=()=>m({...f,style:h}),G=()=>d({...f,style:h,label:S}),w=()=>n(s,`<script ${c('class="gps-link" delay',"src")}="{{ 'gp-product-button-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${c('class="gps-link" delay',"src")}="${r}/assets-v2/gp-product-button-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`);return o`
     ${i("{%- assign total_combinations = 1 -%}")}
     ${l("option in product.options_with_values","{%- assign total_combinations = total_combinations | times: option.values.size -%}")}
     {%- liquid
@@ -8,15 +8,16 @@ import{getSplitStyle as t}from"./common/styles.js";import{getGPProductButtonStat
     <gp-product-button
       style="${_}"
       gp-data-wrapper="true"
-      gp-href="${q.href}"
+      gp-href="${A.href}"
       class="gp-product-button"
       gp-label-out-of-stock="${S}"
-      gp-label-unavailable="${h}"
+      gp-label-unavailable="${j}"
       gp-data='${JSON.stringify(B).replaceAll("'","&#039;")}'
       data-variant-selection-required-message="${k}"
+      gp-enable-third-partycart="{{shop.metafields.GEMPAGES.enableThirdPartyCart}}"
     >
-      ${E()}
-      ${A()}
+      ${P()}
+      ${G()}
     </gp-product-button>
     ${w()}
   `};export{ProductButton as default};

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

@@ -1 +1 @@
-let getButtonClasses=({isDisabled:t,isLiquid:s})=>({"gp-cursor-default gp-opacity-30":t,"btn-disabled":t&&s}),getAddToCartButtonClasses=t=>{let{isLiquid:s=!1,isDisabled:e=!1}=t??{};return{...getButtonClasses({isDisabled:e,isLiquid:s}),"gp-button-atc tcustomizer-submit-button":s}},getSoldOutButtonClasses=t=>{let{isLiquid:s=!1}=t??{};return{...getButtonClasses({isDisabled:!0,isLiquid:s}),"gp-button-sold-out":s}},getProductPriceClasses=()=>({"gp-button-price":!0});export{getAddToCartButtonClasses,getButtonClasses,getProductPriceClasses,getSoldOutButtonClasses};
+let getButtonClasses=({isDisabled:t,isLiquid:s})=>({"gp-cursor-default gp-opacity-30":t,"btn-disabled":t&&s,"gp-add-to-cart":!s}),getAddToCartButtonClasses=t=>{let{isLiquid:s=!1,isDisabled:e=!1}=t??{};return{...getButtonClasses({isDisabled:e,isLiquid:s}),"gp-button-atc tcustomizer-submit-button":s}},getSoldOutButtonClasses=t=>{let{isLiquid:s=!1}=t??{};return{...getButtonClasses({isDisabled:!0,isLiquid:s}),"gp-button-sold-out":s}},getProductPriceClasses=()=>({"gp-button-price":!0});export{getAddToCartButtonClasses,getButtonClasses,getProductPriceClasses,getSoldOutButtonClasses};

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

@@ -1 +1 @@
-import{SEPARATOR as e}from"./constants.js";let checkIconVisibility=e=>e?.enableIcon===!0,getRenderRegularPriceSettings=e=>({lineThrough:!1,typo:removeColorFromTypo(e?.priceTypo)}),getRenderComparePriceSettings=e=>({lineThrough:!0,typo:removeColorFromTypo(e?.compareAtPriceTypo),opacityPrice:e?.opacityPrice}),getGPProductButtonState=(e,r)=>({styles:{errorTypo:e?.errorTypo,successTypo:e?.successTypo},setting:{errorType:r?.errorType,actionEffect:r?.actionEffect,enableMessage:r?.enableMessage,label:r?.label?.replaceAll("'","'"),errorMessage:r?.errorMessage?.replaceAll("'","'"),successMessage:r?.successMessage?.replaceAll("'","'"),outOfStockLabel:r?.outOfStockLabel?.replaceAll("'","'"),customURL:{link:r?.customURL?.link?.replaceAll("'","'"),target:r?.customURL?.target}},variantID:"{{variant.id}}",disabled:"{{variant.available}}",totalVariant:"{{total_combinations}}"}),renderSeparator=r=>{let t=r??"horizontal-line";return({dot:e.DOT,"vertical-line":e.VERTICAL_LINE,"horizontal-line":e.HORIZONTAL_LINE})[t]??e.HORIZONTAL_LINE},removeColorFromTypo=e=>(e?.attrs&&e?.attrs.color&&delete e.attrs.color,e);export{checkIconVisibility,getGPProductButtonState,getRenderComparePriceSettings,getRenderRegularPriceSettings,renderSeparator};
+import{SEPARATOR as e}from"./constants.js";let checkIconVisibility=e=>e?.enableIcon===!0,getRenderRegularPriceSettings=e=>({lineThrough:!1,typo:removeColorFromTypo(e?.priceTypo)}),getRenderComparePriceSettings=e=>({lineThrough:!0,typo:removeColorFromTypo(e?.compareAtPriceTypo),opacityPrice:e?.opacityPrice}),getGPProductButtonState=({styles:e,setting:r,successMessage:t,errorMessage:o})=>({styles:{errorTypo:e?.errorTypo,successTypo:e?.successTypo},setting:{errorType:r?.errorType,actionEffect:r?.actionEffect,enableMessage:r?.enableMessage,label:r?.label?.replaceAll("'","'"),errorMessage:o??r?.errorMessage?.replaceAll("'","'"),successMessage:t??r?.successMessage?.replaceAll("'","'"),outOfStockLabel:r?.outOfStockLabel?.replaceAll("'","'"),customURL:{link:r?.customURL?.link?.replaceAll("'","'"),target:r?.customURL?.target}},variantID:"{{variant.id}}",disabled:"{{variant.available}}",totalVariant:"{{total_combinations}}"}),renderSeparator=r=>{let t=r??"horizontal-line";return({dot:e.DOT,"vertical-line":e.VERTICAL_LINE,"horizontal-line":e.HORIZONTAL_LINE})[t]??e.HORIZONTAL_LINE},removeColorFromTypo=e=>(e?.attrs&&e?.attrs.color&&delete e.attrs.color,e);export{checkIconVisibility,getGPProductButtonState,getRenderComparePriceSettings,getRenderRegularPriceSettings,renderSeparator};

package/dist/esm/product/components/product-button/helpers/getButtonDynamicSourceLocales.js

@@ -1 +1 @@
-import{getDynamicSourceLocales as e}from"../../../../helpers.js";let getButtonDynamicSourceLocales=({setting:a,builderProps:t,pageContext:l})=>{let o={pageContext:l,uid:t?.uid},i=(t,l,i)=>{let n=e({...o,translate:a?.translate?i:void 0,settingId:t,val:l??""});return n};return{outOfStockButtonLabel:i("outOfStockLabel",a?.outOfStockLabel,"outOfStockLabel"),unavailableButtonLabel:i("unavailableLabel","Unavailable","unavailableLabel"),variantSelectionRequiredMessage:i("variantSelectionRequiredMessage",a?.variantSelectionRequiredMessage,"variantSelectionRequiredMessage")}};export{getButtonDynamicSourceLocales};
+import{getDynamicSourceLocales as e,createSettingId as t}from"../../../../helpers.js";import{ProductButton as a}from"../../../settings/product-button/configs/translate.js";let getButtonDynamicSourceLocales=({setting:s,builderProps:o,pageContext:r})=>{let i={pageContext:r,uid:o?.uid},n=(s,o)=>{let n=e({...i,pageContext:r??{},settingId:t({id:a[s]?.id}),val:o??""});return n};return{outOfStockButtonLabel:n("outOfStockLabel",s?.outOfStockLabel),unavailableButtonLabel:n("unavailableLabel","Unavailable"),variantSelectionRequiredMessage:n("variantSelectionRequiredMessage",s?.variantSelectionRequiredMessage),successMessage:n("successMessage",s?.successMessage),errorMessage:n("errorMessage",s?.errorMessage)}};export{getButtonDynamicSourceLocales};

package/dist/esm/product/components/product-button/hooks/useAddToCart.js

@@ -1 +1 @@
-import{useRenderMode as e,useProduct as t,useCurrency as r,useQuantity as i,useProductProperties as s,useCurrentVariant as n,useHasPreSelected as o,useStickyStore as a,useProductStore as u,useCreateCart as l,useAddToCart as c,convertDecimalToNumber as m,useCurrentVariantInStock as b}from"@gem-sdk/core";import{useRef as d,useEffect as f,useCallback as p}from"react";import{addToCartTracking as v}from"../../../helpers/tracking.js";import{useDispatchAfterSubmitEvent as g}from"./useDispatchAfterSubmitEvent.js";import{useCartMessage as I}from"./useCartMessage.js";import{useCartOperations as k}from"./useCartOperations.js";let useBtnAddToCart=({styles:D,setting:S,builderProps:E})=>{let h=d(null),{isEditMode:j,isPreviewSharePageMode:y}=e(),C=t(),{currency:A}=r(),{quantity:M}=i(),O=s(),w=n(),{hasPreSelected:B}=o(),T=a(e=>e.setStickyVisible),q=u(e=>e.updateIsSubmit),x=g(E?.uid),{showMessage:L,notiComponent:U}=I(D,S),{handleSuccess:V,handleError:z,cartId:F}=k(S,L,x),{isMutating:G,trigger:H}=l({onSuccess:V,onError:z}),{isMutating:J,trigger:K}=c({onSuccess:V,onError:z});f(()=>{let e=new IntersectionObserver(e=>{let t=e[0];T(t?.isIntersecting)},{threshold:.1}),t=h.current;return h.current&&e.observe(h.current),()=>{t&&e.unobserve(t)}},[T]);let N=p(()=>{if(!w?.baseID||!M||!C?.baseID||void 0!==B&&!B||j||y)return;let e=O?.some(e=>e.required&&!e.value);if(q(!0),e)return;let t=O?.filter(e=>!!e.value)?.map(e=>({key:e.key,value:e.value}));v({quantity:M,currency:A,id:C?.baseID,name:C?.title,brand:C?.vendor,sku:w.sku,price:m(w?.price),variant:w.title});let r={quantity:M,attributes:t,variantId:w.baseID};S?.actionEffect!=="buy-now"&&F?K({cartId:F,lines:[r]}):H({items:[r]})},[j,y,F,A,M,O,B,C?.title,C?.vendor,C?.baseID,w?.sku,w?.price,w?.title,w?.baseID,S?.actionEffect,H,K,q]),P=b(),Q=G||J,R=w?S?.outOfStockLabel:"Unavailable";return{addToCartRef:h,isLoading:Q,isInStock:P,notiComponent:U,outOfStockLabel:R,addToCart:N}};export{useBtnAddToCart};
+import{useRenderMode as e,useProduct as t,useCurrency as r,useQuantity as i,useProductProperties as s,useCurrentVariant as n,useHasPreSelected as o,useStickyStore as a,useProductStore as u,useCreateCart as l,useAddToCart as c,convertDecimalToNumber as m,useCurrentVariantInStock as b}from"@gem-sdk/core";import{useRef as d,useEffect as f,useCallback as p}from"react";import{addToCartTracking as v}from"../../../helpers/tracking.js";import{useDispatchInteractionEvent as g,useDispatchCustomEvent as I}from"./useDispatchAfterSubmitEvent.js";import{useCartMessage as k}from"./useCartMessage.js";import{useCartOperations as D}from"./useCartOperations.js";let useBtnAddToCart=({styles:S,setting:E,builderProps:h})=>{let j=d(null),{isEditMode:y,isPreviewSharePageMode:C}=e(),A=t(),{currency:M}=r(),{quantity:O}=i(),w=s(),B=n(),{hasPreSelected:T}=o(),q=a(e=>e.setStickyVisible),x=u(e=>e.updateIsSubmit),L=g(h?.uid),U=I({product:A,currentVariant:B,quantity:O}),{showMessage:V,notiComponent:z}=k(S,E),{handleSuccess:F,handleError:G,cartId:H}=D({setting:E,showMessage:V,dispatchInteractionEvent:L,dispatchCustomEvent:U}),{isMutating:J,trigger:K}=l({onSuccess:F,onError:G}),{isMutating:N,trigger:P}=c({onSuccess:F,onError:G});f(()=>{let e=new IntersectionObserver(e=>{let t=e[0];q(t?.isIntersecting)},{threshold:.1}),t=j.current;return j.current&&e.observe(j.current),()=>{t&&e.unobserve(t)}},[q]);let Q=p(()=>{if(!B?.baseID||!O||!A?.baseID||void 0!==T&&!T||y||C)return;let e=w?.some(e=>e.required&&!e.value);if(x(!0),e)return;let t=w?.filter(e=>!!e.value)?.map(e=>({key:e.key,value:e.value}));v({quantity:O,currency:M,id:A?.baseID,name:A?.title,brand:A?.vendor,sku:B.sku,price:m(B?.price),variant:B.title});let r={quantity:O,attributes:t,variantId:B.baseID};E?.actionEffect!=="buy-now"&&H?P({cartId:H,lines:[r]}):K({items:[r]})},[y,C,H,M,O,w,T,A?.title,A?.vendor,A?.baseID,B?.sku,B?.price,B?.title,B?.baseID,E?.actionEffect,K,P,x]),R=b(),W=J||N,X=B?E?.outOfStockLabel:"Unavailable";return{addToCartRef:j,isLoading:W,isInStock:R,notiComponent:z,outOfStockLabel:X,addToCart:Q}};export{useBtnAddToCart};

package/dist/esm/product/components/product-button/hooks/useCartOperations.js

@@ -1 +1 @@
-import{useCallback as e}from"react";import{useCartUI as o,useStoreFront as r,useCartId as t}from"@gem-sdk/core";let useCartOperations=(s,c,n)=>{let{openCart:a}=o(),{storefrontToken:i}=r(),{cartId:l,updateCartId:u}=t(),k=e((e,o)=>{e?.enableMessage&&o(e.successMessage||"","success"),a()},[a]),m=(e,o)=>{if(!e.checkoutUrl)return;let r=o?`${e.checkoutUrl}?access_token=${o}`:e.checkoutUrl;window.location.href=r},f=e=>{e?.customURL?.link&&("_blank"===e.customURL.target?window.open(e.customURL.link,"_blank"):window.location.href=e.customURL.link)},g=e(e=>{let o={"open-cart-drawer":()=>a(),"go-to-url":()=>f(s),"buy-now":()=>m(e,i),"continue-shopping":()=>k(s,c)};s?.actionEffect!=="buy-now"&&u(e.id);let r=o[s?.actionEffect];r&&r(),n()},[s,i,a,c,u,n,k]),p=e(e=>{s?.enableMessage&&(e?.[0]?.code==="INVALID"?c(e[0].message||"","error"):c(s.errorMessage||"","error"))},[s,c]);return{cartId:l,handleSuccess:g,handleError:p}};export{useCartOperations};
+import{useCallback as e}from"react";import{useCartUI as o,useStoreFront as r,useCartId as t}from"@gem-sdk/core";let useCartOperations=({setting:s,showMessage:c,dispatchInteractionEvent:n,dispatchCustomEvent:a})=>{let{openCart:i}=o(),{storefrontToken:l}=r(),{cartId:u,updateCartId:k}=t(),m=e((e,o)=>{e?.enableMessage&&o(e.successMessage||"","success"),i()},[i]),f=(e,o)=>{if(!e.checkoutUrl)return;let r=o?`${e.checkoutUrl}?access_token=${o}`:e.checkoutUrl;window.location.href=r},g=e=>{e?.customURL?.link&&("_blank"===e.customURL.target?window.open(e.customURL.link,"_blank"):window.location.href=e.customURL.link)},p=e(e=>{let o={"open-cart-drawer":()=>i(),"go-to-url":()=>g(s),"buy-now":()=>f(e,l),"continue-shopping":()=>m(s,c)};s?.actionEffect!=="buy-now"&&k(e.id);let r=o[s?.actionEffect];r&&r(),n(),a()},[s,l,i,c,k,n,m,a]),w=e(e=>{s?.enableMessage&&(e?.[0]?.code==="INVALID"?c(e[0].message||"","error"):c(s.errorMessage||"","error"))},[s,c]);return{cartId:u,handleSuccess:p,handleError:w}};export{useCartOperations};

package/dist/esm/product/components/product-button/hooks/useDispatchAfterSubmitEvent.js

@@ -1 +1 @@
-import{useInteraction as t}from"@gem-sdk/core";import{useCallback as e}from"react";let useDispatchAfterSubmitEvent=r=>{let{trigger:i}=t();return e(()=>{let t=document.querySelector(`[data-id="${r}"]`);if(!t)return;let e=JSON.parse(t?.getAttribute("gp-interaction-after-submit")??"{}");Object.keys(e).length<=0||Object.entries(e).forEach(([e])=>{i({event:"gp:after-submit",selector:`[data-id="${r}"]`,data:Number(e),element:t})})},[r,i])};export{useDispatchAfterSubmitEvent};
+import{useInteraction as t}from"@gem-sdk/core";import{useCallback as e}from"react";let useDispatchInteractionEvent=a=>{let{trigger:r}=t();return e(()=>{let t=document.querySelector(`[data-id="${a}"]`);if(!t)return;let e=JSON.parse(t?.getAttribute("gp-interaction-after-submit")??"{}");Object.keys(e).length<=0||Object.entries(e).forEach(([e])=>{r({event:"gp:after-submit",selector:`[data-id="${a}"]`,data:Number(e),element:t})})},[a,r])},useDispatchCustomEvent=({product:t,currentVariant:a,quantity:r})=>e(()=>{let e=new CustomEvent("gp:add-to-cart-success",{detail:{data:{product:t,variant:a,quantity:r}}});window.dispatchEvent(e)},[t,a,r]);export{useDispatchCustomEvent,useDispatchInteractionEvent};

package/dist/esm/product/components/product-description/ProductDescription.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as e,Fragment as t,jsxs as s}from"react/jsx-runtime";import{useProduct as o,useCurrentDevice as i,getResponsiveValueByScreen as r,makeStyleResponsive as c,makeLineClamp as m}from"@gem-sdk/core";import n from"../../../common/components/NoDataState.js";import{ICON_SVG as l}from"./common/helpers.js";import{createClass as a,createStyle as p,createAttr as d,If as h}from"@gem-sdk/system";import{getClasses as u,getButtonClasses as y,getClassPreBuilt as g}from"./common/classes.js";import{getTextStyle as f,getButtonStyle as x,getStaticCss as k}from"./common/styles.js";import{useGpDescription as N}from"./hooks/useGpDescription.js";let ProductDescription=j=>{let{setting:w,advanced:L,builderProps:b}=j,{htmlTag:v}=w??{},C="html"===v?"div":"p",H=o(),T=i(),D=r(w?.hasLineClamp,T),{ref:M,open:_,isShowViewMore:I,handleToggleShowMore:P,mode:S,redirectProductShopifyLink:A}=N(w),q=a({"gp-product-description":!0,[L?.cssClass]:!0}),G=a(u({setting:w,isLiquid:!1})),V=a(y({setting:w})),$=a({"gp-show-more-text":!0}),z=a({"gp-show-more-icon gp-ml-1":!0,..._?{"gp-rotate-180":!0}:{}}),B=a(g()),E=p({...f({setting:w}),..._?{}:c("line-clamp",m(w?.lineClamp,w?.hasLineClamp))}),F=p(x({setting:w})),J=d({"data-id":`${b?.uid}`}),K=d({"data-gp-text":""}),{gpDescriptionCss:O,textDescriptionCss:Q}=k(),R=!H?.descriptionHtml;return R&&"edit"===S?e(n,{elementType:"secondary",description:"Highlight key benefits with product description.",descriptionActions:[{text:"Add description",callback:A},{text:"sync data",callback:"syncProduct"}]}):e(t,{children:h(R,"",s("div",{...J,className:q,children:[e("style",{children:Q}),e("style",{children:O}),e("div",{className:B}),e(C,{ref:M,...K,className:G,style:E,dangerouslySetInnerHTML:{__html:H?.descriptionHtml||""}}),h(D&&I,s("button",{className:V,style:F,onClick:P,children:[e("span",{className:$,children:h(_,w?.viewLessText||"",w?.viewMoreText)}),h(w?.enableViewMoreIcon,e("span",{className:z,dangerouslySetInnerHTML:{__html:l}}))]})," ")]}))})};export{ProductDescription as default};
+import{jsx as e,Fragment as t,jsxs as s}from"react/jsx-runtime";import{useProduct as o,useCurrentDevice as i,getResponsiveValueByScreen as r,useI18nStore as c,makeStyleResponsive as m,makeLineClamp as n}from"@gem-sdk/core";import l from"../../../common/components/NoDataState.js";import{ICON_SVG as a}from"./common/helpers.js";import{createClass as p,createStyle as d,createAttr as h,If as u}from"@gem-sdk/system";import{getClasses as y,getButtonClasses as g,getClassPreBuilt as f}from"./common/classes.js";import{getTextStyle as x,getButtonStyle as k,getStaticCss as N}from"./common/styles.js";import{useGpDescription as j}from"./hooks/useGpDescription.js";let ProductDescription=w=>{let{setting:L,advanced:b,builderProps:v}=w,{htmlTag:C}=L??{},H="html"===C?"div":"p",T=o(),D=i(),M=r(L?.hasLineClamp,D),{ref:_,open:I,isShowViewMore:P,handleToggleShowMore:S,mode:A,redirectProductShopifyLink:q}=j(L),{t:G}=c(),V=p({"gp-product-description":!0,[b?.cssClass]:!0}),$=p(y({setting:L,isLiquid:!1})),z=p(g({setting:L})),B=p({"gp-show-more-text":!0}),E=p({"gp-show-more-icon gp-ml-1":!0,...I?{"gp-rotate-180":!0}:{}}),F=p(f()),J=d({...x({setting:L}),...I?{}:m("line-clamp",n(L?.lineClamp,L?.hasLineClamp))}),K=d(k({setting:L})),O=h({"data-id":`${v?.uid}`}),Q=h({"data-gp-text":""}),{gpDescriptionCss:R,textDescriptionCss:U}=N(),W=!T?.descriptionHtml;return W&&"edit"===A?e(l,{elementType:"secondary",description:G("Highlight key benefits with product description."),descriptionActions:[{text:G("Add description"),callback:q},{text:G("sync data"),callback:"syncProduct"}]}):e(t,{children:u(W,"",s("div",{...O,className:V,children:[e("style",{children:U}),e("style",{children:R}),e("div",{className:F}),e(H,{ref:_,...Q,className:$,style:J,dangerouslySetInnerHTML:{__html:T?.descriptionHtml||""}}),u(M&&P,s("button",{className:z,style:K,onClick:S,children:[e("span",{className:B,children:u(I,L?.viewLessText||"",L?.viewMoreText)}),u(L?.enableViewMoreIcon,e("span",{className:E,dangerouslySetInnerHTML:{__html:a}}))]})," ")]}))})};export{ProductDescription as default};

package/dist/esm/product/components/product-description/ProductDescription.liquid.js

@@ -1,24 +1,24 @@
-import{makeStyleResponsive as e,makeLineClamp as t,template as s,dataStringify as i,isLocalEnv as o,baseAssetURL as r}from"@gem-sdk/core";import{getDynamicSourceLocales as p,getSettingPreloadData as l}from"../../../helpers.js";import{createClass as a,createStyle as n,createAttr as d,createStateOrContext as c,LiquidIf as m,Liquid as $,LiquidUnless as u,If as g}from"@gem-sdk/system";import{getClasses as v,getButtonClasses as w,getClassPreBuilt as x}from"./common/classes.js";import{getTextStyle as f,getButtonStyle as h,getStaticCss as y}from"./common/styles.js";import{ICON_SVG as M}from"./common/helpers.js";let ProductDescription=b=>{let{setting:C,advanced:L,builderProps:S,pageContext:T}=b,{htmlTag:j,translate:I,viewMoreText:k,viewLessText:E}=C??{},P="html"===j?"div":"p",V=a({"gp-product-description":!0,[L?.cssClass]:!0}),A=a(v({setting:C,isLiquid:!0})),D=a(w({setting:C})),G=a({"gp-show-more-text":!0}),_=a({"gp-show-more-icon gp-ml-1":!0}),q=n({...f({setting:C,renderMaxHeight:!0}),...e("line-clamp",t(C?.lineClamp,C?.hasLineClamp))}),H=a(x()),N=n(h({setting:C})),O=d({"data-id":`${S?.uid}`}),R=d({"data-gp-text":""}),{textDescriptionCss:z,gpDescriptionCss:B}=y(),F="product.description == blank",J=()=>{let e=o?"{{ 'gp-product-description-v7-5.js' | asset_url }}":`${r}/assets-v2/gp-product-description-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}`;return`<script ${l('class="gps-link" delay',"src")}="${e}" defer="defer"></script>`},K=c({setting:{lineClamp:C?.lineClamp,hasLineClamp:C?.hasLineClamp,viewMoreText:C?.viewMoreText,viewLessText:C?.viewLessText,enableViewMoreIcon:C?.enableViewMoreIcon},textStyle:q}),Q=p({val:k,uid:S?.uid,settingId:"viewMoreText",pageContext:T,translate:I}),U=p({val:E,uid:S?.uid,settingId:"viewLessText",pageContext:T,translate:I});return m(F,"",$(s`
+import{makeStyleResponsive as e,makeLineClamp as t,template as s,dataStringify as i,isLocalEnv as o,baseAssetURL as r}from"@gem-sdk/core";import{getDynamicSourceLocales as p,createSettingId as a,getSettingPreloadData as n}from"../../../helpers.js";import{createClass as d,createStyle as l,createAttr as c,createStateOrContext as m,LiquidIf as u,Liquid as $,LiquidUnless as g,If as v}from"@gem-sdk/system";import{getClasses as f,getButtonClasses as x,getClassPreBuilt as w}from"./common/classes.js";import{getTextStyle as h,getButtonStyle as y,getStaticCss as C}from"./common/styles.js";import{ICON_SVG as b}from"./common/helpers.js";import{ProductDescription as j}from"../../settings/product-description/configs/translate.js";let ProductDescription=M=>{let{setting:S,advanced:I,builderProps:L,pageContext:P}=M,{htmlTag:T,viewMoreText:k,viewLessText:E}=S??{},V="html"===T?"div":"p",A=d({"gp-product-description":!0,[I?.cssClass]:!0}),D=d(f({setting:S,isLiquid:!0})),G=d(x({setting:S})),_=d({"gp-show-more-text":!0}),q=d({"gp-show-more-icon gp-ml-1":!0}),H=l({...h({setting:S,renderMaxHeight:!0}),...e("line-clamp",t(S?.lineClamp,S?.hasLineClamp))}),N=d(w()),O=l(y({setting:S})),R=c({"data-id":`${L?.uid}`}),z=c({"data-gp-text":""}),{textDescriptionCss:B,gpDescriptionCss:F}=C(),J="product.description == blank",K=()=>{let e=o?"{{ 'gp-product-description-v7-5.js' | asset_url }}":`${r}/assets-v2/gp-product-description-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}`;return`<script ${n('class="gps-link" delay',"src")}="${e}" defer="defer"></script>`},Q=p({val:k,uid:L?.uid,settingId:a({id:j?.viewMoreText?.id}),pageContext:P??{}}),U=p({val:E,uid:L?.uid,settingId:a({id:j?.viewLessText?.id}),pageContext:P??{}}),W=m({setting:{lineClamp:S?.lineClamp,hasLineClamp:S?.hasLineClamp,viewMoreText:Q,viewLessText:U,enableViewMoreIcon:S?.enableViewMoreIcon},textStyle:H});return u(J,"",$(s`
     <gp-product-description
-      ${O}
-      class="${V}"
-      gp-data='${i(K).replaceAll("'","&#039;")}'
+      ${R}
+      class="${A}"
+      gp-data='${i(W).replaceAll("'","&#039;")}'
       data-view-more-text="${Q}"
       data-view-less-text="${U}"
     >
-      <style>${z}</style>
       <style>${B}</style>
-      <div class="${H}" ></div>
-      ${u("product","<p>Product not found</p>",s`<${P} ${R} class="${A}" style="${q}">
+      <style>${F}</style>
+      <div class="${N}" ></div>
+      ${g("product","<p>Product not found</p>",s`<${V} ${z} class="${D}" style="${H}">
           {{product.description}}
-        </${P}>
-        ${u(F,s`<button type="button" class="${D}" style="${N}">
-          <span class="${G}">
-            ${g(!1,U?.toString(),Q?.toString())}
+        </${V}>
+        ${g(J,s`<button type="button" class="${G}" style="${O}">
+          <span class="${_}">
+            ${v(!1,U?.toString(),Q?.toString())}
           </span>
-          ${g(C?.enableViewMoreIcon,s`<span class="${_}">${M}</span>`," ")}
+          ${v(S?.enableViewMoreIcon,s`<span class="${q}">${b}</span>`," ")}
           </button>`)}`)}
     </gp-product-description>
 
-    ${J()}
+    ${K()}
   `))};export{ProductDescription as default};

package/dist/esm/product/components/product-discount-tag/ProductDiscountTag.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{makeStyleResponsive as s}from"@gem-sdk/core";import o from"../../../common/components/NoDataState.js";import i from"../../../common/components/TooltipHover.js";import l from"../../../text/components/Text.js";import{createStyle as r,createClass as d,If as m}from"@gem-sdk/system";import{getWrapperTextStyle as n,getContainerStyle as a}from"./common/styles.js";import{getWrapperTextClass as p,getContainerClass as c,getRootClass as u}from"./common/classes.js";import{useGpDiscountTag as x}from"./hooks/useGpDiscountTag.js";let ProductTag=({setting:f,styles:g,builderProps:y,...h})=>{let{customContent:b}=f??{},j=h["bundle-item"],{textAlign:N}=g??{},{mode:T,product:v,salePrice:k,priceSave:w,currentProductId:A,unitCustomDisplay:D,shouldPlaceholderNoDiscount:F}=x({setting:f,styles:g,builderProps:y,...h});if(F)return e(i,{enable:!0,text:"Not be displayed when published",position:"bottom",width:"205px",children:e(o,{builderAttrs:y?.builderData,elementType:"secondary",description:"No discount",rawMode:!0,customClass:"!gp-p-[5px]"})});let S=r(n(g)),$=r(a(g)),q=d(p(g)),C=d(c()),I=d(u({mode:T,salePrice:k,priceSave:w,bundleItem:j}));return e("div",{className:I,style:{...s("ta",N)},id:`shopify-text-element-${y?.uid}`,"data-id":y?.uid,"data-product-id":A,"gp-data-hidden":"false",children:m(!v," ",e("div",{className:C,style:$,children:e("div",{className:q,style:S,children:t("div",{className:"gp-flex gp-break-all",children:[e(l,{styles:g,setting:{...f,text:b?.prefix?.replaceAll(" "," "),options:{useState:!0,uniqueId:`${y?.uid}-prefix`},excludeFlex:!0}}),e(l,{styles:g,setting:{...f,text:D,options:{isCannotEditing:!0},excludeFlex:!0}}),e(l,{styles:g,setting:{...f,text:b?.suffix?.replaceAll(" "," "),excludeFlex:!0,options:{useState:!0,uniqueId:`${y?.uid}-suffix`}}})]})})}))})};export{ProductTag as default};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useI18nStore as s,makeStyleResponsive as o}from"@gem-sdk/core";import i from"../../../common/components/NoDataState.js";import l from"../../../common/components/TooltipHover.js";import r from"../../../text/components/Text.js";import{createStyle as d,createClass as m,If as n}from"@gem-sdk/system";import{getWrapperTextStyle as a,getContainerStyle as p}from"./common/styles.js";import{getWrapperTextClass as c,getContainerClass as u,getRootClass as x}from"./common/classes.js";import{useGpDiscountTag as f}from"./hooks/useGpDiscountTag.js";let ProductTag=({setting:g,styles:y,builderProps:h,...b})=>{let{customContent:j}=g??{},N=b["bundle-item"],{textAlign:T}=y??{},{t:v}=s(),{mode:k,product:w,salePrice:A,priceSave:D,currentProductId:F,unitCustomDisplay:S,shouldPlaceholderNoDiscount:$}=f({setting:g,styles:y,builderProps:h,...b});if($)return e(l,{enable:!0,text:v("Not be displayed when published"),position:"bottom",width:"205px",children:e(i,{builderAttrs:h?.builderData,elementType:"secondary",description:v("No discount"),rawMode:!0,customClass:"!gp-p-[5px]"})});let q=d(a(y)),C=d(p(y)),I=m(c(y)),P=m(u()),E=m(x({mode:k,salePrice:A,priceSave:D,bundleItem:N}));return e("div",{className:E,style:{...o("ta",T)},id:`shopify-text-element-${h?.uid}`,"data-id":h?.uid,"data-product-id":F,"gp-data-hidden":"false",children:n(!w," ",e("div",{className:P,style:C,children:e("div",{className:I,style:q,children:t("div",{className:"gp-flex gp-break-all",children:[e(r,{styles:y,setting:{...g,text:j?.prefix?.replaceAll(" "," "),options:{useState:!0,uniqueId:`${h?.uid}-prefix`},excludeFlex:!0}}),e(r,{styles:y,setting:{...g,text:S,options:{isCannotEditing:!0},excludeFlex:!0}}),e(r,{styles:y,setting:{...g,text:j?.suffix?.replaceAll(" "," "),excludeFlex:!0,options:{useState:!0,uniqueId:`${h?.uid}-suffix`}}})]})})}))})};export{ProductTag as default};

package/dist/esm/product/components/product-discount-tag/ProductDiscountTag.liquid.js

@@ -1,30 +1,30 @@
-import{template as e,isLocalEnv as i,baseAssetURL as a}from"@gem-sdk/core";import{getDynamicSourceLocales as s,getSettingPreloadData as r}from"../../../helpers.js";import p from"../../../text/components/Text.liquid.js";import{createStyle as t,createClass as n,LiquidIf as c,Liquid as d,If as l}from"@gem-sdk/system";import{getWrapperTextClass as o,getContainerClass as u,getProductTagClass as g}from"./common/classes.js";import{getRootClass as m,getWrapperTextStyle as f,getContainerStyle as v}from"./common/styles.js";let ProductTag=({setting:$,styles:y,builderProps:x,advanced:S,pageContext:P})=>{let{customContent:_,translate:V}=$??{},h=$?.moneyWithCurrentFormat?"money_with_currency":"money",j=s({val:_?.prefix,uid:x?.uid,settingId:"customContent_prefix",isLiquid:!0,pageContext:P,translate:V}),M=s({val:_?.suffix,uid:x?.uid,settingId:"customContent_suffix",isLiquid:!0,pageContext:P,translate:V}),q=t(m(y)),w=t(f(y)),C=t(v(y)),E=n(o(y)),F=n(u()),N=n(g(S)),O=_?.unit==="percentage",T=()=>{let e=i?"{{ 'gp-product-tag-v7-5.js' | asset_url }}":`${a}/assets-v2/gp-product-tag-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}`;return`<script ${r('class="gps-link" delay',"src")}="${e}" defer="defer"></script>`};return e`
+import{template as e,isLocalEnv as i,baseAssetURL as s}from"@gem-sdk/core";import{getDynamicSourceLocales as a,createSettingId as r,getSettingPreloadData as t}from"../../../helpers.js";import p from"../../../text/components/Text.liquid.js";import{createStyle as n,createClass as c,LiquidIf as o,Liquid as d,If as l}from"@gem-sdk/system";import{getWrapperTextClass as u,getContainerClass as g,getProductTagClass as f}from"./common/classes.js";import{getRootClass as m,getWrapperTextStyle as v,getContainerStyle as x}from"./common/styles.js";import{ProductTag as $}from"../../settings/product-discount-tag/configs/translate.js";let ProductTag=({setting:y,styles:P,builderProps:S,advanced:V,pageContext:_})=>{let{customContent:h}=y??{},C=y?.moneyWithCurrentFormat?"money_with_currency":"money",j=$?.customContent?.id?a({val:h?.prefix,uid:S?.uid,settingId:r({id:$.customContent.id,suffix:"prefix"}),isLiquid:!0,pageContext:_??{}}):h?.prefix,F=$?.customContent?.id?a({val:h?.suffix,uid:S?.uid,settingId:r({id:$.customContent.id,suffix:"suffix"}),isLiquid:!0,pageContext:_??{}}):h?.suffix,M=n(m(P)),T=n(v(P)),q=n(x(P)),w=c(u(P)),E=c(g()),N=c(f(V)),O=h?.unit==="percentage",k=()=>{let e=i?"{{ 'gp-product-tag-v7-5.js' | asset_url }}":`${s}/assets-v2/gp-product-tag-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}`;return`<script ${t('class="gps-link" delay',"src")}="${e}" defer="defer"></script>`};return e`
     {% liquid
       assign price = variant.price | times: 1.0
       assign salePrice = variant.compare_at_price | times: 1.0
       assign priceSave = salePrice | minus: price
-      assign prefixVal = ${P?.isPreviewing?JSON.stringify(j):j}
-      assign suffixVal = ${P?.isPreviewing?JSON.stringify(M):M}
+      assign prefixVal = ${_?.isPreviewing?JSON.stringify(j):j}
+      assign suffixVal = ${_?.isPreviewing?JSON.stringify(F):F}
     %}
-    ${c("salePrice == null or price == null",d(`{% assign pricePercentage = prefixVal ${l(O,"| append: ' 0% '",`| ${h} | append: ' '`)} | append: suffixVal %}`),`${l(O,`{% assign salePercent = priceSave | divided_by: salePrice | times: 100  | round %}
-          {% assign pricePercentage = prefixVal | append: ' ' | append: salePercent | append: '% ' | append: suffixVal %}`,c("priceSave > 0",`{% assign priceSaveMoney = priceSave | ${h} %}
-           {% assign pricePercentage = prefixVal | append: ' ' | append: priceSaveMoney | append: ' ' | append: suffixVal %}`,`{% assign priceSaveMoney = 0 | ${h} %}
+    ${o("salePrice == null or price == null",d(`{% assign pricePercentage = prefixVal ${l(O,"| append: ' 0% '",`| ${C} | append: ' '`)} | append: suffixVal %}`),`${l(O,`{% assign salePercent = priceSave | divided_by: salePrice | times: 100  | round %}
+          {% assign pricePercentage = prefixVal | append: ' ' | append: salePercent | append: '% ' | append: suffixVal %}`,o("priceSave > 0",`{% assign priceSaveMoney = priceSave | ${C} %}
+           {% assign pricePercentage = prefixVal | append: ' ' | append: priceSaveMoney | append: ' ' | append: suffixVal %}`,`{% assign priceSaveMoney = 0 | ${C} %}
            {% assign pricePercentage = prefixVal | append: ' ' | append: priceSaveMoney | append: ' ' | append: suffixVal %}`))}`)}
 
     <gp-product-tag
       class="${N}"
-      style="${q}"
-      data-id="${x?.uid}"
-      data-disabled="${c(`${l(O,"salePercent","priceSave")} > 0`,"false","true")}"
-      gp-data='{"setting":${JSON.stringify($).replaceAll("'","&#039;")}, "id": "${x?.uid}", "locale": "{{shop.locale}}", "currency": "{{shop.currency}}", "moneyFormat": "{{ ${$?.moneyWithCurrentFormat?"shop.money_with_currency_format":"shop.money_format"} | replace: '"', '\\"' | escape }}"}'
+      style="${M}"
+      data-id="${S?.uid}"
+      data-disabled="${o(`${l(O,"salePercent","priceSave")} > 0`,"false","true")}"
+      gp-data='{"setting":${JSON.stringify(y).replaceAll("'","&#039;")}, "id": "${S?.uid}", "locale": "{{shop.locale}}", "currency": "{{shop.currency}}", "moneyFormat": "{{ ${y?.moneyWithCurrentFormat?"shop.money_with_currency_format":"shop.money_format"} | replace: '"', '\\"' | escape }}"}'
       price-save="{{priceSave}}"
     >
-      <div class="${F}" style="${C}">
-        <div class="${E}" style="${w}">
-          ${p({styles:y,id:`p-tag-${x?.uid}`,setting:{...$,translate:"",text:"{{ pricePercentage }}",excludeFlex:!0}})}
+      <div class="${E}" style="${q}">
+        <div class="${w}" style="${T}">
+          ${p({styles:P,id:`p-tag-${S?.uid}`,setting:{...y,text:"{{ pricePercentage }}",excludeFlex:!0,isForceValue:!0}})}
         </div>
       </div>
 
   </gp-product-tag>
-  ${T()}
+  ${k()}
   `};export{ProductTag as default};

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

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

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

@@ -1,44 +1,44 @@
-import{template as e,isLocalEnv as o,baseAssetURL as r,WrapRenderChildren as s,RenderChildren as t}from"@gem-sdk/core";import{getConditionRenderGalleryImages as i,getStyleInsideLayout as a,setDefaultWhenUndefineSetting as p}from"./common/common.js";import l from"./components/feature-gallery/FeatureImageWithGallery.liquid.js";import d from"./components/gallery-carousel/GalleryCarousel.liquid.js";import m from"./components/gallery-grid/GalleryGrid.liquid.js";import{getSettingPreloadData as c}from"../../../helpers.js";import{getShapeByLayout as u,sizeSettingDefaultForNewLayout as n}from"./common/productGallery.js";import{getProductImagesClassName as g}from"./composables/getProductImagesClassName.js";import{getProductImagesStyles as f}from"./composables/getProductImagesStyles.js";import{createAttr as $,LiquidIf as y,createClass as h,If as S,Liquid as j}from"@gem-sdk/system";import{getBorderActiveCss as v}from"./common/getBorderActiveCss.js";import{getStyleOfObject as F}from"../../helpers/function.js";let ProductImages=I=>{let P=p(I),{setting:C,styles:G,builderProps:D,style:b}=P,{rawChildren:z,pageContext:O}=I,{enableLazyLoadImage:_}=O??{},N={...C,...G},A=`
+import{template as e,isLocalEnv as o,baseAssetURL as r,WrapRenderChildren as s,RenderChildren as t}from"@gem-sdk/core";import{getConditionRenderGalleryImages as i,getStyleInsideLayout as a,setDefaultWhenUndefineSetting as p}from"./common/common.js";import l from"./components/feature-gallery/FeatureImageWithGallery.liquid.js";import d from"./components/gallery-carousel/GalleryCarousel.liquid.js";import m from"./components/gallery-grid/GalleryGrid.liquid.js";import{filterPageContext as c,getSettingPreloadData as u}from"../../../helpers.js";import{getShapeByLayout as n,sizeSettingDefaultForNewLayout as g}from"./common/productGallery.js";import{getProductImagesClassName as f}from"./composables/getProductImagesClassName.js";import{getProductImagesStyles as $}from"./composables/getProductImagesStyles.js";import{createAttr as y,LiquidIf as h,createClass as S,If as j,Liquid as v}from"@gem-sdk/system";import{getBorderActiveCss as F}from"./common/getBorderActiveCss.js";import{getStyleOfObject as I}from"../../helpers/function.js";let ProductImages=P=>{let C=p(P),{setting:G,styles:D,builderProps:b,style:z}=C,{rawChildren:O,pageContext:_}=P,{enableLazyLoadImage:N}=_??{},A={...G,...D},B=`
     {
-      "id":${JSON.stringify(D?.uid)},
-      "pageContext": ${JSON.stringify(O)},
-      "setting":${JSON.stringify(C)},
-      "styles":${JSON.stringify(G)},
+      "id":${JSON.stringify(b?.uid)},
+      "pageContext": ${JSON.stringify(c(_))},
+      "setting":${JSON.stringify(G)},
+      "styles":${JSON.stringify(D)},
       "productUrl":{{product.url | json | escape}},
       "product":{{product | json | escape}},
       "collectionUrl": {{ collection.url | json | escape }},
       "collection": {{ collection | json | escape}}
     }
-  `,B=$({"section-id":"{{section.id}}","data-id":`${D?.uid}`}),{isOnlyFeatureAllDevices:U,isRenderGalleryGrid:k}=i(N?.position,C?.type),q=k?{}:$({"data-only-image":y("product.media.size > 1","false","true")}),{wrapperClasses:E,productImagesGalleryClasses:J}=g(I),w=h({"gp-grid gp-w-full !gp-m-0 gp-relative":!0}),T=h({"gp-w-full !gp-m-0 gp-relative":!0}),{wrapContainerStyle:x,wrapContainerStyleOnlyOneImage:L,galleryImageStyle:M}=f(N),R=u({shape:N.shape,shapeForBottom:N.shapeForBottom,shapeFor1Col:N.shapeFor1Col,shapeFor2Col:N.shapeFor2Col,shapeForFtOnly:N.shapeForFtOnly,shapeForInsideBottom:N.shapeForInsideBottom??n,shapeForInside:N.shapeForInside??n},N.position),V=a(N.position,R,N?.spacing),W=()=>e`
-      ${s({uid:D?.uid||"",customProps:z?.[0].customProps},z?.map(o=>{if(o)return e`${t({...o,isInsideProductImage:!0,imageData:{imageShape:G?.ftShape,imageAlign:G?.align,imageLayout:G?.position},dotData:{dotSize:C?.ftDotSize,dotGapToCarousel:C?.ftDotGapToCarousel,dotStyle:C?.ftDotStyle}})}`}))}
-    `,H=()=>e`
+  `,U=y({"section-id":"{{section.id}}","data-id":`${b?.uid}`}),{isOnlyFeatureAllDevices:k,isRenderGalleryGrid:q}=i(A?.position,G?.type),E=q?{}:y({"data-only-image":h("product.media.size > 1","false","true")}),{wrapperClasses:J,productImagesGalleryClasses:w}=f(P),T=S({"gp-grid gp-w-full !gp-m-0 gp-relative":!0}),x=S({"gp-w-full !gp-m-0 gp-relative":!0}),{wrapContainerStyle:L,wrapContainerStyleOnlyOneImage:M,galleryImageStyle:R}=$(A),V=n({shape:A.shape,shapeForBottom:A.shapeForBottom,shapeFor1Col:A.shapeFor1Col,shapeFor2Col:A.shapeFor2Col,shapeForFtOnly:A.shapeForFtOnly,shapeForInsideBottom:A.shapeForInsideBottom??g,shapeForInside:A.shapeForInside??g},A.position),W=a(A.position,V,A?.spacing),H=()=>e`
+      ${s({uid:b?.uid||"",customProps:O?.[0].customProps},O?.map(o=>{if(o)return e`${t({...o,isInsideProductImage:!0,imageData:{imageShape:D?.ftShape,imageAlign:D?.align,imageLayout:D?.position},dotData:{dotSize:G?.ftDotSize,dotGapToCarousel:G?.ftDotGapToCarousel,dotStyle:G?.ftDotStyle}})}`}))}
+    `,K=()=>e`
       <div
-        class="${J}"
-        style="${F(M)}"
-        ${{...q}}
+        class="${w}"
+        style="${I(R)}"
+        ${{...E}}
       >
-        ${y("product.media.size > 1",d({builderPropUID:`gp-gallery-${D?.uid}`,...N,enableLazyLoadImage:_}))}
-        ${S(k,m({builderPropUID:D?.uid,wrapperStyle:{...V},children:W(),...N,enableLazyLoadImage:_}))}
+        ${h("product.media.size > 1",d({builderPropUID:`gp-gallery-${b?.uid}`,...A,enableLazyLoadImage:N}))}
+        ${j(q,m({builderPropUID:b?.uid,wrapperStyle:{...W},children:H(),...A,enableLazyLoadImage:N}))}
       </div>
-    `,K=()=>C?.borderActive?.border!=="none";return e`
-  ${S(K(),y("product.media.size > 1",`<style>${v({settings:N,uid:D?.uid,type:"Liquid"})}</style>`),"")}
-  ${j(`
+    `,Q=()=>G?.borderActive?.border!=="none";return e`
+  ${j(Q(),h("product.media.size > 1",`<style>${F({settings:A,uid:b?.uid,type:"Liquid"})}</style>`),"")}
+  ${v(`
     {% assign featured_image = product.featured_image %}
-    ${y("variant != null and variant.featured_image != null","{% assign featured_image = variant.featured_image %}")}
+    ${h("variant != null and variant.featured_image != null","{% assign featured_image = variant.featured_image %}")}
   `)}
     <gp-product-images
-      gp-data='${A}'
-      ${{...B}}
-      style="${{...b}}"
-      class="${E}"
+      gp-data='${B}'
+      ${{...U}}
+      style="${{...z}}"
+      class="${J}"
     >
       <div
-        class="${y("product.media.size > 1",`${w}`,`${T}`)}"
-        style="${y("product.media.size > 1",F(x),F(L))}"
+        class="${h("product.media.size > 1",`${T}`,`${x}`)}"
+        style="${h("product.media.size > 1",I(L),I(M))}"
       >
-        ${l({builderPropUID:`gp-carousel-${D?.uid}`,...N,children:W(),enableLazyLoadImage:_})}
-        ${S(!U,H())}
+        ${l({builderPropUID:`gp-carousel-${b?.uid}`,...A,children:H(),enableLazyLoadImage:N})}
+        ${j(!k,K())}
       </div>
     </gp-product-images>
-    ${S(o,`<script ${c('class="gps-link" delay',"src")}="{{ 'gp-product-images-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${c('class="gps-link" delay',"src")}="${r}/assets-v2/gp-product-images-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
+    ${j(o,`<script ${u('class="gps-link" delay',"src")}="{{ 'gp-product-images-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${u('class="gps-link" delay',"src")}="${r}/assets-v2/gp-product-images-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
   `};export{ProductImages as default};

package/dist/esm/product/components/product-images-v3/ProductImageV3.js

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

package/dist/esm/product/components/product-images-v3/ProductImagesV3.liquid.js

@@ -1,44 +1,44 @@
-import{template as e,isLocalEnv as o,baseAssetURL as r,WrapRenderChildren as s,RenderChildren as t}from"@gem-sdk/core";import{getConditionRenderGalleryImages as i,getStyleInsideLayout as a,setDefaultWhenUndefineSetting as p}from"./common/common.js";import l from"./components/feature-gallery/FeatureImageWithGallery.liquid.js";import d from"./components/gallery-carousel/GalleryCarousel.liquid.js";import m from"./components/gallery-grid/GalleryGrid.liquid.js";import{getSettingPreloadData as c}from"../../../helpers.js";import{getShapeByLayout as u,sizeSettingDefaultForNewLayout as n}from"./common/productGallery.js";import{getProductImagesClassName as g}from"./composables/getProductImagesClassName.js";import{getProductImagesStyles as f}from"./composables/getProductImagesStyles.js";import{createAttr as $,LiquidIf as y,createClass as h,If as v,Liquid as S}from"@gem-sdk/system";import{getBorderActiveCss as j}from"./common/getBorderActiveCss.js";import{getStyleOfObject as F}from"../../helpers/function.js";let ProductImages=I=>{let P=p(I),{setting:C,styles:G,builderProps:D,style:b}=P,{rawChildren:z,pageContext:O}=I,{enableLazyLoadImage:_}=O??{},N={...C,...G},A=`
+import{template as e,isLocalEnv as o,baseAssetURL as r,WrapRenderChildren as s,RenderChildren as t}from"@gem-sdk/core";import{getConditionRenderGalleryImages as i,getStyleInsideLayout as a,setDefaultWhenUndefineSetting as p}from"./common/common.js";import l from"./components/feature-gallery/FeatureImageWithGallery.liquid.js";import d from"./components/gallery-carousel/GalleryCarousel.liquid.js";import m from"./components/gallery-grid/GalleryGrid.liquid.js";import{filterPageContext as c,getSettingPreloadData as u}from"../../../helpers.js";import{getShapeByLayout as n,sizeSettingDefaultForNewLayout as g}from"./common/productGallery.js";import{getProductImagesClassName as f}from"./composables/getProductImagesClassName.js";import{getProductImagesStyles as $}from"./composables/getProductImagesStyles.js";import{createAttr as y,LiquidIf as h,createClass as v,If as S,Liquid as j}from"@gem-sdk/system";import{getBorderActiveCss as F}from"./common/getBorderActiveCss.js";import{getStyleOfObject as I}from"../../helpers/function.js";let ProductImages=P=>{let C=p(P),{setting:G,styles:D,builderProps:b,style:z}=C,{rawChildren:O,pageContext:_}=P,{enableLazyLoadImage:N}=_??{},A={...G,...D},B=`
     {
-      "id":${JSON.stringify(D?.uid)},
-      "pageContext": ${JSON.stringify(O)},
-      "setting":${JSON.stringify(C)},
-      "styles":${JSON.stringify(G)},
+      "id":${JSON.stringify(b?.uid)},
+      "pageContext": ${JSON.stringify(c(_))},
+      "setting":${JSON.stringify(G)},
+      "styles":${JSON.stringify(D)},
       "productUrl":{{product.url | json | escape}},
       "product":{{product | json | escape}},
       "collectionUrl": {{ collection.url | json | escape }},
       "collection": {{ collection | json | escape}}
     }
-  `,B=$({"section-id":"{{section.id}}","data-id":`${D?.uid}`}),{isOnlyFeatureAllDevices:U,isRenderGalleryGrid:k}=i(N?.position,C?.type),q=k?{}:$({"data-only-image":y("product.media.size > 1","false","true")}),{wrapperClasses:E,productImagesGalleryClasses:J}=g(I),w=h({"gp-grid gp-w-full !gp-m-0 gp-relative":!0}),T=h({"gp-w-full !gp-m-0 gp-relative":!0}),{wrapContainerStyle:x,wrapContainerStyleOnlyOneImage:L,galleryImageStyle:M}=f(N),R=u({shape:N.shape,shapeForBottom:N.shapeForBottom,shapeFor1Col:N.shapeFor1Col,shapeFor2Col:N.shapeFor2Col,shapeForFtOnly:N.shapeForFtOnly,shapeForInsideBottom:N.shapeForInsideBottom??n,shapeForInside:N.shapeForInside??n},N.position),V=a(N.position,R,N?.spacing),W=()=>e`
-      ${s({uid:D?.uid||"",customProps:z?.[0].customProps},z?.map(o=>{if(o)return e`${t({...o,isInsideProductImage:!0,imageData:{imageShape:G?.ftShape,imageAlign:G?.align,imageLayout:G?.position},dotData:{dotSize:C?.ftDotSize,dotGapToCarousel:C?.ftDotGapToCarousel,dotStyle:C?.ftDotStyle}})}`}))}
-    `,H=()=>e`
+  `,U=y({"section-id":"{{section.id}}","data-id":`${b?.uid}`}),{isOnlyFeatureAllDevices:k,isRenderGalleryGrid:q}=i(A?.position,G?.type),E=q?{}:y({"data-only-image":h("product.media.size > 1","false","true")}),{wrapperClasses:J,productImagesGalleryClasses:w}=f(P),T=v({"gp-grid gp-w-full !gp-m-0 gp-relative":!0}),x=v({"gp-w-full !gp-m-0 gp-relative":!0}),{wrapContainerStyle:L,wrapContainerStyleOnlyOneImage:M,galleryImageStyle:R}=$(A),V=n({shape:A.shape,shapeForBottom:A.shapeForBottom,shapeFor1Col:A.shapeFor1Col,shapeFor2Col:A.shapeFor2Col,shapeForFtOnly:A.shapeForFtOnly,shapeForInsideBottom:A.shapeForInsideBottom??g,shapeForInside:A.shapeForInside??g},A.position),W=a(A.position,V,A?.spacing),H=()=>e`
+      ${s({uid:b?.uid||"",customProps:O?.[0].customProps},O?.map(o=>{if(o)return e`${t({...o,isInsideProductImage:!0,imageData:{imageShape:D?.ftShape,imageAlign:D?.align,imageLayout:D?.position},dotData:{dotSize:G?.ftDotSize,dotGapToCarousel:G?.ftDotGapToCarousel,dotStyle:G?.ftDotStyle}})}`}))}
+    `,K=()=>e`
       <div
-        class="${J}"
-        style="${F(M)}"
-        ${{...q}}
+        class="${w}"
+        style="${I(R)}"
+        ${{...E}}
       >
-        ${y("product.media.size > 1",d({builderPropUID:`gp-gallery-${D?.uid}`,...N,enableLazyLoadImage:_}))}
-        ${v(k,m({builderPropUID:D?.uid,wrapperStyle:{...V},children:W(),...N,enableLazyLoadImage:_}))}
+        ${h("product.media.size > 1",d({builderPropUID:`gp-gallery-${b?.uid}`,...A,enableLazyLoadImage:N}))}
+        ${S(q,m({builderPropUID:b?.uid,wrapperStyle:{...W},children:H(),...A,enableLazyLoadImage:N}))}
       </div>
-    `,K=()=>C?.borderActive?.border!=="none";return e`
-  ${v(K(),y("product.media.size > 1",`<style>${j({settings:N,uid:D?.uid,type:"Liquid"})}</style>`),"")}
-  ${S(`
+    `,Q=()=>G?.borderActive?.border!=="none";return e`
+  ${S(Q(),h("product.media.size > 1",`<style>${F({settings:A,uid:b?.uid,type:"Liquid"})}</style>`),"")}
+  ${j(`
     {% assign featured_image = product.featured_image %}
-    ${y("variant != null and variant.featured_image != null","{% assign featured_image = variant.featured_image %}")}
+    ${h("variant != null and variant.featured_image != null","{% assign featured_image = variant.featured_image %}")}
   `)}
     <gp-product-images-v3
-      gp-data='${A}'
-      ${{...B}}
-      style="${{...b}}"
-      class="${E}"
+      gp-data='${B}'
+      ${{...U}}
+      style="${{...z}}"
+      class="${J}"
     >
       <div
-        class="${y("product.media.size > 1",`${w}`,`${T}`)}"
-        style="${y("product.media.size > 1",F(x),F(L))}"
+        class="${h("product.media.size > 1",`${T}`,`${x}`)}"
+        style="${h("product.media.size > 1",I(L),I(M))}"
       >
-        ${l({builderPropUID:`gp-carousel-${D?.uid}`,...N,children:W(),enableLazyLoadImage:_})}
-        ${v(!U,H())}
+        ${l({builderPropUID:`gp-carousel-${b?.uid}`,...A,children:H(),enableLazyLoadImage:N})}
+        ${S(!k,K())}
       </div>
     </gp-product-images-v3>
-    ${v(o,`<script ${c('class="gps-link" delay',"src")}="{{ 'gp-product-images-v3-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${c('class="gps-link" delay',"src")}="${r}/assets-v2/gp-product-images-v3-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
+    ${S(o,`<script ${u('class="gps-link" delay',"src")}="{{ 'gp-product-images-v3-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${u('class="gps-link" delay',"src")}="${r}/assets-v2/gp-product-images-v3-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
   `};export{ProductImages as default};

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

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

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