@gem-sdk/components 17.0.0-dev.14 → 17.0.0-dev.141

package/dist/esm/hero-banner/common/helpers.js

@@ -1 +1 @@
-import{DEVICES as e,makeStyleResponsive as t,getValueByDevice as o,getAspectRatioGlobalSize as l,getResponsiveValueByScreen as i,cls as r,GRADIENT_BGR_KEY as a}from"@gem-sdk/core";import{getImageSrc as n,createBlurDataURL as s}from"../../image/common/helpers.js";import{HREF_TO_SALES_PAGE as p}from"../../constant.js";import{DEFAULT_CLIP_PATH as b,VIDEO_IFRAME_SCALE as g}from"./const.js";let d=(t,o,l)=>{let r={};return e.map(e=>{let a=i(t,e),n=i(o,e),s=i(l,e);r={...r,[e]:1>=(a?.cols?.length||1)?n:s}}),r},c=(e,t)=>{if(!i(m(t),e))return!1;if(!t?.[e]){if("mobile"===e)return t?.tablet?.type==="image"||t?.desktop?.type==="image"&&!t?.tablet;if("tablet"===e)return t?.desktop?.type==="image"}return t?.[e]?.type==="image"},m=e=>{if(!e)return{};let t={desktop:e?.desktop?.image,tablet:e?.tablet?.image,mobile:e?.mobile?.image};return t},u=e=>{let t=m(e);return{desktop:s(t?.desktop?.width??0,t?.desktop?.height??0),tablet:s(t?.tablet?.width??t?.desktop?.width??0,t?.tablet?.height??t?.desktop?.width??0),mobile:s(t?.mobile?.width??t?.tablet?.width??t?.desktop?.width??0,t?.mobile?.height??t?.tablet?.height??t?.desktop?.width??0)}},h=(e,t,o,l)=>{if(!e)return"";let r=m(e),s=i(e,t),p=o?`url(${u(e)[t]})`:`url(${n(i(r,t),t,l)})`,b=s?.color?`, ${s.color}`:"";return s?.color?.includes(a)&&s?.type==="image"?`${p}${b}`:s?.color?.includes(a)&&s?.type!=="image"?`${s.color}`:s?.type==="image"?p:"url()"},y=(o,l=!1,i=!1)=>{if(!o)return;let r={};return e.forEach(e=>{r={...r,[e]:h(o,e,l,i)}}),t("bgi",r)},f=e=>{let t={};return["desktop","mobile","tablet"].forEach(o=>{let l=e?.[o]?.attachment;t={...t,[o]:"fixed"===l?"fixed":"absolute"}}),t},I=(e,t,o)=>S(d(e,t,o)),v=e=>e?.target?.closest("div.gp-hero-banner-row")?.scrollTo(0,0),k=(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}}},w=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]}),{}):{},C=(e,t)=>{if(!e)return t;let o=e?.shapeVideo;return"custom"===o?e?.shapeValue||t:void 0!==o?o:e?.shapeValue??t},A=({shapeByDevice:e,fallbackRatio:t,device:o,currentResult:l})=>{let i=C(e,t);return i?{...l,[o]:i}:l},j=(e,o)=>{let r=l(o);return["desktop","mobile","tablet"].forEach(t=>{let l=i(o,t),a=!!k(t,e);a&&(r=A({shapeByDevice:l,fallbackRatio:"auto",device:t,currentResult:r}))}),t("aspect",r)},S=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},Z=(e,o)=>{let l={desktop:"none",tablet:"none",mobile:"none"};return["desktop","mobile","tablet"].forEach(t=>{let r=i(e,t),a=!!k(t,o),n=r?.shape,s=r?.height;l={...l,[t]:"original"!==n||"fit-content"===s||a?"none":"block"}}),t("d",l)},B=(e,t)=>{if(!e)return;if(!t)return e.shapeValue;let o=e.shapeVideo;return"custom"===o?e.shapeValue:o},P=(t,o)=>{let l=!1,r=e.reduce((e,r)=>{let a=i(t,r),n=i(o,r),s=B(a,n?.type==="video");return s&&(e[r]=s,l=!0),e},{});return{aspectRatio:l?r:void 0}},x=(t,l,i)=>e.reduce((e,r)=>{let a=o(t,r),n=a?.type==="video"?a?.videoType:void 0,s=o(l,r),p=i?.[r];return p&&"youtube"===n&&"cover"!==s&&(e[r]=p),e},{}),$=(e,t)=>{let{aspectRatio:o}=P(e,t);return o},D=(e,t,o)=>{let l=x(e,t,o);return Object.keys(l).length?l:void 0},R=e=>{let t={};return["desktop","mobile","tablet"].forEach(o=>{let l=e?.[o];l&&(t={...t,[o]:"default"===l?"var(--g-ct-w, 1200px)":l})}),t},T=(e,t)=>{let{top:o,height:l}=e,i=-l;return o<i?0:o>t?100:Math.min(Math.max((o-i)/(t-i)*100,0),100)},V=({enableParallax:e=!1,attachment:t="scroll"})=>!!e||"fixed"===t,z=(e,o)=>{let l={};return["desktop","mobile","tablet"].forEach(t=>{let r=i(e,t),a=r?.type==="image"&&o,n=V({enableParallax:a,attachment:e[t]?.attachment});l={...l,[t]:a?"150%":n?"100vh":"100%"}}),t("h",l)},M=(e,o)=>{let l={};return["desktop","mobile","tablet"].forEach(t=>{let r=i(e,t),a=r?.type==="image"&&o,n=V({enableParallax:a,attachment:e[t]?.attachment});l={...l,[t]:n?"100vw":"100%"}}),t("w",l)},W=e=>{let o={};return["desktop","mobile","tablet"].forEach(t=>{o={...o,[t]:e[t]?.attachment==="fixed"?"0px":""}}),t("top",o)},E=(e,t)=>{let o=z(e,t),l=M(e,t),i=W(e);return{...o,...l,...i}},G=(e,t=0,o=0)=>{let l=t,i=t;if(t>o?l=o:i=o,e>=999){let t=e-l;return t>0?t:0}let r=e-i;return r>0?r:0},L=(e,t)=>{if(!t)return`${b}`;let[o,l,i,r]=(e??"0 0 0 0").split(" ").map(e=>parseInt(e??"0")||0),{btlr:a,btrr:n,bbrr:s,bblr:p}=t,g=G(parseInt(a??"0")||0,o,r),d=G(parseInt(n??"0")||0,o,l),c=G(parseInt(s??"0")||0,l,i),m=G(parseInt(p??"0")||0,i,r);return[g,d,c,m].every(e=>0===e)?`${b}`:`inset(0 0 0 round ${g}px ${d}px ${c}px ${m}px)`},H=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}),N=({device:e,settingLayoutRes:t,contentPosition1ColRes:o})=>{let l=t[e]?.cols??[],i=l.length<=1,r=o[e];if(i&&r)return["space-between","top","center","bottom"].includes(r)?r:void 0},J=(t,o)=>{let l=Y(t),i=Y(o),r={desktop:N({device:"desktop",settingLayoutRes:l,contentPosition1ColRes:i}),tablet:N({device:"tablet",settingLayoutRes:l,contentPosition1ColRes:i}),mobile:N({device:"mobile",settingLayoutRes:l,contentPosition1ColRes:i})},a={"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"}},n={};return e.forEach(e=>{let t=r[e],o=a?.[t]?.[e];n[o]=!0}),n},K=e=>{let t=Y(e),o=t?.desktop?.type=="left-distributed"||t?.desktop?.type=="right-distributed",l=t?.tablet?.type=="left-distributed"||t?.tablet?.type=="right-distributed",i=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":l,"mobile:!gp-h-full mobile:[&>*]:!gp-justify-between":i,"mobile:!gp-h-auto":!i}},O=e=>{let t={desktop:"none",tablet:"none",mobile:"none"};return["desktop","mobile","tablet"].forEach(o=>{let l=i(e,o);t={...t,[o]:l}}),r("space-between"===t.desktop?"[&>*>*]:!gp-justify-between":"","space-between"===t.tablet?"tablet:[&>*>*]:!gp-justify-between ":`tablet:[&>*>*]:!gp-justify-${e?.tablet}`,"space-between"===t.mobile?"mobile:[&>*>*]:!gp-justify-between ":`mobile:[&>*>*]:!gp-justify-${e?.mobile}`)},X=(e,t)=>{let o={desktop:!1,tablet:!1,mobile:!1};return["desktop","mobile","tablet"].forEach(l=>{let r=i(e,l),a=!!k(l,t),n=r?.shape,s=r?.height;o={...o,[l]:"original"===n&&"fit-content"!==s&&!a}}),r(o.desktop?"!gp-absolute":"",o.tablet?"tablet:!gp-absolute":"tablet:!gp-relative",o.mobile?"mobile:!gp-absolute":"mobile:!gp-relative")},F=e=>{let t={center:"center",top:"start",bottom:"end","space-between":"between"},o=e.desktop||"center",l=e.tablet||o,i=e.mobile||l;return{[`gp-justify-${t[o]}`]:!0,[`tablet:gp-justify-${t[l]}`]:!0,[`mobile:gp-justify-${t[i]}`]:!0}},Y=e=>{let t=e.desktop,o=e.tablet?e.tablet:t,l=e.mobile?e.mobile:o;return{desktop:t,tablet:o,mobile:l}},U=t=>e.some(e=>{let l=o(t,e);return l?.type!=="color"&&l?.type!=="image"&&!!l&&(l?.videoType==="html5"&&l?.videoHtml5||l?.videoType==="youtube"&&l?.video)});function Q(e,t){let o;return function(...l){clearTimeout(o),o=setTimeout(()=>e.apply(this,l),t)}}let _="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkyMCIgaGVpZ2h0PSI5MDAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZGVmcz4KICAgICAgPGxpbmVhckdyYWRpZW50IGlkPSJnLTE5MjAtOTAwIj4KICAgICAgICA8c3RvcCBzdG9wLWNvbG9yPSJyZ2JhKDUxLCA1MSwgNTEsIDApIiBvZmZzZXQ9IjIwJSIgLz4KICAgICAgICA8c3RvcCBzdG9wLWNvbG9yPSJyZ2JhKDUxLCA1MSwgNTEsIDApIiBvZmZzZXQ9IjUwJSIgLz4KICAgICAgICA8c3RvcCBzdG9wLWNvbG9yPSJyZ2JhKDUxLCA1MSwgNTEsIDApIiBvZmZzZXQ9IjcwJSIgLz4KICAgICAgPC9saW5lYXJHcmFkaWVudD4KICAgIDwvZGVmcz4KICAgIDxyZWN0IHdpZHRoPSIxOTIwIiBoZWlnaHQ9IjkwMCIgZmlsbD0icmdiYSg1MSwgNTEsIDUxLCAwKSIgLz4KICAgIDxyZWN0IGlkPSJyIiB3aWR0aD0iMTkyMCIgaGVpZ2h0PSI5MDAiIGZpbGw9InVybCgjZy0xOTIwLTkwMCkiIC8+CiAgICA8YW5pbWF0ZSB4bGluazpocmVmPSIjciIgYXR0cmlidXRlTmFtZT0ieCIgZnJvbT0iLTE5MjAiIHRvPSIxOTIwIiBkdXI9IjFzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgIC8+CiAgPC9zdmc+",q=e=>{let t=e?.link;return t?.type==="go-to-sales-page"?{type:"go-to-sales-page",link:p,target:"_self"}:t},ee=e=>e?String(e).includes("%")?`${e}`:`${e}%`:"100%",et=e=>{let{overlayColor:t,overlayOpacity:o}=e??{},l=!t?.normal||o?.normal=="0%"||!o?.normal;return{disableOpacity:l}},eo=e=>{let{overlayOpacity:t}=e??{},o="number"!=typeof t?.hover||isNaN(t?.hover)?"string"==typeof t?.hover?`${parseInt(t?.hover)}%`:"":`${t?.hover}%`,l="number"!=typeof t?.normal||isNaN(t?.normal)?"string"==typeof t?.normal?`${parseInt(t?.normal)}%`:"0%":`${t?.normal}%`;return o||l},el=(e,t)=>{if(!e||!t)return 16/9;let o=i(e,t),l=o?.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},ei=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"))},er=e=>{Object.assign(e.style,{position:"absolute",top:"0",left:"0",width:"100%",height:"100%"})},ea=e=>{e.style.removeProperty("position"),e.style.removeProperty("top"),e.style.removeProperty("left"),e.style.removeProperty("width"),e.style.removeProperty("height")},en=e=>{if(!e)return 0;let{width:t,height:o}=e.getBoundingClientRect();return t&&o?t/o:0},es=e=>{switch(e){case"top":default:return{top:"0%",transform:`translate(-50%, 0%) scale(${g})`};case"bottom":return{top:"100%",transform:`translate(-50%, -100%) scale(${g})`};case"center":return{top:"50%",transform:`translate(-50%, -50%) scale(${g})`}}},ep=(e,t)=>{if(!e)return;let o=es(t);e.style.top=o.top,e.style.transform=o.transform},eb=({iframeEl:e,containerRatio:t,videoObjectFit:o,background:l,currentDevice:r,isYoutubeVideoMigrated:a})=>{let n,s;let p=el(l,r),b=i(l,r);if(!e||!t)return;let d=b?.videoAlign||"top",c=es(d);if("contain"===o){Object.assign(e.style,{position:"absolute",top:"50%",left:"50%",width:"100%",height:"100%",maxWidth:"none",transform:`translate(-50%, -50%) scale(${g})`});return}t>=p?(n=100,s=t/p*100):(s=100,n=p/t*100),Object.assign(e.style,{position:"absolute",top:c.top,left:"50%",width:a?"500%":`${n}%`,height:a?"100%":`${s}%`,maxWidth:"none",transform:c.transform})};export{P as collectAspectRatioByDevice,x as collectYoutubeAspectRatio,Q as debounce,_ as fallbackImg,ee as formatHoverScale,$ as getAspectRatio,f as getAttachmentDevice,y as getBackgroundImageHeroBanner,q as getBannerLink,m as getBgImage,H as getClassAlignBanner,F as getClassContentPosition,X as getClassForContentByFitContent,O as getClassForStretchContent,J as getClassSpaceBetween,K as getClassSpaceBetweenLeftRight,L as getClipPath,en as getContainerRatio,d as getContentPosition,k as getDataVideoHeroBannerResponsive,Z as getDisplayStyleByFitContent,c as getEnableBgImageByDevice,eo as getOpacityHover,T as getPercentageVisible,Y as getResponsiveSetting,j as getStyleAspectRatioHeroBannerCustom,E as getStyleHeroBannerBg,el as getVideoAspectRatio,w as getVisibilityStyle,R as getWidth,D as getYoutubeAspectRatio,I as horizontalAlign,u as imagePlaceholder,V as isScaleImage,S as mapContentPositionToHorizontal,et as opacityEnabledData,ei as resetVideoIframeStyle,ea as resetVideoWrapperStyle,v as scrollToContentBanner,ep as setVideoIframeAlign,er as setVideoWrapperStyle,U as showVideoType,eb as updateVideoIframeSize};
+import{DEVICES as e,makeStyleResponsive as t,getValueByDevice as o,getAspectRatioGlobalSize as l,getResponsiveValueByScreen as i,cls as r,GRADIENT_BGR_KEY as a}from"@gem-sdk/core";import{getImageSrc as n,createBlurDataURL as s}from"../../image/common/helpers.js";import{HREF_TO_SALES_PAGE as p}from"../../constant.js";import{DEFAULT_CLIP_PATH as b,VIDEO_IFRAME_SCALE as g}from"./const.js";let d=(t,o,l)=>{let r={};return e.map(e=>{let a=i(t,e),n=i(o,e),s=i(l,e);r={...r,[e]:1>=(a?.cols?.length||1)?n:s}}),r},c=(e,t)=>{if(!i(m(t),e))return!1;if(!t?.[e]){if("mobile"===e)return t?.tablet?.type==="image"||t?.desktop?.type==="image"&&!t?.tablet;if("tablet"===e)return t?.desktop?.type==="image"}return t?.[e]?.type==="image"},m=e=>{if(!e)return{};let t={desktop:e?.desktop?.image,tablet:e?.tablet?.image,mobile:e?.mobile?.image};return t},u=e=>{let t=m(e);return{desktop:s(t?.desktop?.width??0,t?.desktop?.height??0),tablet:s(t?.tablet?.width??t?.desktop?.width??0,t?.tablet?.height??t?.desktop?.width??0),mobile:s(t?.mobile?.width??t?.tablet?.width??t?.desktop?.width??0,t?.mobile?.height??t?.tablet?.height??t?.desktop?.width??0)}},h=(e,t,o,l)=>{if(!e)return"";let r=m(e),s=i(e,t),p=o?`url(${u(e)[t]})`:`url(${n(i(r,t),t,l)})`,b=s?.color?`, ${s.color}`:"";return s?.color?.includes(a)&&s?.type==="image"?`${p}${b}`:s?.color?.includes(a)&&s?.type!=="image"?`${s.color}`:s?.type==="image"?p:"url()"},y=(o,l=!1,i=!1)=>{if(!o)return;let r={};return e.forEach(e=>{r={...r,[e]:h(o,e,l,i)}}),t("bgi",r)},f=e=>{let t={};return["desktop","mobile","tablet"].forEach(o=>{let l=e?.[o]?.attachment;t={...t,[o]:"fixed"===l?"fixed":"absolute"}}),t},I=(e,t,o)=>S(d(e,t,o)),v=e=>e?.target?.closest("div.gp-hero-banner-row")?.scrollTo(0,0),k=(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}}},w=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]}),{}):{},C=(e,t)=>{if(!e)return t;let o=e?.shapeVideo;return"custom"===o?e?.shapeValue||t:void 0!==o?o:e?.shapeValue??t},A=({shapeByDevice:e,fallbackRatio:t,device:o,currentResult:l})=>{let i=C(e,t);return i?{...l,[o]:i}:l},j=(e,o)=>{let r=l(o);return["desktop","mobile","tablet"].forEach(t=>{let l=i(o,t),a=!!k(t,e);a&&(r=A({shapeByDevice:l,fallbackRatio:"auto",device:t,currentResult:r}))}),t("aspect",r)},S=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},Z=(e,o)=>{let l={desktop:"none",tablet:"none",mobile:"none"};return["desktop","mobile","tablet"].forEach(t=>{let r=i(e,t),a=!!k(t,o),n=r?.shape,s=r?.height;l={...l,[t]:"original"!==n||"fit-content"===s||a?"none":"block"}}),t("d",l)},B=(e,t)=>{if(!e)return;if(!t)return e.shapeValue;let o=e.shapeVideo;return"custom"===o?e.shapeValue:o},P=(t,o)=>{let l=!1,r=e.reduce((e,r)=>{let a=i(t,r),n=i(o,r),s=B(a,n?.type==="video");return s&&(e[r]=s,l=!0),e},{});return{aspectRatio:l?r:void 0}},x=(t,l,i)=>e.reduce((e,r)=>{let a=o(t,r),n=a?.type==="video"?a?.videoType:void 0,s=o(l,r),p=i?.[r];return p&&"youtube"===n&&"cover"!==s&&(e[r]=p),e},{}),$=(e,t)=>{let{aspectRatio:o}=P(e,t);return o},D=(e,t,o)=>{let l=x(e,t,o);return Object.keys(l).length?l:void 0},R=e=>{let t={};return["desktop","mobile","tablet"].forEach(o=>{let l=e?.[o];l&&(t={...t,[o]:"default"===l?"var(--g-ct-w, 1200px)":l})}),t},T=(e,t)=>{let{top:o,height:l}=e,i=-l;return o<i?0:o>t?100:Math.min(Math.max((o-i)/(t-i)*100,0),100)},V=({enableParallax:e=!1,attachment:t="scroll"})=>!!e||"fixed"===t,z=(e,o)=>{let l={};return["desktop","mobile","tablet"].forEach(t=>{let r=i(e,t),a=r?.type==="image"&&o,n=V({enableParallax:a,attachment:e[t]?.attachment});l={...l,[t]:a?"150%":n?"100vh":"100%"}}),t("h",l)},M=(e,o)=>{let l={};return["desktop","mobile","tablet"].forEach(t=>{let r=i(e,t),a=r?.type==="image"&&o,n=V({enableParallax:a,attachment:e[t]?.attachment});l={...l,[t]:n?"100vw":"100%"}}),t("w",l)},W=e=>{let o={};return["desktop","mobile","tablet"].forEach(t=>{o={...o,[t]:e[t]?.attachment==="fixed"?"0px":""}}),t("top",o)},E=(e,t)=>{let o=z(e,t),l=M(e,t),i=W(e);return{...o,...l,...i}},G=(e,t=0,o=0)=>{let l=t,i=t;if(t>o?l=o:i=o,e>=999){let t=e-l;return t>0?t:0}let r=e-i;return r>0?r:0},L=(e,t)=>{if(!t)return`${b}`;let[o,l,i,r]=(e??"0 0 0 0").split(" ").map(e=>parseInt(e??"0")||0),{btlr:a,btrr:n,bbrr:s,bblr:p}=t,g=G(parseInt(a??"0")||0,o,r),d=G(parseInt(n??"0")||0,o,l),c=G(parseInt(s??"0")||0,l,i),m=G(parseInt(p??"0")||0,i,r);return[g,d,c,m].every(e=>0===e)?`${b}`:`inset(0 0 0 round ${g}px ${d}px ${c}px ${m}px)`},H=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}),N=({device:e,settingLayoutRes:t,contentPosition1ColRes:o})=>{let l=t[e]?.cols??[],i=l.length<=1,r=o[e];if(i&&r)return["space-between","top","center","bottom"].includes(r)?r:void 0},J=(t,o)=>{let l=Y(t),i=Y(o),r={desktop:N({device:"desktop",settingLayoutRes:l,contentPosition1ColRes:i}),tablet:N({device:"tablet",settingLayoutRes:l,contentPosition1ColRes:i}),mobile:N({device:"mobile",settingLayoutRes:l,contentPosition1ColRes:i})},a={"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"}},n={};return e.forEach(e=>{let t=r[e],o=a?.[t]?.[e];n[o]=!0}),n},K=e=>{let t=Y(e),o=t?.desktop?.type=="left-distributed"||t?.desktop?.type=="right-distributed",l=t?.tablet?.type=="left-distributed"||t?.tablet?.type=="right-distributed",i=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":l,"mobile:!gp-h-full mobile:[&>*]:!gp-justify-between":i,"mobile:!gp-h-auto":!i}},O=e=>{let t={desktop:"none",tablet:"none",mobile:"none"};return["desktop","mobile","tablet"].forEach(o=>{let l=i(e,o);t={...t,[o]:l}}),r("space-between"===t.desktop?"[&>*>*]:!gp-justify-between":"","space-between"===t.tablet?"tablet:[&>*>*]:!gp-justify-between ":`tablet:[&>*>*]:!gp-justify-${e?.tablet}`,"space-between"===t.mobile?"mobile:[&>*>*]:!gp-justify-between ":`mobile:[&>*>*]:!gp-justify-${e?.mobile}`)},X=(e,t)=>{let o={desktop:!1,tablet:!1,mobile:!1};return["desktop","mobile","tablet"].forEach(l=>{let r=i(e,l),a=!!k(l,t),n=r?.shape,s=r?.height;o={...o,[l]:"original"===n&&"fit-content"!==s&&!a}}),r(o.desktop?"!gp-absolute":"",o.tablet?"tablet:!gp-absolute":"tablet:!gp-relative",o.mobile?"mobile:!gp-absolute":"mobile:!gp-relative")},F=e=>{let t={center:"center",top:"start",bottom:"end","space-between":"between"},o=e.desktop||"center",l=e.tablet||o,i=e.mobile||l;return{[`gp-justify-${t[o]}`]:!0,[`tablet:gp-justify-${t[l]}`]:!0,[`mobile:gp-justify-${t[i]}`]:!0}},Y=e=>{let t=e.desktop,o=e.tablet?e.tablet:t,l=e.mobile?e.mobile:o;return{desktop:t,tablet:o,mobile:l}},U=t=>e.some(e=>{let l=o(t,e);return l?.type!=="color"&&l?.type!=="image"&&!!l&&(l?.videoType==="html5"&&l?.videoHtml5||l?.videoType==="youtube"&&l?.video)});function Q(e,t){let o;return function(...l){clearTimeout(o),o=setTimeout(()=>e.apply(this,l),t)}}let _="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkyMCIgaGVpZ2h0PSI5MDAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZGVmcz4KICAgICAgPGxpbmVhckdyYWRpZW50IGlkPSJnLTE5MjAtOTAwIj4KICAgICAgICA8c3RvcCBzdG9wLWNvbG9yPSJyZ2JhKDUxLCA1MSwgNTEsIDApIiBvZmZzZXQ9IjIwJSIgLz4KICAgICAgICA8c3RvcCBzdG9wLWNvbG9yPSJyZ2JhKDUxLCA1MSwgNTEsIDApIiBvZmZzZXQ9IjUwJSIgLz4KICAgICAgICA8c3RvcCBzdG9wLWNvbG9yPSJyZ2JhKDUxLCA1MSwgNTEsIDApIiBvZmZzZXQ9IjcwJSIgLz4KICAgICAgPC9saW5lYXJHcmFkaWVudD4KICAgIDwvZGVmcz4KICAgIDxyZWN0IHdpZHRoPSIxOTIwIiBoZWlnaHQ9IjkwMCIgZmlsbD0icmdiYSg1MSwgNTEsIDUxLCAwKSIgLz4KICAgIDxyZWN0IGlkPSJyIiB3aWR0aD0iMTkyMCIgaGVpZ2h0PSI5MDAiIGZpbGw9InVybCgjZy0xOTIwLTkwMCkiIC8+CiAgICA8YW5pbWF0ZSB4bGluazpocmVmPSIjciIgYXR0cmlidXRlTmFtZT0ieCIgZnJvbT0iLTE5MjAiIHRvPSIxOTIwIiBkdXI9IjFzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgIC8+CiAgPC9zdmc+",q=e=>{let t=e?.link;return t?.type==="go-to-sales-page"?{type:"go-to-sales-page",link:p,target:"_self"}:t},ee=e=>e?String(e).includes("%")?`${e}`:`${e}%`:"100%",et=e=>{let{overlayColor:t,overlayOpacity:o}=e??{},l=!t?.normal||o?.normal=="0%"||!o?.normal;return{disableOpacity:l}},eo=e=>{let{overlayOpacity:t}=e??{},o="number"!=typeof t?.hover||isNaN(t?.hover)?"string"==typeof t?.hover?`${parseInt(t?.hover)}%`:"":`${t?.hover}%`,l="number"!=typeof t?.normal||isNaN(t?.normal)?"string"==typeof t?.normal?`${parseInt(t?.normal)}%`:"0%":`${t?.normal}%`;return o||l},el=(e,t)=>{if(!e||!t)return 16/9;let o=i(e,t),l=o?.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},ei=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"))},er=e=>{Object.assign(e.style,{position:"absolute",top:"0",left:"0",width:"100%",height:"100%"})},ea=e=>{e.style.removeProperty("position"),e.style.removeProperty("top"),e.style.removeProperty("left"),e.style.removeProperty("width"),e.style.removeProperty("height")},en=e=>{if(!e)return 0;let{width:t,height:o}=e.getBoundingClientRect();return t&&o?t/o:0},es=e=>{switch(e){case"top":default:return{top:"0%",transform:`translate(-50%, 0%) scale(${g})`};case"bottom":return{top:"100%",transform:`translate(-50%, -100%) scale(${g})`};case"center":return{top:"50%",transform:`translate(-50%, -50%) scale(${g})`}}},ep=(e,t)=>{if(!e)return;let o=es(t);e.style.top=o.top,e.style.transform=o.transform},eb=({iframeEl:e,containerRatio:t,videoObjectFit:o,background:l,currentDevice:r,isYoutubeVideoMigrated:a})=>{let n,s;let p=el(l,r),b=i(l,r);if(!e||!t)return;let d=b?.videoAlign||"top",c=es(d);if("contain"===o){Object.assign(e.style,{position:"absolute",top:"50%",left:"50%",width:"100%",height:"100%",maxWidth:"none",transform:`translate(-50%, -50%) scale(${g})`});return}t>=p?(n=100,s=t/p*100):(s=100,n=p/t*100),Object.assign(e.style,{position:"absolute",top:c.top,left:"50%",width:a?"500%":`${n}%`,height:a?"100%":`${s}%`,maxWidth:"none",transform:c.transform})};export{P as collectAspectRatioByDevice,x as collectYoutubeAspectRatio,Q as debounce,_ as fallbackImg,ee as formatHoverScale,$ as getAspectRatio,f as getAttachmentDevice,y as getBackgroundImageHeroBanner,q as getBannerLink,m as getBgImage,H as getClassAlignBanner,F as getClassContentPosition,X as getClassForContentByFitContent,O as getClassForStretchContent,J as getClassSpaceBetween,K as getClassSpaceBetweenLeftRight,L as getClipPath,en as getContainerRatio,d as getContentPosition,k as getDataVideoHeroBannerResponsive,Z as getDisplayStyleByFitContent,c as getEnableBgImageByDevice,eo as getOpacityHover,T as getPercentageVisible,Y as getResponsiveSetting,j as getStyleAspectRatioHeroBannerCustom,E as getStyleHeroBannerBg,el as getVideoAspectRatio,w as getVisibilityStyle,R as getWidth,D as getYoutubeAspectRatio,I as horizontalAlign,u as imagePlaceholder,V as isScaleImage,S as mapContentPositionToHorizontal,et as opacityEnabledData,ei as resetVideoIframeStyle,ea as resetVideoWrapperStyle,v as scrollToContentBanner,ep as setVideoIframeAlign,er as setVideoWrapperStyle,U as showVideoType,eb as updateVideoIframeSize};

