@gem-sdk/components 11.2.5 → 12.0.0-dev.101

package/dist/esm/product/components/product-badge/utils/renderBadgeLiquid.js

@@ -16,12 +16,16 @@ import{CompareType as e}from"../types.js";let getMinValueForInventory=i=>i===e.A
   {% assign price = variant.price | times: 1.0 %}
   {% assign salePrice = variant.compare_at_price | times: 1.0 %}
   {% assign priceSave = salePrice | minus: price %}
-  {% assign isDiscountContent = ${i} %}
-  {% assign isTextBadge = ${n} %}
-  {% if priceSave <= 0 or isDiscountContent == false or isTextBadge == false %}
-    {% assign isShow = false %}
+  {% assign isEmptyBadgeContent = ${!i} %}
+  {% assign isNotDiscount = false %}
+  {% assign isBadgeContentHasDiscount = ${n} %}
+  {% if isEmptyBadgeContent == true %}
+    {% assign isNotDiscount = true %}
   {% endif %}
-  {% if isShow %}
+  {% if isBadgeContentHasDiscount == true and priceSave <= 0 %}
+    {% assign isNotDiscount = true %}
+  {% endif %}
+  {% if isShow and isNotDiscount == false %}
     {% assign className = "" %}
   {% else %}
     {% assign className = "!gp-hidden" %}

package/dist/esm/product/components/product-bundle/ProductBundleDiscount.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as t,jsxs as e}from"react/jsx-runtime";import{useRenderMode as o,isEmptyChildren as s}from"@gem-sdk/core";import{isValidElement as n}from"react";import r from"../../../common/components/NoDataState.js";import{createClass as i,createStyle as l,If as d}from"@gem-sdk/system";import{getSizeSettings as m,getContainerStyles as u}from"./common/styles.js";import{getContainerClasses as c,getNoDiscountClasses as a}from"./common/classes.js";import p from"./hooks/useProductBundleDataState.js";import f from"./hooks/useProductBundleDiscountState.js";import h from"./ProductBundleDiscountChildrenItem.js";let ProductBundleDiscount=({builderAttrs:y,style:b,children:I,setting:g,styles:j,advanced:D})=>{let{isEditMode:k,isPreviewSharePageMode:S}=o(),{isSelected:x,setSelected:B}=f(g),{emitRedirectSetupPage:P,redirectGuideline:N,svgVertical:T,svgHorizontal:v}=p(),A=i(c(g,D?.cssClass)),C=i(a),q=l(m(j)?.gap),w=l(u(q,j,b));if(!g?.bundleItems?.length&&k)return t(r,{elementType:"secondary",description:"Increase AOV with bundle quantity.",descriptionActions:[{text:"Setup bundle discount",callback:P},{text:"read guideline",callback:N}],additionalMedia:g?.layout=="horizontal-layout"?v:T});let z=(e,o)=>{if(g?.hideNoDiscountItem&&e?.discountType==="no_discount")return null;let s=I?.[o];if(n(s))return t(h,{index:o,childItem:s,setting:g,styles:j,isSelected:x(o),setSelected:B,bundleItem:e},o)},M=(s(I)||g?.bundleItems?.length==0)&&!S;return e("div",{...y,className:A,style:w,children:[d(M,t("div",{className:C,children:"This product has no bundle discount"})),g?.bundleItems?.map((t,e)=>z(t,e))]})};export{ProductBundleDiscount as default};
+import{jsx as t,jsxs as e}from"react/jsx-runtime";import{useRenderMode as o,useI18nStore as s,isEmptyChildren as n}from"@gem-sdk/core";import{isValidElement as r}from"react";import i from"../../../common/components/NoDataState.js";import{createClass as l,createStyle as d,If as m}from"@gem-sdk/system";import{getSizeSettings as u,getContainerStyles as c}from"./common/styles.js";import{getContainerClasses as a,getNoDiscountClasses as p}from"./common/classes.js";import f from"./hooks/useProductBundleDataState.js";import h from"./hooks/useProductBundleDiscountState.js";import y from"./ProductBundleDiscountChildrenItem.js";let ProductBundleDiscount=({builderAttrs:b,style:I,children:g,setting:j,styles:D,advanced:k})=>{let{isEditMode:S,isPreviewSharePageMode:x}=o(),{isSelected:B,setSelected:P}=h(j),{emitRedirectSetupPage:N,redirectGuideline:T,svgVertical:v,svgHorizontal:A}=f(),{t:C}=s(),q=l(a(j,k?.cssClass)),w=l(p),z=d(u(D)?.gap),M=d(c(z,D,I));if(!j?.bundleItems?.length&&S)return t(i,{elementType:"secondary",description:C("Increase AOV with bundle quantity."),descriptionActions:[{text:C("Setup bundle discount"),callback:N},{text:C("read guideline"),callback:T}],additionalMedia:j?.layout=="horizontal-layout"?A:v});let O=(e,o)=>{if(j?.hideNoDiscountItem&&e?.discountType==="no_discount")return null;let s=g?.[o];if(r(s))return t(y,{index:o,childItem:s,setting:j,styles:D,isSelected:B(o),setSelected:P,bundleItem:e},o)},V=(n(g)||j?.bundleItems?.length==0)&&!x;return e("div",{...b,className:q,style:M,children:[m(V,t("div",{className:w,children:"This product has no bundle discount"})),j?.bundleItems?.map((t,e)=>O(t,e))]})};export{ProductBundleDiscount as default};

