npm - @gem-sdk/components - Versions diffs - 19.0.0 → 19.1.0-dev.1 - Mend

@gem-sdk/components 19.0.0 → 19.1.0-dev.1

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

package/dist/cjs/hero-banner/common/helpers.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";var e=require("@gem-sdk/core"),t=require("../../image/common/helpers.js"),o=require("../../constant.js"),r=require("./const.js");const l=(t,o,r)=>{let l={};return e.DEVICES.map(i=>{let s=e.getResponsiveValueByScreen(t,i),a=e.getResponsiveValueByScreen(o,i),n=e.getResponsiveValueByScreen(r,i);l={...l,[i]:1>=(s?.cols?.length\|\|1)?a:n}}),l},i=e=>{if(!e)return{};let t={desktop:e?.desktop?.image,tablet:e?.tablet?.image,mobile:e?.mobile?.image};return t},s=e=>{let o=i(e);return{desktop:t.createBlurDataURL(o?.desktop?.width??0,o?.desktop?.height??0),tablet:t.createBlurDataURL(o?.tablet?.width??o?.desktop?.width??0,o?.tablet?.height??o?.desktop?.width??0),mobile:t.createBlurDataURL(o?.mobile?.width??o?.tablet?.width??o?.desktop?.width??0,o?.mobile?.height??o?.tablet?.height??o?.desktop?.width??0)}},a=(o,r,l,a)=>{if(!o)return"";let n=i(o),p=e.getResponsiveValueByScreen(o,r),b=l?`url(${s(o)[r]})`:`url(${t.getImageSrc(e.getResponsiveValueByScreen(n,r),r,a)})`,g=p?.color?`, ${p.color}`:"";return p?.color?.includes(e.GRADIENT_BGR_KEY)&&p?.type==="image"?`${b}${g}`:p?.color?.includes(e.GRADIENT_BGR_KEY)&&p?.type!=="image"?`${p.color}`:p?.type==="image"?b:"url()"},n=(e,t)=>{switch(e){case"desktop":if(t?.desktop?.type==="video")return{device:"desktop",data:t.desktop};break;case"tablet":if(t?.tablet?.type==="video")return{device:"tablet",data:t.tablet};if(!t?.tablet&&t?.desktop?.type==="video")return{device:"desktop",data:t.desktop};break;case"mobile":if(t?.mobile?.type==="video")return{device:"mobile",data:t.mobile};if(!t?.mobile&&t?.tablet?.type==="video")return{device:"tablet",data:t.tablet};if(!t?.mobile&&!t?.tablet?.type&&t?.desktop?.type==="video")return{device:"desktop",data:t.desktop}}},p=(e,t)=>{if(!e)return t;let o=e?.shapeVideo;return"custom"===o?e?.shapeValue\|\|t:void 0!==o?o:e?.shapeValue??t},b=({shapeByDevice:e,fallbackRatio:t,device:o,currentResult:r})=>{let l=p(e,t);return l?{...r,[o]:l}:r},g=e=>{let t={};for(let o in e)"top"===e[o]?t[o]="start":"bottom"===e[o]?t[o]="end":t[o]="center";return t},c=(e,t)=>{if(!e)return;if(!t)return e.shapeValue;let o=e.shapeVideo;return"custom"===o?e.shapeValue:o},u=(t,o)=>{let r=!1,l=e.DEVICES.reduce((l,i)=>{let s=e.getResponsiveValueByScreen(t,i),a=e.getResponsiveValueByScreen(o,i),n=c(s,a?.type==="video");return n&&(l[i]=n,r=!0),l},{});return{aspectRatio:r?l:void 0}},d=(t,o,r)=>e.DEVICES.reduce((l,i)=>{let s=e.getValueByDevice(t,i),a=s?.type==="video"?s?.videoType:void 0,n=e.getValueByDevice(o,i),p=r?.[i];return p&&"youtube"===a&&"cover"!==n&&(l[i]=p),l},{}),m=({enableParallax:e=!1,attachment:t="scroll"})=>!!e\|\|"fixed"===t,y=(t,o)=>{let r={};return["desktop","mobile","tablet"].forEach(l=>{let i=e.getResponsiveValueByScreen(t,l),s=i?.type==="image"&&o,a=m({enableParallax:s,attachment:t[l]?.attachment});r={...r,[l]:s?"150%":a?"100vh":"100%"}}),e.makeStyleResponsive("h",r)},h=(t,o)=>{let r={};return["desktop","mobile","tablet"].forEach(l=>{let i=e.getResponsiveValueByScreen(t,l),s=i?.type==="image"&&o,a=m({enableParallax:s,attachment:t[l]?.attachment});r={...r,[l]:a?"100vw":"100%"}}),e.makeStyleResponsive("w",r)},f=t=>{let o={};return["desktop","mobile","tablet"].forEach(e=>{o={...o,[e]:t[e]?.attachment==="fixed"?"0px":""}}),e.makeStyleResponsive("top",o)},I=(e,t=0,o=0)=>{let r=t,l=t;if(t>o?r=o:l=o,e>=999){let t=e-r;return t>0?t:0}let i=e-l;return i>0?i:0},v=({device:e,settingLayoutRes:t,contentPosition1ColRes:o})=>{let r=t[e]?.cols??[],l=r.length<=1,i=o[e];if(l&&i)return["space-between","top","center","bottom"].includes(i)?i:void 0},k=e=>{let t=e.desktop,o=e.tablet?e.tablet:t,r=e.mobile?e.mobile:o;return{desktop:t,tablet:o,mobile:r}},S=(t,o)=>{if(!t\|\|!o)return 16/9;let r=e.getResponsiveValueByScreen(t,o),l=r?.videoCustomRatio;if(l?.width&&l?.height){let e=Number(l.width),t=Number(l.height);if(e>0&&t>0)return e/t}return 16/9},x=e=>{switch(e){case"top":default:return{top:"0%",transform:`translate(-50%, 0%) scale(${r.VIDEO_IFRAME_SCALE})`};case"bottom":return{top:"100%",transform:`translate(-50%, -100%) scale(${r.VIDEO_IFRAME_SCALE})`};case"center":return{top:"50%",transform:`translate(-50%, -50%) scale(${r.VIDEO_IFRAME_SCALE})`}}};exports.collectAspectRatioByDevice=u,exports.collectYoutubeAspectRatio=d,exports.debounce=function(e,t){let o;return function(...r){clearTimeout(o),o=setTimeout(()=>e.apply(this,r),t)}},exports.fallbackImg="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkyMCIgaGVpZ2h0PSI5MDAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZGVmcz4KICAgICAgPGxpbmVhckdyYWRpZW50IGlkPSJnLTE5MjAtOTAwIj4KICAgICAgICA8c3RvcCBzdG9wLWNvbG9yPSJyZ2JhKDUxLCA1MSwgNTEsIDApIiBvZmZzZXQ9IjIwJSIgLz4KICAgICAgICA8c3RvcCBzdG9wLWNvbG9yPSJyZ2JhKDUxLCA1MSwgNTEsIDApIiBvZmZzZXQ9IjUwJSIgLz4KICAgICAgICA8c3RvcCBzdG9wLWNvbG9yPSJyZ2JhKDUxLCA1MSwgNTEsIDApIiBvZmZzZXQ9IjcwJSIgLz4KICAgICAgPC9saW5lYXJHcmFkaWVudD4KICAgIDwvZGVmcz4KICAgIDxyZWN0IHdpZHRoPSIxOTIwIiBoZWlnaHQ9IjkwMCIgZmlsbD0icmdiYSg1MSwgNTEsIDUxLCAwKSIgLz4KICAgIDxyZWN0IGlkPSJyIiB3aWR0aD0iMTkyMCIgaGVpZ2h0PSI5MDAiIGZpbGw9InVybCgjZy0xOTIwLTkwMCkiIC8+CiAgICA8YW5pbWF0ZSB4bGluazpocmVmPSIjciIgYXR0cmlidXRlTmFtZT0ieCIgZnJvbT0iLTE5MjAiIHRvPSIxOTIwIiBkdXI9IjFzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgIC8+CiAgPC9zdmc+",exports.formatHoverScale=e=>e?String(e).includes("%")?`${e}`:`${e}%`:"100%",exports.getAspectRatio=(e,t)=>{let{aspectRatio:o}=u(e,t);return o},exports.getAttachmentDevice=e=>{let t={};return["desktop","mobile","tablet"].forEach(o=>{let r=e?.[o]?.attachment;t={...t,[o]:"fixed"===r?"fixed":"absolute"}}),t},exports.getBackgroundImageHeroBanner=(t,o=!1,r=!1)=>{if(!t)return;let l={};return e.DEVICES.forEach(e=>{l={...l,[e]:a(t,e,o,r)}}),e.makeStyleResponsive("bgi",l)},exports.getBannerLink=e=>{let t=e?.link;return t?.type==="go-to-sales-page"?{type:"go-to-sales-page",link:o.HREF_TO_SALES_PAGE,target:"_self"}:t},exports.getBgImage=i,exports.getClassAlignBanner=e=>({"!gp-self-start":"left"===e.desktop,"!gp-self-center":"center"===e.desktop,"!gp-self-end":"right"===e.desktop,"tablet:!gp-self-start":"left"===e.tablet,"tablet:!gp-self-center":"center"===e.tablet,"tablet:!gp-self-end":"right"===e.tablet,"mobile:!gp-self-start":"left"===e.mobile,"mobile:!gp-self-center":"center"===e.mobile,"mobile:!gp-self-end":"right"===e.mobile}),exports.getClassContentPosition=e=>{let t={center:"center",top:"start",bottom:"end","space-between":"between"},o=e.desktop\|\|"center",r=e.tablet\|\|o,l=e.mobile\|\|r;return{[`gp-justify-${t[o]}`]:!0,[`tablet:gp-justify-${t[r]}`]:!0,[`mobile:gp-justify-${t[l]}`]:!0}},exports.getClassForContentByFitContent=(t,o)=>{let r={desktop:!1,tablet:!1,mobile:!1};return["desktop","mobile","tablet"].forEach(l=>{let i=e.getResponsiveValueByScreen(t,l),s=!!n(l,o),a=i?.shape,p=i?.height;r={...r,[l]:"original"===a&&"fit-content"!==p&&!s}}),e.cls(r.desktop?"!gp-absolute":"",r.tablet?"tablet:!gp-absolute":"tablet:!gp-relative",r.mobile?"mobile:!gp-absolute":"mobile:!gp-relative")},exports.getClassForStretchContent=t=>{let o={desktop:"none",tablet:"none",mobile:"none"};return["desktop","mobile","tablet"].forEach(r=>{let l=e.getResponsiveValueByScreen(t,r);o={...o,[r]:l}}),e.cls("space-between"===o.desktop?"[&>>]:!gp-justify-between":"","space-between"===o.tablet?"tablet:[&>>]:!gp-justify-between ":`tablet:[&>>]:!gp-justify-${t?.tablet}`,"space-between"===o.mobile?"mobile:[&>>]:!gp-justify-between ":`mobile:[&>>]:!gp-justify-${t?.mobile}`)},exports.getClassSpaceBetween=(t,o)=>{let r=k(t),l=k(o),i={desktop:v({device:"desktop",settingLayoutRes:r,contentPosition1ColRes:l}),tablet:v({device:"tablet",settingLayoutRes:r,contentPosition1ColRes:l}),mobile:v({device:"mobile",settingLayoutRes:r,contentPosition1ColRes:l})},s={"space-between":{desktop:"!gp-h-full !gp-content-stretch [&>]:!gp-justify-between [&>:nth-child(2)]:gp-absolute [&>:nth-child(2)]:gp-hidden",tablet:"tablet:!gp-h-full tablet:!gp-content-stretch tablet:[&>]:!gp-justify-between tablet:[&>:nth-child(2)]:gp-absolute tablet:[&>:nth-child(2)]:gp-hidden",mobile:"mobile:!gp-h-full mobile:!gp-content-stretch mobile:[&>]:!gp-justify-between mobile:[&>:nth-child(2)]:gp-absolute mobile:[&>:nth-child(2)]:gp-hidden"},top:{desktop:"!gp-content-stretch [&>]:!gp-justify-start",tablet:"tablet:!gp-content-stretch tablet:[&>]:!gp-justify-start",mobile:"mobile:!gp-content-stretch mobile:[&>]:!gp-justify-start"},center:{desktop:"!gp-content-stretch [&>]:!gp-justify-center",tablet:"tablet:!gp-content-stretch tablet:[&>]:!gp-justify-center",mobile:"mobile:!gp-content-stretch mobile:[&>]:!gp-justify-center"},bottom:{desktop:"!gp-content-stretch [&>]:!gp-justify-end",tablet:"tablet:!gp-content-stretch tablet:[&>]:!gp-justify-end",mobile:"mobile:!gp-content-stretch mobile:[&>]:!gp-justify-end"}},a={};return e.DEVICES.forEach(e=>{let t=i[e],o=s?.[t]?.[e];a[o]=!0}),a},exports.getClassSpaceBetweenLeftRight=e=>{let t=k(e),o=t?.desktop?.type=="left-distributed"\|\|t?.desktop?.type=="right-distributed",r=t?.tablet?.type=="left-distributed"\|\|t?.tablet?.type=="right-distributed",l=t?.mobile?.type=="left-distributed"\|\|t?.mobile?.type=="right-distributed";return{"gp-h-full tablet:gp-h-auto mobile:gp-h-auto [&>]:!gp-justify-between":o,"tablet:!gp-h-full tablet:[&>]:!gp-justify-between mobile:gp-h-auto":r,"mobile:!gp-h-full mobile:[&>]:!gp-justify-between":l,"mobile:!gp-h-auto":!l}},exports.getClipPath=(e,t)=>{if(!t)return`${r.DEFAULT_CLIP_PATH}`;let[o,l,i,s]=(e??"0 0 0 0").split(" ").map(e=>parseInt(e??"0")\|\|0),{btlr:a,btrr:n,bbrr:p,bblr:b}=t,g=I(parseInt(a??"0")\|\|0,o,s),c=I(parseInt(n??"0")\|\|0,o,l),u=I(parseInt(p??"0")\|\|0,l,i),d=I(parseInt(b??"0")\|\|0,i,s);return[g,c,u,d].every(e=>0===e)?`${r.DEFAULT_CLIP_PATH}`:`inset(0 0 0 round ${g}px ${c}px ${u}px ${d}px)`},exports.getContainerRatio=e=>{if(!e)return 0;let{width:t,height:o}=e.getBoundingClientRect();return t&&o?t/o:0},exports.getContentPosition=l,exports.getDataVideoHeroBannerResponsive=n,exports.getDisplayStyleByFitContent=(t,o)=>{let r={desktop:"none",tablet:"none",mobile:"none"};return["desktop","mobile","tablet"].forEach(l=>{let i=e.getResponsiveValueByScreen(t,l),s=!!n(l,o),a=i?.shape,p=i?.height;r={...r,[l]:"original"!==a\|\|"fit-content"===p\|\|s?"none":"block"}}),e.makeStyleResponsive("d",r)},exports.getEnableBgImageByDevice=(t,o)=>{if(!e.getResponsiveValueByScreen(i(o),t))return!1;if(!o?.[t]){if("mobile"===t)return o?.tablet?.type==="image"\|\|o?.desktop?.type==="image"&&!o?.tablet;if("tablet"===t)return o?.desktop?.type==="image"}return o?.[t]?.type==="image"},exports.getOpacityHover=e=>{let{overlayOpacity:t}=e??{},o="number"!=typeof t?.hover\|\|isNaN(t?.hover)?"string"==typeof t?.hover?`${parseInt(t?.hover)}%`:"":`${t?.hover}%`,r="number"!=typeof t?.normal\|\|isNaN(t?.normal)?"string"==typeof t?.normal?`${parseInt(t?.normal)}%`:"0%":`${t?.normal}%`;return o\|\|r},exports.getPercentageVisible=(e,t)=>{let{top:o,height:r}=e,l=-r;return o<l?0:o>t?100:Math.min(Math.max((o-l)/(t-l)100,0),100)},exports.getResponsiveSetting=k,exports.getStyleAspectRatioHeroBannerCustom=(t,o)=>{let r=e.getAspectRatioGlobalSize(o);return["desktop","mobile","tablet"].forEach(l=>{let i=e.getResponsiveValueByScreen(o,l),s=!!n(l,t);s&&(r=b({shapeByDevice:i,fallbackRatio:"auto",device:l,currentResult:r}))}),e.makeStyleResponsive("aspect",r)},exports.getStyleHeroBannerBg=(e,t)=>{let o=y(e,t),r=h(e,t),l=f(e);return{...o,...r,...l}},exports.getVideoAspectRatio=S,exports.getVisibilityStyle=e=>e?Object.keys(e).filter(e=>["--d","--d-tablet","--d-mobile"].includes(e)).reduce((t,o)=>({...t,[o]:e?.[o]!=="none"?"flex":e?.[o]}),{}):{},exports.getWidth=e=>{let t={};return["desktop","mobile","tablet"].forEach(o=>{let r=e?.[o];r&&(t={...t,[o]:"default"===r?"var(--g-ct-w, 1200px)":r})}),t},exports.getYoutubeAspectRatio=(e,t,o)=>{let r=d(e,t,o);return Object.keys(r).length?r:void 0},exports.horizontalAlign=(e,t,o)=>g(l(e,t,o)),exports.imagePlaceholder=s,exports.isScaleImage=m,exports.mapContentPositionToHorizontal=g,exports.opacityEnabledData=e=>{let{overlayColor:t,overlayOpacity:o}=e??{},r=!t?.normal\|\|o?.normal=="0%"\|\|!o?.normal;return{disableOpacity:r}},exports.resetVideoIframeStyle=e=>{e&&(e.style.removeProperty("width"),e.style.removeProperty("height"),e.style.removeProperty("top"),e.style.removeProperty("left"),e.style.removeProperty("transform"),e.style.removeProperty("position"))},exports.resetVideoWrapperStyle=e=>{e.style.removeProperty("position"),e.style.removeProperty("top"),e.style.removeProperty("left"),e.style.removeProperty("width"),e.style.removeProperty("height")},exports.scrollToContentBanner=e=>e?.target?.closest("div.gp-hero-banner-row")?.scrollTo(0,0),exports.setVideoIframeAlign=(e,t)=>{if(!e)return;let o=x(t);e.style.top=o.top,e.style.transform=o.transform},exports.setVideoWrapperStyle=e=>{Object.assign(e.style,{position:"absolute",top:"0",left:"0",width:"100%",height:"100%"})},exports.showVideoType=t=>e.DEVICES.some(o=>{let r=e.getValueByDevice(t,o);return r?.type!=="color"&&r?.type!=="image"&&!!r&&(r?.videoType==="html5"&&r?.videoHtml5\|\|r?.videoType==="youtube"&&r?.video)}),exports.updateVideoIframeSize=({iframeEl:t,containerRatio:o,videoObjectFit:l,background:i,currentDevice:s,isYoutubeVideoMigrated:a})=>{let n,p;let b=S(i,s),g=e.getResponsiveValueByScreen(i,s);if(!t\|\|!o)return;let c=g?.videoAlign\|\|"top",u=x(c);if("contain"===l){Object.assign(t.style,{position:"absolute",top:"50%",left:"50%",width:"100%",height:"100%",maxWidth:"none",transform:`translate(-50%, -50%) scale(${r.VIDEO_IFRAME_SCALE})`});return}o>=b?(n=100,p=o/b100):(p=100,n=b/o100),Object.assign(t.style,{position:"absolute",top:u.top,left:"50%",width:a?"500%":`${n}%`,height:a?"100%":`${p}%`,maxWidth:"none",transform:u.transform})};
1	+ "use strict";var e=require("@gem-sdk/core"),t=require("../../image/common/helpers.js"),o=require("../../constant.js"),r=require("./const.js");const l=(t,o,r)=>{let l={};return e.DEVICES.map(i=>{let s=e.getResponsiveValueByScreen(t,i),a=e.getResponsiveValueByScreen(o,i),n=e.getResponsiveValueByScreen(r,i);l={...l,[i]:1>=(s?.cols?.length\|\|1)?a:n}}),l},i=e=>{if(!e)return{};let t={desktop:e?.desktop?.image,tablet:e?.tablet?.image,mobile:e?.mobile?.image};return t},s=e=>{let o=i(e);return{desktop:t.createBlurDataURL(o?.desktop?.width??0,o?.desktop?.height??0),tablet:t.createBlurDataURL(o?.tablet?.width??o?.desktop?.width??0,o?.tablet?.height??o?.desktop?.width??0),mobile:t.createBlurDataURL(o?.mobile?.width??o?.tablet?.width??o?.desktop?.width??0,o?.mobile?.height??o?.tablet?.height??o?.desktop?.width??0)}},a=(o,r,l,a)=>{if(!o)return"";let n=i(o),p=e.getResponsiveValueByScreen(o,r),b=l?`url(${s(o)[r]})`:`url(${t.getImageSrc(e.getResponsiveValueByScreen(n,r),r,a)})`,g=p?.color?`, ${p.color}`:"";return p?.color?.includes(e.GRADIENT_BGR_KEY)&&p?.type==="image"?`${b}${g}`:p?.color?.includes(e.GRADIENT_BGR_KEY)&&p?.type!=="image"?`${p.color}`:p?.type==="image"?b:"url()"},n=(e,t)=>{switch(e){case"desktop":if(t?.desktop?.type==="video")return{device:"desktop",data:t.desktop};break;case"tablet":if(t?.tablet?.type==="video")return{device:"tablet",data:t.tablet};if(!t?.tablet&&t?.desktop?.type==="video")return{device:"desktop",data:t.desktop};break;case"mobile":if(t?.mobile?.type==="video")return{device:"mobile",data:t.mobile};if(!t?.mobile&&t?.tablet?.type==="video")return{device:"tablet",data:t.tablet};if(!t?.mobile&&!t?.tablet?.type&&t?.desktop?.type==="video")return{device:"desktop",data:t.desktop}}},p=(e,t)=>{if(!e)return t;let o=e?.shapeVideo;return"custom"===o?e?.shapeValue\|\|t:void 0!==o?o:e?.shapeValue??t},b=({shapeByDevice:e,fallbackRatio:t,device:o,currentResult:r})=>{let l=p(e,t);return l?{...r,[o]:l}:r},g=e=>{let t={};for(let o in e)"top"===e[o]?t[o]="start":"bottom"===e[o]?t[o]="end":t[o]="center";return t},c=(e,t)=>{if(!e)return;if(!t)return e.shapeValue;let o=e.shapeVideo;return"custom"===o?e.shapeValue:o},u=(t,o)=>{let r=!1,l=e.DEVICES.reduce((l,i)=>{let s=e.getResponsiveValueByScreen(t,i),a=e.getResponsiveValueByScreen(o,i),n=c(s,a?.type==="video");return n&&(l[i]=n,r=!0),l},{});return{aspectRatio:r?l:void 0}},d=(t,o,r)=>e.DEVICES.reduce((l,i)=>{let s=e.getValueByDevice(t,i),a=s?.type==="video"?s?.videoType:void 0,n=e.getValueByDevice(o,i),p=r?.[i];return p&&"youtube"===a&&"cover"!==n&&(l[i]=p),l},{}),m=({enableParallax:e=!1,attachment:t="scroll"})=>!!e\|\|"fixed"===t,y=(t,o)=>{let r={};return["desktop","mobile","tablet"].forEach(l=>{let i=e.getResponsiveValueByScreen(t,l),s=i?.type==="image"&&o,a=m({enableParallax:s,attachment:t[l]?.attachment});r={...r,[l]:s?"150%":a?"100vh":"100%"}}),e.makeStyleResponsive("h",r)},h=(t,o)=>{let r={};return["desktop","mobile","tablet"].forEach(l=>{let i=e.getResponsiveValueByScreen(t,l),s=i?.type==="image"&&o,a=m({enableParallax:s,attachment:t[l]?.attachment});r={...r,[l]:a?"100vw":"100%"}}),e.makeStyleResponsive("w",r)},f=t=>{let o={};return["desktop","mobile","tablet"].forEach(e=>{o={...o,[e]:t[e]?.attachment==="fixed"?"0px":""}}),e.makeStyleResponsive("top",o)},I=(e,t=0,o=0)=>{let r=t,l=t;if(t>o?r=o:l=o,e>=999){let t=e-r;return t>0?t:0}let i=e-l;return i>0?i:0},v=({device:e,settingLayoutRes:t,contentPosition1ColRes:o})=>{let r=t[e]?.cols??[],l=r.length<=1,i=o[e];if(l&&i)return["space-between","top","center","bottom"].includes(i)?i:void 0},k=e=>{let t=e.desktop,o=e.tablet?e.tablet:t,r=e.mobile?e.mobile:o;return{desktop:t,tablet:o,mobile:r}},S=(t,o)=>{if(!t\|\|!o)return 16/9;let r=e.getResponsiveValueByScreen(t,o),l=r?.videoCustomRatio;if(l?.width&&l?.height){let e=Number(l.width),t=Number(l.height);if(e>0&&t>0)return e/t}return 16/9},x=e=>{switch(e){case"top":default:return{top:"0%",transform:`translate(-50%, 0%) scale(${r.VIDEO_IFRAME_SCALE})`};case"bottom":return{top:"100%",transform:`translate(-50%, -100%) scale(${r.VIDEO_IFRAME_SCALE})`};case"center":return{top:"50%",transform:`translate(-50%, -50%) scale(${r.VIDEO_IFRAME_SCALE})`}}};exports.collectAspectRatioByDevice=u,exports.collectYoutubeAspectRatio=d,exports.debounce=function(e,t){let o;return function(...r){clearTimeout(o),o=setTimeout(()=>e.apply(this,r),t)}},exports.fallbackImg="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkyMCIgaGVpZ2h0PSI5MDAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZGVmcz4KICAgICAgPGxpbmVhckdyYWRpZW50IGlkPSJnLTE5MjAtOTAwIj4KICAgICAgICA8c3RvcCBzdG9wLWNvbG9yPSJyZ2JhKDUxLCA1MSwgNTEsIDApIiBvZmZzZXQ9IjIwJSIgLz4KICAgICAgICA8c3RvcCBzdG9wLWNvbG9yPSJyZ2JhKDUxLCA1MSwgNTEsIDApIiBvZmZzZXQ9IjUwJSIgLz4KICAgICAgICA8c3RvcCBzdG9wLWNvbG9yPSJyZ2JhKDUxLCA1MSwgNTEsIDApIiBvZmZzZXQ9IjcwJSIgLz4KICAgICAgPC9saW5lYXJHcmFkaWVudD4KICAgIDwvZGVmcz4KICAgIDxyZWN0IHdpZHRoPSIxOTIwIiBoZWlnaHQ9IjkwMCIgZmlsbD0icmdiYSg1MSwgNTEsIDUxLCAwKSIgLz4KICAgIDxyZWN0IGlkPSJyIiB3aWR0aD0iMTkyMCIgaGVpZ2h0PSI5MDAiIGZpbGw9InVybCgjZy0xOTIwLTkwMCkiIC8+CiAgICA8YW5pbWF0ZSB4bGluazpocmVmPSIjciIgYXR0cmlidXRlTmFtZT0ieCIgZnJvbT0iLTE5MjAiIHRvPSIxOTIwIiBkdXI9IjFzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgIC8+CiAgPC9zdmc+",exports.formatHoverScale=e=>e?String(e).includes("%")?`${e}`:`${e}%`:"100%",exports.getAspectRatio=(e,t)=>{let{aspectRatio:o}=u(e,t);return o},exports.getAttachmentDevice=e=>{let t={};return["desktop","mobile","tablet"].forEach(o=>{let r=e?.[o]?.attachment;t={...t,[o]:"fixed"===r?"fixed":"absolute"}}),t},exports.getBackgroundImageHeroBanner=(t,o=!1,r=!1)=>{if(!t)return;let l={};return e.DEVICES.forEach(e=>{l={...l,[e]:a(t,e,o,r)}}),e.makeStyleResponsive("bgi",l)},exports.getBannerLink=e=>{let t=e?.link;return t?.type==="go-to-sales-page"?{type:"go-to-sales-page",link:o.HREF_TO_SALES_PAGE,target:"_self"}:t},exports.getBgImage=i,exports.getClassAlignBanner=e=>({"!gp-self-start":"left"===e.desktop,"!gp-self-center":"center"===e.desktop,"!gp-self-end":"right"===e.desktop,"tablet:!gp-self-start":"left"===e.tablet,"tablet:!gp-self-center":"center"===e.tablet,"tablet:!gp-self-end":"right"===e.tablet,"mobile:!gp-self-start":"left"===e.mobile,"mobile:!gp-self-center":"center"===e.mobile,"mobile:!gp-self-end":"right"===e.mobile}),exports.getClassContentPosition=e=>{let t={center:"center",top:"start",bottom:"end","space-between":"between"},o=e.desktop\|\|"center",r=e.tablet\|\|o,l=e.mobile\|\|r;return{[`gp-justify-${t[o]}`]:!0,[`tablet:gp-justify-${t[r]}`]:!0,[`mobile:gp-justify-${t[l]}`]:!0}},exports.getClassForContentByFitContent=(t,o)=>{let r={desktop:!1,tablet:!1,mobile:!1};return["desktop","mobile","tablet"].forEach(l=>{let i=e.getResponsiveValueByScreen(t,l),s=!!n(l,o),a=i?.shape,p=i?.height;r={...r,[l]:"original"===a&&"fit-content"!==p&&!s}}),e.cls(r.desktop?"!gp-absolute":"",r.tablet?"tablet:!gp-absolute":"tablet:!gp-relative",r.mobile?"mobile:!gp-absolute":"mobile:!gp-relative")},exports.getClassForStretchContent=t=>{let o={desktop:"none",tablet:"none",mobile:"none"};return["desktop","mobile","tablet"].forEach(r=>{let l=e.getResponsiveValueByScreen(t,r);o={...o,[r]:l}}),e.cls("space-between"===o.desktop?"[&>>]:!gp-justify-between":"","space-between"===o.tablet?"tablet:[&>>]:!gp-justify-between ":`tablet:[&>>]:!gp-justify-${t?.tablet}`,"space-between"===o.mobile?"mobile:[&>>]:!gp-justify-between ":`mobile:[&>>]:!gp-justify-${t?.mobile}`)},exports.getClassSpaceBetween=(t,o)=>{let r=k(t),l=k(o),i={desktop:v({device:"desktop",settingLayoutRes:r,contentPosition1ColRes:l}),tablet:v({device:"tablet",settingLayoutRes:r,contentPosition1ColRes:l}),mobile:v({device:"mobile",settingLayoutRes:r,contentPosition1ColRes:l})},s={"space-between":{desktop:"!gp-h-full !gp-content-stretch [&>]:!gp-justify-between [&>:nth-child(3)]:gp-absolute [&>:nth-child(3)]:gp-hidden",tablet:"tablet:!gp-h-full tablet:!gp-content-stretch tablet:[&>]:!gp-justify-between tablet:[&>:nth-child(3)]:gp-absolute tablet:[&>:nth-child(3)]:gp-hidden",mobile:"mobile:!gp-h-full mobile:!gp-content-stretch mobile:[&>]:!gp-justify-between mobile:[&>:nth-child(3)]:gp-absolute mobile:[&>:nth-child(3)]:gp-hidden"},top:{desktop:"!gp-content-stretch [&>]:!gp-justify-start",tablet:"tablet:!gp-content-stretch tablet:[&>]:!gp-justify-start",mobile:"mobile:!gp-content-stretch mobile:[&>]:!gp-justify-start"},center:{desktop:"!gp-content-stretch [&>]:!gp-justify-center",tablet:"tablet:!gp-content-stretch tablet:[&>]:!gp-justify-center",mobile:"mobile:!gp-content-stretch mobile:[&>]:!gp-justify-center"},bottom:{desktop:"!gp-content-stretch [&>]:!gp-justify-end",tablet:"tablet:!gp-content-stretch tablet:[&>]:!gp-justify-end",mobile:"mobile:!gp-content-stretch mobile:[&>]:!gp-justify-end"}},a={};return e.DEVICES.forEach(e=>{let t=i[e],o=s?.[t]?.[e];a[o]=!0}),a},exports.getClassSpaceBetweenLeftRight=e=>{let t=k(e),o=t?.desktop?.type=="left-distributed"\|\|t?.desktop?.type=="right-distributed",r=t?.tablet?.type=="left-distributed"\|\|t?.tablet?.type=="right-distributed",l=t?.mobile?.type=="left-distributed"\|\|t?.mobile?.type=="right-distributed";return{"gp-h-full tablet:gp-h-auto mobile:gp-h-auto [&>]:!gp-justify-between":o,"tablet:!gp-h-full tablet:[&>]:!gp-justify-between mobile:gp-h-auto":r,"mobile:!gp-h-full mobile:[&>]:!gp-justify-between":l,"mobile:!gp-h-auto":!l}},exports.getClipPath=(e,t)=>{if(!t)return`${r.DEFAULT_CLIP_PATH}`;let[o,l,i,s]=(e??"0 0 0 0").split(" ").map(e=>parseInt(e??"0")\|\|0),{btlr:a,btrr:n,bbrr:p,bblr:b}=t,g=I(parseInt(a??"0")\|\|0,o,s),c=I(parseInt(n??"0")\|\|0,o,l),u=I(parseInt(p??"0")\|\|0,l,i),d=I(parseInt(b??"0")\|\|0,i,s);return[g,c,u,d].every(e=>0===e)?`${r.DEFAULT_CLIP_PATH}`:`inset(0 0 0 round ${g}px ${c}px ${u}px ${d}px)`},exports.getContainerRatio=e=>{if(!e)return 0;let{width:t,height:o}=e.getBoundingClientRect();return t&&o?t/o:0},exports.getContentPosition=l,exports.getDataVideoHeroBannerResponsive=n,exports.getDisplayStyleByFitContent=(t,o)=>{let r={desktop:"none",tablet:"none",mobile:"none"};return["desktop","mobile","tablet"].forEach(l=>{let i=e.getResponsiveValueByScreen(t,l),s=!!n(l,o),a=i?.shape,p=i?.height;r={...r,[l]:"original"!==a\|\|"fit-content"===p\|\|s?"none":"block"}}),e.makeStyleResponsive("d",r)},exports.getEnableBgImageByDevice=(t,o)=>{if(!e.getResponsiveValueByScreen(i(o),t))return!1;if(!o?.[t]){if("mobile"===t)return o?.tablet?.type==="image"\|\|o?.desktop?.type==="image"&&!o?.tablet;if("tablet"===t)return o?.desktop?.type==="image"}return o?.[t]?.type==="image"},exports.getOpacityHover=e=>{let{overlayOpacity:t}=e??{},o="number"!=typeof t?.hover\|\|isNaN(t?.hover)?"string"==typeof t?.hover?`${parseInt(t?.hover)}%`:"":`${t?.hover}%`,r="number"!=typeof t?.normal\|\|isNaN(t?.normal)?"string"==typeof t?.normal?`${parseInt(t?.normal)}%`:"0%":`${t?.normal}%`;return o\|\|r},exports.getPercentageVisible=(e,t)=>{let{top:o,height:r}=e,l=-r;return o<l?0:o>t?100:Math.min(Math.max((o-l)/(t-l)100,0),100)},exports.getResponsiveSetting=k,exports.getStyleAspectRatioHeroBannerCustom=(t,o)=>{let r=e.getAspectRatioGlobalSize(o);return["desktop","mobile","tablet"].forEach(l=>{let i=e.getResponsiveValueByScreen(o,l),s=!!n(l,t);s&&(r=b({shapeByDevice:i,fallbackRatio:"auto",device:l,currentResult:r}))}),e.makeStyleResponsive("aspect",r)},exports.getStyleHeroBannerBg=(e,t)=>{let o=y(e,t),r=h(e,t),l=f(e);return{...o,...r,...l}},exports.getVideoAspectRatio=S,exports.getVisibilityStyle=e=>e?Object.keys(e).filter(e=>["--d","--d-tablet","--d-mobile"].includes(e)).reduce((t,o)=>({...t,[o]:e?.[o]!=="none"?"flex":e?.[o]}),{}):{},exports.getWidth=e=>{let t={};return["desktop","mobile","tablet"].forEach(o=>{let r=e?.[o];r&&(t={...t,[o]:"default"===r?"var(--g-ct-w, 1200px)":r})}),t},exports.getYoutubeAspectRatio=(e,t,o)=>{let r=d(e,t,o);return Object.keys(r).length?r:void 0},exports.horizontalAlign=(e,t,o)=>g(l(e,t,o)),exports.imagePlaceholder=s,exports.isScaleImage=m,exports.mapContentPositionToHorizontal=g,exports.opacityEnabledData=e=>{let{overlayColor:t,overlayOpacity:o}=e??{},r=!t?.normal\|\|o?.normal=="0%"\|\|!o?.normal;return{disableOpacity:r}},exports.resetVideoIframeStyle=e=>{e&&(e.style.removeProperty("width"),e.style.removeProperty("height"),e.style.removeProperty("top"),e.style.removeProperty("left"),e.style.removeProperty("transform"),e.style.removeProperty("position"))},exports.resetVideoWrapperStyle=e=>{e.style.removeProperty("position"),e.style.removeProperty("top"),e.style.removeProperty("left"),e.style.removeProperty("width"),e.style.removeProperty("height")},exports.scrollToContentBanner=e=>e?.target?.closest("div.gp-hero-banner-row")?.scrollTo(0,0),exports.setVideoIframeAlign=(e,t)=>{if(!e)return;let o=x(t);e.style.top=o.top,e.style.transform=o.transform},exports.setVideoWrapperStyle=e=>{Object.assign(e.style,{position:"absolute",top:"0",left:"0",width:"100%",height:"100%"})},exports.showVideoType=t=>e.DEVICES.some(o=>{let r=e.getValueByDevice(t,o);return r?.type!=="color"&&r?.type!=="image"&&!!r&&(r?.videoType==="html5"&&r?.videoHtml5\|\|r?.videoType==="youtube"&&r?.video)}),exports.updateVideoIframeSize=({iframeEl:t,containerRatio:o,videoObjectFit:l,background:i,currentDevice:s,isYoutubeVideoMigrated:a})=>{let n,p;let b=S(i,s),g=e.getResponsiveValueByScreen(i,s);if(!t\|\|!o)return;let c=g?.videoAlign\|\|"top",u=x(c);if("contain"===l){Object.assign(t.style,{position:"absolute",top:"50%",left:"50%",width:"100%",height:"100%",maxWidth:"none",transform:`translate(-50%, -50%) scale(${r.VIDEO_IFRAME_SCALE})`});return}o>=b?(n=100,p=o/b100):(p=100,n=b/o100),Object.assign(t.style,{position:"absolute",top:u.top,left:"50%",width:a?"500%":`${n}%`,height:a?"100%":`${p}%`,maxWidth:"none",transform:u.transform})};

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,{enableLink:S,enableParallax:m}=u??{},k=n.getBackgroundTranslated({background:p?.background,uid:g?.uid,enableTranslate:!!l.HeroBanner?.background?.id,pageContext:h??{},isTranslateVideo:!0}),y=o.getBannerLink(u),{cssClass:C}=b??{},{urlData:$}=n.getInsertLinkData("",y),j=a.createStateOrContext({background:o.getResponsiveSetting(k||{}),uid:g?.uid,enableParallax:m&&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:y?.target??"_self",href:$?.href??"",linkType:y?.type??"",hoverEffectDuration:p?.hoverEffectDuration,isYoutubeVideoMigrated:u?.isYoutubeVideoMigrated}),P=!!y?.link&&S,E=a.createAttr({...t.getAttr({uid:g?.uid||""})}),q=a.createAttr(t.getAttrLink()),x=a.createStyle({...r.getStyle(p,u,f)}),R=a.createClass({...s.getClasses({setting:u,builderProps:g,advancedCssClass:C})}),A=a.createClass({...s.getLinkClasses()}),I=()=>e.default({setting:u,translatedBackground:k,styles:p,children:v,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,{enableLink:S,enableParallax:m}=u??{},k=n.getBackgroundTranslated({background:p?.background,uid:g?.uid,enableTranslate:!!l.HeroBanner?.background?.id,pageContext:h??{},isTranslateVideo:!0}),y=o.getBannerLink(u),{cssClass:C}=b??{},{urlData:$}=n.getInsertLinkData("",y),j=a.createStateOrContext({background:o.getResponsiveSetting(k||{}),uid:g?.uid,enableParallax:m&&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:y?.target??"_self",href:$?.href??"",linkType:y?.type??"",hoverEffectDuration:p?.hoverEffectDuration,isYoutubeVideoMigrated:u?.isYoutubeVideoMigrated}),P=!!y?.link&&S,E=a.createAttr({...t.getAttr({uid:g?.uid||""})}),q=a.createAttr(t.getAttrLink()),x=a.createStyle({...r.getStyle(p,u,f)}),R=a.createClass({...s.getClasses({setting:u,builderProps:g,advancedCssClass:C})}),A=a.createClass({...s.getLinkClasses()}),I=()=>e.default({setting:u,translatedBackground:k,styles:p,children:v,rawChildren:c.rawChildren,builderProps:g,pageContext:h});return i.template`
       <gp-hero-banner
-        ${{...c}}
+        ${{...d}}
         ${{...E}}
         class="${R}"
         style="${x}"
-        gp-data='${i.dataStringify(j)}'
       >
+        <script gp-data type="application/json">${i.dataStringify(j)}</script>
         ${a.If(!P,I())}
         ${a.If(P,i.template`
           <div

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

@@ -1,4 +1,4 @@
-"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()),q=l.createClass(a.getClassTextItem({setting:d})),f=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}}
@@ -6,12 +6,12 @@
       data-id="${o?.uid}"
       style="${f}"
       className="${$}"
-      gp-data='${e.dataStringify({position:g?.position,iconWidth:p?.iconWidth}).replaceAll("'","&#039;")}'
     >
+      <script gp-data type="application/json">${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}"

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

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>
 `};