package/dist/esm/hero-banner/components/HeroBanner.liquid.js

@@ -1,13 +1,13 @@
-import e from"./HeroBannerItem.liquid.js";import{getAttr as r,getAttrLink as t}from"../common/attrs.js";import{getStyle as o}from"../common/styles.js";import{getClasses as s,getLinkClasses as a}from"../common/classes.js";import{createStateOrContext as i,createAttr as n,createStyle as l,createClass as d,If as c}from"@gem-sdk/system";import{dataStringify as m,template as p,RenderIf as f,isLocalEnv as u,baseAssetURL as g}from"@gem-sdk/core";import{getBackgroundTranslated as h,getInsertLinkData as v,getSettingPreloadData as b}from"../../helpers.js";import{getResponsiveSetting as $,getBannerLink as j}from"../common/helpers.js";import{HeroBanner as k}from"../settings/configs/translate.js";let E=E=>{let{builderAttrs:y,builderProps:C,setting:P,styles:S,style:x,children:B,advanced:T,pageContext:V}=E,{enableLazyLoadImage:H}=V??{},{enableLink:M,enableParallax:N}=P??{},O=h({background:S?.background,uid:C?.uid,enableTranslate:!!k?.background?.id,pageContext:V??{},isTranslateVideo:!0}),R=j(P),{cssClass:_}=T??{},{urlData:w}=v("",R),z=i({background:$(O||{}),uid:C?.uid,enableParallax:N&&Number(P?.speedParallax||0)>0,speedParallax:Number(P?.speedParallax)||0,hoverEffect:S?.hoverEffect,hoverEffectScale:S?.hoverEffectScale,layout:P?.layout,contentPosition1Col:S?.contentPosition1Col,contentPosition2Col:S?.contentPosition2Col,aspectRatio:P?.aspectRatio,sizeSetting:$(S?.sizeSetting||{}),videoObjectFit:$(S?.videoObjectFit||{}),target:R?.target??"_self",href:w?.href??"",linkType:R?.type??"",hoverEffectDuration:S?.hoverEffectDuration,isYoutubeVideoMigrated:P?.isYoutubeVideoMigrated}),A=!!R?.link&&M,D=n({...r({uid:C?.uid||""})}),F=n(t()),G=l({...o(S,P,x)}),I=d({...s({setting:P,builderProps:C,advancedCssClass:_})}),Y=d({...a()}),q=()=>e({setting:P,translatedBackground:O,styles:S,children:B,enableLazyLoadImage:H,rawChildren:E.rawChildren,builderProps:C,pageContext:V});return p`
+import e from"./HeroBannerItem.liquid.js";import{getAttr as r,getAttrLink as t}from"../common/attrs.js";import{getStyle as o}from"../common/styles.js";import{getClasses as s,getLinkClasses as a}from"../common/classes.js";import{createStateOrContext as i,createAttr as n,createStyle as l,createClass as d,If as c}from"@gem-sdk/system";import{dataStringify as p,template as m,RenderIf as f,isLocalEnv as u,baseAssetURL as g}from"@gem-sdk/core";import{getBackgroundTranslated as h,getInsertLinkData as v,getSettingPreloadData as b}from"../../helpers.js";import{getResponsiveSetting as $,getBannerLink as j}from"../common/helpers.js";import{HeroBanner as k}from"../settings/configs/translate.js";let y=y=>{let{builderAttrs:E,builderProps:C,setting:P,styles:S,style:x,children:B,advanced:T,pageContext:V}=y,{enableLazyLoadImage:H}=V??{},{enableLink:M,enableParallax:N}=P??{},O=h({background:S?.background,uid:C?.uid,enableTranslate:!!k?.background?.id,pageContext:V??{},isTranslateVideo:!0}),R=j(P),{cssClass:_}=T??{},{urlData:w}=v("",R),z=i({background:$(O||{}),uid:C?.uid,enableParallax:N&&Number(P?.speedParallax||0)>0,speedParallax:Number(P?.speedParallax)||0,hoverEffect:S?.hoverEffect,hoverEffectScale:S?.hoverEffectScale,layout:P?.layout,contentPosition1Col:S?.contentPosition1Col,contentPosition2Col:S?.contentPosition2Col,aspectRatio:P?.aspectRatio,sizeSetting:$(S?.sizeSetting||{}),videoObjectFit:$(S?.videoObjectFit||{}),target:R?.target??"_self",href:w?.href??"",linkType:R?.type??"",hoverEffectDuration:S?.hoverEffectDuration,isYoutubeVideoMigrated:P?.isYoutubeVideoMigrated}),A=!!R?.link&&M,D=n({...r({uid:C?.uid||""})}),F=n(t()),G=l({...o(S,P,x)}),I=d({...s({setting:P,builderProps:C,advancedCssClass:_})}),Y=d({...a()}),q=()=>e({setting:P,translatedBackground:O,styles:S,children:B,enableLazyLoadImage:H,rawChildren:y.rawChildren,builderProps:C,pageContext:V});return m`
       <gp-hero-banner
-        ${{...y}}
+        ${{...E}}
         ${{...D}}
         class="${I}"
         style="${G}"
-        gp-data='${m(z)}'
       >
+        <script gp-data type="application/json">${p(z)}</script>
         ${c(!A,q())}
-        ${c(A,p`
+        ${c(A,m`
           <div
             ${{...F}}
             aria-hidden="true"
@@ -18,4 +18,4 @@ import e from"./HeroBannerItem.liquid.js";import{getAttr as r,getAttrLink as t}f
       </gp-hero-banner>
        ${f(u,`<script ${b('class="gps-link" delay',"src")}="{{ 'gp-hero-banner-v2-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${b('class="gps-link" delay',"src")}="${g}/assets-v2/gp-hero-banner-v2-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>
 `)}
-  `};export{E as default};
+  `};export{y as default};

package/dist/esm/hero-banner/index.js

@@ -1 +1 @@
-import"react/jsx-runtime";import"react";import"@gem-sdk/core";import"next/head";import"next/image";import"@gem-sdk/system";import"next/link";import"react-youtube";import"../image/components/AdaptiveImage.js";import"./common/animation-manager.js";import t from"./settings/HeroBanner.js";let e={HeroBanner:t};export{e as bannerSetting};
+import"react/jsx-runtime";import"react";import"@gem-sdk/core";import"next/head";import"next/image";import"@gem-sdk/system";import"next/link";import"react-youtube";import"../grid/components/section/lazyload/lazyInteractionTrigger.js";import"../image/components/AdaptiveImage.js";import"./common/animation-manager.js";import t from"./settings/HeroBanner.js";let e={HeroBanner:t};export{e as bannerSetting};

package/dist/esm/hero-banner/settings/configs/ui-v2.js

@@ -1 +1 @@
-let e=[{label:"Layout",controls:[{setting:{id:"layout"},layout:"vertical",controlChangeTrigger:{settings:[{condition:"layout.cols.length == 1 &&  layout.type === 'center-top'",source:["layout"],action:{controlId:"contentPosition1Col",groupType:"style",controlType:"style",newValue:"top"}},{condition:"layout.cols.length == 1 &&  layout.type === 'center'",source:["layout"],action:{controlId:"contentPosition1Col",groupType:"style",controlType:"style",newValue:"center"}},{condition:"layout.cols.length == 1 &&  layout.type === 'center-bottom'",source:["layout"],action:{controlId:"contentPosition1Col",groupType:"style",controlType:"style",newValue:"bottom"}},{condition:"layout.cols.length == 1 &&  layout.type === 'center-distributed'",source:["layout"],action:{controlId:"contentPosition1Col",groupType:"style",controlType:"style",newValue:"space-between"}},{condition:"layout.cols.length > 1 && ( layout.type === 'left-distributed' || layout.type === 'right-distributed')",source:["layout"],action:{controlId:"contentPosition2Col",groupType:"style",controlType:"style",newValue:"space-between"}},{condition:"layout.cols.length > 1 && ( layout.type === 'left-top' || layout.type === 'right-top')",source:["layout"],action:{controlId:"contentPosition2Col",groupType:"style",controlType:"style",newValue:"top"}},{condition:"layout.cols.length > 1 && ( layout.type === 'right' || layout.type === 'left')",source:["layout"],action:{controlId:"contentPosition2Col",groupType:"style",controlType:"style",newValue:"center"}},{condition:"layout.cols.length > 1 && ( layout.type === 'left-bottom' || layout.type === 'right-bottom')",source:["layout"],action:{controlId:"contentPosition2Col",groupType:"style",controlType:"style",newValue:"bottom"}}],options:{noRecordHistory:!0}}}]},{label:"Background",controls:[{setting:{id:"background"},options:{updateFields:[{field:"preload",settingId:"preload"}]},controlChangeTrigger:{settings:[{action:{controlId:"preload",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}},{condition:"!background.image.src",source:["background"],action:{controlId:"sizeSetting",newValue:{shapeLinked:!1},valueIfNull:{width:"100%",height:"fit-content"},groupType:"style",controlType:"size-setting"}},{condition:'background.type == "video"',source:["background"],action:{controlId:"sizeSetting",newValue:{enableVideoShape:!0},valueIfNull:{enableVideoShape:!0},groupType:"style",controlType:"size-setting"}},{condition:'!!background.image.src && background.type == "image" && sizeSetting.height == "fit-content"',source:["background","sizeSetting"],action:{controlId:"sizeSetting",newValue:{shape:"original",height:""},valueIfNull:{shape:"original"},groupType:"style",controlType:"size-setting"}},{condition:'background.type != "video"',source:["background"],action:{controlId:"sizeSetting",newValue:{enableVideoShape:!1},valueIfNull:{enableVideoShape:!1},groupType:"style",controlType:"size-setting"}}],options:{noRecordHistory:!0,enableTriggerWhenChangeDevice:!0}},layout:"vertical"}],moreSettings:{type:"collapse",controls:[{label:"Overlay",type:"combo",comboType:"color",getValueFromSettingID:"overlayColor.normal",compoDefaultValue:"#121212",controls:[{setting:{id:"overlayColor",state:"normal"},label:"Color"},{setting:{id:"overlayOpacity",state:"normal"},label:"Opacity"}]}]}},{label:"Size",controls:[{setting:{id:"sizeSetting"},layout:"vertical"},{label:"Scale",setting:{id:"videoObjectFit"},conditionDisplay:'background.type == "video"'}]},{label:"Content",controls:[{id:"contentWidth",label:"Width",controlConfig:{id:"contentWidth",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,displayOptions:[{label:"Full",value:"100%",showValue:!0},{label:"Default",value:"default",showValue:!0},{label:"Fit content",value:"Auto",showValue:!0}]},layout:"horizontal"},{label:"Padding",setting:{id:"contentPadding"}},{label:"Align",setting:{id:"verticalAlign"},conditionEnable:'layout.cols.length > 1 && layout.type != "right-distributed" && layout.type != "left-distributed"'}]},{label:"Shape",controls:[{label:"Border",setting:{id:"borderBg"}},{label:"Corner",setting:{id:"cornerBg"}},{label:"Shadow",setting:{id:"shadowBg"},options:{updateFields:[{field:"enable",settingId:"hasActiveShadow"}]},controlChangeTrigger:{settings:[{condition:"shadowBg.enable === true",source:["shadowBg","hasActiveShadow"],action:{controlId:"hasActiveShadow",groupType:"style",controlType:"style",newValue:!0}},{condition:"shadowBg.enable === false",source:["shadowBg","hasActiveShadow"],action:{controlId:"hasActiveShadow",groupType:"style",controlType:"style",newValue:!1}}],options:{noRecordHistory:!0}}}]},{label:"Effect",controls:[{type:"combo",fixedValue:"Effect",iconName:"polaris-check-clicked",label:"Hover effect",setting:{id:"hoverEffect"},controlChangeTrigger:{settings:[{condition:"hoverEffect == true",source:["hoverEffect","hoverEffectScale"],action:{controlId:"hoverEffectScale",groupType:"style",controlType:"style",newValue:"120%"}},{condition:"hoverEffect == true",source:["hoverEffect","hoverEffectDuration"],action:{controlId:"hoverEffectDuration",groupType:"style",controlType:"style",newValue:"0.5s"}}],options:{noRecordHistory:!0}},defaultValueWhenClear:!1,state:"hover",controls:[{label:"Overlay",type:"combo",comboType:"color",getValueFromSettingID:"overlayColor.hover",defaultValueWhenClear:"transparent",compoDefaultValue:"#121212",controls:[{setting:{id:"overlayOpacity",state:"hover"},label:"Opacity"},{setting:{id:"overlayColor",state:"hover"},controlChangeTrigger:{settings:[{condition:"overlayColor.hover == 'transparent'",source:["overlayColor","overlayOpacity"],action:{controlId:"overlayOpacity",groupType:"style",controlType:"style",state:"hover",newValue:"20%"}}],options:{noRecordHistory:!0}},compoDefaultValue:"#121212",label:"Color"}]},{label:"Scale",type:"combo",iconName:"polaris-maximize",getValueFromSettingID:"hoverEffectScale",defaultValueWhenClear:"100%",compoDefaultValue:"120%",controls:[{label:"Scale",setting:{id:"hoverEffectScale"},defaultValueWhenClear:"100%"},{type:"control",label:"Time",setting:{id:"hoverEffectDuration"}}]}]},{type:"combo",fixedValue:"Enabled",iconName:"polaris-parallax-effect",label:"Parallax scroll",setting:{id:"enableParallax"},conditionDisplay:'background.type == "image"',defaultValueWhenClear:!1,controls:[{setting:{id:"contentBanner"},layout:"vertical"},{label:"Speed",setting:{id:"speedParallax"}}]}]},{controls:[{label:"Link",setting:{id:"enableLink"},options:{labelVariant:"primary",toggleStyle:"switch"}},{layout:"vertical",controlConfig:{id:"linkedToPreSalesPageBanner",type:"banner",message:"Pre-sales page elements with link should redirect to the Sales page."},conditionDisplay:'pageType === "GP_PRE_SALE_PAGE" && enableLink == true'},{conditionDisplay:"enableLink == true",setting:{id:"link"},layout:"vertical"}]},{label:"SEO",controls:[{type:"combo",label:"Image alt text",iconName:"polaris-text-block",getValueFromSettingID:"alt",compoDefaultValue:"Describes the appearance of the image",isHideClear:!0,controls:[{label:"Content",setting:{id:"alt"},layout:"vertical"}]},{type:"combo",label:"Image title",iconName:"polaris-text-block",getValueFromSettingID:"title",compoDefaultValue:"Title",isHideClear:!0,controls:[{label:"Content",setting:{id:"title"},layout:"vertical"}]}]},{controls:[{label:"Align",conditionEnable:'!(parseInt(sizeSetting.width) >= 100 && sizeSetting.width?.includes("%"))',setting:{id:"alignBanner"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"}}]}];export{e as SettingUIV2};
+let e=[{label:"Layout",controls:[{setting:{id:"layout"},layout:"vertical",controlChangeTrigger:{settings:[{condition:"layout.cols.length == 1 &&  layout.type === 'center-top'",source:["layout"],action:{controlId:"contentPosition1Col",groupType:"style",controlType:"style",newValue:"top"}},{condition:"layout.cols.length == 1 &&  layout.type === 'center'",source:["layout"],action:{controlId:"contentPosition1Col",groupType:"style",controlType:"style",newValue:"center"}},{condition:"layout.cols.length == 1 &&  layout.type === 'center-bottom'",source:["layout"],action:{controlId:"contentPosition1Col",groupType:"style",controlType:"style",newValue:"bottom"}},{condition:"layout.cols.length == 1 &&  layout.type === 'center-distributed'",source:["layout"],action:{controlId:"contentPosition1Col",groupType:"style",controlType:"style",newValue:"space-between"}},{condition:"layout.cols.length > 1 && ( layout.type === 'left-distributed' || layout.type === 'right-distributed')",source:["layout"],action:{controlId:"contentPosition2Col",groupType:"style",controlType:"style",newValue:"space-between"}},{condition:"layout.cols.length > 1 && ( layout.type === 'left-top' || layout.type === 'right-top')",source:["layout"],action:{controlId:"contentPosition2Col",groupType:"style",controlType:"style",newValue:"top"}},{condition:"layout.cols.length > 1 && ( layout.type === 'right' || layout.type === 'left')",source:["layout"],action:{controlId:"contentPosition2Col",groupType:"style",controlType:"style",newValue:"center"}},{condition:"layout.cols.length > 1 && ( layout.type === 'left-bottom' || layout.type === 'right-bottom')",source:["layout"],action:{controlId:"contentPosition2Col",groupType:"style",controlType:"style",newValue:"bottom"}}],options:{noRecordHistory:!0}}}]},{label:"Background",controls:[{setting:{id:"background"},options:{updateFields:[{field:"preload",settingId:"preload"}]},controlChangeTrigger:{settings:[{action:{controlId:"preload",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}},{condition:"!background.image.src",source:["background"],action:{controlId:"sizeSetting",newValue:{shapeLinked:!1},valueIfNull:{width:"100%",height:"fit-content"},groupType:"style",controlType:"size-setting"}},{condition:'background.type == "video"',source:["background"],action:{controlId:"sizeSetting",newValue:{enableVideoShape:!0},valueIfNull:{enableVideoShape:!0},groupType:"style",controlType:"size-setting"}},{condition:'!!background.image.src && background.type == "image" && sizeSetting.height == "fit-content"',source:["background","sizeSetting"],action:{controlId:"sizeSetting",newValue:{shape:"original",height:""},valueIfNull:{shape:"original"},groupType:"style",controlType:"size-setting"}},{condition:'background.type != "video"',source:["background"],action:{controlId:"sizeSetting",newValue:{enableVideoShape:!1},valueIfNull:{enableVideoShape:!1},groupType:"style",controlType:"size-setting"}}],options:{noRecordHistory:!0,enableTriggerWhenChangeDevice:!0}},layout:"vertical"}],moreSettings:{type:"collapse",controls:[{label:"Overlay",type:"combo",comboType:"color",getValueFromSettingID:"overlayColor.normal",compoDefaultValue:"#121212",controls:[{setting:{id:"overlayColor",state:"normal"},label:"Color"},{setting:{id:"overlayOpacity",state:"normal"},label:"Opacity"}]}]}},{label:"Size",hiddenOnMobile:!0,controls:[{setting:{id:"sizeSetting"},layout:"vertical"},{label:"Scale",setting:{id:"videoObjectFit"},conditionDisplay:'background.type == "video"'}]},{label:"Content",hiddenOnMobile:!0,controls:[{id:"contentWidth",label:"Width",controlConfig:{id:"contentWidth",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,displayOptions:[{label:"Full",value:"100%",showValue:!0},{label:"Default",value:"default",showValue:!0},{label:"Fit content",value:"Auto",showValue:!0}]},layout:"horizontal"},{label:"Padding",setting:{id:"contentPadding"}},{label:"Align",setting:{id:"verticalAlign"},conditionEnable:'layout.cols.length > 1 && layout.type != "right-distributed" && layout.type != "left-distributed"'}]},{label:"Shape",hiddenOnMobile:!0,controls:[{label:"Border",setting:{id:"borderBg"}},{label:"Corner",setting:{id:"cornerBg"}},{label:"Shadow",setting:{id:"shadowBg"},options:{updateFields:[{field:"enable",settingId:"hasActiveShadow"}]},controlChangeTrigger:{settings:[{condition:"shadowBg.enable === true",source:["shadowBg","hasActiveShadow"],action:{controlId:"hasActiveShadow",groupType:"style",controlType:"style",newValue:!0}},{condition:"shadowBg.enable === false",source:["shadowBg","hasActiveShadow"],action:{controlId:"hasActiveShadow",groupType:"style",controlType:"style",newValue:!1}}],options:{noRecordHistory:!0}}}]},{label:"Effect",hiddenOnMobile:!0,controls:[{type:"combo",fixedValue:"Effect",iconName:"polaris-check-clicked",label:"Hover effect",setting:{id:"hoverEffect"},controlChangeTrigger:{settings:[{condition:"hoverEffect == true",source:["hoverEffect","hoverEffectScale"],action:{controlId:"hoverEffectScale",groupType:"style",controlType:"style",newValue:"120%"}},{condition:"hoverEffect == true",source:["hoverEffect","hoverEffectDuration"],action:{controlId:"hoverEffectDuration",groupType:"style",controlType:"style",newValue:"0.5s"}}],options:{noRecordHistory:!0}},defaultValueWhenClear:!1,state:"hover",controls:[{label:"Overlay",type:"combo",comboType:"color",getValueFromSettingID:"overlayColor.hover",defaultValueWhenClear:"transparent",compoDefaultValue:"#121212",controls:[{setting:{id:"overlayOpacity",state:"hover"},label:"Opacity"},{setting:{id:"overlayColor",state:"hover"},controlChangeTrigger:{settings:[{condition:"overlayColor.hover == 'transparent'",source:["overlayColor","overlayOpacity"],action:{controlId:"overlayOpacity",groupType:"style",controlType:"style",state:"hover",newValue:"20%"}}],options:{noRecordHistory:!0}},compoDefaultValue:"#121212",label:"Color"}]},{label:"Scale",type:"combo",iconName:"polaris-maximize",getValueFromSettingID:"hoverEffectScale",defaultValueWhenClear:"100%",compoDefaultValue:"120%",controls:[{label:"Scale",setting:{id:"hoverEffectScale"},defaultValueWhenClear:"100%"},{type:"control",label:"Time",setting:{id:"hoverEffectDuration"}}]}]},{type:"combo",fixedValue:"Enabled",iconName:"polaris-parallax-effect",label:"Parallax scroll",setting:{id:"enableParallax"},conditionDisplay:'background.type == "image"',defaultValueWhenClear:!1,controls:[{setting:{id:"contentBanner"},layout:"vertical"},{label:"Speed",setting:{id:"speedParallax"}}]}]},{controls:[{label:"Link",setting:{id:"enableLink"},options:{labelVariant:"primary",toggleStyle:"switch"}},{layout:"vertical",controlConfig:{id:"linkedToPreSalesPageBanner",type:"banner",message:"Pre-sales page elements with link should redirect to the Sales page."},conditionDisplay:'pageType === "GP_PRE_SALE_PAGE" && enableLink == true'},{conditionDisplay:"enableLink == true",setting:{id:"link"},layout:"vertical"}]},{label:"SEO",hiddenOnMobile:!0,controls:[{type:"combo",label:"Image alt text",iconName:"polaris-text-block",getValueFromSettingID:"alt",compoDefaultValue:"Describes the appearance of the image",isHideClear:!0,controls:[{label:"Content",setting:{id:"alt"},layout:"vertical"}]},{type:"combo",label:"Image title",iconName:"polaris-text-block",getValueFromSettingID:"title",compoDefaultValue:"Title",isHideClear:!0,controls:[{label:"Content",setting:{id:"title"},layout:"vertical"}]}]},{controls:[{label:"Align",hiddenOnMobile:!0,conditionEnable:'!(parseInt(sizeSetting.width) >= 100 && sizeSetting.width?.includes("%"))',setting:{id:"alignBanner"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"}}]}];export{e as SettingUIV2};

package/dist/esm/icon/settings/configs/ui-v2.js

@@ -1 +1 @@
-let e=[{label:"Icon",controls:[{label:"Choose",setting:{id:"iconSvg"}},{label:"Color",setting:{id:"color",state:"normal"}},{label:"Size",controlConfig:{id:"width",type:"input:stepper",includeUnit:"px",linkWithSetting:{name:"globalSize",field:"width"}}},{label:"Padding",controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"globalSize",field:"padding"},compoDefaultValue:{default:{top:"16px",right:"16px",bottom:"16px",left:"16px",linked:!1}}}}]},{label:"Background",controls:[{label:"Color",setting:{id:"bgColor",state:"normal"}}]},{label:"Shape",controls:[{label:"Border",setting:{id:"iconBorder",state:"normal"}},{label:"Corner",setting:{id:"iconRounded",state:"normal"}},{label:"Shadow",setting:{id:"iconShadow"}}]},{controls:[{label:"Link",setting:{id:"iconLinkEnable"},options:{labelVariant:"primary",toggleStyle:"switch"}},{layout:"vertical",controlConfig:{id:"linkedToPreSalesPageBanner",type:"banner",message:"Pre-sales page elements with link should redirect to the Sales page."},conditionDisplay:'pageType === "GP_PRE_SALE_PAGE" && iconLinkEnable == true'},{conditionDisplay:"iconLinkEnable == true",layout:"vertical",setting:{id:"iconLink"}}]},{controls:[{label:"Align",setting:{id:"align"},options:{labelVariant:"primary",fullWidth:!0}}]}];export{e as SettingUIV2};
+let e=[{label:"Icon",controls:[{label:"Choose",setting:{id:"iconSvg"}},{label:"Color",setting:{id:"color",state:"normal"}},{label:"Size",controlConfig:{id:"width",type:"input:stepper",includeUnit:"px",linkWithSetting:{name:"globalSize",field:"width"}}},{label:"Padding",hiddenOnMobile:!0,controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"globalSize",field:"padding"},compoDefaultValue:{default:{top:"16px",right:"16px",bottom:"16px",left:"16px",linked:!1}}}}]},{label:"Background",controls:[{label:"Color",setting:{id:"bgColor",state:"normal"}}]},{label:"Shape",hiddenOnMobile:!0,controls:[{label:"Border",setting:{id:"iconBorder",state:"normal"}},{label:"Corner",setting:{id:"iconRounded",state:"normal"}},{label:"Shadow",setting:{id:"iconShadow"}}]},{controls:[{label:"Link",setting:{id:"iconLinkEnable"},options:{labelVariant:"primary",toggleStyle:"switch"}},{layout:"vertical",controlConfig:{id:"linkedToPreSalesPageBanner",type:"banner",message:"Pre-sales page elements with link should redirect to the Sales page."},conditionDisplay:'pageType === "GP_PRE_SALE_PAGE" && iconLinkEnable == true'},{conditionDisplay:"iconLinkEnable == true",layout:"vertical",setting:{id:"iconLink"}}]},{controls:[{label:"Align",hiddenOnMobile:!0,setting:{id:"align"},options:{labelVariant:"primary",fullWidth:!0}}]}];export{e as SettingUIV2};

package/dist/esm/icon-list/settings/configs/ui-v2.js

@@ -1 +1 @@
-let e=[{label:"Item management",controls:[{label:"Order",setting:{id:"childItem"}}]},{label:"Item spacing",controls:[{label:"Gap",setting:{id:"verticalSpacing"}}]},{label:"Item style",moreSettings:{controls:[{label:"Padding",controlConfig:{id:"padding-item-padding",type:"padding-v2",linkWithSetting:{name:"itemPadding",field:"padding"},compoDefaultValue:{desktop:{default:{type:"medium",top:"8px",bottom:"8px",left:"16px",right:"16px"}}}}},{label:"Background",setting:{id:"itemBackgroundColor"}},{label:"Border",setting:{id:"itemBorder"}},{label:"Corner",setting:{id:"itemRounded"}},{label:"Shadow",setting:{id:"itemBoxShadow"}}]},controls:[{label:"Icon & text gap",setting:{id:"horizontalSpacing"}}]},{label:"Size",controls:[{id:"Width",label:"Width",controlConfig:{id:"width",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,fallbackValue:"Auto",linkWithSetting:{name:"globalSize",field:"width"},displayOptions:[{label:"Fit content",value:"Auto",showValue:!0},{label:"Full",value:"100%",showValue:!0}]},layout:"horizontal"},{label:"Padding",controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"spacing-setting",field:"padding"},compoDefaultValue:{desktop:{default:{type:"medium",top:"16px",bottom:"16px",left:"16px",right:"16px"}}}}},{label:"Arrange",setting:{id:"align"},options:{fullWidth:!0},conditionDisplay:"globalSize.width !== 'Auto'"}]},{label:"Background",controls:[{setting:{id:"background"},layout:"vertical",options:{updateFields:[{field:"preload",settingId:"preload"}]},controlChangeTrigger:{settings:[{action:{controlId:"preload",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}}]},{label:"Shape",controls:[{label:"Border",setting:{id:"border",state:"normal"}},{label:"Corner",setting:{id:"rounded",state:"normal"}},{label:"Shadow",setting:{id:"boxShadow",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadow",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadow.normal.enable === true",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!0}},{condition:"boxShadow.normal.enable === false",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{controls:[{label:"Align",conditionEnable:'!(parseInt(globalSize.width) >= 100 && globalSize.width?.includes("%"))',setting:{id:"alignWrapper"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Align is not supported when width is 100%"}}]}];export{e as SettingUIV2};
+let e=[{label:"Item management",controls:[{label:"Order",setting:{id:"childItem"}}]},{label:"Item spacing",controls:[{label:"Gap",setting:{id:"verticalSpacing"}}]},{label:"Item style",hiddenOnMobile:!0,moreSettings:{controls:[{label:"Padding",controlConfig:{id:"padding-item-padding",type:"padding-v2",linkWithSetting:{name:"itemPadding",field:"padding"},compoDefaultValue:{desktop:{default:{type:"medium",top:"8px",bottom:"8px",left:"16px",right:"16px"}}}}},{label:"Background",setting:{id:"itemBackgroundColor"}},{label:"Border",setting:{id:"itemBorder"}},{label:"Corner",setting:{id:"itemRounded"}},{label:"Shadow",setting:{id:"itemBoxShadow"}}]},controls:[{label:"Icon & text gap",setting:{id:"horizontalSpacing"}}]},{label:"Size",hiddenOnMobile:!0,controls:[{id:"Width",label:"Width",controlConfig:{id:"width",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,fallbackValue:"Auto",linkWithSetting:{name:"globalSize",field:"width"},displayOptions:[{label:"Fit content",value:"Auto",showValue:!0},{label:"Full",value:"100%",showValue:!0}]},layout:"horizontal"},{label:"Padding",controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"spacing-setting",field:"padding"},compoDefaultValue:{desktop:{default:{type:"medium",top:"16px",bottom:"16px",left:"16px",right:"16px"}}}}},{label:"Arrange",setting:{id:"align"},options:{fullWidth:!0},conditionDisplay:"globalSize.width !== 'Auto'"}]},{label:"Background",controls:[{setting:{id:"background"},layout:"vertical",options:{updateFields:[{field:"preload",settingId:"preload"}]},controlChangeTrigger:{settings:[{action:{controlId:"preload",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}}]},{label:"Shape",hiddenOnMobile:!0,controls:[{label:"Border",setting:{id:"border",state:"normal"}},{label:"Corner",setting:{id:"rounded",state:"normal"}},{label:"Shadow",setting:{id:"boxShadow",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadow",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadow.normal.enable === true",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!0}},{condition:"boxShadow.normal.enable === false",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{controls:[{label:"Align",hiddenOnMobile:!0,conditionEnable:'!(parseInt(globalSize.width) >= 100 && globalSize.width?.includes("%"))',setting:{id:"alignWrapper"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Align is not supported when width is 100%"}}]}];export{e as SettingUIV2};

package/dist/esm/icon-list-hoz/settings/configs/uiV2.js

@@ -1 +1 @@
-let o=[{label:"Item management",controls:[{label:"Order",setting:{id:"childItem"},options:{fullWidth:!0}}]},{label:"Item spacing",controls:[{type:"control",label:"Gap",setting:{id:"horizontalSpacing"}}]},{label:"Background",controls:[{type:"control",setting:{id:"background"},layout:"vertical"}]},{label:"Shape",controls:[{label:"Border",setting:{id:"border",state:"normal"}},{label:"Corner",setting:{id:"rounded",state:"normal"}},{label:"Shadow",setting:{id:"boxShadow",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadow",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadow.normal.enable === true",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!0}},{condition:"boxShadow.normal.enable === false",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{label:"Align",controls:[{type:"control",label:"Horizontal",setting:{id:"align"}},{type:"control",label:"Vertical",setting:{id:"verticalAlign"}}]}];export{o as SettingUIV2};
+let o=[{label:"Item management",controls:[{label:"Order",setting:{id:"childItem"},options:{fullWidth:!0}}]},{label:"Item spacing",hiddenOnMobile:!0,controls:[{type:"control",label:"Gap",setting:{id:"horizontalSpacing"}}]},{label:"Background",controls:[{type:"control",setting:{id:"background"},layout:"vertical"}]},{label:"Shape",hiddenOnMobile:!0,controls:[{label:"Border",setting:{id:"border",state:"normal"}},{label:"Corner",setting:{id:"rounded",state:"normal"}},{label:"Shadow",setting:{id:"boxShadow",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadow",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadow.normal.enable === true",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!0}},{condition:"boxShadow.normal.enable === false",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{label:"Align",hiddenOnMobile:!0,controls:[{type:"control",label:"Horizontal",setting:{id:"align"}},{type:"control",label:"Vertical",setting:{id:"verticalAlign"}}]}];export{o as SettingUIV2};

package/dist/esm/icon-list-v2/components/IconList.liquid.js

@@ -1,4 +1,4 @@
-import{dataStringify as s,template as i,RenderIf as t,isLocalEnv as e,baseAssetURL as l}from"@gem-sdk/core";import{getSettingPreloadData as o}from"../../helpers.js";import r from"../../text/components/Text.liquid.js";import{createClass as a,createStyle as d,createAttr as p,If as n}from"@gem-sdk/system";import{getClassWraplistIcon as c,getClassColListIcon as m,getClassWrapItemIcon as $,getClassWrapIcon as u,getClassIcon as g,getClassTextItem as v}from"../common/classes.js";import{getStyleContainerIconlistMain as y,getStyleWraplistIcon as f,getStyleColListIcon as j,getStyleWrapIcon as h,getStyleWrapItemIcon as q,getStyleIcon as x,getStyleTypoText as S}from"../common/styles.js";import{getvalueMap as k,getTextIconTranslations as E,getTextIconNotFound as A}from"../common/helpers.js";let N=N=>{let{builderProps:T,builderAttrs:V,style:_,setting:w,styles:C,pageContext:G}=N,I=T?.builderData?.advanced,L=a({[T?.uid??""]:!0}),O=a(c()),W=a(m()),b=a($({builderProps:T})),D=a(u()),F=a(g()),M=a(v({setting:w})),P=d(y({styles:C,style:_,type:"liquid",advanced:I})),R=d(f({styles:C,uid:T?.uid??"",pageContext:G,type:"Liquid"})),z=d(j({styles:C})),B=d(h({styles:C,setting:w})),H=d(q({styles:C})),J=d(x({styles:C,setting:w})),K=S({setting:w}),Q=p({...V}),U=A("liquid"),X=k({setting:w});return i`
+import{dataStringify as s,template as i,RenderIf as t,isLocalEnv as e,baseAssetURL as l}from"@gem-sdk/core";import{getSettingPreloadData as o}from"../../helpers.js";import r from"../../text/components/Text.liquid.js";import{createClass as p,createStyle as a,createAttr as d,If as c}from"@gem-sdk/system";import{getClassWraplistIcon as n,getClassColListIcon as m,getClassWrapItemIcon as $,getClassWrapIcon as u,getClassIcon as g,getClassTextItem as v}from"../common/classes.js";import{getStyleContainerIconlistMain as y,getStyleWraplistIcon as f,getStyleColListIcon as j,getStyleWrapIcon as h,getStyleWrapItemIcon as q,getStyleIcon as x,getStyleTypoText as S}from"../common/styles.js";import{getvalueMap as k,getTextIconTranslations as E,getTextIconNotFound as A}from"../common/helpers.js";let N=N=>{let{builderProps:T,builderAttrs:V,style:_,setting:w,styles:C,pageContext:G}=N,I=T?.builderData?.advanced,L=p({[T?.uid??""]:!0}),O=p(n()),W=p(m()),b=p($({builderProps:T})),D=p(u()),F=p(g()),M=p(v({setting:w})),P=a(y({styles:C,style:_,type:"liquid",advanced:I})),R=a(f({styles:C,uid:T?.uid??"",pageContext:G,type:"Liquid"})),z=a(j({styles:C})),B=a(h({styles:C,setting:w})),H=a(q({styles:C})),J=a(x({styles:C,setting:w})),K=S({setting:w}),Q=d({...V}),U=A("liquid"),X=k({setting:w});return i`
     {% assign locationOrigin = request.origin | append: routes.root_url | split: '/' | join: '/' %}
     <gp-icon-list
       ${{...Q}}
@@ -6,9 +6,9 @@ import{dataStringify as s,template as i,RenderIf as t,isLocalEnv as e,baseAssetU
       data-id="${T?.uid}"
       style="${P}"
       className="${L}"
-      gp-data='${s({position:C?.position,iconWidth:w?.iconWidth}).replaceAll("'","&#039;")}'
     >
-      ${n(!X||!X.length,i`<div>${U}</div>`,i`
+      <script gp-data type="application/json">${s({position:C?.position,iconWidth:w?.iconWidth}).replaceAll("'","&#039;")}</script>
+      ${c(!X||!X.length,i`<div>${U}</div>`,i`
           <div class="${O}" style="${R}">
             <div class="${W}" style="${z}">
               ${X?.map((s,t)=>{let e=E({setting:w,builderProps:T,pageContext:G,key:t,type:"liquid"});return i`

package/dist/esm/icon-list-v2/settings/configs/ui-v2.js

@@ -1 +1 @@
-let t=[{label:"Item management",controls:[{label:"Order",setting:{id:"childItem"}}]},{label:"Icon style",controls:[{label:"Icon type ",setting:{id:"iconType"}},{conditionDisplay:'iconType === "matching"',label:"Icon",setting:{id:"iconSvg"}},{conditionDisplay:'iconType === "different"',layout:"vertical",setting:{id:"childConfig"}},{label:"Icon color",setting:{id:"iconColor"}},{label:"Icon size",setting:{id:"iconWidth"}}],moreSettings:{type:"collapse",controls:[{label:"Position",setting:{id:"position"}},{label:"Padding",controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"globalSize",field:"padding"},compoDefaultValue:{default:{top:"4px",right:"4px",bottom:"4px",left:"4px"}}}},{label:"Background",setting:{id:"backgroundColor"}},{label:"Border",setting:{id:"iconBorder"}},{label:"Corner",setting:{id:"iconRounded"}}]}},{label:"Text",controls:[{setting:{id:"textTypo"},layout:"vertical"}]},{label:"Item spacing",controls:[{label:"Gap",setting:{id:"verticalSpacing"}}]},{label:"Item style",controls:[{label:"Icon & text gap",setting:{id:"horizontalSpacing"}}]},{label:"Background",controls:[{setting:{id:"background"},layout:"vertical"}]},{label:"Size",controls:[{label:"Width",setting:{id:"contentBoxWidth"},layout:"horizontal"},{label:"Padding",setting:{id:"contentBoxPadding"},layout:"horizontal"},{label:"Arrange",setting:{id:"panelAlign"}}]},{label:"Shape",controls:[{label:"Border",setting:{id:"contentBoxBorder"}},{label:"Corner",setting:{id:"contentBoxRounded"}},{label:"Shadow",setting:{id:"contentBoxShadow"}}]},{controls:[{label:"Align",setting:{id:"align"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"},conditionEnable:'!contentBoxWidth?.includes("%") || (parseInt(contentBoxWidth) < 100 && contentBoxWidth?.includes("%"))'}]}];export{t as SettingUIV2};
+let e=[{label:"Item management",controls:[{label:"Order",setting:{id:"childItem"}}]},{label:"Icon style",controls:[{label:"Icon type ",setting:{id:"iconType"}},{conditionDisplay:'iconType === "matching"',label:"Icon",setting:{id:"iconSvg"}},{conditionDisplay:'iconType === "different"',layout:"vertical",setting:{id:"childConfig"}},{label:"Icon color",setting:{id:"iconColor"}},{label:"Icon size",setting:{id:"iconWidth"}}],moreSettings:{type:"collapse",controls:[{label:"Position",hiddenOnMobile:!0,setting:{id:"position"}},{label:"Padding",hiddenOnMobile:!0,controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"globalSize",field:"padding"},compoDefaultValue:{default:{top:"4px",right:"4px",bottom:"4px",left:"4px"}}}},{label:"Background",hiddenOnMobile:!0,setting:{id:"backgroundColor"}},{label:"Border",hiddenOnMobile:!0,setting:{id:"iconBorder"}},{label:"Corner",hiddenOnMobile:!0,setting:{id:"iconRounded"}}]}},{label:"Text",controls:[{setting:{id:"textTypo"},layout:"vertical"}]},{label:"Item spacing",controls:[{label:"Gap",setting:{id:"verticalSpacing"}}]},{label:"Item style",controls:[{label:"Icon & text gap",setting:{id:"horizontalSpacing"}}]},{label:"Background",controls:[{setting:{id:"background"},layout:"vertical"}]},{label:"Size",hiddenOnMobile:!0,controls:[{label:"Width",setting:{id:"contentBoxWidth"},layout:"horizontal"},{label:"Padding",setting:{id:"contentBoxPadding"},layout:"horizontal"},{label:"Arrange",setting:{id:"panelAlign"}}]},{label:"Shape",hiddenOnMobile:!0,controls:[{label:"Border",setting:{id:"contentBoxBorder"}},{label:"Corner",setting:{id:"contentBoxRounded"}},{label:"Shadow",setting:{id:"contentBoxShadow"}}]},{controls:[{label:"Align",hiddenOnMobile:!0,setting:{id:"align"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"},conditionEnable:'!contentBoxWidth?.includes("%") || (parseInt(contentBoxWidth) < 100 && contentBoxWidth?.includes("%"))'}]}];export{e as SettingUIV2};

package/dist/esm/image/common/const.js

@@ -0,0 +1 @@
+let f=/\.(gif|webp|jfif|svg|tiff?)(?:\?|$)/i;export{f as REGEX_IS_NON_RESIZABLE_IMAGE};

package/dist/esm/image/common/helpers.js

@@ -1,4 +1,4 @@
-import{getCornerCSSFromGlobal as e,getAspectRatioGlobalSize as t,hasTranslatedLiquid as i,makeStyleResponsive as r,DEVICES as l,getResponsiveValueByScreen as a,cloneDeep as s}from"@gem-sdk/core";import{getDynamicSourceLocales as o,createSettingId as n}from"../../helpers.js";import{Image as g}from"../settings/configs/translate.js";let c=t=>{let i={...t},r=!0;return i&&Object.keys(i??{}).forEach(e=>{if("bblr"===e||"bbrr"===e||"btlr"===e||"btrr"===e){let t=i[e]??{};"0px"!==t&&(r=!1)}}),r?e(i):{}},u=({styles:e,setting:i})=>{let{srcSet:r,image:l}=i??{},{customAspectRadio:a,shape:s}=e??{},o={desktop:d({device:"desktop",aspect:e?.aspectRatio,auto:i?.isAdaptive?r?.desktop:l,custom:a}),tablet:d({device:"tablet",aspect:e?.aspectRatio,auto:i?.isAdaptive?r?.tablet:l,custom:a}),mobile:d({device:"mobile",aspect:e?.aspectRatio,auto:i?.isAdaptive?r?.mobile:l,custom:a})};return s?t(s):o},d=({device:e,aspect:t,custom:i,auto:r})=>{let l=t?.[e];return"auto"===l?r?.height?`${r.width}/${r.height}`:void 0:"custom"===l?i?.[e]?.height?`${i?.[e]?.width}/${i?.[e]?.height}`:void 0:l},f=({layout:e,isDisableObjectFit:t})=>t?{}:r("objf",e),m=({isDisableAspectStyle:e,aspectRatio:t,objectFits:i,width:r,height:a})=>{if(e)return{};let s={};return l.forEach(e=>{let l=`--objf${"desktop"!==e?`-${e}`:""}`,o=i?.[l]||i?.["--objf"];if(t?.[e]==="auto"&&"contain"===o){s[e]="auto";return}s[e]=t?.[e]!=="auto"&&t?.[e]?t[e]:`${r}/${a}`}),s},p=e=>JSON.stringify(e||{}).replace(/"/g,"&quot;"),h=(e,t)=>`<svg width="${e}" height="${t}" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+import{getCornerCSSFromGlobal as e,getAspectRatioGlobalSize as t,hasTranslatedLiquid as i,makeStyleResponsive as r,DEVICES as l,getResponsiveValueByScreen as a,cloneDeep as s}from"@gem-sdk/core";import{getDynamicSourceLocales as o,createSettingId as n}from"../../helpers.js";import{Image as g}from"../settings/configs/translate.js";import{REGEX_IS_NON_RESIZABLE_IMAGE as c}from"./const.js";let d=t=>{let i={...t},r=!0;return i&&Object.keys(i??{}).forEach(e=>{if("bblr"===e||"bbrr"===e||"btlr"===e||"btrr"===e){let t=i[e]??{};"0px"!==t&&(r=!1)}}),r?e(i):{}},u=({styles:e,setting:i})=>{let{srcSet:r,image:l}=i??{},{customAspectRadio:a,shape:s}=e??{},o={desktop:m({device:"desktop",aspect:e?.aspectRatio,auto:i?.isAdaptive?r?.desktop:l,custom:a}),tablet:m({device:"tablet",aspect:e?.aspectRatio,auto:i?.isAdaptive?r?.tablet:l,custom:a}),mobile:m({device:"mobile",aspect:e?.aspectRatio,auto:i?.isAdaptive?r?.mobile:l,custom:a})};return s?t(s):o},m=({device:e,aspect:t,custom:i,auto:r})=>{let l=t?.[e];return"auto"===l?r?.height?`${r.width}/${r.height}`:void 0:"custom"===l?i?.[e]?.height?`${i?.[e]?.width}/${i?.[e]?.height}`:void 0:l},f=({layout:e,isDisableObjectFit:t})=>t?{}:r("objf",e),p=({isDisableAspectStyle:e,aspectRatio:t,objectFits:i,width:r,height:a})=>{if(e)return{};let s={};return l.forEach(e=>{let l=`--objf${"desktop"!==e?`-${e}`:""}`,o=i?.[l]||i?.["--objf"];if(t?.[e]==="auto"&&"contain"===o){s[e]="auto";return}s[e]=t?.[e]!=="auto"&&t?.[e]?t[e]:`${r}/${a}`}),s},h=e=>JSON.stringify(e||{}).replace(/"/g,"&quot;"),b=(e,t)=>`<svg width="${e}" height="${t}" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <defs>
       <linearGradient id="g-${e}-${t}">
         <stop stop-color="rgba(51, 51, 51, 0)" offset="20%" />
@@ -9,4 +9,4 @@ import{getCornerCSSFromGlobal as e,getAspectRatioGlobalSize as t,hasTranslatedLi
     <rect width="${e}" height="${t}" fill="rgba(51, 51, 51, 0)" />
     <rect id="r" width="${e}" height="${t}" fill="url(#g-${e}-${t})" />
     <animate xlink:href="#r" attributeName="x" from="-${e}" to="${e}" dur="1s" repeatCount="indefinite"  />
-  </svg>`,b=e=>"undefined"==typeof window?Buffer.from(e).toString("base64"):window.btoa(e),A=(e,t)=>`data:image/svg+xml;base64,${b(h(e,t))}`,w="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=",$="https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",_={DEFAULT_SIZES:"100vw",DEFAULT_ALT:"Alt image",DEFAULT_SRC:"https://cdn.shopify.com/s/files/1/2005/9307/files/placeholder-1.png?v=1751355990",DEFAULT_WIDTH_PROPS:800,DEFAULT_HEIGHT_PROPS:533},S=e=>{let{srcSet:t,fallbackImg:i}=e;return{getDeviceSource:e=>{let{isLiquid:r}=e??{},l=y(t?.desktop,"desktop",!r)||i||$,a=y(t?.tablet,"tablet",!r)||y(t?.desktop,"tablet",!r)||i||$,s=y(t?.mobile,"mobile",!r)||y(t?.tablet,"mobile",!r)||y(t?.desktop,"mobile",!r)||i||$;return{srcTablet:a,srcMobile:s,srcDesktop:l}}}},E=({setting:e,uid:t,pageContext:i})=>{if(!e||!g)return{};let r=s(e);for(let e in r.srcSet){let l=r.srcSet[e];if(l&&l.src){let r=o({val:l.src,uid:t,settingId:g?.srcSet?.id?`${g.srcSet.id}_${e}_src`:"",pageContext:i??{}});l.src=String(r)}}let l=o({val:r.alt,uid:t,settingId:n({id:g?.alt?.id}),pageContext:i??{}});r.alt=String(l);let a=o({val:r.title,uid:t,settingId:n({id:g?.title?.id}),pageContext:i??{}});return r.title=String(a),r},x=(e,t,i)=>e?I(e,t):k(i),v=e=>e.includes("webp")||e.includes("jfif")||e.includes(".svg")||e.includes(".tiff"),I=(e,t)=>{let i=R(e);return v(e)?"FILE_CONTENT"==t?`{{ '${i}' | file_url }} 768w, {{ '${i}' | file_url }} 1024w, {{ '${i}' | file_url }} 1440w`:`{{ '${e}' | asset_url }} 768w, {{ '${e}' | asset_url }} 1024w, {{ '${e}' | asset_url }} 1440w`:"FILE_CONTENT"==t?`{{ '${i}' | file_img_url: '768x' }} 768w, {{ '${i}' | file_img_url: '1024x' }} 1024w, {{ '${i}' | file_img_url: 'master' }} 1440w`:`{{ '${e}' | asset_img_url: '768x' }} 768w, {{ '${e}' | asset_img_url: '1024x' }} 1024w, {{ '${e}' | asset_img_url: 'master' }} 1440w`},k=e=>e,y=(e,t,r)=>{if(e?.metafieldDefinitionKey)return C(e?.metafieldDefinitionKey);let l=e?.backupFilePath??e?.src??"";if(r)l=e?.src||"";else{let t=e?.src??"";if(i(t))return t;if(e?.backupFileKey){let t=N(e.backupFileKey,e?.src??"");"THEME"!==e.storage&&e.storage?"FILE_CONTENT"===e.storage&&(l=`{{ "${R(t)}" | file_url }}`):l=`{{ "${t}" | asset_url }}`}}if(t&&l?.includes("cdn.shopify"))switch(t){case"tablet":l=l?.replace(F,"_1024x.");break;case"mobile":l=l?.replace(F,"_768x.")}return l},C=e=>`{{${e} | file_url}}`,F=/\.(?=[^.]*$)/,R=e=>e.replace(/\.jpeg|\.jfif/g,".jpg"),N=(e,t)=>{let i=t?.match(/\/files\/([^\/]+\.(jpg|jpeg|gif|png|webp|svg))/)?.[1];return i&&i!=e?i:e};function T(e,t){let i=e.match(/\.webp/g)?.length,r=j({str:e,reg:/_(pico|icon|thumb|small|compact|medium|large|grande|original|1024x1024|2048x2048|master)+\./g,newString:"."});if(i)return r;let l=j({str:r,reg:/\.jpg|\.png|\.gif|\.jpeg/g,newString:t,isAdd:!0});return l}let j=e=>{let t=e.str,i=e.str.match(e.reg)?.length;if(i){let r,l=1;for(;null!==(r=e.reg.exec(e.str));){if(l===i){let i=e.reg.lastIndex,l=i-r[0].length;e.isAdd&&(e.newString="_"+e.newString+r),t=t.slice(0,l)+e.newString+t.slice(i,t.length)}l++}}return t},D=(e,t)=>{let i=H(),r=t?.[i]||"auto";if("auto"===r||r.includes("%"))return e;let l=Number(r.replace("px",""));return l>e?e:Number(r.replace("px",""))},L=e=>{let{itemWidthParam:t,imageWidthSetting:i,qualityType:r,qualityPercent:l}=e,s=H(),o=D(t,i),n=a(r,s,"finest"),g=a(l,s,100);switch(n){case"finest":default:return"auto";case"high":return Math.round(1.5*o)||1;case"medium":return Math.round(o)||1;case"custom":return Math.round(o*(Number(g)/100))||1}},W=e=>{let t={desktop:"100%",tablet:"100%",mobile:"100%"};return l.forEach(i=>{let r=a(e,i)?.width||"100%";t[i]=r}),t},O=e=>{let t={desktop:"100%",tablet:"100%",mobile:"100%"};return l.forEach(i=>{let r=a(e,i)?.width||"100%";t[i]=r}),t},B=e=>{let t=document.querySelectorAll(`.gem-slider-item-${e}.gp-gallery-image-item`),i=0;return t.forEach(e=>{e.offsetWidth>i&&(i=e.offsetWidth)}),i},K=e=>{let t=document.querySelectorAll(`.gem-slider-item-${e}.gp-ft-image-item`),i=0;return t.forEach(e=>{e.offsetWidth>i&&(i=e.offsetWidth)}),i},P=e=>{let{shapeByLayout:t,qualityType:i,qualityPercent:r,builderPropUID:l}=e,a=document.querySelectorAll(`.gem-slider-item-${l}.gp-gallery-image-item`),s=O(t),o=B(l);a.forEach(e=>{G({item:e,settingWidth:s,width:o,qualityType:i,qualityPercent:r})})},U=e=>{let{ftShape:t,qualityType:i,qualityPercent:r,builderPropUID:l}=e,a=document.querySelectorAll(`.gem-slider-item-${l}.gp-ft-image-item`),s=W(t),o=K(l);a.forEach(e=>{G({item:e,settingWidth:s,width:o,qualityType:i,qualityPercent:r})})},G=e=>{let{item:t,settingWidth:i,width:r,qualityType:l,qualityPercent:a}=e,s=H(),o=t.querySelector("img");if(o){let e=L({itemWidthParam:r,imageWidthSetting:i,qualityType:l,qualityPercent:a}),t=o.getAttribute("base-src");if(!t)return;let n=M(e,t),g=q(t,n,s);o.setAttribute("srcset",g)}},M=(e,t)=>"auto"===e?t:T(t,`${e}x`),q=(e,t,i)=>`${"mobile"===i&&e!==t?t:T(e,"768x")} 767w, ${"tablet"===i&&e!==t?t:T(e,"1024x")} 1023w, ${"desktop"===i&&e!==t?t:T(e,"1920x")} 1440w`,H=()=>window.innerWidth<768?"mobile":window.innerWidth>=768&&window.innerWidth<1025?"tablet":"desktop";export{$ as FALLBACK_IMAGE,w as IMAGE_PLACEHOLDER,_ as NEXT_IMAGE_CONFIG,d as composeAspectRatio,A as createBlurDataURL,S as getAdaptiveImageData,u as getAspectRatio,m as getAspectRatioNextImage,H as getCurrentDevice,y as getImageSrc,L as getImageWidthFollowByQuality,N as getNewBackupFileKey,f as getResponsiveObjectFit,E as getSettingTranslatedImageAndSeo,x as getSrcSet,U as handleSetSrcForFeatureProductImage,P as handleSetSrcForProductImageList,v as isCannotResizeImage,c as overwriteDefaultRadius,F as regexReplaceEndDot,R as replaceBackupFileKeyFileContent,T as resizeImage,p as safeStringify,h as shimmer,b as toBase64};
+  </svg>`,A=e=>"undefined"==typeof window?Buffer.from(e).toString("base64"):window.btoa(e),w=(e,t)=>`data:image/svg+xml;base64,${A(b(e,t))}`,$="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=",_="https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",S={DEFAULT_SIZES:"100vw",DEFAULT_ALT:"Alt image",DEFAULT_SRC:"https://cdn.shopify.com/s/files/1/2005/9307/files/placeholder-1.png?v=1751355990",DEFAULT_WIDTH_PROPS:800,DEFAULT_HEIGHT_PROPS:533},E=e=>{let{srcSet:t,fallbackImg:i}=e;return{getDeviceSource:e=>{let{isLiquid:r}=e??{},l=C(t?.desktop,"desktop",!r)||i||_,a=C(t?.tablet,"tablet",!r)||C(t?.desktop,"tablet",!r)||i||_,s=C(t?.mobile,"mobile",!r)||C(t?.tablet,"mobile",!r)||C(t?.desktop,"mobile",!r)||i||_;return{srcTablet:a,srcMobile:s,srcDesktop:l}}}},x=({setting:e,uid:t,pageContext:i})=>{if(!e||!g)return{};let r=s(e);for(let e in r.srcSet){let l=r.srcSet[e];if(l&&l.src){let r=o({val:l.src,uid:t,settingId:g?.srcSet?.id?`${g.srcSet.id}_${e}_src`:"",pageContext:i??{}});l.src=String(r)}}let l=o({val:r.alt,uid:t,settingId:n({id:g?.alt?.id}),pageContext:i??{}});r.alt=String(l);let a=o({val:r.title,uid:t,settingId:n({id:g?.title?.id}),pageContext:i??{}});return r.title=String(a),r},I=(e,t,i)=>e?v(e,t):y(i),k=e=>c.test(e),v=(e,t)=>{let i=N(e);return k(e)?"FILE_CONTENT"==t?`{{ '${i}' | file_url }} 768w, {{ '${i}' | file_url }} 1024w, {{ '${i}' | file_url }} 1440w`:`{{ '${e}' | asset_url }} 768w, {{ '${e}' | asset_url }} 1024w, {{ '${e}' | asset_url }} 1440w`:"FILE_CONTENT"==t?`{{ '${i}' | file_img_url: '768x' }} 768w, {{ '${i}' | file_img_url: '1024x' }} 1024w, {{ '${i}' | file_img_url: 'master' }} 1440w`:`{{ '${e}' | asset_img_url: '768x' }} 768w, {{ '${e}' | asset_img_url: '1024x' }} 1024w, {{ '${e}' | asset_img_url: 'master' }} 1440w`},y=e=>e,C=(e,t,r)=>{if(e?.metafieldDefinitionKey)return F(e?.metafieldDefinitionKey);let l=e?.backupFilePath??e?.src??"";if(r)l=e?.src||"";else{let t=e?.src??"";if(i(t))return t;if(e?.backupFileKey){let t=R(e.backupFileKey,e?.src??"");"THEME"!==e.storage&&e.storage?"FILE_CONTENT"===e.storage&&(l=`{{ '${N(t)}' | file_url }}`):l=`{{ '${t}' | asset_url }}`}}if(t&&l?.includes("cdn.shopify")&&!k(l))switch(t){case"tablet":l=l?.includes("?")?`${l}&width=1024`:`${l}?width=1024`;break;case"mobile":l=l?.includes("?")?`${l}&width=768`:`${l}?width=768`}return l},F=e=>`{{${e} | file_url}}`,N=e=>e.replace(/\.jpeg|\.jfif/g,".jpg"),R=(e,t)=>{let i=t?.match(/\/files\/([^\/]+\.(jpg|jpeg|gif|png|webp|svg))/)?.[1];return i&&i!=e?i:e};function T(e,t){let i=j({str:e,reg:/_(pico|icon|thumb|small|compact|medium|large|grande|original|1024x1024|2048x2048|master)+\./g,newString:"."});if(k(i))return i;let r=j({str:i,reg:/\.jpg|\.png|\.jpeg/g,newString:t,isAdd:!0});return r}let j=e=>{let t=e.str,i=e.str.match(e.reg)?.length;if(i){let r,l=1;for(;null!==(r=e.reg.exec(e.str));){if(l===i){let i=e.reg.lastIndex,l=i-r[0].length;e.isAdd&&(e.newString="_"+e.newString+r),t=t.slice(0,l)+e.newString+t.slice(i,t.length)}l++}}return t},L=(e,t)=>{let i=H(),r=t?.[i]||"auto";if("auto"===r||r.includes("%"))return e;let l=Number(r.replace("px",""));return l>e?e:Number(r.replace("px",""))},D=e=>{let{itemWidthParam:t,imageWidthSetting:i,qualityType:r,qualityPercent:l}=e,s=H(),o=L(t,i),n=a(r,s,"finest"),g=a(l,s,100);switch(n){case"finest":default:return"auto";case"high":return Math.round(1.5*o)||1;case"medium":return Math.round(o)||1;case"custom":return Math.round(o*(Number(g)/100))||1}},W=e=>{let t={desktop:"100%",tablet:"100%",mobile:"100%"};return l.forEach(i=>{let r=a(e,i)?.width||"100%";t[i]=r}),t},O=e=>{let t={desktop:"100%",tablet:"100%",mobile:"100%"};return l.forEach(i=>{let r=a(e,i)?.width||"100%";t[i]=r}),t},B=e=>{let t=document.querySelectorAll(`.gem-slider-item-${e}.gp-gallery-image-item`),i=0;return t.forEach(e=>{e.offsetWidth>i&&(i=e.offsetWidth)}),i},K=e=>{let t=document.querySelectorAll(`.gem-slider-item-${e}.gp-ft-image-item`),i=0;return t.forEach(e=>{e.offsetWidth>i&&(i=e.offsetWidth)}),i},P=e=>{let{shapeByLayout:t,qualityType:i,qualityPercent:r,builderPropUID:l}=e,a=document.querySelectorAll(`.gem-slider-item-${l}.gp-gallery-image-item`),s=O(t),o=B(l);a.forEach(e=>{G({item:e,settingWidth:s,width:o,qualityType:i,qualityPercent:r})})},U=e=>{let{ftShape:t,qualityType:i,qualityPercent:r,builderPropUID:l}=e,a=document.querySelectorAll(`.gem-slider-item-${l}.gp-ft-image-item`),s=W(t),o=K(l);a.forEach(e=>{G({item:e,settingWidth:s,width:o,qualityType:i,qualityPercent:r})})},G=e=>{let{item:t,settingWidth:i,width:r,qualityType:l,qualityPercent:a}=e,s=H(),o=t.querySelector("img");if(o){let e=D({itemWidthParam:r,imageWidthSetting:i,qualityType:l,qualityPercent:a}),t=o.getAttribute("base-src");if(!t)return;let n=M(e,t),g=q(t,n,s);o.setAttribute("srcset",g)}},M=(e,t)=>"auto"===e?t:T(t,`${e}x`),q=(e,t,i)=>`${"mobile"===i&&e!==t?t:T(e,"768x")} 767w, ${"tablet"===i&&e!==t?t:T(e,"1024x")} 1023w, ${"desktop"===i&&e!==t?t:T(e,"1920x")} 1440w`,H=()=>window.innerWidth<768?"mobile":window.innerWidth>=768&&window.innerWidth<1025?"tablet":"desktop";export{_ as FALLBACK_IMAGE,$ as IMAGE_PLACEHOLDER,S as NEXT_IMAGE_CONFIG,m as composeAspectRatio,w as createBlurDataURL,E as getAdaptiveImageData,u as getAspectRatio,p as getAspectRatioNextImage,H as getCurrentDevice,C as getImageSrc,D as getImageWidthFollowByQuality,R as getNewBackupFileKey,f as getResponsiveObjectFit,x as getSettingTranslatedImageAndSeo,I as getSrcSet,U as handleSetSrcForFeatureProductImage,P as handleSetSrcForProductImageList,k as isCannotResizeImage,d as overwriteDefaultRadius,N as replaceBackupFileKeyFileContent,T as resizeImage,h as safeStringify,b as shimmer,A as toBase64};

package/dist/esm/image/next.js

@@ -1 +1 @@
-import o from"next/dynamic";import m from"../common/components/Loading.js";import"react/jsx-runtime";import"react";import"@gem-sdk/core";let t=o(()=>import("./components/Image.js"),{loading:m});var r={Image:t};export{r as default};
+import a from"./components/Image.js";var e={Image:a};export{e as default};

package/dist/esm/image/settings/configs/ui-v2.js

@@ -1 +1 @@
-let e=[{label:"Style",controls:[{setting:{id:"imageStyle"},layout:"vertical",controlChangeTrigger:{settings:[{condition:'imageStyle==="circle"',source:["imageStyle"],action:{controlId:"shape",newValue:{shape:"square",shapeValue:"1/1",shapeLinked:!0,width:"80px"},groupType:"style",controlType:"style"}},{condition:'imageStyle==="circle"',source:["imageStyle"],action:{controlId:"borderRadius",newValue:{bblr:"9999px",btrr:"9999px",bbrr:"9999px",btlr:"9999px",radiusType:"circle"},groupType:"style",controlType:"style"}},{condition:'imageStyle==="circle"',source:["imageStyle"],action:{controlId:"wrapperBorder",newValue:{border:"none",color:"transparent",borderWidth:"0px"},groupType:"style",controlType:"style"}},{condition:'imageStyle==="rectangle"',source:["imageStyle"],action:{controlId:"wrapperBorder",newValue:{border:"none",color:"transparent",borderWidth:"0px"},groupType:"style",controlType:"style"}},{condition:'imageStyle==="circle"',source:["imageStyle"],action:{controlId:"shadow",newValue:{enable:!1},groupType:"style",controlType:"style"}},{condition:'imageStyle==="rectangle"',source:["imageStyle"],action:{controlId:"shadow",newValue:{enable:!1},groupType:"style",controlType:"style"}},{condition:'imageStyle==="rectangle"',source:["imageStyle"],action:{controlId:"shape",newValue:{shape:"original",shapeValue:"",width:"100%"},groupType:"style",controlType:"style"}},{condition:'imageStyle==="rectangle"',source:["imageStyle"],action:{controlId:"borderRadius",newValue:{bblr:"0px",btrr:"0px",bbrr:"0px",btlr:"0px",radiusType:"none"},groupType:"style",controlType:"style"}}],options:{noRecordHistory:!0}}}]},{label:"Source",controls:[{conditionDisplay:"isAdaptive === false",setting:{id:"image"},layout:"vertical",options:{updateFields:[{field:"preload",settingId:"priority"},{field:"altText",settingId:"alt"},{field:"imageTitle",settingId:"title"}]},controlChangeTrigger:{settings:[{action:{controlId:"priority",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"alt",valueFromField:"altText",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"title",valueFromField:"imageTitle",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}},{conditionDisplay:"isAdaptive === true",setting:{id:"srcSet"},layout:"vertical",options:{updateFields:[{field:"preload",settingId:"priority"},{field:"altText",settingId:"alt"},{field:"imageTitle",settingId:"title"}]},controlChangeTrigger:{settings:[{action:{controlId:"priority",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"alt",valueFromField:"altText",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"title",valueFromField:"imageTitle",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}},{label:"Scale",setting:{id:"objectFit"},conditionDisplay:'shape.shape !== "original"'}]},{label:"Size",controls:[{setting:{id:"shape"},layout:"vertical"}]},{label:"Shape",controls:[{label:"Border",controlConfig:{id:"border",type:"border-v2",linkWithSetting:{name:"wrapperBorder"}}},{label:"Corner",controlConfig:{id:"corner",type:"corner-v2",linkWithSetting:{name:"borderRadius"}}},{label:"Shadow",setting:{id:"shadow"},options:{updateFields:[{field:"enable",settingId:"hasActiveShadow"}]},controlChangeTrigger:{settings:[{condition:"shadow.enable === true",source:["shadow","hasActiveShadow"],action:{controlId:"hasActiveShadow",groupType:"advanced",controlType:"advanced",newValue:!0}},{condition:"shadow.enable === false",source:["shadow","hasActiveShadow"],action:{controlId:"hasActiveShadow",groupType:"advanced",controlType:"advanced",newValue:!1}}],options:{noRecordHistory:!0}}}]},{controls:[{label:"Link",setting:{id:"enableImageLink"},options:{labelVariant:"primary",toggleStyle:"switch"}},{layout:"vertical",controlConfig:{id:"linkedToPreSalesPageBanner",type:"banner",message:"Pre-sales page elements with link should redirect to the Sales page."},conditionDisplay:'pageType === "GP_PRE_SALE_PAGE" && enableImageLink == true'},{setting:{id:"imageLink"},conditionDisplay:"enableImageLink === true",layout:"vertical"}]},{label:"SEO",controls:[{type:"combo",label:"Alt text",iconName:"polaris-text-block",getValueFromSettingID:"alt",compoDefaultValue:"Describes the appearance of the image",isHideClear:!0,controls:[{label:"Content",setting:{id:"alt"},layout:"vertical"}]},{type:"combo",label:"Image title",iconName:"polaris-text-block",getValueFromSettingID:"title",isHideClear:!0,compoDefaultValue:"Title",controls:[{label:"Content",setting:{id:"title"},layout:"vertical"}]}]},{label:"Optimize LCP",controls:[{label:"Preload",setting:{id:"priority"}},{label:"Quality",setting:{id:"qualityType"},options:{disableMessage:"This setting only works with images uploaded to Shopify"},conditionEnable:"(activeScreenId === \"desktop\" && srcSet?.src && srcSet.src.includes('cdn.shopify.com')) || (activeScreenId === \"tablet\" && srcSet?.src && srcSet.src.includes('cdn.shopify.com')) || (activeScreenId === \"mobile\" && srcSet?.src && srcSet.src.includes('cdn.shopify.com'))",conditionDisplay:"priority === false"},{layout:"horizontal",label:"Quality",conditionDisplay:'qualityType == "custom" && priority === false && ((activeScreenId === "desktop" && srcSet?.src && srcSet.src.includes("cdn.shopify.com")) || (activeScreenId === "tablet" && srcSet?.src && srcSet.src.includes("cdn.shopify.com")) || (activeScreenId === "mobile" && srcSet?.src && srcSet.src.includes("cdn.shopify.com")))',setting:{id:"qualityPercent"}}]},{controls:[{label:"Align",setting:{id:"align"},conditionEnable:'!(shape.width === "default" || (parseInt(shape.width) >= 100 && shape.width?.includes("%")))',options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"}}]}];export{e as SettingUIV2};
+let e=[{label:"Style",controls:[{setting:{id:"imageStyle"},layout:"vertical",controlChangeTrigger:{settings:[{condition:'imageStyle==="circle"',source:["imageStyle"],action:{controlId:"shape",newValue:{shape:"square",shapeValue:"1/1",shapeLinked:!0,width:"80px"},groupType:"style",controlType:"style"}},{condition:'imageStyle==="circle"',source:["imageStyle"],action:{controlId:"borderRadius",newValue:{bblr:"9999px",btrr:"9999px",bbrr:"9999px",btlr:"9999px",radiusType:"circle"},groupType:"style",controlType:"style"}},{condition:'imageStyle==="circle"',source:["imageStyle"],action:{controlId:"wrapperBorder",newValue:{border:"none",color:"transparent",borderWidth:"0px"},groupType:"style",controlType:"style"}},{condition:'imageStyle==="rectangle"',source:["imageStyle"],action:{controlId:"wrapperBorder",newValue:{border:"none",color:"transparent",borderWidth:"0px"},groupType:"style",controlType:"style"}},{condition:'imageStyle==="circle"',source:["imageStyle"],action:{controlId:"shadow",newValue:{enable:!1},groupType:"style",controlType:"style"}},{condition:'imageStyle==="rectangle"',source:["imageStyle"],action:{controlId:"shadow",newValue:{enable:!1},groupType:"style",controlType:"style"}},{condition:'imageStyle==="rectangle"',source:["imageStyle"],action:{controlId:"shape",newValue:{shape:"original",shapeValue:"",width:"100%"},groupType:"style",controlType:"style"}},{condition:'imageStyle==="rectangle"',source:["imageStyle"],action:{controlId:"borderRadius",newValue:{bblr:"0px",btrr:"0px",bbrr:"0px",btlr:"0px",radiusType:"none"},groupType:"style",controlType:"style"}}],options:{noRecordHistory:!0}}}]},{label:"Source",controls:[{conditionDisplay:"isAdaptive === false",setting:{id:"image"},layout:"vertical",options:{updateFields:[{field:"preload",settingId:"priority"},{field:"altText",settingId:"alt"},{field:"imageTitle",settingId:"title"}]},controlChangeTrigger:{settings:[{action:{controlId:"priority",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"alt",valueFromField:"altText",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"title",valueFromField:"imageTitle",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}},{conditionDisplay:"isAdaptive === true",setting:{id:"srcSet"},layout:"vertical",options:{updateFields:[{field:"preload",settingId:"priority"},{field:"altText",settingId:"alt"},{field:"imageTitle",settingId:"title"}]},controlChangeTrigger:{settings:[{action:{controlId:"priority",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"alt",valueFromField:"altText",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"title",valueFromField:"imageTitle",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}},{label:"Scale",setting:{id:"objectFit"},conditionDisplay:'shape.shape !== "original"'}]},{label:"Size",hiddenOnMobile:!0,controls:[{setting:{id:"shape"},layout:"vertical"}]},{label:"Shape",hiddenOnMobile:!0,controls:[{label:"Border",controlConfig:{id:"border",type:"border-v2",linkWithSetting:{name:"wrapperBorder"}}},{label:"Corner",controlConfig:{id:"corner",type:"corner-v2",linkWithSetting:{name:"borderRadius"}}},{label:"Shadow",setting:{id:"shadow"},options:{updateFields:[{field:"enable",settingId:"hasActiveShadow"}]},controlChangeTrigger:{settings:[{condition:"shadow.enable === true",source:["shadow","hasActiveShadow"],action:{controlId:"hasActiveShadow",groupType:"advanced",controlType:"advanced",newValue:!0}},{condition:"shadow.enable === false",source:["shadow","hasActiveShadow"],action:{controlId:"hasActiveShadow",groupType:"advanced",controlType:"advanced",newValue:!1}}],options:{noRecordHistory:!0}}}]},{controls:[{label:"Link",setting:{id:"enableImageLink"},options:{labelVariant:"primary",toggleStyle:"switch"}},{layout:"vertical",controlConfig:{id:"linkedToPreSalesPageBanner",type:"banner",message:"Pre-sales page elements with link should redirect to the Sales page."},conditionDisplay:'pageType === "GP_PRE_SALE_PAGE" && enableImageLink == true'},{setting:{id:"imageLink"},conditionDisplay:"enableImageLink === true",layout:"vertical"}]},{label:"SEO",hiddenOnMobile:!0,controls:[{type:"combo",label:"Alt text",iconName:"polaris-text-block",getValueFromSettingID:"alt",compoDefaultValue:"Describes the appearance of the image",isHideClear:!0,controls:[{label:"Content",setting:{id:"alt"},layout:"vertical"}]},{type:"combo",label:"Image title",iconName:"polaris-text-block",getValueFromSettingID:"title",isHideClear:!0,compoDefaultValue:"Title",controls:[{label:"Content",setting:{id:"title"},layout:"vertical"}]}]},{label:"Optimize LCP",conditionDisplay:'pageType !== "STATIC"',hiddenOnMobile:!0,controls:[{label:"Preload",setting:{id:"priority"}},{label:"Quality",setting:{id:"qualityType"},options:{disableMessage:"This setting only works with images uploaded to Shopify"},conditionEnable:"(activeScreenId === \"desktop\" && srcSet?.src && srcSet.src.includes('cdn.shopify.com')) || (activeScreenId === \"tablet\" && srcSet?.src && srcSet.src.includes('cdn.shopify.com')) || (activeScreenId === \"mobile\" && srcSet?.src && srcSet.src.includes('cdn.shopify.com'))",conditionDisplay:"priority === false"},{layout:"horizontal",label:"Quality",conditionDisplay:'qualityType == "custom" && priority === false && ((activeScreenId === "desktop" && srcSet?.src && srcSet.src.includes("cdn.shopify.com")) || (activeScreenId === "tablet" && srcSet?.src && srcSet.src.includes("cdn.shopify.com")) || (activeScreenId === "mobile" && srcSet?.src && srcSet.src.includes("cdn.shopify.com")))',setting:{id:"qualityPercent"}}]},{controls:[{label:"Align",hiddenOnMobile:!0,setting:{id:"align"},conditionEnable:'!(shape.width === "default" || (parseInt(shape.width) >= 100 && shape.width?.includes("%")))',options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"}}]}];export{e as SettingUIV2};

package/dist/esm/image-comparison/common/classes.js

@@ -1 +1 @@
-import{composeTypographyClassName as e}from"@gem-sdk/core";let p=e=>({"gp-w-full gp-flex":!0,...e&&{cssClass:!0}}),g=p=>{let g=e(p?.typo);return{[g]:!0,"gp-absolute gp-box-border gp-rounded-[4px] gp-bg-[rgba(0,0,0,0.60)] gp-px-2 gp-py-1":!0}},r=()=>({"gp-absolute gp-top-0 gp-h-full gp-w-full":!0}),l=()=>({"gp-flex gp-w-full gp-overflow-hidden":!0}),s=()=>({"border-radius":"inherit"});export{l as getImageComparisonWrapperClasses,s as getImageComparisonWrapperStyles,g as getLabelClasses,r as getLabelContainerClasses,p as getOuterWrapperClasses};
+import{composeTypographyClassName as e}from"@gem-sdk/core";let p=e=>({"gp-w-full gp-flex":!0,...e&&{cssClass:!0}}),g=p=>{let g=e(p?.typo);return{[g]:!0,"gp-absolute gp-box-border gp-rounded-[4px] gp-bg-[rgba(0,0,0,0.60)] gp-px-2 gp-py-1":!0}},r=()=>({"gp-absolute gp-top-0 gp-h-full gp-w-full":!0}),s=()=>({"gp-flex gp-w-full gp-overflow-hidden swiper-no-swiping":!0}),l=()=>({"border-radius":"inherit"});export{s as getImageComparisonWrapperClasses,l as getImageComparisonWrapperStyles,g as getLabelClasses,r as getLabelContainerClasses,p as getOuterWrapperClasses};

package/dist/esm/image-comparison/components/CompareImage.liquid.js

@@ -1,10 +1,10 @@
-import{template as t,isLocalEnv as e,baseAssetURL as i}from"@gem-sdk/core";import{createStyle as s,createClass as a,createAttr as r,createStateOrContext as l,If as o}from"@gem-sdk/system";import{getSettingPreloadData as m}from"../../helpers.js";import d from"../../image/components/NextImage.liquid.js";import{getOuterWrapperStyles as p,getWrapperWidth as c,getContainerStyles as g,getLazyPlaceholderStyle as n,getImageStyles as y,getLabelStyles as h,getArrowStyles as f,getLineStyles as $,getHandleStyles as b,getHandleCustomStyles as L,getSliderStyles as S}from"../common/styles.js";import{getOuterWrapperClasses as j,getLabelClasses as u,getLabelContainerClasses as I}from"../common/classes.js";import{getImageLiquidAttrs as v,getImagePlaceholderAttrs as w,getLabelLiquidAttrs as A,getLabelAttrs as C}from"../common/attrs.js";import{getData as q}from"../common/helpers.js";import N from"./Label.liquid.js";import k from"./SlideHandle.liquid.js";let z=z=>{let{leftImage:D,rightImage:E,advanced:O,builderData:x,pageContext:F,preload:G=!1,onSliderPositionChange:H}=z,{hover:W,styles:_,handle:J,handleSize:M,leftImageAlt:P,leftImageTitle:R,leftImageCss:T,leftImageLabel:V,rightImageAlt:B,rightImageTitle:K,rightImageCss:Q,rightImageLabel:U,sliderLineWidth:X,sliderLineColor:Y,sliderPositionPercentage:Z,vertical:tt,componentUid:te,tempImage:ti,aspectRatio:ts,defaultRatio:ta,isHorizontal:tr,hasLeftLabel:tl,hasRightLabel:to,qualityType:tm,qualityPercent:td,getLeftImageSrc:tp,getRightImageSrc:tc}=q(z),tg=tp({isLiquid:!0}),tn=tc({isLiquid:!0}),ty=s({...p(_)}),th=s({...c({width:_?.width,leftImageWidth:D?.width,rightImageWidth:E?.width})}),tf=s({...g({aspectRatio:ts,builderData:x})}),t$=s({...n(ts)}),tb=s({...y({type:"right",props:z})}),tL=s({...y({type:"left",props:z})}),tS=s({...h({styles:_,type:"left",isHorizontal:tr})}),tj=s({...h({styles:_,type:"right",isHorizontal:tr})}),tu=s({...f({type:"left"})}),tI=s({...f({type:"right"})}),tv=s({...$({isHorizontal:tr,sliderLineColor:Y,sliderLineWidth:X})}),tw=s({...b({handleSize:M,isHorizontal:tr,sliderLineColor:Y,sliderLineWidth:X})}),tA=s({...L()}),tC=s({...S({hover:W,handleSize:M,isHorizontal:tr})}),tq=a({...j(O?.cssClass)}),tN=a({...u(_)}),tk=a({...I()}),tz=C({componentUid:te,positionId:"left",label:V??""}),tD=C({componentUid:te,positionId:"right",label:U??""}),tE=r({...v({priority:G,src:tn,title:K,isDisableObjectFit:!0,isDisableAspectStyle:!0,id:`right-image-${te}`})}),tO=r({...v({priority:G,src:tg,title:R,isDisableObjectFit:!0,isDisableAspectStyle:!0,id:`left-image-${te}`})}),tx=A({pageContext:F,translateLabel:"leftImageLabel"}),tF=A({pageContext:F,translateLabel:"rightImageLabel"}),tG=r({...w({width:ti?.width,height:ti?.height})}),tH=l({hover:W,handle:J,vertical:tt,leftImage:D,rightImage:E,handleSize:M,aspectRatio:ts,defaultRatio:ta,componentUid:te,leftImageCss:T,rightImageCss:Q,sliderLineColor:Y,sliderLineWidth:X,sliderPositionPercentage:Z,onSliderPositionChange:H});return t`
+import{template as t,isLocalEnv as e,baseAssetURL as i}from"@gem-sdk/core";import{createStyle as s,createClass as a,createAttr as r,createStateOrContext as l,If as o}from"@gem-sdk/system";import{getSettingPreloadData as m}from"../../helpers.js";import d from"../../image/components/NextImage.liquid.js";import{getOuterWrapperStyles as p,getWrapperWidth as c,getContainerStyles as n,getLazyPlaceholderStyle as g,getImageStyles as y,getLabelStyles as h,getArrowStyles as f,getLineStyles as $,getHandleStyles as b,getHandleCustomStyles as j,getSliderStyles as L}from"../common/styles.js";import{getOuterWrapperClasses as S,getLabelClasses as u,getLabelContainerClasses as I}from"../common/classes.js";import{getImageLiquidAttrs as v,getImagePlaceholderAttrs as w,getLabelLiquidAttrs as A,getLabelAttrs as C}from"../common/attrs.js";import{getData as q}from"../common/helpers.js";import N from"./Label.liquid.js";import k from"./SlideHandle.liquid.js";let z=z=>{let{leftImage:D,rightImage:E,advanced:O,builderData:x,pageContext:F,preload:G=!1,onSliderPositionChange:H}=z,{hover:W,styles:_,handle:J,handleSize:M,leftImageAlt:P,leftImageTitle:R,leftImageCss:T,leftImageLabel:V,rightImageAlt:B,rightImageTitle:K,rightImageCss:Q,rightImageLabel:U,sliderLineWidth:X,sliderLineColor:Y,sliderPositionPercentage:Z,vertical:tt,componentUid:te,tempImage:ti,aspectRatio:ts,defaultRatio:ta,isHorizontal:tr,hasLeftLabel:tl,hasRightLabel:to,qualityType:tm,qualityPercent:td,getLeftImageSrc:tp,getRightImageSrc:tc}=q(z),tn=tp({isLiquid:!0}),tg=tc({isLiquid:!0}),ty=s({...p(_)}),th=s({...c({width:_?.width,leftImageWidth:D?.width,rightImageWidth:E?.width})}),tf=s({...n({aspectRatio:ts,builderData:x})}),t$=s({...g(ts)}),tb=s({...y({type:"right",props:z})}),tj=s({...y({type:"left",props:z})}),tL=s({...h({styles:_,type:"left",isHorizontal:tr})}),tS=s({...h({styles:_,type:"right",isHorizontal:tr})}),tu=s({...f({type:"left"})}),tI=s({...f({type:"right"})}),tv=s({...$({isHorizontal:tr,sliderLineColor:Y,sliderLineWidth:X})}),tw=s({...b({handleSize:M,isHorizontal:tr,sliderLineColor:Y,sliderLineWidth:X})}),tA=s({...j()}),tC=s({...L({hover:W,handleSize:M,isHorizontal:tr})}),tq=a({...S(O?.cssClass)}),tN=a({...u(_)}),tk=a({...I()}),tz=C({componentUid:te,positionId:"left",label:V??""}),tD=C({componentUid:te,positionId:"right",label:U??""}),tE=r({...v({priority:G,src:tg,title:K,isDisableObjectFit:!0,isDisableAspectStyle:!0,id:`right-image-${te}`})}),tO=r({...v({priority:G,src:tn,title:R,isDisableObjectFit:!0,isDisableAspectStyle:!0,id:`left-image-${te}`})}),tx=A({pageContext:F,translateLabel:"leftImageLabel"}),tF=A({pageContext:F,translateLabel:"rightImageLabel"}),tG=r({...w({width:ti?.width,height:ti?.height})}),tH=l({hover:W,handle:J,vertical:tt,leftImage:D,rightImage:E,handleSize:M,aspectRatio:ts,defaultRatio:ta,componentUid:te,leftImageCss:T,rightImageCss:Q,sliderLineColor:Y,sliderLineWidth:X,sliderPositionPercentage:Z,onSliderPositionChange:H});return t`
     <gp-image-comparison
       data-id="${te}"
       style="${ty}"
       class="${tq}"
-      gp-data='${JSON.stringify(tH)}'
     >
+      <script gp-data type="application/json">${JSON.stringify(tH)}</script>
       <div id="img-comparison-wrapper-${te}" style="${th}">
         <div
           id="img-comparison-container-${te}"
@@ -15,10 +15,10 @@ import{template as t,isLocalEnv as e,baseAssetURL as i}from"@gem-sdk/core";impor
       <img alt="" ${tG} style="${t$}" />
     `}
           ${d({...tE,alt:B,style:tb,setting:{qualityType:tm,qualityPercent:td},enableLazyLoadImage:!G,isNotLazyload:G,customAttrs:{"data-testid":"right-image"}})}
-          ${d({...tO,alt:P,style:tL,setting:{qualityType:tm,qualityPercent:td},enableLazyLoadImage:!G,isNotLazyload:G,customAttrs:{"data-testid":"left-image"}})}
+          ${d({...tO,alt:P,style:tj,setting:{qualityType:tm,qualityPercent:td},enableLazyLoadImage:!G,isNotLazyload:G,customAttrs:{"data-testid":"left-image"}})}
           ${k({componentUid:te,customHandle:J,lineStyles:tv,sliderStyles:tC,handleStyles:tw,customHandleStyles:tA,leftArrowStyles:tu,rightArrowStyles:tI})}
-          ${o(tl,N({...tz,...tx,styles:_,childrenClass:tN,childrenStyle:tS,containerClass:tk,containerStyle:{}}),"")}
-          ${o(to,N({...tD,...tF,styles:_,childrenClass:tN,childrenStyle:tj,containerClass:tk,containerStyle:{}}),"")}
+          ${o(tl,N({...tz,...tx,styles:_,childrenClass:tN,childrenStyle:tL,containerClass:tk,containerStyle:{}}),"")}
+          ${o(to,N({...tD,...tF,styles:_,childrenClass:tN,childrenStyle:tS,containerClass:tk,containerStyle:{}}),"")}
         </div>
       </div>
     </gp-image-comparison>

package/dist/esm/image-comparison/settings/configs/ui-v2.js

@@ -1 +1 @@
-let e=[{label:"Layout",controls:[{setting:{id:"direction"},layout:"vertical",options:{fullWidth:!0}}]},{label:"Image",controls:[{label:"1st image",setting:{id:"imageLeft"},options:{updateFields:[{field:"preload",settingId:"preload"},{field:"altText",settingId:"altLeft"},{field:"imageTitle",settingId:"titleLeft"}]},controlChangeTrigger:{settings:[{action:{controlId:"preload",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"altLeft",valueFromField:"altText",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"titleLeft",valueFromField:"imageTitle",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}},{label:"2nd image",setting:{id:"imageRight"},options:{updateFields:[{field:"preload",settingId:"preload"},{field:"altText",settingId:"altRight"},{field:"imageTitle",settingId:"titleRight"}]},controlChangeTrigger:{settings:[{action:{controlId:"preload",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"altRight",valueFromField:"altText",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"titleRight",valueFromField:"imageTitle",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}},{label:"Scale",setting:{id:"imageScale"}}]},{label:"Slider",controls:[{label:"Behavior",setting:{id:"hoverToSlide"}},{label:"Default ratio",setting:{id:"defaultPercentage"}}]},{controls:[{label:"Badge",setting:{id:"enableLabel"},options:{labelVariant:"primary",toggleStyle:"switch"}},{label:"1st",conditionDisplay:"enableLabel === true",setting:{id:"leftImageLabel"}},{label:"2nd",conditionDisplay:"enableLabel === true",setting:{id:"rightImageLabel"}},{conditionDisplay:"enableLabel === true",label:"Text style",setting:{id:"typo"},options:{updateFields:[{field:"attrs.color",settingId:"labelTextColor"}]},controlChangeTrigger:{settings:[{action:{controlId:"labelTextColor",valueFromField:"attrs.color",groupType:"style",controlType:"style",removeDevice:!0}}],options:{noRecordHistory:!0}}},{label:"Padding",conditionDisplay:"enableLabel === true",setting:{id:"labelPadding"}},{label:"Background",conditionDisplay:"enableLabel === true",setting:{id:"labelBackgroundColor"}},{label:"Border",conditionDisplay:"enableLabel === true",setting:{id:"labelBorder"}},{label:"Corner",conditionDisplay:"enableLabel === true",setting:{id:"labelRounded"}},{label:"Shadow",conditionDisplay:"enableLabel === true",setting:{id:"labelShadow"}},{label:"Position",setting:{id:"labelPositionHoz"},conditionDisplay:"enableLabel === true && direction === 'horizontal'"},{label:"Position",setting:{id:"labelPositionVer"},conditionDisplay:"enableLabel === true && direction === 'vertical'"}]},{label:"Size",controls:[{label:"Frame",setting:{id:"aspectRatio"}},{label:"Ratio",conditionDisplay:"aspectRatio === 'custom'",setting:{id:"customAspectRadio"}},{label:"Width",setting:{id:"width"}}]},{label:"Shape",controls:[{label:"Border",setting:{id:"border",state:"normal"}},{label:"Corner",setting:{id:"rounded",state:"normal"}},{label:"Shadow",setting:{id:"boxShadow",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadow",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadow.normal.enable === true",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!0}},{condition:"boxShadow.normal.enable === false",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{label:"Optimize LCP",controls:[{label:"Preload",setting:{id:"preload"}},{label:"Quality",conditionEnable:"((imageLeft.src || imageRight.src) && (imageLeft.src.includes('cdn.shopify.com') || imageRight.src.includes('cdn.shopify.com')))",conditionDisplay:"preload === false",setting:{id:"qualityType"},options:{fullWidth:!0,disableMessage:"This setting only works with images uploaded to Shopify"}},{layout:"horizontal",label:"Quality",conditionDisplay:'qualityType == "custom" && preload === false && ((imageLeft.src || imageRight.src) && (imageLeft.src.includes("cdn.shopify.com") || imageRight.src.includes("cdn.shopify.com"))) ',setting:{id:"qualityPercent"}}]},{label:"SEO",controls:[{label:"1st image",type:"combo",iconName:"polaris-text-title",fixedValue:"Edit",popoverLabel:"SEO",setting:{id:"enableSEOLeft"},controls:[{label:"Alt text",options:{labelAlign:"top"},setting:{id:"altLeft"}},{label:"Image title",options:{labelAlign:"top"},setting:{id:"titleLeft"}}]},{label:"2nd image",type:"combo",iconName:"polaris-text-title",fixedValue:"Edit",setting:{id:"enableSEORight"},popoverLabel:"SEO",controls:[{label:"Alt text",options:{labelAlign:"top"},setting:{id:"altRight"}},{label:"Image title",options:{labelAlign:"top"},setting:{id:"titleRight"}}]}]},{controls:[{label:"Align",conditionEnable:'!(width === "default" || (parseInt(width) >= 100 && width?.includes("%")))',setting:{id:"align"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Align is not supported when width is 100%"}}]}];export{e as SettingUIV2};
+let e=[{label:"Layout",controls:[{setting:{id:"direction"},layout:"vertical",options:{fullWidth:!0}}]},{label:"Image",controls:[{label:"1st image",setting:{id:"imageLeft"},options:{updateFields:[{field:"preload",settingId:"preload"},{field:"altText",settingId:"altLeft"},{field:"imageTitle",settingId:"titleLeft"}]},controlChangeTrigger:{settings:[{action:{controlId:"preload",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"altLeft",valueFromField:"altText",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"titleLeft",valueFromField:"imageTitle",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}},{label:"2nd image",setting:{id:"imageRight"},options:{updateFields:[{field:"preload",settingId:"preload"},{field:"altText",settingId:"altRight"},{field:"imageTitle",settingId:"titleRight"}]},controlChangeTrigger:{settings:[{action:{controlId:"preload",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"altRight",valueFromField:"altText",groupType:"setting",controlType:"setting",removeDevice:!0}},{action:{controlId:"titleRight",valueFromField:"imageTitle",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}},{label:"Scale",setting:{id:"imageScale"}}]},{label:"Slider",controls:[{label:"Behavior",setting:{id:"hoverToSlide"}},{label:"Default ratio",setting:{id:"defaultPercentage"}}]},{controls:[{label:"Badge",hiddenOnMobile:!0,setting:{id:"enableLabel"},options:{labelVariant:"primary",toggleStyle:"switch"}},{label:"1st",hiddenOnMobile:!0,conditionDisplay:"enableLabel === true",setting:{id:"leftImageLabel"}},{label:"2nd",hiddenOnMobile:!0,conditionDisplay:"enableLabel === true",setting:{id:"rightImageLabel"}},{conditionDisplay:"enableLabel === true",label:"Text style",hiddenOnMobile:!0,setting:{id:"typo"},options:{updateFields:[{field:"attrs.color",settingId:"labelTextColor"}]},controlChangeTrigger:{settings:[{action:{controlId:"labelTextColor",valueFromField:"attrs.color",groupType:"style",controlType:"style",removeDevice:!0}}],options:{noRecordHistory:!0}}},{label:"Padding",hiddenOnMobile:!0,conditionDisplay:"enableLabel === true",setting:{id:"labelPadding"}},{label:"Background",hiddenOnMobile:!0,conditionDisplay:"enableLabel === true",setting:{id:"labelBackgroundColor"}},{label:"Border",hiddenOnMobile:!0,conditionDisplay:"enableLabel === true",setting:{id:"labelBorder"}},{label:"Corner",hiddenOnMobile:!0,conditionDisplay:"enableLabel === true",setting:{id:"labelRounded"}},{label:"Shadow",hiddenOnMobile:!0,conditionDisplay:"enableLabel === true",setting:{id:"labelShadow"}},{label:"Position",hiddenOnMobile:!0,setting:{id:"labelPositionHoz"},conditionDisplay:"enableLabel === true && direction === 'horizontal'"},{label:"Position",hiddenOnMobile:!0,setting:{id:"labelPositionVer"},conditionDisplay:"enableLabel === true && direction === 'vertical'"}]},{label:"Size",hiddenOnMobile:!0,controls:[{label:"Frame",setting:{id:"aspectRatio"}},{label:"Ratio",conditionDisplay:"aspectRatio === 'custom'",setting:{id:"customAspectRadio"}},{label:"Width",setting:{id:"width"}}]},{label:"Shape",hiddenOnMobile:!0,controls:[{label:"Border",setting:{id:"border",state:"normal"}},{label:"Corner",setting:{id:"rounded",state:"normal"}},{label:"Shadow",setting:{id:"boxShadow",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadow",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadow.normal.enable === true",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!0}},{condition:"boxShadow.normal.enable === false",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{label:"Optimize LCP",conditionDisplay:'pageType !== "STATIC"',hiddenOnMobile:!0,controls:[{label:"Preload",setting:{id:"preload"}},{label:"Quality",conditionEnable:"((imageLeft.src || imageRight.src) && (imageLeft.src.includes('cdn.shopify.com') || imageRight.src.includes('cdn.shopify.com')))",conditionDisplay:"preload === false",setting:{id:"qualityType"},options:{fullWidth:!0,disableMessage:"This setting only works with images uploaded to Shopify"}},{layout:"horizontal",label:"Quality",conditionDisplay:'qualityType == "custom" && preload === false && ((imageLeft.src || imageRight.src) && (imageLeft.src.includes("cdn.shopify.com") || imageRight.src.includes("cdn.shopify.com"))) ',setting:{id:"qualityPercent"}}]},{label:"SEO",hiddenOnMobile:!0,controls:[{label:"1st image",type:"combo",iconName:"polaris-text-title",fixedValue:"Edit",popoverLabel:"SEO",setting:{id:"enableSEOLeft"},controls:[{label:"Alt text",options:{labelAlign:"top"},setting:{id:"altLeft"}},{label:"Image title",options:{labelAlign:"top"},setting:{id:"titleLeft"}}]},{label:"2nd image",type:"combo",iconName:"polaris-text-title",fixedValue:"Edit",setting:{id:"enableSEORight"},popoverLabel:"SEO",controls:[{label:"Alt text",options:{labelAlign:"top"},setting:{id:"altRight"}},{label:"Image title",options:{labelAlign:"top"},setting:{id:"titleRight"}}]}]},{controls:[{label:"Align",hiddenOnMobile:!0,conditionEnable:'!(width === "default" || (parseInt(width) >= 100 && width?.includes("%")))',setting:{id:"align"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Align is not supported when width is 100%"}}]}];export{e as SettingUIV2};