npm - @gem-sdk/components - Versions diffs - 17.0.0-dev.113 → 17.0.0-dev.114 - Mend

@gem-sdk/components 17.0.0-dev.113 → 17.0.0-dev.114

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (81) hide show

package/dist/cjs/accordion/components/Accordion.liquid.js CHANGED Viewed

@@ -1,8 +1,7 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../helpers.js"),s=require("@gem-sdk/system"),r=require("../common/helpers.js"),a=require("../common/styles.js"),i=require("../common/classes.js"),l=require("../settings/configs/translate.js");exports.default=({rawChildren:c,setting:d,styles:n,builderProps:o,pageContext:p,advanced:g,style:u,builderAttrs:m})=>{let{align:y}=n??{},{childItem:S,activeKey:f}=d??{},{uidState:v,settingState:C,stylesState:$,accordions:j}=r.getDataState({setting:d,styles:n,builderProps:o},c),h=s.createStateOrContext({uid:v,setting:C,styles:{...$}}),q=s.createClass(i.getContainerClasses(g?.cssClass)),x=s.createStyle({...a.getContainerStyles(u,n)}),A=s.createAttr({...m,"data-id":o?.uid??""}),I=s.createStyle({...e.makeStyleResponsive("jc",y)}),P=s.createClass({"gp-flex":!0}),R=s.createClass(i.extendClasses());return e.template`
-    <gp-accordion ${A} class="${q}" style="${x}"
-      gp-data='${JSON.stringify(h).replaceAll("'","&#039;")}'
-        >
-        <div class=" ${R}"></div>
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../helpers.js"),s=require("@gem-sdk/system"),r=require("../common/helpers.js"),a=require("../common/styles.js"),i=require("../common/classes.js"),l=require("../settings/configs/translate.js");exports.default=({rawChildren:c,setting:d,styles:n,builderProps:o,pageContext:p,advanced:g,style:u,builderAttrs:y})=>{let{align:m}=n??{},{childItem:S,activeKey:f}=d??{},{uidState:v,settingState:C,stylesState:$,accordions:j}=r.getDataState({setting:d,styles:n,builderProps:o},c),h=s.createStateOrContext({uid:v,setting:C,styles:{...$}}),q=s.createClass(i.getContainerClasses(g?.cssClass)),x=s.createStyle({...a.getContainerStyles(u,n)}),A=s.createAttr({...y,"data-id":o?.uid??""}),I=s.createStyle({...e.makeStyleResponsive("jc",m)}),P=s.createClass({"gp-flex":!0}),R=s.createClass(i.extendClasses());return e.template`
+    <gp-accordion ${A} class="${q}" style="${x}">
+      <script gp-data type="application/json">${JSON.stringify(h).replaceAll("'","&#039;")}</script>
+      <div class=" ${R}"></div>
       ${e.WrapRenderChildren({uid:o?.uid??"",customProps:c?.[0].customProps},c?.map((s,r)=>{if(s){let a=t.getDynamicSourceLocales({val:S?.[r],uid:o?.uid,settingId:t.createSettingId({id:l.Accordion?.childItem?.id,index:r}),pageContext:p??{},isCapitalize:d?.titleTypo?.attrs?.transform==="capitalize"});return e.template`
           <div class="${P}" style="${I}">
             ${e.RenderChildren({...s,index:r,title:a,accordions:j,parentSetting:d,parentStyle:n,parentUid:o?.uid,childrenIcon:d?.childConfig?.[r],activeKey:f})}

package/dist/cjs/button/components/Button.liquid.js CHANGED Viewed

@@ -1,30 +1,30 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("@gem-sdk/system"),s=require("../common/attrs.js"),a=require("../common/styles.js"),r=require("../common/classes.js"),l=require("../../helpers.js"),i=require("./ButtonIcon.liquid.js"),n=require("./ButtonLabel.liquid.js"),o=require("./ButtonLoadingIndicator.liquid.js"),u=require("../common/helpers.js");exports.default=c=>{let{advanced:g,className:d,nodePrice:p,customAttrs:y,styles:$={},setting:f={},builderProps:q,wrapClassName:S="",translateSetting:C,isForceValue:L,pageContext:b}=c,{iconSvg:m,btnLink:v,htmlType:B,disabled:I,enableBtnLink:j,shouldClearSpace:k,disabledLoading:h=!0}=f,{enableTextStyle:x=!0}=$,{customCss:E,wrapStyle:T,restStyle:A,dataState:D,dataIdAttr:P,isShowIcon:_,isScrollToElement:M,getArialLabel:O,getLabelToDisplay:W,checkIsShowLabel:G,checkIsEditableLabel:H}=u.getData(c),{HTMLTag:R,urlData:N,shouldRenderLink:U}=u.getInsertLinkData({enableBtnLink:j,htmlType:B,setting:v,defaultTag:"button",isLiquid:!0}),V=t.createStyle({...a.getButtonStyles($,f?.enableHoverEffect)}),w=t.createStyle({...a.getTypoStyles($)}),z=t.createStyle({...a.getTypoStyles($),...a.getButtonIconStyles($,f)}),F=t.createStyle({...a.getButtonWrapperStyles(A,$)}),J=t.createClass({...r.getButtonClasses({styles:$,className:d,shouldRenderLink:U,uid:q?.uid,advanced:g})}),K=t.createClass({...r.getButtonIconClasses(W({isLiquid:!0,translateSetting:C,isForceValue:L,pageContext:b??{}}),k,x)}),Q=t.createClass({...r.getButtonLabelClasses($,H({isLiquid:!0}))}),X=t.createClass({...r.getButtonWrapperClasses(S,d,g?.cssClass)}),Y=t.createClass({...r.getButtonContentWrapperClasses(f)}),Z=t.createClass({...r.getButtonContainerClasses()}),ee=t.createAttr({...s.getButtonAttributes({disabled:I,dataState:D,dataId:P,arialLabel:O({isLiquid:!0})})}),et=t.createStateOrContext({btnLink:f?.btnLink});return t.Liquid(e.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("@gem-sdk/system"),s=require("../common/attrs.js"),a=require("../common/styles.js"),r=require("../common/classes.js"),l=require("../../helpers.js"),i=require("./ButtonIcon.liquid.js"),n=require("./ButtonLabel.liquid.js"),o=require("./ButtonLoadingIndicator.liquid.js"),u=require("../common/helpers.js");exports.default=c=>{let{advanced:g,className:d,nodePrice:p,customAttrs:y,styles:$={},setting:f={},builderProps:q,wrapClassName:S="",translateSetting:C,isForceValue:L,pageContext:b}=c,{iconSvg:m,btnLink:v,htmlType:B,disabled:I,enableBtnLink:j,shouldClearSpace:k,disabledLoading:h=!0}=f,{enableTextStyle:x=!0}=$,{customCss:A,wrapStyle:E,restStyle:T,dataState:D,dataIdAttr:O,isShowIcon:P,isScrollToElement:_,getArialLabel:M,getLabelToDisplay:W,checkIsShowLabel:G,checkIsEditableLabel:H}=u.getData(c),{HTMLTag:N,urlData:R,shouldRenderLink:J}=u.getInsertLinkData({enableBtnLink:j,htmlType:B,setting:v,defaultTag:"button",isLiquid:!0}),U=t.createStyle({...a.getButtonStyles($,f?.enableHoverEffect)}),V=t.createStyle({...a.getTypoStyles($)}),w=t.createStyle({...a.getTypoStyles($),...a.getButtonIconStyles($,f)}),z=t.createStyle({...a.getButtonWrapperStyles(T,$)}),F=t.createClass({...r.getButtonClasses({styles:$,className:d,shouldRenderLink:J,uid:q?.uid,advanced:g})}),K=t.createClass({...r.getButtonIconClasses(W({isLiquid:!0,translateSetting:C,isForceValue:L,pageContext:b??{}}),k,x)}),Q=t.createClass({...r.getButtonLabelClasses($,H({isLiquid:!0}))}),X=t.createClass({...r.getButtonWrapperClasses(S,d,g?.cssClass)}),Y=t.createClass({...r.getButtonContentWrapperClasses(f)}),Z=t.createClass({...r.getButtonContainerClasses()}),ee=t.createAttr({...s.getButtonAttributes({disabled:I,dataState:D,dataId:O,arialLabel:M({isLiquid:!0})})}),et=t.createStateOrContext({btnLink:f?.btnLink});return t.Liquid(e.template`
     <gp-button
-      gp-data='${e.dataStringify(et)}'
-      style="${{...T}}"
+      style="${{...E}}"
       class="${Z}"
     >
-      <div style="${F}" class="${X}">
-        <style>${E}</style>
-        ${t.If(M,`<a
+      <script gp-data type="application/json">${JSON.stringify(et).replaceAll("'","&#039;")}</script>
+      <div style="${z}" class="${X}">
+        <style>${A}</style>
+        ${t.If(_,`<a
             class="gp-trigger-button-link gp-hidden"
-            href=${N.href}
-            target=${N.target}
+            href=${R.href}
+            target=${R.target}
           ></a>`)}
-        <${R}
+        <${N}
           ${{...ee}}
           ${{...y}}
-          ${{...N}}
-          style="${V}"
-          class="${J}"
+          ${{...R}}
+          style="${U}"
+          class="${F}"
         >
         ${t.If(!h,o.default(),"")}
         <div class="${Y}">
-          ${t.If(_,i.default({iconSvg:m??"",styles:z,classes:K}))}
-          ${t.If(x&&G({isLiquid:!0,translateSetting:C,isForceValue:L,pageContext:b??{}}),n.default({label:W({isLiquid:!0,translateSetting:C,isForceValue:L,pageContext:b??{}}),styles:w,classes:Q}))}
+          ${t.If(P,i.default({iconSvg:m??"",styles:w,classes:K}))}
+          ${t.If(x&&G({isLiquid:!0,translateSetting:C,isForceValue:L,pageContext:b??{}}),n.default({label:W({isLiquid:!0,translateSetting:C,isForceValue:L,pageContext:b??{}}),styles:V,classes:Q}))}
         </div>
         ${t.If(!!p,p?.toString()??"","")}
-        </${R}>
+        </${N}>
       </div>
       ${t.If(e.isLocalEnv,`<script ${l.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-button-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${l.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-button-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
     </gp-button>

package/dist/cjs/carousel/components/root/Carousel.liquid.js CHANGED Viewed

@@ -1,7 +1,8 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),r=require("../arrow/Arrow.liquid.js"),t=require("../dot/Dots.liquid.js"),s=require("../arrow/common/helpers.js"),o=require("./common/helpers.js"),a=require("./common/classes.js"),l=require("./common/styles.js"),i=require("./common/attrs.js"),d=require("../../../helpers.js");exports.default=n=>{let{children:u,builderAttrs:c,builderProps:p,styles:g,isHiddenArrowWhenDisabled:$=!0,hiddenDotWhenOnlyOne:m,rootId:v,rawChildren:S,conditionAppendJs:h}=n,w=s.mappingNavigationCarousel(n.setting),f={...n,setting:w},{arrowButtonSize:y,arrowBackgroundColor:C,arrowGapToEachSide:q="16",roundedArrow:j,arrowIconSize:k,arrowCustomColor:A,arrowBorder:D,arrowShadow:E,showWhenHover:I}=w??{},{uniqueComponentId:P,loopConfig:b,arrowShowConfig:R,stateData:_}=o.getData(f),{rootClassRender:x,wrapperClassRender:G,wrapperInnerClass:O,sliderClass:T}=a.getClass(f),{rootStyleRender:W,wrapperStyleRender:z,wrapperInnerStyle:B,sliderStyle:L}=l.getStyle(f),{rootAttrRender:H,sliderAttr:M}=i.getAttr(f),N=()=>e.RenderIf(e.isLocalEnv,`<script ${d.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-carousel-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${d.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-carousel-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`),U=e=>r.default({uid:p?.uid,componentId:P,custom:w?.arrowCustom??"",showArrow:R,arrowButtonSize:y||{},arrowIconSize:k||{},arrowBackgroundColor:C??"",arrowCustomColor:A,gapToEachSize:q,showWhenHover:I,arrowBorder:D||{},arrowCorner:j||{},arrowShadow:E||{},left:"next"!==e,vertical:w?.vertical,isHiddenWhenDisabled:$,rootId:v});return e.template`
-    <gp-carousel gp-data='${_}' ${H} style="${W}" class="${x}">
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),r=require("../arrow/Arrow.liquid.js"),t=require("../dot/Dots.liquid.js"),s=require("../arrow/common/helpers.js"),o=require("./common/helpers.js"),a=require("./common/classes.js"),i=require("./common/styles.js"),l=require("./common/attrs.js"),d=require("../../../helpers.js");exports.default=n=>{let{children:c,builderAttrs:u,builderProps:p,styles:g,isHiddenArrowWhenDisabled:$=!0,hiddenDotWhenOnlyOne:m,rootId:v,rawChildren:S,conditionAppendJs:h}=n,w=s.mappingNavigationCarousel(n.setting),y={...n,setting:w},{arrowButtonSize:f,arrowBackgroundColor:C,arrowGapToEachSide:j="16",roundedArrow:q,arrowIconSize:k,arrowCustomColor:A,arrowBorder:D,arrowShadow:E,showWhenHover:I}=w??{},{uniqueComponentId:P,loopConfig:b,arrowShowConfig:R,stateData:_}=o.getData(y),{rootClassRender:x,wrapperClassRender:G,wrapperInnerClass:O,sliderClass:T}=a.getClass(y),{rootStyleRender:W,wrapperStyleRender:z,wrapperInnerStyle:B,sliderStyle:L}=i.getStyle(y),{rootAttrRender:H,sliderAttr:M}=l.getAttr(y),N=()=>e.RenderIf(e.isLocalEnv,`<script ${d.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-carousel-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${d.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-carousel-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`),U=e=>r.default({uid:p?.uid,componentId:P,custom:w?.arrowCustom??"",showArrow:R,arrowButtonSize:f||{},arrowIconSize:k||{},arrowBackgroundColor:C??"",arrowCustomColor:A,gapToEachSize:j,showWhenHover:I,arrowBorder:D||{},arrowCorner:q||{},arrowShadow:E||{},left:"next"!==e,vertical:w?.vertical,isHiddenWhenDisabled:$,rootId:v});return e.template`
+    <gp-carousel ${H} style="${W}" class="${x}">
+      <script gp-data type="application/json">${_}</script>
       <div
-        ${c}
+        ${u}
         class="${G}"
         style="${z}"
       >
@@ -9,7 +10,7 @@
           ${U("prev")}
           <div ${M} class="${T}" style="${L}">
             ${e.template`
-    ${S?.length?e.WrapRenderChildren({uid:p?.uid??"",customProps:S[0]?.customProps},S.map((r,t)=>{if(r)return e.template`${e.RenderChildren({...r,index:t,parentSettings:w,parentStyle:g,background:w?.background,parentUid:p?.uid})}`})):u??`<div>${d.getStaticLocale("Carousel","no_slider")}</div>`}`}
+    ${S?.length?e.WrapRenderChildren({uid:p?.uid??"",customProps:S[0]?.customProps},S.map((r,t)=>{if(r)return e.template`${e.RenderChildren({...r,index:t,parentSettings:w,parentStyle:g,background:w?.background,parentUid:p?.uid})}`})):c??`<div>${d.getStaticLocale("Carousel","no_slider")}</div>`}`}
           </div>
           ${U("next")}
         </div>

package/dist/cjs/carousel-v3/components/root/Carousel.liquid.js CHANGED Viewed

@@ -1,7 +1,8 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),r=require("../arrow/Arrow.liquid.js"),t=require("../dot/Dots.liquid.js"),s=require("../arrow/common/helpers.js"),o=require("./common/helpers.js"),a=require("./common/classes.js"),i=require("./common/styles.js"),l=require("./common/attrs.js"),d=require("../../../helpers.js");exports.default=n=>{let{children:u,builderAttrs:c,builderProps:p,styles:v,isHiddenArrowWhenDisabled:g=!0,hiddenDotWhenOnlyOne:$,rootId:m,rawChildren:S,conditionAppendJs:h,productBadgeLiquid:w}=n,f=s.mappingNavigationCarousel(n.setting),y={...n,setting:f},{arrowButtonSize:C,arrowBackgroundColor:q,arrowGapToEachSide:j="16",roundedArrow:k,arrowIconSize:P,arrowCustomColor:A,arrowBorder:D,arrowShadow:E,showWhenHover:I}=f??{},{uniqueComponentId:b,loopConfig:R,arrowShowConfig:_,stateData:x}=o.getData(y),{rootClassRender:G,wrapperClassRender:O,wrapperInnerClass:T,sliderClass:W}=a.getClass(y),{sliderWrapperStyle:z,rootStyleRender:B,wrapperStyleRender:L,wrapperInnerStyle:H}=i.getStyle(y),{rootAttrRender:M,sliderAttr:N}=l.getAttr(y),U=()=>e.RenderIf(e.isLocalEnv,`<script ${d.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-carousel-v3-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${d.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-carousel-v3-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`),V=e=>r.default({uid:p?.uid,componentId:b,custom:f?.arrowCustom??"",showArrow:_,arrowButtonSize:C||{},arrowIconSize:P||{},arrowBackgroundColor:q??"",arrowCustomColor:A,gapToEachSize:j,showWhenHover:I,arrowBorder:D||{},arrowCorner:k||{},arrowShadow:E||{},left:"next"!==e,onClick:e=>{e.stopPropagation()},vertical:f?.vertical,isHiddenWhenDisabled:g,rootId:m});return e.template`
-    <gp-carousel-v3 gp-data='${x}' ${M} style="${B}" class="${G}">
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),r=require("../arrow/Arrow.liquid.js"),t=require("../dot/Dots.liquid.js"),s=require("../arrow/common/helpers.js"),o=require("./common/helpers.js"),a=require("./common/classes.js"),i=require("./common/styles.js"),l=require("./common/attrs.js"),d=require("../../../helpers.js");exports.default=n=>{let{children:c,builderAttrs:p,builderProps:u,styles:v,isHiddenArrowWhenDisabled:g=!0,hiddenDotWhenOnlyOne:$,rootId:m,rawChildren:S,conditionAppendJs:h,productBadgeLiquid:w}=n,y=s.mappingNavigationCarousel(n.setting),f={...n,setting:y},{arrowButtonSize:C,arrowBackgroundColor:j,arrowGapToEachSide:q="16",roundedArrow:k,arrowIconSize:P,arrowCustomColor:A,arrowBorder:D,arrowShadow:E,showWhenHover:I}=y??{},{uniqueComponentId:b,loopConfig:R,arrowShowConfig:_,stateData:x}=o.getData(f),{rootClassRender:G,wrapperClassRender:O,wrapperInnerClass:T,sliderClass:W}=a.getClass(f),{sliderWrapperStyle:z,rootStyleRender:B,wrapperStyleRender:L,wrapperInnerStyle:H}=i.getStyle(f),{rootAttrRender:M,sliderAttr:N}=l.getAttr(f),U=()=>e.RenderIf(e.isLocalEnv,`<script ${d.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-carousel-v3-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${d.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-carousel-v3-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`),V=e=>r.default({uid:u?.uid,componentId:b,custom:y?.arrowCustom??"",showArrow:_,arrowButtonSize:C||{},arrowIconSize:P||{},arrowBackgroundColor:j??"",arrowCustomColor:A,gapToEachSize:q,showWhenHover:I,arrowBorder:D||{},arrowCorner:k||{},arrowShadow:E||{},left:"next"!==e,onClick:e=>{e.stopPropagation()},vertical:y?.vertical,isHiddenWhenDisabled:g,rootId:m});return e.template`
+    <gp-carousel-v3 ${M} style="${B}" class="${G}">
+      <script gp-data type="application/json">${x}</script>
       <div
-        ${c}
+        ${p}
         class="${O}"
         style="${L}"
       >
@@ -11,12 +12,12 @@
           <div ${N} style="${z}">
             <div class="${W}">
               ${e.template`
-    ${S?.length?e.WrapRenderChildren({uid:p?.uid??"",customProps:S[0]?.customProps},S.map((r,t)=>{if(r)return e.template`${e.RenderChildren({...r,index:t,parentSettings:f,parentStyle:v,background:f?.background,parentUid:p?.uid})}`})):u??`<div>${d.getStaticLocale("Carousel","no_slider")}</div>`}`}
+    ${S?.length?e.WrapRenderChildren({uid:u?.uid??"",customProps:S[0]?.customProps},S.map((r,t)=>{if(r)return e.template`${e.RenderChildren({...r,index:t,parentSettings:y,parentStyle:v,background:y?.background,parentUid:u?.uid})}`})):c??`<div>${d.getStaticLocale("Carousel","no_slider")}</div>`}`}
             </div>
           </div>
           ${V("next")}
         </div>
-        ${t.default({loop:R,showDots:f?.dot,dotStyle:f?.dotStyle,dotGapToCarousel:f?.dotGapToCarousel,vertical:f?.vertical,uniqueComponentId:b,hiddenWhenOnlyOne:$})}
+        ${t.default({loop:R,showDots:y?.dot,dotStyle:y?.dotStyle,dotGapToCarousel:y?.dotGapToCarousel,vertical:y?.vertical,uniqueComponentId:b,hiddenWhenOnlyOne:$})}
       </div>
     </gp-carousel-v3>
     ${h?`{% if ${h} %} ${U()} {% endif %}`:U()}

package/dist/cjs/cart/components/shop-pay-button/ShopPayButton.liquid.js CHANGED Viewed

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),s=require("@gem-sdk/system"),t=require("../../../helpers.js"),r=require("./common/classes.js"),a=require("./common/helpers.js"),u=require("./common/styles.js"),i=require("./icons/DynamicCheckoutBlack.liquid.js"),l=require("./icons/DynamicCheckoutPurple.liquid.js"),o=require("./icons/DynamicCheckoutWhite.liquid.js"),c=require("./icons/ExpressCheckoutBlack.liquid.js"),p=require("./icons/ExpressCheckoutPurple.liquid.js"),n=require("./icons/ExpressCheckoutWhite.liquid.js");exports.default=({style:d,styles:h,setting:y,className:k,builderAttrs:g})=>{let q=a.getSPButton({styles:h,buttons:{DynamicCheckoutBlack:i.default({}),DynamicCheckoutPurple:l.default({}),DynamicCheckoutWhite:o.default({}),ExpressCheckoutBlack:c.default({}),ExpressCheckoutPurple:p.default({}),ExpressCheckoutWhite:n.default({})}}),m=s.createStyle({...u.getButtonWrapperStyles(d,h)}),C=s.createClass({...r.getButtonClasses()}),f=s.createClass({...r.getButtonWrapperClasses(k)}),j=s.createAttr({disabled:!1,"aria-label":"Buy with Shop Pay"}),S=s.createStateOrContext({setting:JSON.stringify(y),shop_url:"{{shop.url}}"});return e.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),s=require("@gem-sdk/system"),t=require("../../../helpers.js"),r=require("./common/classes.js"),a=require("./common/helpers.js"),i=require("./common/styles.js"),u=require("./icons/DynamicCheckoutBlack.liquid.js"),l=require("./icons/DynamicCheckoutPurple.liquid.js"),c=require("./icons/DynamicCheckoutWhite.liquid.js"),o=require("./icons/ExpressCheckoutBlack.liquid.js"),p=require("./icons/ExpressCheckoutPurple.liquid.js"),n=require("./icons/ExpressCheckoutWhite.liquid.js");exports.default=({style:d,styles:h,setting:y,className:k,builderAttrs:g})=>{let q=a.getSPButton({styles:h,buttons:{DynamicCheckoutBlack:u.default({}),DynamicCheckoutPurple:l.default({}),DynamicCheckoutWhite:c.default({}),ExpressCheckoutBlack:o.default({}),ExpressCheckoutPurple:p.default({}),ExpressCheckoutWhite:n.default({})}}),m=s.createStyle({...i.getButtonWrapperStyles(d,h)}),C=s.createClass({...r.getButtonClasses()}),f=s.createClass({...r.getButtonWrapperClasses(k)}),j=s.createAttr({disabled:!1,"aria-label":"Buy with Shop Pay"}),S=s.createStateOrContext({setting:JSON.stringify(y),shop_url:"{{shop.url}}"});return e.template`
     <gp-shop-pay-button
       ${{...g}}
       style="${m}"
       class="${f}"
-      gp-data='${S}'
     >
+      <script gp-data type="application/json">${S}</script>
       <button
         ${{...j}}
         class="${C}"

package/dist/cjs/collection/components/collection-description/CollectionDescription.liquid.js CHANGED Viewed

@@ -1,20 +1,19 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../../helpers.js"),s=require("./common/styles.js"),l=require("@gem-sdk/system"),i=require("./common/classes.js"),a=require("./common/helpers.js");exports.default=({setting:r,advanced:o,builderProps:n,pageContext:c})=>{let p=l.createClass(i.getClassContainerCollectionDes({setting:r})),d=l.createClass(i.getClassButtonViewMore({setting:r})),g=l.createClass(i.getDescriptionClasses({advanced:o})),$=l.createClass(i.getShowMoreIconClasses()),u=l.createClass(i.getShowMoreTextClasses()),C=l.createClass(i.getClassPreBuilt()),m=l.createStyle({...s.getDefaultStyleCollectionDes({setting:r}),...e.makeStyleResponsive("line-clamp",e.makeLineClamp(r?.lineClamp,r?.hasLineClamp))}),v=l.createStyle({...s.getStyleDefaultViewMore(r)}),y=a.getViewLessText({setting:r,builderProps:n,pageContext:c,type:"liquid"}),S=a.getViewMoreText({setting:r,builderProps:n,pageContext:c,type:"liquid"}),w=l.createAttr({"data-id":`${n?.uid}`,"view-more-text":`${c?.isPreviewing?S:`{{${S}}}`}`,"view-less-text":`${c?.isPreviewing?y:`{{${y}}}`}`}),f=l.createAttr({"data-gp-text":""}),{gpDescriptionCss:q,textDescriptionCss:x}=s.getStaticCss(),L=l.createStateOrContext({setting:{lineClamp:r?.lineClamp,hasLineClamp:r?.hasLineClamp,viewMoreText:S,viewLessText:y,enableViewMoreIcon:r?.enableViewMoreIcon},textStyle:m});return l.If(!1,"",l.Liquid(e.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../../helpers.js"),s=require("./common/styles.js"),i=require("@gem-sdk/system"),l=require("./common/classes.js"),a=require("./common/helpers.js");exports.default=({setting:r,advanced:o,builderProps:n,pageContext:c})=>{let p=i.createClass(l.getClassContainerCollectionDes({setting:r})),d=i.createClass(l.getClassButtonViewMore({setting:r})),g=i.createClass(l.getDescriptionClasses({advanced:o})),$=i.createClass(l.getShowMoreIconClasses()),u=i.createClass(l.getShowMoreTextClasses()),C=i.createClass(l.getClassPreBuilt()),m=i.createStyle({...s.getDefaultStyleCollectionDes({setting:r}),...e.makeStyleResponsive("line-clamp",e.makeLineClamp(r?.lineClamp,r?.hasLineClamp))}),v=i.createStyle({...s.getStyleDefaultViewMore(r)}),y=a.getViewLessText({setting:r,builderProps:n,pageContext:c,type:"liquid"}),S=a.getViewMoreText({setting:r,builderProps:n,pageContext:c,type:"liquid"}),w=i.createAttr({"data-id":`${n?.uid}`,"view-more-text":`${c?.isPreviewing?S:`{{${S}}}`}`,"view-less-text":`${c?.isPreviewing?y:`{{${y}}}`}`}),f=i.createAttr({"data-gp-text":""}),{gpDescriptionCss:q,textDescriptionCss:x}=s.getStaticCss(),L=i.createStateOrContext({setting:{lineClamp:r?.lineClamp,hasLineClamp:r?.hasLineClamp,viewMoreText:S,viewLessText:y,enableViewMoreIcon:r?.enableViewMoreIcon},textStyle:m});return i.If(!1,"",i.Liquid(e.template`
     <gp-collection-description
       ${w}
       class="${g}"
-      gp-data='${JSON.stringify(L).replaceAll("'","&#039;")}'
     >
-      <style>${x}</style>
-      <style>${q}</style>
+      <script gp-data type="application/json">${JSON.stringify(L).replaceAll("'","&#039;")}</script>
+      <style>${x}${q}</style>
       <div class="${C}" ></div>
-      ${l.LiquidUnless("collection","<p>Collection not found</p>",e.template`<div ${f} class="${p}" style="${m}">
+      ${i.LiquidUnless("collection","<p>Collection not found</p>",e.template`<div ${f} class="${p}" style="${m}">
           {{collection.description}}
         </div>
-        ${l.LiquidIf("collection.description != blank",e.template`<button type="button" class="${d}" style="${v}">
+        ${i.LiquidIf("collection.description != blank",e.template`<button type="button" class="${d}" style="${v}">
           <span class="${u}">
-            ${l.If(c?.isPreviewing,S?.toString()||"",`{{${S}}}`)}
+            ${i.If(c?.isPreviewing,S?.toString()||"",`{{${S}}}`)}
           </span>
-          ${l.If(r?.enableViewMoreIcon,e.template`<span class="${$}">${a.ICON_SVG}</span>`," ")}
+          ${i.If(r?.enableViewMoreIcon,e.template`<span class="${$}">${a.ICON_SVG}</span>`," ")}
           </button>`)}`)}
     </gp-collection-description>
     ${(()=>{let s=e.isLocalEnv?"{{ 'gp-collection-description-v7-5.js' | asset_url }}":`${e.baseAssetURL}/assets-v2/gp-collection-description-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}`;return`<script ${t.getSettingPreloadData('class="gps-link" delay',"src")}="${s}" defer="defer"></script>`})()}

package/dist/cjs/collection/components/collection-paginator/CollectionPaginator.liquid.js CHANGED Viewed

@@ -1,7 +1,8 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../../helpers.js"),s=require("./common/helpers.js"),l=require("./common/classes.js"),a=require("@gem-sdk/system");exports.default=({setting:r,builderProps:o,pageContext:i})=>{let{typographyPaginator:c,activeColor:p,align:g,typo:d,normalColor:n}=r??{},S=a.createStyle({...e.composeTypographyStyle(d,c)}),C=a.createStyle({normalColorClass:e.getGlobalColorClass("text",n),activeColorClass:e.getGlobalColorClass("text",p),normalColorStyle:e.getGlobalColorCSSProp(n)??"",activeColorStyle:e.getGlobalColorCSSProp(p)??""}),u=a.createClass({...l.customClass("",void 0,r)}),m={...C,customStyle:S,addedClass:u},y=s.renderPaginatorItem({setting:r,builderProps:o,pageContext:i},"liquid"),v=a.createClass({...l.getPaginatorWrapperClass()}),$=a.createClass({...l.getPaginatorClass()}),f=a.createStyle({...e.makeStyleResponsive("ta",g),...m.customStyle}),P=a.createStateOrContext({setting:r,styleSetting:m,uid:o?.uid});return e.template`
-    <gp-collection-paginator gp-data='${JSON.stringify(P).replaceAll("'","&#039;")}' id="${o?.uid}" >
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../../helpers.js"),s=require("./common/helpers.js"),l=require("./common/classes.js"),a=require("@gem-sdk/system");exports.default=({setting:r,builderProps:o,pageContext:i})=>{let{typographyPaginator:c,activeColor:p,align:n,typo:g,normalColor:d}=r??{},S=a.createStyle({...e.composeTypographyStyle(g,c)}),C=a.createStyle({normalColorClass:e.getGlobalColorClass("text",d),activeColorClass:e.getGlobalColorClass("text",p),normalColorStyle:e.getGlobalColorCSSProp(d)??"",activeColorStyle:e.getGlobalColorCSSProp(p)??""}),u=a.createClass({...l.customClass("",void 0,r)}),y={...C,customStyle:S,addedClass:u},m=s.renderPaginatorItem({setting:r,builderProps:o,pageContext:i},"liquid"),v=a.createClass({...l.getPaginatorWrapperClass()}),$=a.createClass({...l.getPaginatorClass()}),f=a.createStyle({...e.makeStyleResponsive("ta",n),...y.customStyle}),P=a.createStateOrContext({setting:r,styleSetting:y,uid:o?.uid});return e.template`
+    <gp-collection-paginator id="${o?.uid}">
+    <script gp-data type="application/json">${JSON.stringify(P).replaceAll("'","&#039;")}</script>
       <div class="${$}" style="${f}">
-        <div class="${v}">${y}</div>
+        <div class="${v}">${m}</div>
       </div>
     </gp-collection-paginator>
     ${e.RenderIf(e.isLocalEnv,`<script ${t.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-collection-paginator-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${t.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-collection-paginator-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}

package/dist/cjs/collection/components/collection-toolbar/CollectionToolbar.liquid.js CHANGED Viewed

@@ -3,8 +3,8 @@
       class="${p}"
       style="${v}"
       id="${i?.uid}"
-      gp-data='${JSON.stringify(_)}'
     >
+      <script gp-data type="application/json">${JSON.stringify(_)}</script>
       <div class="${d}" style="${b}" >
         <div class="${u}">
           <select id="sorting" class="${g}" style="${$}" >

package/dist/cjs/countdown-timer/components/Countdown.liquid.js CHANGED Viewed

@@ -1,30 +1,31 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../text/components/Text.liquid.js"),s=require("../../helpers.js"),a=require("@gem-sdk/system"),r=require("../common/attrs.js"),l=require("../common/styles.js"),i=require("../common/classes.js"),n=require("../settings/configs/translate.js");exports.default=c=>{let{setting:d,styles:o,builderProps:u,advanced:g,pageContext:p}=c,{labelTypo:y,numTypo:$,numTypography:f,labelTypography:m,enableLabelTextStyle:S}=o??{},{weekLabel:C,dayLabel:x,hourLabel:k,minuteLabel:v,secondLabel:I,enableWeek:b,enableDay:q,enableHour:w,enableMinute:L,enableSecond:h,redirectUrl:j,autoHideWhenTimeout:A}=d??{},P=!!j?.link,{urlData:T}=s.getInsertLinkData("",j),D=a.createStateOrContext({...d,...u}),E=a.createStyle({...l.getDateStyle(o)}),F=e=>a.createClass({...i.getDateClasses(e)}),N=a.createClass({...i.getTextFrontClasses(o)}),O=a.createStyle({...l.getTextFrontStyle(o)}),_=a.createStyle({...l.getTextBackStyle(o)}),R=e=>a.createClass({...i.getTextBackClasses(o,e)}),B=a.createAttr({...r.getAttr({uid:u?.uid||""})}),G=a.createAttr({...r.getAttrHref({uid:T.href||""})}),M=a.createStyle({...l.getWrapperStyle(o)}),V=a.createClass({...i.getWrapperClasses(g?.cssClass)}),W=a.createClass({...i.getContentClasses({isLiquid:!0,autoHideWhenTimeout:A})}),H=a.createStyle({...l.getContainStyle(o)}),J=(s,r,l)=>{let i=l&&l in n.Countdown?n.Countdown[l]?.id:void 0;return e.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../text/components/Text.liquid.js"),s=require("../../helpers.js"),a=require("@gem-sdk/system"),r=require("../common/attrs.js"),l=require("../common/styles.js"),i=require("../common/classes.js"),n=require("../settings/configs/translate.js");exports.default=c=>{let{setting:o,styles:d,builderProps:u,advanced:p,pageContext:g}=c,{labelTypo:y,numTypo:$,numTypography:f,labelTypography:m,enableLabelTextStyle:S}=d??{},{weekLabel:C,dayLabel:x,hourLabel:k,minuteLabel:v,secondLabel:I,enableWeek:b,enableDay:j,enableHour:q,enableMinute:w,enableSecond:L,redirectUrl:h,autoHideWhenTimeout:A}=o??{},P=!!h?.link,{urlData:T}=s.getInsertLinkData("",h),D=a.createStateOrContext({...o,...u}),E=a.createStyle({...l.getDateStyle(d)}),F=e=>a.createClass({...i.getDateClasses(e)}),N=a.createClass({...i.getTextFrontClasses(d)}),O=a.createStyle({...l.getTextFrontStyle(d)}),_=a.createStyle({...l.getTextBackStyle(d)}),R=e=>a.createClass({...i.getTextBackClasses(d,e)}),B=a.createAttr({...r.getAttr({uid:u?.uid||""})}),G=a.createAttr({...r.getAttrHref({uid:T.href||""})}),M=a.createStyle({...l.getWrapperStyle(d)}),V=a.createClass({...i.getWrapperClasses(p?.cssClass)}),W=a.createClass({...i.getContentClasses({isLiquid:!0,autoHideWhenTimeout:A})}),H=a.createStyle({...l.getContainStyle(d)}),J=(s,r,l)=>{let i=l&&l in n.Countdown?n.Countdown[l]?.id:void 0;return e.template`
     <div style="${E}" class="${F(r)}">
-    ${t.default({styles:{typography:f,typo:$},setting:{...d,text:"00",excludeFlex:!0,isForceValue:!0},style:O,className:N,builderAttrs:{id:s},builderProps:{...u,uid:u?.uid,uidInteraction:`${u?.uid}-text`}})}
+    ${t.default({styles:{typography:f,typo:$},setting:{...o,text:"00",excludeFlex:!0,isForceValue:!0},style:O,className:N,builderAttrs:{id:s},builderProps:{...u,uid:u?.uid,uidInteraction:`${u?.uid}-text`}})}
     ${a.If(!!S,e.template`
-         ${t.default({styles:{typography:m,typo:y},setting:{...d,text:r,excludeFlex:!0},translateSetting:i,style:_,className:R(r),builderProps:{...u,uid:u?.uid,uidInteraction:`${u?.uid}-text`},pageContext:p})}
+         ${t.default({styles:{typography:m,typo:y},setting:{...o,text:r,excludeFlex:!0},translateSetting:i,style:_,className:R(r),builderProps:{...u,uid:u?.uid,uidInteraction:`${u?.uid}-text`},pageContext:g})}
     `)}
     </div>
     `},U=a.createClass({...i.getLinkClasses()});return e.template`
     <gp-countdown-timer
-        ${{...B}}
-        ${{...G}}
-        class="${V}"
-        style="${M}"
-        gp-data='${JSON.stringify(D).replaceAll("'","&#039;")}'>
-        <div id="section-countdown" class="${W}" style="${H}">
+      ${{...B}}
+      ${{...G}}
+      class="${V}"
+      style="${M}"
+    >
+      <script gp-data type="application/json">${JSON.stringify(D).replaceAll("'","&#039;")}</script>
+      <div id="section-countdown" class="${W}" style="${H}">
         ${a.If(P,`<a
             href="${T.href}"
             target="${T?.target}"
             aria-label="Countdown link"
             class="${U}"
           > </a>`)}
-          ${a.If(b,J("week",C,"weekLabel"))}
-          ${a.If(q,J("day",x,"dayLabel"))}
-          ${a.If(w,J("hour",k,"hourLabel"))}
-          ${a.If(L,J("minute",v,"minuteLabel"))}
-          ${a.If(h,J("second",I,"secondLabel"))}
+        ${a.If(b,J("week",C,"weekLabel"))}
+        ${a.If(j,J("day",x,"dayLabel"))}
+        ${a.If(q,J("hour",k,"hourLabel"))}
+        ${a.If(w,J("minute",v,"minuteLabel"))}
+        ${a.If(L,J("second",I,"secondLabel"))}
       </div>
-     </gp-countdown-timer>
+    </gp-countdown-timer>
     ${e.RenderIf(e.isLocalEnv,`<script ${s.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-countdown-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${s.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-countdown-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
   `};

package/dist/cjs/grid/components/row/Row.liquid.js CHANGED Viewed

@@ -1,5 +1,10 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),r=require("../../../helpers.js"),s=require("../../../video/components/HTML5Embed.liquid.js"),t=require("@gem-sdk/system"),a=require("../../../video/common/helpers.js"),i=require("../../../video/components/LiteYouTubeEmbed.liquid.js"),o=require("./common/attrs.js"),l=require("../../settings/configs/row/translate.js"),d=require("./common/classes.js"),n=require("./common/styles.js"),p=require("./common/helpers.js"),u=require("../../../hero-banner/common/helpers.js");exports.default=c=>{let{styles:g,setting:m,rawChildren:$,builderProps:f}=c,{isSection:y}=m??{},{background:k}=g??{},v=y?"section":"div",q=r.getBackgroundTranslated({background:k,uid:f?.uid,enableTranslate:!!l.Row?.background?.id,pageContext:c.pageContext??{}}),{stateData:b}=p.getData(c,q),{rowStyle:j,backgroundBoxStyle:h,embedVideoStyle:R,sectionStyle:w}=n.getRowStyle({rowProps:c,type:"Liquid",translatedBackground:q}),{rowAttr:I}=o.getAttr(c),{rowClass:C,backgroundBoxClass:S,backgroundBoxInnerClass:V,sectionClass:P,wrapperYoutubeClasses:E,iframeYoutubeClasses:L}=d.getClass(c),T=t.createClass({[C]:!0}),A=()=>{if(!p.checkHasBackgroundVideo(k))return;let r=u.getResponsiveSetting(k||{});if(p.isRenderHtmlVideo(k))return s.default({uid:f?.uid,muted:!0,loop:r.desktop?.loop,controls:!1,autoplay:!0,src:"",title:"Video",className:"gp-relative",style:R});if(p.isRenderYoutubeVideo(k)){let s=r?.desktop?.video??"",t=a.getYoutubeVideoId(s)||"",o=e.hasTranslatedLiquid(s),l=`&loop=false&playlist=${t}&showinfo=0&rel=0&fs=0&enablejsapi=1`;return i.default({uid:f?.uid,id:t,autoplay:!0,title:"Video",translatedVideoUrl:o?s:"",controls:!1,params:l,adNetwork:!1,noCookie:!0,muted:!0,lazy:r?.desktop?.lazyLoad??!0,style:R,wrapperClass:E,iframeClass:L})}},_=e.template`
-    <gp-row gp-data='${b}' ${{...I}} class="${T}" style="${j()}">
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),r=require("../../../helpers.js"),s=require("../../../video/components/HTML5Embed.liquid.js"),t=require("@gem-sdk/system"),a=require("../../../video/common/helpers.js"),i=require("../../../video/components/LiteYouTubeEmbed.liquid.js"),o=require("./common/attrs.js"),l=require("../../settings/configs/row/translate.js"),d=require("./common/classes.js"),n=require("./common/styles.js"),p=require("./common/helpers.js"),u=require("../../../hero-banner/common/helpers.js");exports.default=c=>{let{styles:g,setting:m,rawChildren:$,builderProps:f}=c,{isSection:y}=m??{},{background:k}=g??{},v=y?"section":"div",j=r.getBackgroundTranslated({background:k,uid:f?.uid,enableTranslate:!!l.Row?.background?.id,pageContext:c.pageContext??{}}),{stateData:q}=p.getData(c,j),{rowStyle:b,backgroundBoxStyle:h,embedVideoStyle:R,sectionStyle:w}=n.getRowStyle({rowProps:c,type:"Liquid",translatedBackground:j}),{rowAttr:I}=o.getAttr(c),{rowClass:C,backgroundBoxClass:S,backgroundBoxInnerClass:V,sectionClass:P,wrapperYoutubeClasses:E,iframeYoutubeClasses:L}=d.getClass(c),T=t.createClass({[C]:!0}),A=()=>{if(!p.checkHasBackgroundVideo(k))return;let r=u.getResponsiveSetting(k||{});if(p.isRenderHtmlVideo(k))return s.default({uid:f?.uid,muted:!0,loop:r.desktop?.loop,controls:!1,autoplay:!0,src:"",title:"Video",className:"gp-relative",style:R});if(p.isRenderYoutubeVideo(k)){let s=r?.desktop?.video??"",t=a.getYoutubeVideoId(s)||"",o=e.hasTranslatedLiquid(s),l=`&loop=false&playlist=${t}&showinfo=0&rel=0&fs=0&enablejsapi=1`;return i.default({uid:f?.uid,id:t,autoplay:!0,title:"Video",translatedVideoUrl:o?s:"",controls:!1,params:l,adNetwork:!1,noCookie:!0,muted:!0,lazy:r?.desktop?.lazyLoad??!0,style:R,wrapperClass:E,iframeClass:L})}},_=e.template`
+    <gp-row
+      ${{...I}}
+      class="${T}"
+      style="${b()}"
+    >
+      <script gp-data type="application/json">${q}</script>
       ${t.If(!!A(),e.template`
           <div class="${S}" style="${h}">
             <div class="${V}">${A()}</div>

package/dist/cjs/hero-banner/components/HeroBanner.liquid.js CHANGED Viewed

@@ -1,11 +1,11 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./HeroBannerItem.liquid.js"),t=require("../common/attrs.js"),r=require("../common/styles.js"),s=require("../common/classes.js"),a=require("@gem-sdk/system"),i=require("@gem-sdk/core"),n=require("../../helpers.js"),o=require("../common/helpers.js"),l=require("../settings/configs/translate.js");exports.default=d=>{let{builderAttrs:c,builderProps:g,setting:u,styles:p,style:f,children:v,advanced:b,pageContext:h}=d,{enableLazyLoadImage:S}=h??{},{enableLink:m,enableParallax:k}=u??{},y=n.getBackgroundTranslated({background:p?.background,uid:g?.uid,enableTranslate:!!l.HeroBanner?.background?.id,pageContext:h??{},isTranslateVideo:!0}),C=o.getBannerLink(u),{cssClass:$}=b??{},{urlData:j}=n.getInsertLinkData("",C),P=a.createStateOrContext({background:o.getResponsiveSetting(y||{}),uid:g?.uid,enableParallax:k&&Number(u?.speedParallax||0)>0,speedParallax:Number(u?.speedParallax)||0,hoverEffect:p?.hoverEffect,hoverEffectScale:p?.hoverEffectScale,layout:u?.layout,contentPosition1Col:p?.contentPosition1Col,contentPosition2Col:p?.contentPosition2Col,aspectRatio:u?.aspectRatio,sizeSetting:o.getResponsiveSetting(p?.sizeSetting||{}),videoObjectFit:o.getResponsiveSetting(p?.videoObjectFit||{}),target:C?.target??"_self",href:j?.href??"",linkType:C?.type??"",hoverEffectDuration:p?.hoverEffectDuration,isYoutubeVideoMigrated:u?.isYoutubeVideoMigrated}),E=!!C?.link&&m,q=a.createAttr({...t.getAttr({uid:g?.uid||""})}),x=a.createAttr(t.getAttrLink()),R=a.createStyle({...r.getStyle(p,u,f)}),A=a.createClass({...s.getClasses({setting:u,builderProps:g,advancedCssClass:$})}),I=a.createClass({...s.getLinkClasses()}),L=()=>e.default({setting:u,translatedBackground:y,styles:p,children:v,enableLazyLoadImage:S,rawChildren:d.rawChildren,builderProps:g,pageContext:h});return i.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./HeroBannerItem.liquid.js"),t=require("../common/attrs.js"),r=require("../common/styles.js"),s=require("../common/classes.js"),a=require("@gem-sdk/system"),i=require("@gem-sdk/core"),n=require("../../helpers.js"),o=require("../common/helpers.js"),l=require("../settings/configs/translate.js");exports.default=c=>{let{builderAttrs:d,builderProps:g,setting:u,styles:p,style:f,children:v,advanced:b,pageContext:h}=c,{enableLazyLoadImage:S}=h??{},{enableLink:m,enableParallax:k}=u??{},y=n.getBackgroundTranslated({background:p?.background,uid:g?.uid,enableTranslate:!!l.HeroBanner?.background?.id,pageContext:h??{},isTranslateVideo:!0}),C=o.getBannerLink(u),{cssClass:$}=b??{},{urlData:j}=n.getInsertLinkData("",C),P=a.createStateOrContext({background:o.getResponsiveSetting(y||{}),uid:g?.uid,enableParallax:k&&Number(u?.speedParallax||0)>0,speedParallax:Number(u?.speedParallax)||0,hoverEffect:p?.hoverEffect,hoverEffectScale:p?.hoverEffectScale,layout:u?.layout,contentPosition1Col:p?.contentPosition1Col,contentPosition2Col:p?.contentPosition2Col,aspectRatio:u?.aspectRatio,sizeSetting:o.getResponsiveSetting(p?.sizeSetting||{}),videoObjectFit:o.getResponsiveSetting(p?.videoObjectFit||{}),target:C?.target??"_self",href:j?.href??"",linkType:C?.type??"",hoverEffectDuration:p?.hoverEffectDuration,isYoutubeVideoMigrated:u?.isYoutubeVideoMigrated}),E=!!C?.link&&m,q=a.createAttr({...t.getAttr({uid:g?.uid||""})}),x=a.createAttr(t.getAttrLink()),R=a.createStyle({...r.getStyle(p,u,f)}),A=a.createClass({...s.getClasses({setting:u,builderProps:g,advancedCssClass:$})}),I=a.createClass({...s.getLinkClasses()}),L=()=>e.default({setting:u,translatedBackground:y,styles:p,children:v,enableLazyLoadImage:S,rawChildren:c.rawChildren,builderProps:g,pageContext:h});return i.template`
       <gp-hero-banner
-        ${{...c}}
+        ${{...d}}
         ${{...q}}
         class="${A}"
         style="${R}"
-        gp-data='${i.dataStringify(P)}'
       >
+        <script gp-data type="application/json">${i.dataStringify(P)}</script>
         ${a.If(!E,L())}
         ${a.If(E,i.template`
           <div

package/dist/cjs/icon-list-v2/components/IconList.liquid.js CHANGED Viewed

@@ -1,17 +1,17 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../helpers.js"),s=require("../../text/components/Text.liquid.js"),l=require("@gem-sdk/system"),a=require("../common/classes.js"),i=require("../common/styles.js"),r=require("../common/helpers.js");exports.default=c=>{let{builderProps:o,builderAttrs:n,style:d,setting:p,styles:g,pageContext:y}=c,u=o?.builderData?.advanced,$=l.createClass({[o?.uid??""]:!0}),m=l.createClass(a.getClassWraplistIcon()),S=l.createClass(a.getClassColListIcon()),v=l.createClass(a.getClassWrapItemIcon({builderProps:o})),I=l.createClass(a.getClassWrapIcon()),C=l.createClass(a.getClassIcon()),q=l.createClass(a.getClassTextItem({setting:p})),f=l.createStyle(i.getStyleContainerIconlistMain({styles:g,style:d,type:"liquid",advanced:u})),x=l.createStyle(i.getStyleWraplistIcon({styles:g,uid:o?.uid??"",pageContext:y,type:"Liquid"})),j=l.createStyle(i.getStyleColListIcon({styles:g})),T=l.createStyle(i.getStyleWrapIcon({styles:g,setting:p})),W=l.createStyle(i.getStyleWrapItemIcon({styles:g})),h=l.createStyle(i.getStyleIcon({styles:g,setting:p})),k=i.getStyleTypoText({setting:p}),A=l.createAttr({...n}),E=r.getTextIconNotFound("liquid"),L=r.getvalueMap({setting:p});return e.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../helpers.js"),s=require("../../text/components/Text.liquid.js"),l=require("@gem-sdk/system"),a=require("../common/classes.js"),i=require("../common/styles.js"),r=require("../common/helpers.js");exports.default=c=>{let{builderProps:o,builderAttrs:n,style:p,setting:d,styles:g,pageContext:y}=c,u=o?.builderData?.advanced,$=l.createClass({[o?.uid??""]:!0}),m=l.createClass(a.getClassWraplistIcon()),S=l.createClass(a.getClassColListIcon()),v=l.createClass(a.getClassWrapItemIcon({builderProps:o})),I=l.createClass(a.getClassWrapIcon()),C=l.createClass(a.getClassIcon()),f=l.createClass(a.getClassTextItem({setting:d})),q=l.createStyle(i.getStyleContainerIconlistMain({styles:g,style:p,type:"liquid",advanced:u})),j=l.createStyle(i.getStyleWraplistIcon({styles:g,uid:o?.uid??"",pageContext:y,type:"Liquid"})),x=l.createStyle(i.getStyleColListIcon({styles:g})),T=l.createStyle(i.getStyleWrapIcon({styles:g,setting:d})),W=l.createStyle(i.getStyleWrapItemIcon({styles:g})),h=l.createStyle(i.getStyleIcon({styles:g,setting:d})),k=i.getStyleTypoText({setting:d}),A=l.createAttr({...n}),E=r.getTextIconNotFound("liquid"),L=r.getvalueMap({setting:d});return e.template`
     {% assign locationOrigin = request.origin | append: routes.root_url | split: '/' | join: '/' %}
     <gp-icon-list
       ${{...A}}
       ${{...o}}
       data-id="${o?.uid}"
-      style="${f}"
+      style="${q}"
       className="${$}"
-      gp-data='${e.dataStringify({position:g?.position,iconWidth:p?.iconWidth}).replaceAll("'","&#039;")}'
     >
+      <script gp-data type="application/json">${JSON.stringify(e.dataStringify({position:g?.position,iconWidth:d?.iconWidth}).replaceAll("'","&#039;"))}</script>
       ${l.If(!L||!L.length,e.template`<div>${E}</div>`,e.template`
-          <div class="${m}" style="${x}">
-            <div class="${S}" style="${j}">
-              ${L?.map((t,l)=>{let a=r.getTextIconTranslations({setting:p,builderProps:o,pageContext:y,key:l,type:"liquid"});return e.template`
+          <div class="${m}" style="${j}">
+            <div class="${S}" style="${x}">
+              ${L?.map((t,l)=>{let a=r.getTextIconTranslations({setting:d,builderProps:o,pageContext:y,key:l,type:"liquid"});return e.template`
                     <div
                       key="${l}"
                       data-index="${l}"
@@ -26,7 +26,7 @@
                           ${t}
                         </span>
                       </div>
-                      ${s.default({setting:{text:a?.toString(),htmlTag:"div",options:{customClass:{wrapper:"gp-w-full"}},isForceValue:!0},styles:k,className:q})}
+                      ${s.default({setting:{text:a?.toString(),htmlTag:"div",options:{customClass:{wrapper:"gp-w-full"}},isForceValue:!0},styles:k,className:f})}
                     </div>`}).join(" ")}
             </div>
           </div>`)}

package/dist/cjs/image-comparison/components/CompareImage.liquid.js CHANGED Viewed

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("@gem-sdk/system"),a=require("../../helpers.js"),s=require("../../image/components/NextImage.liquid.js"),l=require("../common/styles.js"),i=require("../common/classes.js"),r=require("../common/attrs.js"),g=require("../common/helpers.js"),d=require("./Label.liquid.js"),c=require("./SlideHandle.liquid.js");exports.default=y=>{let{leftImage:o,rightImage:n,advanced:m,builderData:p,pageContext:S,preload:u=!1,onSliderPositionChange:h}=y,{hover:L,styles:b,handle:f,handleSize:$,leftImageAlt:q,leftImageTitle:A,leftImageCss:I,leftImageLabel:C,rightImageAlt:j,rightImageTitle:v,rightImageCss:w,rightImageLabel:O,sliderLineWidth:D,sliderLineColor:P,sliderPositionPercentage:W,vertical:z,componentUid:E,tempImage:N,aspectRatio:k,defaultRatio:x,isHorizontal:H,hasLeftLabel:_,hasRightLabel:F,qualityType:G,qualityPercent:M,getLeftImageSrc:R,getRightImageSrc:J}=g.getData(y),T=R({isLiquid:!0}),U=J({isLiquid:!0}),V=t.createStyle({...l.getOuterWrapperStyles(b)}),B=t.createStyle({...l.getWrapperWidth({width:b?.width,leftImageWidth:o?.width,rightImageWidth:n?.width})}),K=t.createStyle({...l.getContainerStyles({aspectRatio:k,builderData:p})}),Q=t.createStyle({...l.getLazyPlaceholderStyle(k)}),X=t.createStyle({...l.getImageStyles({type:"right",props:y})}),Y=t.createStyle({...l.getImageStyles({type:"left",props:y})}),Z=t.createStyle({...l.getLabelStyles({styles:b,type:"left",isHorizontal:H})}),ee=t.createStyle({...l.getLabelStyles({styles:b,type:"right",isHorizontal:H})}),et=t.createStyle({...l.getArrowStyles({type:"left"})}),ea=t.createStyle({...l.getArrowStyles({type:"right"})}),es=t.createStyle({...l.getLineStyles({isHorizontal:H,sliderLineColor:P,sliderLineWidth:D})}),el=t.createStyle({...l.getHandleStyles({handleSize:$,isHorizontal:H,sliderLineColor:P,sliderLineWidth:D})}),ei=t.createStyle({...l.getHandleCustomStyles()}),er=t.createStyle({...l.getSliderStyles({hover:L,handleSize:$,isHorizontal:H})}),eg=t.createClass({...i.getOuterWrapperClasses(m?.cssClass)}),ed=t.createClass({...i.getLabelClasses(b)}),ec=t.createClass({...i.getLabelContainerClasses()}),ey=r.getLabelAttrs({componentUid:E,positionId:"left",label:C??""}),eo=r.getLabelAttrs({componentUid:E,positionId:"right",label:O??""}),en=t.createAttr({...r.getImageLiquidAttrs({priority:u,src:U,title:v,isDisableObjectFit:!0,isDisableAspectStyle:!0,id:`right-image-${E}`})}),em=t.createAttr({...r.getImageLiquidAttrs({priority:u,src:T,title:A,isDisableObjectFit:!0,isDisableAspectStyle:!0,id:`left-image-${E}`})}),ep=r.getLabelLiquidAttrs({pageContext:S,translateLabel:"leftImageLabel"}),eS=r.getLabelLiquidAttrs({pageContext:S,translateLabel:"rightImageLabel"}),eu=t.createAttr({...r.getImagePlaceholderAttrs({width:N?.width,height:N?.height})}),eh=t.createStateOrContext({hover:L,handle:f,vertical:z,leftImage:o,rightImage:n,handleSize:$,aspectRatio:k,defaultRatio:x,componentUid:E,leftImageCss:I,rightImageCss:w,sliderLineColor:P,sliderLineWidth:D,sliderPositionPercentage:W,onSliderPositionChange:h});return e.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("@gem-sdk/system"),a=require("../../helpers.js"),s=require("../../image/components/NextImage.liquid.js"),l=require("../common/styles.js"),i=require("../common/classes.js"),r=require("../common/attrs.js"),g=require("../common/helpers.js"),d=require("./Label.liquid.js"),c=require("./SlideHandle.liquid.js");exports.default=y=>{let{leftImage:o,rightImage:n,advanced:p,builderData:m,pageContext:S,preload:u=!1,onSliderPositionChange:h}=y,{hover:L,styles:b,handle:f,handleSize:$,leftImageAlt:q,leftImageTitle:A,leftImageCss:I,leftImageLabel:C,rightImageAlt:j,rightImageTitle:v,rightImageCss:w,rightImageLabel:O,sliderLineWidth:D,sliderLineColor:P,sliderPositionPercentage:W,vertical:z,componentUid:E,tempImage:N,aspectRatio:k,defaultRatio:x,isHorizontal:H,hasLeftLabel:_,hasRightLabel:F,qualityType:G,qualityPercent:M,getLeftImageSrc:R,getRightImageSrc:J}=g.getData(y),T=R({isLiquid:!0}),U=J({isLiquid:!0}),V=t.createStyle({...l.getOuterWrapperStyles(b)}),B=t.createStyle({...l.getWrapperWidth({width:b?.width,leftImageWidth:o?.width,rightImageWidth:n?.width})}),K=t.createStyle({...l.getContainerStyles({aspectRatio:k,builderData:m})}),Q=t.createStyle({...l.getLazyPlaceholderStyle(k)}),X=t.createStyle({...l.getImageStyles({type:"right",props:y})}),Y=t.createStyle({...l.getImageStyles({type:"left",props:y})}),Z=t.createStyle({...l.getLabelStyles({styles:b,type:"left",isHorizontal:H})}),ee=t.createStyle({...l.getLabelStyles({styles:b,type:"right",isHorizontal:H})}),et=t.createStyle({...l.getArrowStyles({type:"left"})}),ea=t.createStyle({...l.getArrowStyles({type:"right"})}),es=t.createStyle({...l.getLineStyles({isHorizontal:H,sliderLineColor:P,sliderLineWidth:D})}),el=t.createStyle({...l.getHandleStyles({handleSize:$,isHorizontal:H,sliderLineColor:P,sliderLineWidth:D})}),ei=t.createStyle({...l.getHandleCustomStyles()}),er=t.createStyle({...l.getSliderStyles({hover:L,handleSize:$,isHorizontal:H})}),eg=t.createClass({...i.getOuterWrapperClasses(p?.cssClass)}),ed=t.createClass({...i.getLabelClasses(b)}),ec=t.createClass({...i.getLabelContainerClasses()}),ey=r.getLabelAttrs({componentUid:E,positionId:"left",label:C??""}),eo=r.getLabelAttrs({componentUid:E,positionId:"right",label:O??""}),en=t.createAttr({...r.getImageLiquidAttrs({priority:u,src:U,title:v,isDisableObjectFit:!0,isDisableAspectStyle:!0,id:`right-image-${E}`})}),ep=t.createAttr({...r.getImageLiquidAttrs({priority:u,src:T,title:A,isDisableObjectFit:!0,isDisableAspectStyle:!0,id:`left-image-${E}`})}),em=r.getLabelLiquidAttrs({pageContext:S,translateLabel:"leftImageLabel"}),eS=r.getLabelLiquidAttrs({pageContext:S,translateLabel:"rightImageLabel"}),eu=t.createAttr({...r.getImagePlaceholderAttrs({width:N?.width,height:N?.height})}),eh=t.createStateOrContext({hover:L,handle:f,vertical:z,leftImage:o,rightImage:n,handleSize:$,aspectRatio:k,defaultRatio:x,componentUid:E,leftImageCss:I,rightImageCss:w,sliderLineColor:P,sliderLineWidth:D,sliderPositionPercentage:W,onSliderPositionChange:h});return e.template`
     <gp-image-comparison
       data-id="${E}"
       style="${V}"
       class="${eg}"
-      gp-data='${JSON.stringify(eh)}'
     >
+      <script gp-data type="application/json">${JSON.stringify(eh)}</script>
       <div id="img-comparison-wrapper-${E}" style="${B}">
         <div
           id="img-comparison-container-${E}"
@@ -15,9 +15,9 @@
       <img alt="" ${eu} style="${Q}" />
     `}
           ${s.default({...en,alt:j,style:X,setting:{qualityType:G,qualityPercent:M},enableLazyLoadImage:!u,isNotLazyload:u,customAttrs:{"data-testid":"right-image"}})}
-          ${s.default({...em,alt:q,style:Y,setting:{qualityType:G,qualityPercent:M},enableLazyLoadImage:!u,isNotLazyload:u,customAttrs:{"data-testid":"left-image"}})}
+          ${s.default({...ep,alt:q,style:Y,setting:{qualityType:G,qualityPercent:M},enableLazyLoadImage:!u,isNotLazyload:u,customAttrs:{"data-testid":"left-image"}})}
           ${c.default({componentUid:E,customHandle:f,lineStyles:es,sliderStyles:er,handleStyles:el,customHandleStyles:ei,leftArrowStyles:et,rightArrowStyles:ea})}
-          ${t.If(_,d.default({...ey,...ep,styles:b,childrenClass:ed,childrenStyle:Z,containerClass:ec,containerStyle:{}}),"")}
+          ${t.If(_,d.default({...ey,...em,styles:b,childrenClass:ed,childrenStyle:Z,containerClass:ec,containerStyle:{}}),"")}
           ${t.If(F,d.default({...eo,...eS,styles:b,childrenClass:ed,childrenStyle:ee,containerClass:ec,containerStyle:{}}),"")}
         </div>
       </div>

package/dist/cjs/marquee/components/Marquee.liquid.js CHANGED Viewed

@@ -1,28 +1,28 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),s=require("./MarqueeBase.liquid.js"),t=require("../common/helpers.js"),r=require("@gem-sdk/system"),a=require("../common/styles.js"),l=require("../common/classes.js");exports.default=({children:i,style:d,builderAttrs:o,rawChildren:n,advanced:c,...u})=>{let{styles:p,setting:m,builderProps:g}=u,{iconSeparatorColor:C,backgroundColor:y}=p||{},{iconSeparatorSvg:S,isShowIconSeparator:v}=m||{},$=n.length,{isFullWidth:q,getIsFullWidthValue:h}=t.useMarqueeLiquidStyles(m,p),{styleHeight:f,styleWidth:M,getWidthForWrapperItem:j,getHeightOfIconSeparatorSize:F,getWidthOfIconSeparatorSize:I,getIconPosition:b,getItemPaddingRightSpacingValue:k,getWidthForItem:w}=a.getMarqueeStyles({itemSize:$,setting:m,styles:p}),O=r.createClass(l.getAlignClasses),R=r.createStyle(a.getAlignStyles(p)),A=r.createStyle(a.getContentStyles({style:d,backgroundColor:y,styleWidth:M,styleHeight:f})),B=r.createClass(l.getContentClasses),E=r.createClass(l.getWrapperClasses(g?.uid)),x=r.createClass(l.getFastMarqueeContentClasses),P=r.createClass(l.getFastMarqueeClasses),_=r.createClass(l.getFastMarqueeContentChildrenClasses(q)),L=e=>r.createStyle(a.getFastMarqueeChildrenIconStyles({index:e,itemSize:$,iconSeparatorColor:C,getHeightOfIconSeparatorSize:F,getWidthOfIconSeparatorSize:I,getIconPosition:b})),W=r.createClass(l.getFastMarqueeChildrenIconClasses),G=e=>r.createStyle({...k(e),"text-wrap":"wrap",...j()}),H=r.createStyle(w()),N=r.createStateOrContext({setting:{...m,uid:g?.uid},styles:p});return e.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),s=require("./MarqueeBase.liquid.js"),t=require("../common/helpers.js"),r=require("@gem-sdk/system"),a=require("../common/styles.js"),l=require("../common/classes.js");exports.default=({children:i,style:d,builderAttrs:o,rawChildren:c,advanced:n,...u})=>{let{styles:p,setting:m,builderProps:g}=u,{iconSeparatorColor:C,backgroundColor:y}=p||{},{iconSeparatorSvg:S,isShowIconSeparator:v}=m||{},$=c.length,{isFullWidth:q,getIsFullWidthValue:h}=t.useMarqueeLiquidStyles(m,p),{styleHeight:f,styleWidth:M,getWidthForWrapperItem:j,getHeightOfIconSeparatorSize:F,getWidthOfIconSeparatorSize:I,getIconPosition:b,getItemPaddingRightSpacingValue:k,getWidthForItem:w}=a.getMarqueeStyles({itemSize:$,setting:m,styles:p}),O=r.createClass(l.getAlignClasses),R=r.createStyle(a.getAlignStyles(p)),A=r.createStyle(a.getContentStyles({style:d,backgroundColor:y,styleWidth:M,styleHeight:f})),B=r.createClass(l.getContentClasses),E=r.createClass(l.getWrapperClasses(g?.uid)),x=r.createClass(l.getFastMarqueeContentClasses),P=r.createClass(l.getFastMarqueeClasses),_=r.createClass(l.getFastMarqueeContentChildrenClasses(q)),L=e=>r.createStyle(a.getFastMarqueeChildrenIconStyles({index:e,itemSize:$,iconSeparatorColor:C,getHeightOfIconSeparatorSize:F,getWidthOfIconSeparatorSize:I,getIconPosition:b})),W=r.createClass(l.getFastMarqueeChildrenIconClasses),G=e=>r.createStyle({...k(e),"text-wrap":"wrap",...j()}),H=r.createStyle(w()),N=r.createStateOrContext({setting:{...m,uid:g?.uid},styles:p});return e.template`
   ${e.RenderIf(e.isLocalEnv,'<script src="{{ \'gp-marquee-v7-5.js\' | asset_url }}" defer="defer"></script>',`<script src="${e.baseAssetURL}/assets-v2/gp-marquee-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
-  <gp-marquee data-id="${g?.uid}" gp-data='${JSON.stringify(N)}'
-   class="${e.cls(g?.uid,c?.cssClass)}">
-   <div class="${O}" style="${R}">
+  <gp-marquee data-id="${g?.uid}" class="${e.cls(g?.uid,n?.cssClass)}">
+    <script gp-data type="application/json">${JSON.stringify(N)}</script>
+    <div class="${O}" style="${R}">
       <div class="${B}" style="${A}">
-         <div class="${E}">
+        <div class="${E}">
             <div class="${P}">
-               ${s.default({autoFill:!0,direction:u.setting?.direction,play:(u.setting?.speed??0)>0,pauseOnHover:u.setting?.stopOnHover,isFullWidthResponsive:{desktop:h("desktop"),tablet:h("tablet"),mobile:h("mobile")},children:`
-               <div class="${x}">
-                  ${n?.length?e.WrapRenderChildren({uid:g?.uid??"",customProps:n[0]?.customProps},n.map((s,t)=>{if(s)return e.template`
-                  <div class="${_}"
-                     style="${G(t)}">
-                     ${e.RenderChildren({...s,index:t,itemBorderStyle:p?.itemBorderStyle,itemCorner:p?.itemCorner,itemBackgroundColor:p?.itemBackgroundColor,hasItemShadow:m?.hasItemShadow,itemShadow:p?.itemShadow,itemStyles:H})}
-                     ${r.If(!!(v&&S),e.template`<span style="${L(t)}"
-                        class="${W}">
-                        ${S}
-                     </span>`)}
+              ${s.default({autoFill:!0,direction:u.setting?.direction,play:(u.setting?.speed??0)>0,pauseOnHover:u.setting?.stopOnHover,isFullWidthResponsive:{desktop:h("desktop"),tablet:h("tablet"),mobile:h("mobile")},children:`
+                  <div class="${x}">
+                  ${c?.length?e.WrapRenderChildren({uid:g?.uid??"",customProps:c[0]?.customProps},c.map((s,t)=>{if(s)return e.template`
+                              <div class="${_}"
+                                style="${G(t)}">
+                                ${e.RenderChildren({...s,index:t,itemBorderStyle:p?.itemBorderStyle,itemCorner:p?.itemCorner,itemBackgroundColor:p?.itemBackgroundColor,hasItemShadow:m?.hasItemShadow,itemShadow:p?.itemShadow,itemStyles:H})}
+                                ${r.If(!!(v&&S),e.template`<span style="${L(t)}"
+                                    class="${W}">
+                                    ${S}
+                                </span>`)}
+                              </div>
+                              `})):i}
                   </div>
-                  `})):i}
-               </div>
-               `})}
+                `})}
             </div>
-         </div>
+        </div>
       </div>
-   </div>
-</gp-marquee>
+    </div>
+  </gp-marquee>
 `};

package/dist/cjs/product/components/ProductImages.liquid.js CHANGED Viewed

@@ -1,9 +1,9 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../helpers/product-image.js"),i=require("./product-images/common/helpers.js"),r=require("./product-images/ProductFeaturedImage.liquid.js"),l=require("./product-images/ProductGalleryCarousel.liquid.js"),s=require("./product-images/ProductGalleryGrid.liquid.js"),a=require("./product-images/common/productGallery.js"),o=require("../../helpers.js");exports.default=d=>{let{setting:g,styles:u,builderProps:p,style:n}=d,c={...d.styles,...d.setting},m={...d.styles,...d.setting},f=t=>e.getResponsiveValueByScreen(u?.position,t),y=`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../helpers/product-image.js"),i=require("./product-images/common/helpers.js"),r=require("./product-images/ProductFeaturedImage.liquid.js"),s=require("./product-images/ProductGalleryCarousel.liquid.js"),l=require("./product-images/ProductGalleryGrid.liquid.js"),a=require("./product-images/common/productGallery.js"),o=require("../../helpers.js");exports.default=d=>{let{setting:g,styles:p,builderProps:u,style:n}=d,c={...d.styles,...d.setting},m={...d.styles,...d.setting},f=t=>e.getResponsiveValueByScreen(p?.position,t),y=`
     {
-      "id":${JSON.stringify(p?.uid)},
+      "id":${JSON.stringify(u?.uid)},
       "setting":${JSON.stringify(g)},
-      "styles":${JSON.stringify(u)},
-      "product":{{ product | json | escape }}
+      "styles":${JSON.stringify(p)},
+      "product":{{ product | json }}
     }
   `;return e.template`
   {% assign featured_image = product.featured_image %}
@@ -11,22 +11,22 @@
   {% assign featured_image = variant.featured_image %}
   {%- endif -%}
   <gp-product-images
-    gp-data='${y}'
     style="${{...n}}"
     class="${e.cls({"gp-overflow-hidden":i.checkAddOverFlowClass(n)})}"
   >
+    <script gp-data type="application/json">${y}</script>
     <div
         class="${e.cls("gp-flex gp-w-full",{...t.getFlexDirection(d)})}"
-        style="${{...i.getStyleAlignment(u?.align,u?.position)}}"
+        style="${{...i.getStyleAlignment(p?.align,p?.position)}}"
       >
         ${r.default({...c})}
         {%- if product.media.size > 1 -%}
           <div
             class="${e.cls("gallery-wrapper gp-product-images-gallery gp-inline-flex gp-h-fit gp-max-w-full",{"gp-justify-start":"bottom-left"==f("desktop"),"tablet:gp-justify-start":"bottom-left"==f("tablet"),"mobile:gp-justify-start":"bottom-left"==f("mobile"),"gp-justify-center":"bottom-center"==f("desktop"),"tablet:gp-justify-center":"bottom-center"==f("tablet"),"mobile:gp-justify-center":"bottom-center"==f("mobile"),"gp-mx-auto":"bottom-center"==f("desktop"),"tablet:gp-mx-auto":"bottom-center"==f("tablet"),"mobile:gp-mx-auto":"bottom-center"==f("mobile")})}"
-            style="${{...e.makeStyle({fs:"1.23"}),...i.getDisplayStyle(t=>!!g?.galleryVisible&&!e.getResponsiveValueByScreen(g?.galleryVisible,t),"inline-flex"),...a.getStyleWidthForGallery({galleryVisible:g?.galleryVisible,featureImageVisible:g?.featureImageVisible,position:u?.position,width:u?.width,widthHorizontalLayout:u?.widthHorizontalLayout}),...a.getStyleGallerySpacing(u?.position,u?.gallerySpacing)}}"
+            style="${{...e.makeStyle({fs:"1.23"}),...i.getDisplayStyle(t=>!!g?.galleryVisible&&!e.getResponsiveValueByScreen(g?.galleryVisible,t),"inline-flex"),...a.getStyleWidthForGallery({galleryVisible:g?.galleryVisible,featureImageVisible:g?.featureImageVisible,position:p?.position,width:p?.width,widthHorizontalLayout:p?.widthHorizontalLayout}),...a.getStyleGallerySpacing(p?.position,p?.gallerySpacing)}}"
           >
-            ${l.default({builderPropUID:p?.uid,...m})}
-            ${s.default({builderPropUID:p?.uid,...m})}
+            ${s.default({builderPropUID:u?.uid,...m})}
+            ${l.default({builderPropUID:u?.uid,...m})}
           </div>
         {%- endif -%}
       </div>

package/dist/cjs/product/components/dynamic-checkout/Button.liquid.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@gem-sdk/core"),e=require("@gem-sdk/system"),s=require("../../../helpers.js"),a=require("./common/classes.js"),i=require("./common/styles.js");exports.default=({setting:l,advanced:r,styles:n,builderProps:o,className:d=""})=>{let c=e.createClass({...!!d&&{[d]:!0},...a.getButtonClasses({styles:n,uid:o?.uid})}),u=i.getButtonStyles({styles:n,uid:o?.uid}),p=e.createStateOrContext({setting:{label:l?.label},totalVariant:"{{total_combinations}}"});return t.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@gem-sdk/core"),e=require("@gem-sdk/system"),s=require("../../../helpers.js"),a=require("./common/classes.js"),i=require("./common/styles.js");exports.default=({setting:r,advanced:n,styles:l,builderProps:o,className:d=""})=>{let p=e.createClass({...!!d&&{[d]:!0},...a.getButtonClasses({styles:l,uid:o?.uid})}),c=i.getButtonStyles({styles:l,uid:o?.uid}),u=e.createStateOrContext({setting:{label:r?.label},totalVariant:"{{total_combinations}}"});return t.template`
     ${e.Liquid("{%- assign total_combinations = 1 -%}")}
     ${e.LiquidFor("option in product.options_with_values","{%- assign total_combinations = total_combinations | times: option.values.size -%}")}
     ${e.Liquid(`
@@ -7,14 +7,14 @@
         assign supported_payment_methods = shop.enabled_payment_types
       -%}
     `)}
-    <gp-product-dynamic data-id="${o?.uid}" data-translate-label='${l?.label}' class="${r?.cssClass}" gp-data='${JSON.stringify(p).replaceAll("'","&#039;")}
-    '>
-    <div class="${c}">
-        {{ form | payment_button }}
-    </div>
-    {% style %}
-      ${u}
-    {% endstyle %}
+    <gp-product-dynamic data-id="${o?.uid}" data-translate-label='${r?.label}' class="${n?.cssClass}">
+      <script gp-data type="application/json">${t.dataStringify(u)}</script>
+      <div class="${p}">
+          {{ form | payment_button }}
+      </div>
+      {% style %}
+        ${c}
+      {% endstyle %}
     </gp-product-dynamic>
     ${e.If(t.isLocalEnv,`<script ${s.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-product-dynamic-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${s.getSettingPreloadData('class="gps-link" delay',"src")}="${t.baseAssetURL}/assets-v2/gp-product-dynamic-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
   `};

package/dist/cjs/product/components/file-upload/UploadFile.liquid.js CHANGED Viewed

@@ -1,7 +1,6 @@
 "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),s=require("../../../helpers.js"),t=require("@gem-sdk/system"),r=require("./common/classes.js"),a=require("./common/style.js"),l=require("./common/attr.js"),i=require("./common/helpers.js");exports.default=({setting:c,styles:o,builderProps:v,pageContext:n})=>{let d=t.createClass(r.createLayoutClasses(c,v?.uid)),y=t.createStyle({...i.removeHoverStyles(a.createLayoutStyles(c,o),o?.enableHoverEffect)}),p=t.createClass(r.createTypoClasses(o)),u=t.createStyle({...i.removeHoverStyles(a.createTypoStyles(o),o?.enableHoverEffect)}),C=t.createClass(r.createPreviewClasses()),f=t.createClass(r.createPreviewItemClasses()),S=t.createClass(r.createPreviewRemoveClasses()),m=t.createClass(r.createMessageClasses()),$=t.createStyle(a.createMessageStyles()),g=t.createClass(r.createContentWidthClasses()),H=t.createClass(r.createInputClasses()),b=t.createClass(r.composeClasses("gp-flex gp-items-center")),q=t.createAttr({...l.getInputAttr(c?.isRequired,c?.numberOfFiles)}),I=t.createStyle({...i.removeHoverStyles(a.createContainerStyles(o?.align,o?.textColor),o?.enableHoverEffect)}),j=t.createStyle({...i.removeHoverStyles(a.createWrapContentWidthStyles(c),o?.enableHoverEffect)}),E=t.createClass(r.createWrapContainerClasses(v?.uid)),P=t.createStyle({...i.removeHoverStyles(a.createContentWithStyles(c,o),o?.enableHoverEffect)}),h=t.createStyle({...i.removeHoverStyles(a.createIconContainerStyles(c),o?.enableHoverEffect)}),w=t.createClass(r.createIconContentClasses()),x=t.createStyle({...i.removeHoverStyles(a.createIconContentStyles(c,o),o?.enableHoverEffect)}),O=i.getDisplayText("Liquid",{uid:v?.uid,setting:c,styles:o,pageContext:n}),R=t.createStateOrContext({settings:{isShowPreviewImage:c?.isShowPreviewImage,numberOfFiles:c?.numberOfFiles,isRequired:c?.isRequired}});return e.template`
-  <gp-file-upload
-    gp-data='${JSON.stringify(R)}'
-  >
+  <gp-file-upload>
+  <script gp-data type="application/json">${JSON.stringify(R)}</script>
   <div class="${E}" style="${I}">
     <input ${q} class="${H}">
     <div class="${b}" style="${j}">