package/dist/esm/product/components/product-bundle/ProductBundleDiscount.liquid.js

@@ -1,15 +1,16 @@
-import{template as t,RenderIf as e,isLocalEnv as s,baseAssetURL as r}from"@gem-sdk/core";import{getSettingPreloadData as d}from"../../../helpers.js";import{createStyle as o,createClass as a,createStateOrContext as i,Liquid as n,LiquidIf as p}from"@gem-sdk/system";import{getSizeSettings as l,getContainerStyles as u}from"./common/styles.js";import{getContainerClasses as c}from"./common/classes.js";import m from"./ProductBundleDiscountChildrenItem.liquid.js";let ProductBundleDiscount=({rawChildren:f,setting:g,styles:I,advanced:$,style:P})=>{let y=g?.hasPreSelectItem?g?.selectItemDefault??0:-1,B=t=>y===t,S=(t,e)=>m({index:e,rawChildrenItem:f?.[e],setting:g,styles:I,isSelected:B(e),bundleItem:t}),_=o(l(I)?.gap),h=a(c(g,$?.cssClass)),A=o(u(_,I,P)),D=i({styles:I,settings:{useProductCompareAtPrice:g?.useProductCompareAtPrice,selectItemDefault:g?.selectItemDefault,hideNoDiscountItem:g?.hideNoDiscountItem,hasPreSelectItem:g?.hasPreSelectItem,iconItemColor:g?.iconItemColor,applyToInBetweenQuantities:g?.applyToInBetweenQuantities}}),j=()=>e(s,`<script ${d('class="gps-link" delay',"src")}="{{ 'gp-product-bundle-discount-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${d('class="gps-link" delay',"src")}="${r}/assets-v2/gp-product-bundle-discount-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`);return t`
+import{template as t,RenderIf as e,isLocalEnv as s,baseAssetURL as r}from"@gem-sdk/core";import{getSettingPreloadData as d}from"../../../helpers.js";import{createStyle as o,createClass as i,createStateOrContext as a,Liquid as p,LiquidIf as n}from"@gem-sdk/system";import{getSizeSettings as c,getContainerStyles as l}from"./common/styles.js";import{getContainerClasses as u}from"./common/classes.js";import m from"./ProductBundleDiscountChildrenItem.liquid.js";let ProductBundleDiscount=({rawChildren:f,setting:g,styles:I,advanced:$,style:P})=>{let y=g?.hasPreSelectItem?g?.selectItemDefault??0:-1,B=t=>y===t,S=(t,e)=>m({index:e,rawChildrenItem:f?.[e],setting:g,styles:I,isSelected:B(e),bundleItem:t}),_=o(c(I)?.gap),h=i(u(g,$?.cssClass)),j=o(l(_,I,P)),A=a({styles:I,settings:{useProductCompareAtPrice:g?.useProductCompareAtPrice,selectItemDefault:g?.selectItemDefault,hideNoDiscountItem:g?.hideNoDiscountItem,hasPreSelectItem:g?.hasPreSelectItem,iconItemColor:g?.iconItemColor,applyToInBetweenQuantities:g?.applyToInBetweenQuantities}}),D=()=>e(s,`<script ${d('class="gps-link" delay',"src")}="{{ 'gp-product-bundle-discount-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${d('class="gps-link" delay',"src")}="${r}/assets-v2/gp-product-bundle-discount-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`);return t`
     <gp-product-bundle-discount
-      gp-data='${JSON.stringify(D)}'
-      style="${A}"
-      class="${h}">
-      ${n(`
+      style="${j}"
+      class="${h}"
+    >
+      <script gp-data type="application/json">${JSON.stringify(A)}</script>
+      ${p(`
         {%- assign gempages_product_bundle = product.metafields.gp_discount.gp_discount_selected_products -%}
         {%  assign productBundleItem = gempages_product_bundle | split: '($1)'  %}
       `)}
       ${f?.map((e,s)=>t`
           {% for productBundle in productBundleItem %}
-            ${n(`
+            ${p(`
               {% assign attrs = productBundle | split: '($3)' %}
               {% assign parsedAttrs = '' %}
               {% for attr in attrs %}
@@ -22,12 +23,12 @@ import{template as t,RenderIf as e,isLocalEnv as s,baseAssetURL as r}from"@gem-s
                 {% endif %}
               {% endfor %}
             `)}
-            ${p(`forloop.index0 == ${s}`,S("{{ parsedAttrs | strip }}",s))}
+            ${n(`forloop.index0 == ${s}`,S("{{ parsedAttrs | strip }}",s))}
           {% endfor %}
           `).join("")}
     </gp-product-bundle-discount>
 
     {% if productBundleItem %}
-      ${j()}
+      ${D()}
     {% endif %}
   `};export{ProductBundleDiscount as default};

package/dist/esm/product/components/product-bundle/setting/ProductBundleDiscount.js

@@ -6,7 +6,7 @@ import t from"./configs/ui-v2.js";import i from"./configs/ui-v1.js";import{Produ
 <rect x="8" y="36" width="12" height="4" rx="2" fill="#F9F9F9"/>
 <rect x="24" y="36" width="40" height="4" rx="2" fill="#AAAAAA"/>
 </svg>
-`,settings:l,ui:i,uiV2:t,editorConfigs:{placeholder:{flowTag:["Product"],notAppendTags:["ProductList","ProductBundleDiscount"]}},presets:[{id:"product-bundle-discount",name:{en:"Product Bundle Discount"},icon:{desktop:`
+`,settings:l,ui:i,uiV2:t,editorConfigs:{placeholder:{flowTag:["Product"],notAppendTags:["ProductList","ProductBundleDiscount"]}},presets:[{id:"product-bundle-discount",name:"Product Bundle Discount",icon:{desktop:`
         <svg width="72" height="52" viewBox="0 0 72 52" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M0 7C0 5.34315 1.34315 4 3 4H69C70.6569 4 72 5.34315 72 7V21C72 22.6569 70.6569 24 69 24H3C1.34315 24 0 22.6569 0 21V7Z" fill="#424242"/>
 <rect x="8" y="12" width="12" height="4" rx="2" fill="#F9F9F9"/>
@@ -15,7 +15,7 @@ import t from"./configs/ui-v2.js";import i from"./configs/ui-v1.js";import{Produ
 <rect x="8" y="36" width="12" height="4" rx="2" fill="#F9F9F9"/>
 <rect x="24" y="36" width="40" height="4" rx="2" fill="#AAAAAA"/>
 </svg>
-`},components:[{tag:"ProductBundleDiscount",settings:{childItem:[],layout:"vertical-layout"},childrens:[]}]},{id:"product-bundle-horizontal-discount",name:{en:"Product Bundle Discount"},icon:{desktop:`<svg width="72" height="52" viewBox="0 0 72 52" fill="none" xmlns="http://www.w3.org/2000/svg">
+`},components:[{tag:"ProductBundleDiscount",settings:{childItem:[],layout:"vertical-layout"},childrens:[]}]},{id:"product-bundle-horizontal-discount",name:"Product Bundle Discount",icon:{desktop:`<svg width="72" height="52" viewBox="0 0 72 52" fill="none" xmlns="http://www.w3.org/2000/svg">
     <path d="M0 11C0 9.34315 1.34315 8 3 8H31C32.6569 8 34 9.34315 34 11V41C34 42.6569 32.6569 44 31 44H3C1.34315 44 0 42.6569 0 41V11Z" fill="#424242"/>
     <rect x="11" y="16" width="12" height="4" rx="2" fill="#F9F9F9"/>
     <rect x="5" y="24" width="24" height="4" rx="2" fill="#AAAAAA"/>

package/dist/esm/product/components/product-bundle/setting/configs/ui-v2.js

@@ -1 +1 @@
-let SettingUIV2=[{label:{en:"Bundle management"},controls:[{type:"control",layout:"vertical",setting:{id:"childItem"}}]},{label:{en:"Item gap"},controls:[{label:{en:"Gap"},controlConfig:{id:"gap",type:"input:slider",units:["px"],min:0,max:120,step:1,ignoreMax:!0,linkWithSetting:{name:"size",field:"gap"}},layout:"horizontal"}]},{controls:[{type:"control",label:{en:"Radio icon"},setting:{id:"enableIcon"},options:{labelVariant:"primary",toggleStyle:"switch"}},{conditionDisplay:'enableIcon == true && layout == "vertical-layout"',label:{en:"Position"},setting:{id:"iconPosition"}},{type:"control",conditionDisplay:'enableIcon == true && layout == "horizontal-layout"',label:{en:"Position"},setting:{id:"iconHorizontalPosition"}},{conditionDisplay:"enableIcon == true",type:"control",label:{en:"Color"},setting:{id:"iconItemColor"},controlConfig:{id:"icon-radio-color",type:"color-picker-v2",linkWithSetting:{name:"iconColor",field:"normal"}}},{type:"control",conditionDisplay:"enableIcon == true",label:{en:"Size"},setting:{id:"iconSize"}},{type:"control",conditionDisplay:"enableIcon == true",label:{en:"Gap to content"},setting:{id:"iconSpacing"}}]},{label:{en:"Item style"},controls:[{label:{en:"Background"},setting:{id:"backgroundColor",state:"normal"}},{label:{en:"Border"},setting:{id:"borderBundle",state:"normal"}},{label:{en:"Corner"},setting:{id:"roundedBundle",state:"normal"}},{label:{en:"Shadow"},setting:{id:"boxShadowBundle",state:"normal"},controlConfig:{id:"boxShadowBundle",type:"shadow-v2"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadowBundle",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadowBundle.normal.enable === true",source:["boxShadowBundle","hasBoxShadowBundle"],action:{controlId:"hasBoxShadowBundle",groupType:"style",controlType:"style",state:"normal",newValue:!0}},{condition:"boxShadowBundle.normal.enable === false",source:["boxShadowBundle","hasBoxShadowBundle"],action:{controlId:"hasBoxShadowBundle",groupType:"style",controlType:"style",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}},{label:{en:"Shadow"},setting:{id:"hasBoxShadowBundle",state:"normal"},conditionDisplay:"false"},{label:{en:"Shadow"},setting:{id:"hasBoxShadowBundle",state:"hover"},conditionDisplay:"false"},{label:{en:"Shadow"},setting:{id:"hasBoxShadowBundle",state:"active"},conditionDisplay:"false"}]},{label:{en:"Effect"},controls:[{label:{en:"Hover"},type:"combo",iconName:"polaris-check-hover",fixedValue:"Styled",setting:{id:"enableHoverEffect"},state:"hover",popoverLabel:{en:"Hover"},controls:[{type:"group",label:{en:"Background"},controls:[{label:{en:"Color"},setting:{id:"backgroundColor",state:"hover"}}]},{label:{en:"Icon"},type:"group",controls:[{label:{en:"Icon color"},setting:{id:"iconColor",state:"hover"}}]},{label:{en:"Shape"},type:"group",controls:[{label:{en:"Border"},setting:{id:"borderBundle",state:"hover"}},{label:{en:"Corner"},setting:{id:"roundedBundle",state:"hover"}},{label:{en:"Shadow"},setting:{id:"boxShadowBundle",state:"hover"},controlConfig:{id:"boxShadowBundle",type:"shadow-v2"},options:{updateFields:[{field:"hover.enable",settingId:"hasBoxShadowBundle",state:"hover"}]},controlChangeTrigger:{settings:[{condition:"boxShadowBundle.hover.enable === true",source:["boxShadowBundle","hasBoxShadowBundle"],action:{controlId:"hasBoxShadowBundle",groupType:"style",controlType:"style",state:"hover",newValue:!0}},{condition:"boxShadowBundle.hover.enable === false",source:["boxShadowBundle","hasBoxShadowBundle"],action:{controlId:"hasBoxShadowBundle",groupType:"style",controlType:"style",state:"hover",newValue:!1}}],options:{noRecordHistory:!0}}}]}]},{label:{en:"Active"},type:"combo",iconName:"polaris-status-active",fixedValue:"Styled",setting:{id:"enableActiveEffect"},state:"active",popoverLabel:{en:"Active"},controls:[{type:"group",label:{en:"Background"},controls:[{label:{en:"Color"},setting:{id:"backgroundColor",state:"active"}}]},{label:{en:"Icon"},type:"group",controls:[{label:{en:"Icon color"},setting:{id:"iconColor",state:"active"}}]},{label:{en:"Shape"},type:"group",controls:[{label:{en:"Border"},setting:{id:"borderBundle",state:"active"}},{label:{en:"Corner"},setting:{id:"roundedBundle",state:"active"}},{label:{en:"Shadow"},setting:{id:"boxShadowBundle",state:"active"},controlConfig:{id:"boxShadowBundle",type:"shadow-v2"},options:{updateFields:[{field:"active.enable",settingId:"hasBoxShadowBundle",state:"active"}]},controlChangeTrigger:{settings:[{condition:"boxShadowBundle.active.enable === true",source:["boxShadowBundle","hasBoxShadowBundle"],action:{controlId:"hasBoxShadowBundle",groupType:"style",controlType:"style",state:"active",newValue:!0}},{condition:"boxShadowBundle.active.enable === false",source:["boxShadowBundle","hasBoxShadowBundle"],action:{controlId:"hasBoxShadowBundle",groupType:"style",controlType:"style",state:"active",newValue:!1}}],options:{noRecordHistory:!0}}}]}]}]},{label:{en:"Size"},controls:[{id:"Width",label:{en:"Width"},controlConfig:{id:"width",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,linkWithSetting:{name:"size",field:"width"},displayOptions:[{label:"Fit content",value:"Auto",showValue:!0},{label:"Full",value:"100%",showValue:!0},{label:"Small",value:"100px",showValue:!0},{label:"Medium",value:"200px",showValue:!0},{label:"Large",value:"300px",showValue:!0}]},layout:"horizontal"},{label:{en:"Padding"},controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"size",field:"padding"},compoDefaultValue:{desktop:{default:{type:"custom",top:"12px",bottom:"12px",left:"32px",right:"32px"}}}}}]},{label:{en:"Shape",cn:"形状",es:"Forma"},conditionDisplay:'pageType != "POST_PURCHASE"',controls:[{label:{en:"Border",cn:"边界",es:"Borde"},setting:{id:"border",state:"normal"}},{label:{en:"Corner",cn:"角落",es:"Esquina"},setting:{id:"rounded",state:"normal"}},{label:{en:"Shadow",cn:"阴影",es:"Sombra"},setting:{id:"boxShadow",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadow",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadow.normal.enable === true",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!0}},{condition:"boxShadow.normal.enable === false",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{label:{en:"Display condition"},conditionDisplay:"enableDisplayCondition == true",controls:[{label:{en:"Default item"},setting:{id:"hasPreSelectItem"}},{layout:"vertical",setting:{id:"selectItemDefault"},conditionDisplay:"hasPreSelectItem == true"},{label:{en:"Compare price"},setting:{id:"useProductCompareAtPrice"}},{label:{en:"Display item"},setting:{id:"hideNoDiscountItem"}}]},{controls:[{label:{en:"Align"},conditionEnable:'!(parseInt(size.width) >= 100 && size.width?.includes("%"))',setting:{id:"align"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"}}]}];export{SettingUIV2 as default};
+let SettingUIV2=[{label:"Bundle management",controls:[{type:"control",layout:"vertical",setting:{id:"childItem"}}]},{label:"Item gap",controls:[{label:"Gap",controlConfig:{id:"gap",type:"input:slider",units:["px"],min:0,max:120,step:1,ignoreMax:!0,linkWithSetting:{name:"size",field:"gap"}},layout:"horizontal"}]},{controls:[{type:"control",label:"Radio icon",setting:{id:"enableIcon"},options:{labelVariant:"primary",toggleStyle:"switch"}},{conditionDisplay:'enableIcon == true && layout == "vertical-layout"',label:"Position",setting:{id:"iconPosition"}},{type:"control",conditionDisplay:'enableIcon == true && layout == "horizontal-layout"',label:"Position",setting:{id:"iconHorizontalPosition"}},{conditionDisplay:"enableIcon == true",type:"control",label:"Color",setting:{id:"iconItemColor"},controlConfig:{id:"icon-radio-color",type:"color-picker-v2",linkWithSetting:{name:"iconColor",field:"normal"}}},{type:"control",conditionDisplay:"enableIcon == true",label:"Size",setting:{id:"iconSize"}},{type:"control",conditionDisplay:"enableIcon == true",label:"Gap to content",setting:{id:"iconSpacing"}}]},{label:"Item style",controls:[{label:"Background",setting:{id:"backgroundColor",state:"normal"}},{label:"Border",setting:{id:"borderBundle",state:"normal"}},{label:"Corner",setting:{id:"roundedBundle",state:"normal"}},{label:"Shadow",setting:{id:"boxShadowBundle",state:"normal"},controlConfig:{id:"boxShadowBundle",type:"shadow-v2"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadowBundle",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadowBundle.normal.enable === true",source:["boxShadowBundle","hasBoxShadowBundle"],action:{controlId:"hasBoxShadowBundle",groupType:"style",controlType:"style",state:"normal",newValue:!0}},{condition:"boxShadowBundle.normal.enable === false",source:["boxShadowBundle","hasBoxShadowBundle"],action:{controlId:"hasBoxShadowBundle",groupType:"style",controlType:"style",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}},{label:"Shadow",setting:{id:"hasBoxShadowBundle",state:"normal"},conditionDisplay:"false"},{label:"Shadow",setting:{id:"hasBoxShadowBundle",state:"hover"},conditionDisplay:"false"},{label:"Shadow",setting:{id:"hasBoxShadowBundle",state:"active"},conditionDisplay:"false"}]},{label:"Effect",controls:[{label:"Hover",type:"combo",iconName:"polaris-check-hover",fixedValue:"Styled",setting:{id:"enableHoverEffect"},state:"hover",popoverLabel:"Hover",controls:[{type:"group",label:"Background",controls:[{label:"Color",setting:{id:"backgroundColor",state:"hover"}}]},{label:"Icon",type:"group",controls:[{label:"Icon color",setting:{id:"iconColor",state:"hover"}}]},{label:"Shape",type:"group",controls:[{label:"Border",setting:{id:"borderBundle",state:"hover"}},{label:"Corner",setting:{id:"roundedBundle",state:"hover"}},{label:"Shadow",setting:{id:"boxShadowBundle",state:"hover"},controlConfig:{id:"boxShadowBundle",type:"shadow-v2"},options:{updateFields:[{field:"hover.enable",settingId:"hasBoxShadowBundle",state:"hover"}]},controlChangeTrigger:{settings:[{condition:"boxShadowBundle.hover.enable === true",source:["boxShadowBundle","hasBoxShadowBundle"],action:{controlId:"hasBoxShadowBundle",groupType:"style",controlType:"style",state:"hover",newValue:!0}},{condition:"boxShadowBundle.hover.enable === false",source:["boxShadowBundle","hasBoxShadowBundle"],action:{controlId:"hasBoxShadowBundle",groupType:"style",controlType:"style",state:"hover",newValue:!1}}],options:{noRecordHistory:!0}}}]}]},{label:"Active",type:"combo",iconName:"polaris-status-active",fixedValue:"Styled",setting:{id:"enableActiveEffect"},state:"active",popoverLabel:"Active",controls:[{type:"group",label:"Background",controls:[{label:"Color",setting:{id:"backgroundColor",state:"active"}}]},{label:"Icon",type:"group",controls:[{label:"Icon color",setting:{id:"iconColor",state:"active"}}]},{label:"Shape",type:"group",controls:[{label:"Border",setting:{id:"borderBundle",state:"active"}},{label:"Corner",setting:{id:"roundedBundle",state:"active"}},{label:"Shadow",setting:{id:"boxShadowBundle",state:"active"},controlConfig:{id:"boxShadowBundle",type:"shadow-v2"},options:{updateFields:[{field:"active.enable",settingId:"hasBoxShadowBundle",state:"active"}]},controlChangeTrigger:{settings:[{condition:"boxShadowBundle.active.enable === true",source:["boxShadowBundle","hasBoxShadowBundle"],action:{controlId:"hasBoxShadowBundle",groupType:"style",controlType:"style",state:"active",newValue:!0}},{condition:"boxShadowBundle.active.enable === false",source:["boxShadowBundle","hasBoxShadowBundle"],action:{controlId:"hasBoxShadowBundle",groupType:"style",controlType:"style",state:"active",newValue:!1}}],options:{noRecordHistory:!0}}}]}]}]},{label:"Size",controls:[{id:"Width",label:"Width",controlConfig:{id:"width",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,linkWithSetting:{name:"size",field:"width"},displayOptions:[{label:"Fit content",value:"Auto",showValue:!0},{label:"Full",value:"100%",showValue:!0},{label:"Small",value:"100px",showValue:!0},{label:"Medium",value:"200px",showValue:!0},{label:"Large",value:"300px",showValue:!0}]},layout:"horizontal"},{label:"Padding",controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"size",field:"padding"},compoDefaultValue:{desktop:{default:{type:"custom",top:"12px",bottom:"12px",left:"32px",right:"32px"}}}}}]},{label:"Shape",conditionDisplay:'pageType != "POST_PURCHASE"',controls:[{label:"Border",setting:{id:"border",state:"normal"}},{label:"Corner",setting:{id:"rounded",state:"normal"}},{label:"Shadow",setting:{id:"boxShadow",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadow",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadow.normal.enable === true",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!0}},{condition:"boxShadow.normal.enable === false",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{label:"Display condition",conditionDisplay:"enableDisplayCondition == true",controls:[{label:"Default item",setting:{id:"hasPreSelectItem"}},{layout:"vertical",setting:{id:"selectItemDefault"},conditionDisplay:"hasPreSelectItem == true"},{label:"Compare price",setting:{id:"useProductCompareAtPrice"}},{label:"Display item",setting:{id:"hideNoDiscountItem"}}]},{controls:[{label:"Align",conditionEnable:'!(parseInt(size.width) >= 100 && size.width?.includes("%"))',setting:{id:"align"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"}}]}];export{SettingUIV2 as default};

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 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 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:y,style:b,styles:$,pageContext:v}=f,{wrapStyle:_,restStyle:h}=t(b),{outOfStockButtonLabel:j,unavailableButtonLabel:S,variantSelectionRequiredMessage:k,successMessage:E,errorMessage:q}=u({setting:g,pageContext:v,builderProps:y}),{urlData:A}=p("",g?.actionEffect==="open-cart-drawer"?{link:"/cart",target:"_self"}:g?.customURL),B=a(o({styles:$,setting:g,successMessage:E,errorMessage:q})),P=()=>m({...f,style:h}),G=()=>d({...f,style:h,label:j}),w=()=>n(e,`<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 s`
     ${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-data='${JSON.stringify(B).replaceAll("'","&#039;")}'
+      gp-label-out-of-stock="${j}"
+      gp-label-unavailable="${S}"
       data-variant-selection-required-message="${k}"
+      gp-enable-third-partycart="{{shop.metafields.GEMPAGES.enableThirdPartyCart}}"
     >
-      ${E()}
-      ${A()}
+      <script gp-data type="application/json">${JSON.stringify(B).replaceAll("'","&#039;")}</script>
+      ${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 s}from"../../../settings/product-button/configs/translate.js";let getButtonDynamicSourceLocales=({setting:a,builderProps:r,pageContext:o})=>{let i={pageContext:o,uid:r?.uid},u=(a,r)=>{let o=e({...i,settingId:t({id:s[a]?.id}),val:r??""});return o};return{outOfStockButtonLabel:u("outOfStockLabel",a?.outOfStockLabel),unavailableButtonLabel:u("unavailableLabel","Unavailable"),variantSelectionRequiredMessage:u("variantSelectionRequiredMessage",a?.variantSelectionRequiredMessage),successMessage:u("successMessage",a?.successMessage),errorMessage:u("errorMessage",a?.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,useCurrentVariantInStock as m}from"@gem-sdk/core";import{useRef as b,useEffect as d,useCallback as f}from"react";import{addToCartTracking as p}from"../../../helpers/tracking.js";import{useDispatchAfterSubmitEvent as v}from"./useDispatchAfterSubmitEvent.js";import{useCartMessage as g}from"./useCartMessage.js";import{useCartOperations as I}from"./useCartOperations.js";let useBtnAddToCart=({styles:k,setting:D,builderProps:S})=>{let E=b(null),{isEditMode:h,isPreviewSharePageMode:j}=e(),y=t(),{currency:C}=r(),{quantity:A}=i(),M=s(),O=n(),{hasPreSelected:w}=o(),B=a(e=>e.setStickyVisible),T=u(e=>e.updateIsSubmit),q=v(S?.uid),{showMessage:x,notiComponent:L}=g(k,D),{handleSuccess:U,handleError:V,cartId:z}=I(D,x,q),{isMutating:F,trigger:G}=l({onSuccess:U,onError:V}),{isMutating:H,trigger:J}=c({onSuccess:U,onError:V});d(()=>{let e=new IntersectionObserver(e=>{let t=e[0];B(t?.isIntersecting)},{threshold:.1}),t=E.current;return E.current&&e.observe(E.current),()=>{t&&e.unobserve(t)}},[B]);let K=f(()=>{if(!O?.baseID||!A||!y?.baseID||void 0!==w&&!w||h||j)return;let e=M?.some(e=>e.required&&!e.value);if(T(!0),e)return;let t=M?.filter(e=>!!e.value)?.map(e=>({key:e.key,value:e.value}));p({quantity:A,currency:C,id:y?.baseID,name:y?.title,brand:y?.vendor,sku:O.sku,price:O?.price,variant:O.title});let r={quantity:A,attributes:t,variantId:O.baseID};D?.actionEffect!=="buy-now"&&z?J({cartId:z,lines:[r]}):G({items:[r]})},[h,j,z,C,A,M,w,y?.title,y?.vendor,y?.baseID,O?.sku,O?.price,O?.title,O?.baseID,D?.actionEffect,G,J,T]),N=m(),P=F||H,Q=O?D?.outOfStockLabel:"Unavailable";return{addToCartRef:E,isLoading:P,isInStock:N,notiComponent:L,outOfStockLabel:Q,addToCart:K}};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,23 @@
-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 c,createAttr as l,createStateOrContext as m,LiquidIf as u,Liquid as $,LiquidUnless as g,If as v}from"@gem-sdk/system";import{getClasses as f,getButtonClasses as w,getClassPreBuilt as h}from"./common/classes.js";import{getTextStyle as x,getButtonStyle as y,getStaticCss as j}from"./common/styles.js";import{ICON_SVG as b}from"./common/helpers.js";import{ProductDescription as C}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(w({setting:S})),_=d({"gp-show-more-text":!0}),q=d({"gp-show-more-icon gp-ml-1":!0}),H=c({...x({setting:S,renderMaxHeight:!0}),...e("line-clamp",t(S?.lineClamp,S?.hasLineClamp))}),N=d(h()),O=c(y({setting:S})),R=l({"data-id":`${L?.uid}`}),z=l({"data-gp-text":""}),{textDescriptionCss:B,gpDescriptionCss:F}=j(),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:C?.viewMoreText?.id}),pageContext:P}),U=p({val:E,uid:L?.uid,settingId:a({id:C?.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}"
       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}">
+      <script gp-data type="application/json">${i(W).replaceAll("'","&#039;")}</script>
+      <style>${B}${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:"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 f,getProductTagClass as g}from"./common/classes.js";import{getRootClass as m,getWrapperTextStyle as v,getContainerStyle as y}from"./common/styles.js";import{ProductTag as $}from"../../settings/product-discount-tag/configs/translate.js";let ProductTag=({setting:x,styles:P,builderProps:S,advanced:V,pageContext:_})=>{let{customContent:h}=x??{},j=x?.moneyWithCurrentFormat?"money_with_currency":"money",C=$?.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(y(P)),w=c(u(P)),E=c(f()),N=c(g(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(C):C}
+      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% '",`| ${j} | 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 | ${j} %}
+           {% assign pricePercentage = prefixVal | append: ' ' | append: priceSaveMoney | append: ' ' | append: suffixVal %}`,`{% assign priceSaveMoney = 0 | ${j} %}
            {% 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")}"
       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}})}
+      <script gp-data type="application/json">{"setting":${JSON.stringify(x).replaceAll("'","&#039;")}, "id": "${S?.uid}", "locale": "{{shop.locale}}", "currency": "{{shop.currency}}", "moneyFormat": "{{ ${x?.moneyWithCurrentFormat?"shop.money_with_currency_format":"shop.money_format"} | replace: '"', '\\"' | escape }}"}'</script>
+      <div class="${E}" style="${q}">
+        <div class="${w}" style="${T}">
+          ${p({styles:P,id:`p-tag-${S?.uid}`,setting:{...x,text:"{{ pricePercentage }}",excludeFlex:!0,isForceValue:!0}})}
         </div>
       </div>
 
   </gp-product-tag>
-  ${T()}
+  ${k()}
   `};export{ProductTag as default};

package/dist/esm/product/components/product-discount-tag/hooks/useGpDiscountTag.js

@@ -1 +1 @@
-import{useMoneyFormat as e,useEditorMode as t,useProduct as r,useCurrentVariant as n,useQuantity as o,useFormatMoney as u,useProductBundleDiscount as i,formatMoney as p}from"@gem-sdk/core";import{useMemo as c}from"react";import{applyBundleDiscountAmount as s}from"../../../helpers/product-bundle.js";import{DiscountType as a}from"../../constants/product-bundle.js";let useGpDiscountTag=m=>{let{setting:l,...d}=m,{customContent:g}=l??{},f=d["bundle-item"],{moneyFormat:b}=e(),h=t(),D=r(),$=n(),{quantity:j,hasUpdatePrice:y}=o(),G=c(()=>y&&g?.unit!=="percentage"?j??1:1,[y,g?.unit,j]),P=$?.price??0,T=$?.salePrice??0,k=(T-P)*G,x=u(k<0?0:k,l?.moneyWithCurrentFormat||!1),C=c(()=>{if(!T&&0!==T||!P&&0!==P)return`${g?.unit==="percentage"?"0%":x}`;if(g?.unit==="percentage"){let e=Math.round(k/(T/100));return`${e<0?0:e}%`}return`${x}`},[g?.unit,x,P,k,T]),{useProductCompareAtPrice:F}=i(),{discountPercentAmount:I}=s({currentVariant:$,bundleItem:f,options:{moneyFormat:b,useProductCompareAtPrice:F}}),M=c(()=>{if(!f)return 0;let{discountPercentAmount:e,discountAmount:t}=s({currentVariant:$,bundleItem:f,options:{moneyFormat:b,useProductCompareAtPrice:F}}),{discountType:r}=f,{unit:n}=g||{};return r!==a.NoDiscount||F?"percentage"===n?`${e}%`:t:"percentage"===n?"0%":p("0",b)},[f,$,b,F,g]),N=c(()=>f?M:C,[M,f,C]),W=D?.baseID?.replace("gid://shopify/Product/",""),q=c(()=>{let e=f?I<=0:k<=0;return"edit"===h&&e},[f,I,h,k]);return{mode:h,product:D,salePrice:T,priceSave:k,currentProductId:W,unitCustomDisplay:N,shouldPlaceholderNoDiscount:q}};export{useGpDiscountTag};
+import{useMoneyFormat as e,useEditorMode as t,useProduct as r,useCurrentVariant as n,useQuantity as o,convertDecimalToNumber as u,useFormatMoney as i,useProductBundleDiscount as p,formatMoney as c}from"@gem-sdk/core";import{useMemo as s}from"react";import{applyBundleDiscountAmount as a}from"../../../helpers/product-bundle.js";import{DiscountType as m}from"../../constants/product-bundle.js";let useGpDiscountTag=l=>{let{setting:d,...g}=l,{customContent:f}=d??{},b=g["bundle-item"],{moneyFormat:h}=e(),D=t(),$=r(),j=n(),{quantity:y,hasUpdatePrice:G}=o(),P=s(()=>G&&f?.unit!=="percentage"?y??1:1,[G,f?.unit,y]),T=u(j?.price)??0,k=u(j?.salePrice)??0,x=(k-T)*P,C=i(x<0?0:x,d?.moneyWithCurrentFormat||!1),F=s(()=>{if(!k&&0!==k||!T&&0!==T)return`${f?.unit==="percentage"?"0%":C}`;if(f?.unit==="percentage"){let e=Math.round(x/(k/100));return`${e<0?0:e}%`}return`${C}`},[f?.unit,C,T,x,k]),{useProductCompareAtPrice:I}=p(),{discountPercentAmount:M}=a({currentVariant:j,bundleItem:b,options:{moneyFormat:h,useProductCompareAtPrice:I}}),N=s(()=>{if(!b)return 0;let{discountPercentAmount:e,discountAmount:t}=a({currentVariant:j,bundleItem:b,options:{moneyFormat:h,useProductCompareAtPrice:I}}),{discountType:r}=b,{unit:n}=f||{};return r!==m.NoDiscount||I?"percentage"===n?`${e}%`:t:"percentage"===n?"0%":c("0",h)},[b,j,h,I,f]),W=s(()=>b?N:F,[N,b,F]),q=$?.baseID?.replace("gid://shopify/Product/",""),v=s(()=>{let e=b?M<=0:x<=0;return"edit"===D&&e},[b,M,D,x]);return{mode:D,product:$,salePrice:k,priceSave:x,currentProductId:q,unitCustomDisplay:W,shouldPlaceholderNoDiscount:v}};export{useGpDiscountTag};

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 t,RenderChildren as s}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 y,LiquidIf as $,createClass as h,If as j,Liquid as S}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=`
     {
       "id":${JSON.stringify(D?.uid)},
       "pageContext": ${JSON.stringify(O)},
       "setting":${JSON.stringify(C)},
       "styles":${JSON.stringify(G)},
-      "productUrl":{{product.url | json | escape}},
-      "product":{{product | json | escape}},
-      "collectionUrl": {{ collection.url | json | escape }},
-      "collection": {{ collection | json | escape}}
+      "productUrl":{{product.url | json }},
+      "product":{{product | json }},
+      "collectionUrl": {{ collection.url | json }},
+      "collection": {{ collection | json }}
     }
-  `,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}})}`}))}
+  `,B=y({"section-id":"{{section.id}}","data-id":`${D?.uid}`}),{isOnlyFeatureAllDevices:U,isRenderGalleryGrid:k}=i(N?.position,C?.type),q=k?{}:y({"data-only-image":$("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`
+      ${t({uid:D?.uid||"",customProps:z?.[0].customProps},z?.map(o=>{if(o)return e`${s({...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`
       <div
         class="${J}"
         style="${F(M)}"
         ${{...q}}
       >
-        ${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:_}))}
+        ${$("product.media.size > 1",d({builderPropUID:`gp-gallery-${D?.uid}`,...N,enableLazyLoadImage:_}))}
+        ${j(k,m({builderPropUID:D?.uid,wrapperStyle:{...V},children:W(),...N,enableLazyLoadImage:_}))}
       </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(`
+  ${j(K(),$("product.media.size > 1",`<style>${v({settings:N,uid:D?.uid,type:"Liquid"})}</style>`),"")}
+  ${S(`
     {% assign featured_image = product.featured_image %}
-    ${y("variant != null and variant.featured_image != null","{% assign featured_image = variant.featured_image %}")}
+    ${$("variant != null and variant.featured_image != null","{% assign featured_image = variant.featured_image %}")}
   `)}
     <gp-product-images
-      gp-data='${A}'
       ${{...B}}
       style="${{...b}}"
       class="${E}"
     >
+      <script gp-data type="application/json">${A}</script>
       <div
-        class="${y("product.media.size > 1",`${w}`,`${T}`)}"
-        style="${y("product.media.size > 1",F(x),F(L))}"
+        class="${$("product.media.size > 1",`${w}`,`${T}`)}"
+        style="${$("product.media.size > 1",F(x),F(L))}"
       >
         ${l({builderPropUID:`gp-carousel-${D?.uid}`,...N,children:W(),enableLazyLoadImage:_})}
-        ${S(!U,H())}
+        ${j(!U,H())}
       </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 ${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>`)}
   `};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};