@gem-sdk/components 17.0.0-dev.28 → 17.0.0-staging.5

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

@@ -1 +1 @@
-import{getGlobalColorStateClass as e}from"@gem-sdk/core";import{getClassAlignBanner as r,getClassContentPosition as l,getContentPosition as g,getClassForContentByFitContent as t,getClassForStretchContent as o,getClassSpaceBetween as p,getOpacityHover as a,opacityEnabledData as n,getClassSpaceBetweenLeftRight as s,getResponsiveSetting as i}from"./helpers.js";function u(e){return e.split(" ").reduce((e,r)=>(e[r]=!0,e),{})}let b=({setting:e,builderProps:l,advancedCssClass:g})=>{let t="gp-group/hero gp-flex gp-w-full gp-flex-col gp-self-center gp-transition-colors gp-duration-200 gp-ease-in-out";return g&&(t+=` ${g}`),{...l?.uid&&{[l.uid]:!0},...u(t),...r(i(e?.alignBanner||{}))}},f=()=>({...u("gp-cursor-pointer gp-h-full")}),h=(e,r)=>({...u("gp-relative gp-flex gp-w-full gp-flex-col gp-items-center gp-overflow-hidden hero-banner-container"),...l(g(e?.layout,r?.contentPosition1Col,r?.contentPosition2Col)||{})}),v=e=>{let{overlayColor:r}=e??{},l=r?.hover||r?.normal;return l&&"transparent"!==l&&"0%"!=a(e)},c=r=>{let{overlayColor:l,hoverEffect:g}=r??{},{disableOpacity:t}=n(r),o="gp-absolute gp-inset-0 gp-left-[var(--left)] gp-top-[var(--top)]";return v(r)&&(o+=" gp-transition-all gp-duration-300"),g&&(o+=" group-hover/hero:gp-bg-[color:var(--hvr-bgc,_var(--bgc))] group-hover/hero:gp-opacity-[var(--hvr-op,_var(--op))]"),e("bg",l,t,!g)&&(o+=` ${e("bg",l,t,!g)}`),u(o)},d=(e,r)=>{let{sizeSetting:l,background:g}=e??{},{verticalAlign:a}=r??{},n=t(l,g),i=o(a),b=p(r?.layout||{},e?.contentPosition1Col||{}),f=s(r?.layout||{}),h=`gp-hero-banner-row ${n}  ${i}`;return{...u(h),...b,...f}},C=()=>u("adaptive-hero-banner"),m=()=>u("gp-w-full gp-invisible -gp-z-1"),w=(e,r)=>{let l="hero-banner-bg gp-hero-banner-image-background hero-banner-bg-parallax";return r&&(l+=" gp_lazybg"),e&&(l+=" gp-duration-[var(--duration)] group-hover/hero:gp-scale-[var(--scale)] gp-transition-transform"),u(l)},y=()=>u("gp-hero-banner-bg gp-absolute gp-overflow-hidden gp-w-full gp-h-full top-0 left-0"),_=(e=!1)=>{let r="gp-relative gp-h-full";return e&&(r+=" gp-hidden"),u(r)},x=e=>{let r="gp-h-full gp-w-full !gp-max-w-none gp-pointer-events-none";return e&&(r+=" gp-pb-[56.25%]"),u(r)},k=()=>u("gp-inset-0 gp-w-full gp-bg-black gp-h-full !gp-max-w-none"),z=e=>{let r="gp-absolute gp-top-0 gp-invisible gp-w-full gp_lazyload gp-h-full gp_lazyforbg";return"tablet"===e&&(r+=" gp_lazybg_tl"),"mobile"===e&&(r+=" gp_lazybg_mb"),u(r)};export{v as enableTransitionHover,C as getAdaptiveClasses,m as getAdaptivePictureClasses,w as getBackgroundClasses,b as getClasses,y as getContainBackgroundClasses,h as getContainerClasses,_ as getHtml5VideoClasses,k as getIframeYoutubeClasses,z as getLazyBackgroundClasses,f as getLinkClasses,c as getOverlayClasses,d as getRowClasses,x as getWrapperYoutubeClasses};
+import{getGlobalColorStateClass as e}from"@gem-sdk/core";import{getClassAlignBanner as s,getResponsiveSetting as o,getClassContentPosition as l,getContentPosition as a,getClassForContentByFitContent as t,getClassForStretchContent as r,getClassSpaceBetween as g,opacityEnabledData as p,getClassSpaceBetweenLeftRight as n,getOpacityHover as i}from"./helpers.js";function composeClasses(e){return e.split(" ").reduce((e,s)=>(e[s]=!0,e),{})}let getClasses=({setting:e,builderProps:l,advancedCssClass:a})=>{let t="gp-group/hero gp-flex gp-w-full gp-flex-col gp-self-center gp-transition-colors gp-duration-200 gp-ease-in-out";return a&&(t+=` ${a}`),{...l?.uid&&{[l.uid]:!0},...composeClasses(t),...s(o(e?.alignBanner||{}))}},getLinkClasses=()=>({...composeClasses("gp-cursor-pointer gp-h-full")}),getContainerClasses=(e,s)=>({...composeClasses("gp-relative gp-flex gp-w-full gp-flex-col gp-items-center gp-overflow-hidden hero-banner-container"),...l(a(e?.layout,s?.contentPosition1Col,s?.contentPosition2Col)||{})}),enableTransitionHover=e=>{let{overlayColor:s}=e??{},o=s?.hover||s?.normal;return o&&"transparent"!==o&&"0%"!=i(e)},getOverlayClasses=s=>{let{overlayColor:o,hoverEffect:l}=s??{},{disableOpacity:a}=p(s),t="gp-absolute gp-inset-0 gp-left-[var(--left)] gp-top-[var(--top)]";return enableTransitionHover(s)&&(t+=" gp-transition-all gp-duration-300"),l&&(t+=" group-hover/hero:gp-bg-[color:var(--hvr-bgc,_var(--bgc))] group-hover/hero:gp-opacity-[var(--hvr-op,_var(--op))]"),e("bg",o,a,!l)&&(t+=` ${e("bg",o,a,!l)}`),composeClasses(t)},getRowClasses=(e,s)=>{let{sizeSetting:o,background:l}=e??{},{verticalAlign:a}=s??{},p=t(o,l),i=r(a),u=g(s?.layout||{},e?.contentPosition1Col||{}),C=n(s?.layout||{}),c=`gp-hero-banner-row ${p}  ${i}`;return{...composeClasses(c),...u,...C}},getAdaptiveClasses=()=>composeClasses("adaptive-hero-banner"),getAdaptivePictureClasses=()=>composeClasses("gp-w-full gp-invisible -gp-z-1"),getBackgroundClasses=(e,s)=>{let o="hero-banner-bg gp-hero-banner-image-background hero-banner-bg-parallax";return s&&(o+=" gp_lazybg"),e&&(o+=" gp-duration-[var(--duration)] group-hover/hero:gp-scale-[var(--scale)] gp-transition-transform"),composeClasses(o)},getContainBackgroundClasses=()=>composeClasses("gp-hero-banner-bg gp-absolute gp-overflow-hidden gp-w-full gp-h-full top-0 left-0"),getHtml5VideoClasses=(e=!1)=>{let s="gp-relative gp-h-full";return e&&(s+=" gp-hidden"),composeClasses(s)},getWrapperYoutubeClasses=e=>{let s="gp-h-full gp-w-full !gp-max-w-none gp-pointer-events-none";return e&&(s+=" gp-pb-[56.25%]"),composeClasses(s)},getIframeYoutubeClasses=()=>composeClasses("gp-inset-0 gp-w-full gp-bg-black gp-h-full !gp-max-w-none"),getLazyBackgroundClasses=e=>{let s="gp-absolute gp-top-0 gp-invisible gp-w-full gp_lazyload gp-h-full gp_lazyforbg";return"tablet"===e&&(s+=" gp_lazybg_tl"),"mobile"===e&&(s+=" gp_lazybg_mb"),composeClasses(s)};export{enableTransitionHover,getAdaptiveClasses,getAdaptivePictureClasses,getBackgroundClasses,getClasses,getContainBackgroundClasses,getContainerClasses,getHtml5VideoClasses,getIframeYoutubeClasses,getLazyBackgroundClasses,getLinkClasses,getOverlayClasses,getRowClasses,getWrapperYoutubeClasses};

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

@@ -1 +1 @@
-let A="inset(0px)",E="1.04";export{A as DEFAULT_CLIP_PATH,E as VIDEO_IFRAME_SCALE};
+let DEFAULT_CLIP_PATH="inset(0px)",VIDEO_IFRAME_SCALE="1.04";export{DEFAULT_CLIP_PATH,VIDEO_IFRAME_SCALE};

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

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

@@ -1 +1 @@
-import{makeStyleResponsive as e,getHeightByShapeGlobalSize as t,makeStyleWithDefault as r,getWidthByShapeGlobalSize as o,getStyleShadow as l,getStyleBgColor as n,getRadiusStyleActiveState as a,makeStyle as i,getSingleColorVariable as c,makeStyleState as g,getGlobalColorStateStyle as b,getResponsiveStylePadding as p,getStyleBackgroundByDevice as s,getValueByDevice as d,DEVICES as u,getResponsiveValueByScreen as m}from"@gem-sdk/core";import{getVisibilityStyle as h,getStyleAspectRatioHeroBannerCustom as f,getOpacityHover as w,getDisplayStyleByFitContent as y,getAttachmentDevice as v,formatHoverScale as S,getStyleHeroBannerBg as k,getClipPath as j,opacityEnabledData as $,getResponsiveSetting as A}from"./helpers.js";function B(e){return Object.fromEntries(Object.entries(e||{}).filter(([,e])=>void 0!==e||""===e))}let O=(l,n,a)=>{let{sizeSetting:i}=l??{},c={...a,...h(a),...r("w",o(i,!0),{desktop:"--g-ct-w",tablet:"--g-ct-w",mobile:"--g-ct-w"}),...e("h",t(i))};return B(c)},E=r=>{let{sizeSetting:o,background:g,borderBg:b,cornerBg:p,shadowBg:s,hasActiveShadow:d}=r??{},u={...e("h",t(o)),...f(g,o),...i({bs:b?.border??b?.border,bw:b?.width??b?.width,bc:c(b?.color)}),...a({...p,active:{...p||{},radiusType:"custom"}}),...g?{...n(g)}:{},...l({value:s,styleAppliedFor:"box-shadow",isEnableShadow:d})};return B(u)},I=e=>{let{overlayColor:t,overlayOpacity:r,hoverEffect:o}=e??{},{disableOpacity:l}=$(e),n="number"!=typeof r?.normal||isNaN(r?.normal)?"string"==typeof r?.normal?`${parseInt(r?.normal)}%`:"0%":`${r?.normal}%`,a=g("op",{normal:n,hover:w(e)}),i=b("bgc",{...t,hover:t?.hover||t?.normal});l&&(delete i?.["--bgc"],delete a?.["--op"]),o||(delete i?.["--hvr-bgc"],delete a?.["--hvr-op"]);let c={...i,...a,"--top":"0","--left":"0"};return B(c)},x=e=>{let{contentPadding:t}=e??{},r={...p(t)};return B(r)},C=l=>{let{sizeSetting:n,background:a}=l??{},i={...y(n,a),...e("h",t(n)),...r("w",o(n,!0),{desktop:"--g-ct-w",tablet:"--g-ct-w",mobile:"--g-ct-w"})};return B(i)},F=(t,r,o)=>{let{hoverEffectScale:l,background:n,hoverEffectDuration:a}=t??{},i=`${parseFloat(`${a}`)??.5}s`,c={...k(A(n||{}),r),...s(n,{ignoreBgAttachment:!0,ignoreBackgroundImage:!0}),"--duration":i,"--scale":S(l),...e("pos",v(n)),transform:o,transition:`transform ${i} cubic-bezier(0,0,0,1)`};return B(c)},N=e=>{let{borderBg:t,cornerBg:r}=e??{},o={"clip-path":j(t?.width,r)};return B(o)},z=e=>{if(e)return{desktop:d(e,"desktop"),tablet:d(e,"tablet"),mobile:d(e,"mobile")}},H=e=>{if(!e)return;let t={};return u.forEach(r=>{let o=m(e,r),l=o?.videoAlign;t[r]=l||"top"}),Object.keys(t).length>0?t:void 0},R=(t,r,o)=>{let l=z(r),n=H(o),a={...e("aspect",t),...l?e("objf",l):{},...n?e("objp",n):{}};return B(a)},T=(t,r)=>{let o=z(r),l={...e("aspect",t),...o?e("objf",o):{},"pointer-events":"none"};return B(l)};export{C as getAdaptiveStyle,F as getBackgroundStyle,N as getContainBackgroundStyle,E as getContainerStyle,R as getHtml5VideoStyle,I as getOverlayStyle,x as getRowStyle,O as getStyle,T as getYoutubeIframeStyle};
+import{makeStyleWithDefault as e,getWidthByShapeGlobalSize as t,makeStyleResponsive as r,getHeightByShapeGlobalSize as l,makeStyle as o,getSingleColorVariable as i,getRadiusStyleActiveState as n,getStyleBgColor as a,getStyleShadow as y,makeStyleState as g,getGlobalColorStateStyle as s,getResponsiveStylePadding as u,getStyleBackgroundByDevice as d,getValueByDevice as p,DEVICES as c,getResponsiveValueByScreen as b}from"@gem-sdk/core";import{getVisibilityStyle as m,getStyleAspectRatioHeroBannerCustom as S,getOpacityHover as h,getDisplayStyleByFitContent as f,getStyleHeroBannerBg as v,formatHoverScale as w,getAttachmentDevice as k,getClipPath as T,opacityEnabledData as j,getResponsiveSetting as O}from"./helpers.js";function filterTruthyStyles(e){return Object.fromEntries(Object.entries(e||{}).filter(([,e])=>void 0!==e||""===e))}let getStyle=(o,i,n)=>{let{sizeSetting:a}=o??{},y={...n,...m(n),...e("w",t(a,!0),{desktop:"--g-ct-w",tablet:"--g-ct-w",mobile:"--g-ct-w"}),...r("h",l(a))};return filterTruthyStyles(y)},getContainerStyle=e=>{let{sizeSetting:t,background:g,borderBg:s,cornerBg:u,shadowBg:d,hasActiveShadow:p}=e??{},c={...r("h",l(t)),...S(g,t),...o({bs:s?.border??s?.border,bw:s?.width??s?.width,bc:i(s?.color)}),...n({...u,active:{...u||{},radiusType:"custom"}}),...g?{...a(g)}:{},...y({value:d,styleAppliedFor:"box-shadow",isEnableShadow:p})};return filterTruthyStyles(c)},getOverlayStyle=e=>{let{overlayColor:t,overlayOpacity:r,hoverEffect:l}=e??{},{disableOpacity:o}=j(e),i="number"!=typeof r?.normal||isNaN(r?.normal)?"string"==typeof r?.normal?`${parseInt(r?.normal)}%`:"0%":`${r?.normal}%`,n=g("op",{normal:i,hover:h(e)}),a=s("bgc",{...t,hover:t?.hover||t?.normal});o&&(delete a?.["--bgc"],delete n?.["--op"]),l||(delete a?.["--hvr-bgc"],delete n?.["--hvr-op"]);let y={...a,...n,"--top":"0","--left":"0"};return filterTruthyStyles(y)},getRowStyle=e=>{let{contentPadding:t}=e??{},r={...u(t)};return filterTruthyStyles(r)},getAdaptiveStyle=o=>{let{sizeSetting:i,background:n}=o??{},a={...f(i,n),...r("h",l(i)),...e("w",t(i,!0),{desktop:"--g-ct-w",tablet:"--g-ct-w",mobile:"--g-ct-w"})};return filterTruthyStyles(a)},getBackgroundStyle=(e,t,l)=>{let{hoverEffectScale:o,background:i,hoverEffectDuration:n}=e??{},a=`${parseFloat(`${n}`)??.5}s`,y={...v(O(i||{}),t),...d(i,{ignoreBgAttachment:!0,ignoreBackgroundImage:!0}),"--duration":a,"--scale":w(o),...r("pos",k(i)),transform:l,transition:`transform ${a} cubic-bezier(0,0,0,1)`};return filterTruthyStyles(y)},getContainBackgroundStyle=e=>{let{borderBg:t,cornerBg:r}=e??{},l={"clip-path":T(t?.width,r)};return filterTruthyStyles(l)},mapVideoObjectFit=e=>{if(e)return{desktop:p(e,"desktop"),tablet:p(e,"tablet"),mobile:p(e,"mobile")}},mapVideoAlignResponsive=e=>{if(!e)return;let t={};return c.forEach(r=>{let l=b(e,r),o=l?.videoAlign;t[r]=o||"top"}),Object.keys(t).length>0?t:void 0},getHtml5VideoStyle=(e,t,l)=>{let o=mapVideoObjectFit(t),i=mapVideoAlignResponsive(l),n={...r("aspect",e),...o?r("objf",o):{},...i?r("objp",i):{}};return filterTruthyStyles(n)},getYoutubeIframeStyle=(e,t)=>{let l=mapVideoObjectFit(t),o={...r("aspect",e),...l?r("objf",l):{},"pointer-events":"none"};return filterTruthyStyles(o)};export{getAdaptiveStyle,getBackgroundStyle,getContainBackgroundStyle,getContainerStyle,getHtml5VideoStyle,getOverlayStyle,getRowStyle,getStyle,getYoutubeIframeStyle};

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

@@ -1,2 +1,2 @@
 'use client';
-import{jsxs as e,jsx as r}from"react/jsx-runtime";import o from"./HeroBannerItem.js";import{getAttr as s,getAttrLink as m}from"../common/attrs.js";import{getStyle as t}from"../common/styles.js";import{getClasses as n,getLinkClasses as a}from"../common/classes.js";import{createAttr as i,createStyle as l,createClass as d,If as f}from"@gem-sdk/system";import{useRenderMode as p,useCurrentDevice as c,filterToolbarPreview as u}from"@gem-sdk/core";import{getBannerLink as h}from"../common/helpers.js";import j from"../hooks/useHeroBanner.js";import{useRef as y}from"react";let g=g=>{let{builderAttrs:k,builderProps:v,setting:C,styles:B,style:H,children:R,advanced:b,enableLazyLoadImage:w=!0}=g,{isEditMode:L,isPreviewSharePageMode:x}=p(),{enableLink:I}=C??{},M=h(C),{cssClass:N}=b??{},V=c(),{elementRef:z,transform:E,onMouseEnterParallax:P,onMouseLeaveParallax:S,dataVideo:W,bgRef:q,isShowVideoHtml5:A,openLinkBanner:D,layoutResponsive:F}=j(B,C,V),G=y(null),J=!!M?.link&&I&&!L&&!x,K=i({...s({uid:v?.uid||""})}),O=i({...m()}),Q=l({...t(B,C,H)}),T=d({...n({setting:C,builderProps:v,advancedCssClass:N})}),U=d({...a()}),X=()=>r(o,{setting:C,styles:B,children:R,rawChildren:g.rawChildren,builderProps:v,enableLazyLoadImage:w,elementRef:z,transform:E,dataVideo:W,layoutResponsive:F,bgRef:q,isShowVideoHtml5:A,heroBannerWrapperRef:G});return e("div",{ref:G,...k,...K,className:T,style:Q,onMouseEnter:P,onMouseLeave:S,children:[f(!J,X()),f(J,r("div",{...O,"aria-hidden":"true",onClick:D,className:U,children:X()})),u(R,!0)]})};export{g as default};
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import o from"./HeroBannerItem.js";import{getAttr as s,getAttrLink as m}from"../common/attrs.js";import{getStyle as n}from"../common/styles.js";import{getClasses as t,getLinkClasses as a}from"../common/classes.js";import{createAttr as i,createStyle as l,createClass as d,If as f}from"@gem-sdk/system";import{useRenderMode as p,useCurrentDevice as c,filterToolbarPreview as u}from"@gem-sdk/core";import{getBannerLink as h}from"../common/helpers.js";import{useHeroBanner as j}from"../hooks/useHeroBanner.js";import{useRef as y}from"react";let HeroBanner=g=>{let{builderAttrs:k,builderProps:v,setting:B,styles:C,style:H,children:R,advanced:b,enableLazyLoadImage:w=!0}=g,{isEditMode:L,isPreviewSharePageMode:x}=p(),{enableLink:I}=B??{},M=h(B),{cssClass:N}=b??{},V=c(),{elementRef:z,transform:E,onMouseEnterParallax:P,onMouseLeaveParallax:S,dataVideo:W,bgRef:q,isShowVideoHtml5:A,openLinkBanner:D,layoutResponsive:F}=j(C,B,V),G=y(null),J=!!M?.link&&I&&!L&&!x,K=i({...s({uid:v?.uid||""})}),O=i({...m()}),Q=l({...n(C,B,H)}),T=d({...t({setting:B,builderProps:v,advancedCssClass:N})}),U=d({...a()}),X=()=>r(o,{setting:B,styles:C,children:R,rawChildren:g.rawChildren,builderProps:v,enableLazyLoadImage:w,elementRef:z,transform:E,dataVideo:W,layoutResponsive:F,bgRef:q,isShowVideoHtml5:A,heroBannerWrapperRef:G});return e("div",{ref:G,...k,...K,className:T,style:Q,onMouseEnter:P,onMouseLeave:S,children:[f(!J,X()),f(J,r("div",{...O,"aria-hidden":"true",onClick:D,className:U,children:X()})),u(R,!0)]})};export{HeroBanner as default};

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 a,getLinkClasses as s}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{template as m,dataStringify 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 HeroBanner=E=>{let{builderAttrs:y,builderProps:C,setting:P,styles:S,style:x,children:B,advanced:H,pageContext:T}=E,{enableLazyLoadImage:V}=T??{},{enableLink:M,enableParallax:N}=P??{},O=h({background:S?.background,uid:C?.uid,enableTranslate:!!k?.background?.id,pageContext:T??{},isTranslateVideo:!0}),R=j(P),{cssClass:_}=H??{},{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({...a({setting:P,builderProps:C,advancedCssClass:_})}),Y=d({...s()}),q=()=>e({setting:P,translatedBackground:O,styles:S,children:B,enableLazyLoadImage:V,rawChildren:E.rawChildren,builderProps:C,pageContext:T});return m`
       <gp-hero-banner
         ${{...y}}
         ${{...D}}
         class="${I}"
         style="${G}"
-        gp-data='${m(z)}'
+        gp-data='${p(z)}'
       >
         ${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{HeroBanner as default};

package/dist/esm/hero-banner/components/HeroBannerItem.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as e,jsxs as o}from"react/jsx-runtime";import{useMemo as t}from"react";import{useEditorMode as s,filterToolbarPreview as i,getAspectRatioGlobalSize as r}from"@gem-sdk/core";import l from"../../grid/components/row/Row.js";import{createStyle as m,createClass as a}from"@gem-sdk/system";import d from"../../image/components/AdaptiveImage.js";import p from"../../video/components/HTML5Embed.js";import{getContainerStyle as n,getOverlayStyle as c,getRowStyle as y,getAdaptiveStyle as u,getBackgroundStyle as f,getContainBackgroundStyle as v,getYoutubeIframeStyle as h,getHtml5VideoStyle as b}from"../common/styles.js";import{getContainerClasses as g,getOverlayClasses as j,getRowClasses as N,getAdaptivePictureClasses as T,getAdaptiveClasses as k,getBackgroundClasses as H,getContainBackgroundClasses as w,getHtml5VideoClasses as C,getWrapperYoutubeClasses as I,getIframeYoutubeClasses as L}from"../common/classes.js";import{getBackgroundImageHeroBanner as V,showVideoType as z,scrollToContentBanner as B,getWidth as M,horizontalAlign as Y,fallbackImg as E,getBgImage as x}from"../common/helpers.js";import A from"../../video/components/LiteYouTubeEmbed.js";import{getYoutubeVideoId as R,youtubeVideoRegex as $}from"../../video/common/helpers.js";import O from"../hooks/useHeroBannerItem.js";import{getYoutubeContentClasses as S}from"../../video/common/classes.js";let W=W=>{s();let{setting:q,styles:D,children:F,elementRef:G,transform:J,dataVideo:K,bgRef:P,isShowVideoHtml5:Q,layoutResponsive:U,heroBannerWrapperRef:X}=W,{layout:Z,verticalAlign:_,enableParallax:ee,alt:eo,title:et}=q??{},{background:es,overlayColor:ei,verticalGutter:er,sizeSetting:el,contentWidth:em,hoverEffect:ea,contentPosition1Col:ed,contentPosition2Col:ep,videoObjectFit:en}=D??{},ec=m({...n(D)}),ey=a({...g(q,D)}),eu=m({...c(D)}),ef=a({...j(D)}),ev=m({...y(D)}),eh=a({...N(D,q)}),eb=m({...u(D)}),eg=a({...T()}),ej=a({...k()}),eN=a({...H(ea,!1)}),eT=m({...V(es,!1,!0),...f(D,ee,J)}),ek=a({...w()}),eH=m({...v(D)}),ew=a({...C(!Q)}),{youtubeIframeWrapperRef:eC,resolvedAspectRatio:eI,youtubeAspectRatio:eL}=O({videoType:K?.videoType,sizeSetting:el,background:es,videoObjectFit:en,heroBannerWrapperRef:X,isYoutubeVideoMigrated:q?.isYoutubeVideoMigrated}),eV=m({...h(eL,en)}),ez=m({...b(eI,en,es)}),eB=a({...I(q?.isYoutubeVideoMigrated)}),eM=a({...L()}),eY=a({...S()}),eE=t(()=>{if(!z(es))return;if(K?.videoType==="html5"&&!K.videoHtml5||K?.videoType==="youtube"&&!K.video)return null;if(K?.type==="video"&&K?.videoType==="html5"&&K?.videoHtml5)return e(p,{muted:!0,loop:K?.loop,controls:!1,autoplay:!0,src:K?.videoHtml5||"",title:"Video",style:ez,className:ew});let o=K?.video??"",t=R(o),s=K?.loop?1:0,i=`&loop=${s}&playlist=${t}&showinfo=0&rel=0&fs=0&enablejsapi=1`;if(K?.type==="video"&&K?.videoType==="youtube"&&t&&$.test(o))return e("div",{className:eY,ref:eC,children:e(A,{id:t,isHeroBanner:!0,autoplay:!0,title:"Video",controls:!1,params:i,adNetwork:!1,noCookie:!0,muted:!0,lazy:K?.lazyLoad??!0,style:eV,wrapperClass:eB,iframeClass:eM})})},[K,es,ew,eM,eB,eV,ez,eC]);return o("div",{className:ey,style:ec,children:[o("div",{ref:G,className:ek,style:eH,children:[e("div",{ref:P,className:eN,style:eT,children:eE}),!!ei&&e("div",{"aria-label":"Overlay",className:ef,style:eu})]}),e(l,{className:eh,style:ev,setting:{layout:Z,horizontalAlign:Y(Z,ed,ep),verticalAlign:_},styles:{verticalGutter:er,width:M(em),fullWidth:{desktop:!1,tablet:!1,mobile:!1}},hiddenEmptyCol:U?.cols?.length===1,onBlur:e=>B(e),children:i(F)}),e(d,{pictureClass:eg,srcSet:x(es),className:ej,aspectRatio:r(el),style:eb,alt:eo,title:et,enableLazyLoadImage:!1,fallbackImg:E})]})};export{W as default};
+import{jsx as e,jsxs as o}from"react/jsx-runtime";import{useMemo as t}from"react";import{useEditorMode as s,filterToolbarPreview as i,getAspectRatioGlobalSize as r}from"@gem-sdk/core";import l from"../../grid/components/row/Row.js";import{createStyle as m,createClass as a}from"@gem-sdk/system";import d from"../../image/components/AdaptiveImage.js";import n from"../../video/components/HTML5Embed.js";import{getContainerStyle as p,getOverlayStyle as c,getRowStyle as y,getAdaptiveStyle as u,getBackgroundStyle as f,getContainBackgroundStyle as v,getYoutubeIframeStyle as h,getHtml5VideoStyle as b}from"../common/styles.js";import{getContainerClasses as g,getOverlayClasses as j,getRowClasses as N,getAdaptivePictureClasses as H,getAdaptiveClasses as T,getBackgroundClasses as k,getContainBackgroundClasses as w,getHtml5VideoClasses as I,getWrapperYoutubeClasses as B,getIframeYoutubeClasses as C}from"../common/classes.js";import{getBackgroundImageHeroBanner as L,showVideoType as V,horizontalAlign as z,getWidth as M,scrollToContentBanner as Y,getBgImage as E,fallbackImg as x}from"../common/helpers.js";import A from"../../video/components/LiteYouTubeEmbed.js";import{getYoutubeVideoId as R,youtubeVideoRegex as $}from"../../video/common/helpers.js";import O from"../hooks/useHeroBannerItem.js";import{getYoutubeContentClasses as S}from"../../video/common/classes.js";let HeroBannerItem=W=>{s();let{setting:q,styles:D,children:F,elementRef:G,transform:J,dataVideo:K,bgRef:P,isShowVideoHtml5:Q,layoutResponsive:U,heroBannerWrapperRef:X}=W,{layout:Z,verticalAlign:_,enableParallax:ee,alt:eo,title:et}=q??{},{background:es,overlayColor:ei,verticalGutter:er,sizeSetting:el,contentWidth:em,hoverEffect:ea,contentPosition1Col:ed,contentPosition2Col:en,videoObjectFit:ep}=D??{},ec=m({...p(D)}),ey=a({...g(q,D)}),eu=m({...c(D)}),ef=a({...j(D)}),ev=m({...y(D)}),eh=a({...N(D,q)}),eb=m({...u(D)}),eg=a({...H()}),ej=a({...T()}),eN=a({...k(ea,!1)}),eH=m({...L(es,!1,!0),...f(D,ee,J)}),eT=a({...w()}),ek=m({...v(D)}),ew=a({...I(!Q)}),{youtubeIframeWrapperRef:eI,resolvedAspectRatio:eB,youtubeAspectRatio:eC}=O({videoType:K?.videoType,sizeSetting:el,background:es,videoObjectFit:ep,heroBannerWrapperRef:X,isYoutubeVideoMigrated:q?.isYoutubeVideoMigrated}),eL=m({...h(eC,ep)}),eV=m({...b(eB,ep,es)}),ez=a({...B(q?.isYoutubeVideoMigrated)}),eM=a({...C()}),eY=a({...S()}),eE=t(()=>{if(!V(es))return;if(K?.videoType==="html5"&&!K.videoHtml5||K?.videoType==="youtube"&&!K.video)return null;if(K?.type==="video"&&K?.videoType==="html5"&&K?.videoHtml5)return e(n,{muted:!0,loop:K?.loop,controls:!1,autoplay:!0,src:K?.videoHtml5||"",title:"Video",style:eV,className:ew});let o=K?.video??"",t=R(o),s=K?.loop?1:0,i=`&loop=${s}&playlist=${t}&showinfo=0&rel=0&fs=0&enablejsapi=1`;if(K?.type==="video"&&K?.videoType==="youtube"&&t&&$.test(o))return e("div",{className:eY,ref:eI,children:e(A,{id:t,isHeroBanner:!0,autoplay:!0,title:"Video",controls:!1,params:i,adNetwork:!1,noCookie:!0,muted:!0,lazy:K?.lazyLoad??!0,style:eL,wrapperClass:ez,iframeClass:eM})})},[K,es,ew,eM,ez,eL,eV,eI]);return o("div",{className:ey,style:ec,children:[o("div",{ref:G,className:eT,style:ek,children:[e("div",{ref:P,className:eN,style:eH,children:eE}),!!ei&&e("div",{"aria-label":"Overlay",className:ef,style:eu})]}),e(l,{className:eh,style:ev,setting:{layout:Z,horizontalAlign:z(Z,ed,en),verticalAlign:_},styles:{verticalGutter:er,width:M(em),fullWidth:{desktop:!1,tablet:!1,mobile:!1}},hiddenEmptyCol:U?.cols?.length===1,onBlur:e=>Y(e),children:i(F)}),e(d,{pictureClass:eg,srcSet:E(es),className:ej,aspectRatio:r(el),style:eb,alt:eo,title:et,enableLazyLoadImage:!1,fallbackImg:x})]})};export{HeroBannerItem as default};

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

@@ -1,16 +1,16 @@
-import{template as e,getAspectRatioGlobalSize as t,DEVICES as o,getResponsiveValueByScreen as s,hasTranslatedLiquid as i}from"@gem-sdk/core";import l from"../../grid/components/row/Row.liquid.js";import{createStyle as a,createClass as r,If as m}from"@gem-sdk/system";import d from"../../image/components/AdaptiveImage.liquid.js";import n from"../../video/components/HTML5Embed.liquid.js";import{getContainerStyle as p,getOverlayStyle as u,getRowStyle as c,getAdaptiveStyle as f,getBackgroundStyle as v,getContainBackgroundStyle as y,getYoutubeIframeStyle as g,getHtml5VideoStyle as j}from"../common/styles.js";import{getContainerClasses as $,getOverlayClasses as b,getRowClasses as h,getAdaptivePictureClasses as C,getAdaptiveClasses as w,getBackgroundClasses as I,getContainBackgroundClasses as T,getHtml5VideoClasses as k,getWrapperYoutubeClasses as x,getIframeYoutubeClasses as N,getLazyBackgroundClasses as q}from"../common/classes.js";import{getAspectRatio as H,getYoutubeAspectRatio as z,getBackgroundImageHeroBanner as A,getWidth as L,horizontalAlign as V,getEnableBgImageByDevice as B,getBgImage as E,showVideoType as R,getResponsiveSetting as S,fallbackImg as D}from"../common/helpers.js";import{getImageSrc as M}from"../../image/common/helpers.js";import O from"../../image/components/NextImage.liquid.js";import U from"../../video/components/LiteYouTubeEmbed.liquid.js";import{getYoutubeVideoId as W,youtubeVideoRegex as Y}from"../../video/common/helpers.js";import{isRenderHtmlVideo as F}from"../../grid/components/row/common/helpers.js";import{PRIORITY_LOAD_ATTRS as G}from"../../image/constants.js";import{getSeoTranslated as J}from"../../helpers.js";let K=K=>{let{enableLazyLoadImage:P=!0,translatedBackground:Q,setting:X,styles:Z,children:_,builderProps:ee,rawChildren:et,pageContext:eo}=K,{layout:es,verticalAlign:ei,enableParallax:el,alt:ea,title:er,preload:em,isYoutubeVideoMigrated:ed}=X??{},{background:en,overlayColor:ep,verticalGutter:eu,sizeSetting:ec,contentWidth:ef,hoverEffect:ev,contentPosition1Col:ey,contentPosition2Col:eg,videoObjectFit:ej}=Z??{},e$=!em&&P,eb=H(ec,en),eh=z(en,ej,eb),eC=S(Q||{}),ew=eC.desktop,eI=a({...p(Z)}),eT=r({...$(X,Z)}),ek=a({...u(Z)}),ex=r({...b(Z)}),eN=a({...c(Z)}),eq=r({...h(Z,X)}),eH=a({...f(Z)}),ez=r({...C()}),eA=r({...w()}),eL=r({...I(ev,e$)}),eV=a({...A(Q,e$,!1),...v(Z,el,"")}),eB=r({...T()}),eE=a({...y(Z)}),eR=r({...k(!1)}),eS=a({...g(eh,ej)}),eD=r({...x(ed)}),eM=a({...j(eb,ej,en)}),eO=r({...N()}),eU=e=>r({...q(e)});return e`
-  <div class="${eT}" style="${eI}">
+import{template as e,getAspectRatioGlobalSize as t,DEVICES as o,getResponsiveValueByScreen as s,hasTranslatedLiquid as i}from"@gem-sdk/core";import l from"../../grid/components/row/Row.liquid.js";import{createStyle as r,createClass as a,If as m}from"@gem-sdk/system";import d from"../../image/components/AdaptiveImage.liquid.js";import n from"../../video/components/HTML5Embed.liquid.js";import{getContainerStyle as p,getOverlayStyle as u,getRowStyle as c,getAdaptiveStyle as f,getBackgroundStyle as v,getContainBackgroundStyle as y,getYoutubeIframeStyle as g,getHtml5VideoStyle as j}from"../common/styles.js";import{getContainerClasses as $,getOverlayClasses as b,getRowClasses as h,getAdaptivePictureClasses as C,getAdaptiveClasses as I,getBackgroundClasses as w,getContainBackgroundClasses as T,getHtml5VideoClasses as k,getWrapperYoutubeClasses as x,getIframeYoutubeClasses as N,getLazyBackgroundClasses as q}from"../common/classes.js";import{getAspectRatio as H,getYoutubeAspectRatio as z,getBackgroundImageHeroBanner as A,horizontalAlign as B,getWidth as L,getBgImage as V,fallbackImg as E,getEnableBgImageByDevice as R,showVideoType as S,getResponsiveSetting as D}from"../common/helpers.js";import{getImageSrc as M}from"../../image/common/helpers.js";import O from"../../image/components/NextImage.liquid.js";import U from"../../video/components/LiteYouTubeEmbed.liquid.js";import{getYoutubeVideoId as W,youtubeVideoRegex as Y}from"../../video/common/helpers.js";import{isRenderHtmlVideo as F}from"../../grid/components/row/common/helpers.js";import{PRIORITY_LOAD_ATTRS as G}from"../../image/constants.js";import{getSeoTranslated as J}from"../../helpers.js";let HeroBannerItem=K=>{let{enableLazyLoadImage:P=!0,translatedBackground:Q,setting:X,styles:Z,children:_,builderProps:ee,rawChildren:et,pageContext:eo}=K,{layout:es,verticalAlign:ei,enableParallax:el,alt:er,title:ea,preload:em,isYoutubeVideoMigrated:ed}=X??{},{background:en,overlayColor:ep,verticalGutter:eu,sizeSetting:ec,contentWidth:ef,hoverEffect:ev,contentPosition1Col:ey,contentPosition2Col:eg,videoObjectFit:ej}=Z??{},e$=!em&&P,eb=H(ec,en),eh=z(en,ej,eb),eC=D(Q||{}),eI=eC.desktop,ew=r({...p(Z)}),eT=a({...$(X,Z)}),ek=r({...u(Z)}),ex=a({...b(Z)}),eN=r({...c(Z)}),eq=a({...h(Z,X)}),eH=r({...f(Z)}),ez=a({...C()}),eA=a({...I()}),eB=a({...w(ev,e$)}),eL=r({...A(Q,e$,!1),...v(Z,el,"")}),eV=a({...T()}),eE=r({...y(Z)}),eR=a({...k(!1)}),eS=r({...g(eh,ej)}),eD=a({...x(ed)}),eM=r({...j(eb,ej,en)}),eO=a({...N()}),eU=e=>a({...q(e)}),eW=()=>{if(!em)return o.map(e=>m(R(e,Q),O({src:M(s(V(Q),e),e),alt:J({valueTranslate:er,uid:ee?.uid,settingId:"alt",pageContext:eo??{}}),title:J({valueTranslate:ea,uid:ee?.uid,settingId:"title",pageContext:eo??{}}),className:eU(e),isDisableAspectStyle:!0,enableLazyLoadImage:P}))).join("")},eY=()=>{if(!S(en))return;if(F(en))return n({uid:ee?.uid,muted:!0,loop:eI?.loop,controls:!1,autoplay:!0,src:eI?.videoHtml5||"",title:"Video",style:eM,className:eR});let e=eI?.video??"",t=W(e),o=`&loop=false&playlist=${t}&showinfo=0&rel=0&fs=0&enablejsapi=1`,s=i(e);if(eI?.type==="video"&&eI?.videoType==="youtube"&&t&&Y.test(e)||s)return U({uid:ee?.uid,id:t??"",translatedVideoUrl:s?e:"",isHeroBanner:!0,autoplay:!0,title:"Video",controls:!1,params:o,adNetwork:!1,noCookie:!0,muted:!0,lazy:eI?.lazyLoad??!0,preload:!0,style:eS,wrapperClass:eD,iframeClass:eO})};return e`
+  <div class="${eT}" style="${ew}">
       <div
-        class="${eB}"
+        class="${eV}"
         style="${eE}"
       >
-        <div class="${eL}" style="${eV}">
-          ${(()=>{if(!em)return o.map(e=>m(B(e,Q),O({src:M(s(E(Q),e),e),alt:J({valueTranslate:ea,uid:ee?.uid,settingId:"alt",pageContext:eo??{}}),title:J({valueTranslate:er,uid:ee?.uid,settingId:"title",pageContext:eo??{}}),className:eU(e),isDisableAspectStyle:!0,enableLazyLoadImage:P}))).join("")})()}
-          ${(()=>{if(!R(en))return;if(F(en))return n({uid:ee?.uid,muted:!0,loop:ew?.loop,controls:!1,autoplay:!0,src:ew?.videoHtml5||"",title:"Video",style:eM,className:eR});let e=ew?.video??"",t=W(e),o=`&loop=false&playlist=${t}&showinfo=0&rel=0&fs=0&enablejsapi=1`,s=i(e);if(ew?.type==="video"&&ew?.videoType==="youtube"&&t&&Y.test(e)||s)return U({uid:ee?.uid,id:t??"",translatedVideoUrl:s?e:"",isHeroBanner:!0,autoplay:!0,title:"Video",controls:!1,params:o,adNetwork:!1,noCookie:!0,muted:!0,lazy:ew?.lazyLoad??!0,style:eS,wrapperClass:eD,iframeClass:eO})})()}
+        <div class="${eB}" style="${eL}">
+          ${eW()}
+          ${eY()}
         </div>
         ${m(!!ep,e`<div aria-label="Overlay" class="${ex}" style="${ek}"> </div>`)}
       </div>
-      ${l({className:eq,style:eN,setting:{layout:es,horizontalAlign:V(es,ey,eg),verticalAlign:ei},styles:{verticalGutter:eu,width:L(ef),fullWidth:{desktop:!1,tablet:!1,mobile:!1}},children:_,rawChildren:et})}
-        ${d({pictureClass:ez,srcSet:E(Q),className:eA,...em&&G,aspectRatio:t(ec),style:eH,alt:J({valueTranslate:ea,uid:ee?.uid,settingId:"alt",pageContext:eo??{}}),title:J({valueTranslate:er,uid:ee?.uid,settingId:"title",pageContext:eo??{}}),enableLazyLoadImage:P,fallbackImg:D})}
+      ${l({className:eq,style:eN,setting:{layout:es,horizontalAlign:B(es,ey,eg),verticalAlign:ei},styles:{verticalGutter:eu,width:L(ef),fullWidth:{desktop:!1,tablet:!1,mobile:!1}},children:_,rawChildren:et})}
+        ${d({pictureClass:ez,srcSet:V(Q),className:eA,...em&&G,aspectRatio:t(ec),style:eH,alt:J({valueTranslate:er,uid:ee?.uid,settingId:"alt",pageContext:eo??{}}),title:J({valueTranslate:ea,uid:ee?.uid,settingId:"title",pageContext:eo??{}}),enableLazyLoadImage:P,fallbackImg:E})}
   </div>
-`};export{K as default};
+`};export{HeroBannerItem as default};

package/dist/esm/hero-banner/hooks/useHeroBanner.js

@@ -1 +1 @@
-import{useState as e,useRef as r,useEffect as t,useCallback as n,useMemo as l}from"react";import{getResponsiveValueByScreen as o,getBgVideoByDevice as a}from"@gem-sdk/core";import s from"./useTranslateValue.js";import i from"./useIntersectionObserver.js";import{getResponsiveSetting as u}from"../common/helpers.js";import m from"../common/animation-manager.js";let p=(p,c,d)=>{let{hoverEffect:g,hoverEffectScale:f,background:x}=p||{},{link:B,enableParallax:b}=c||{},j=Number(c?.speedParallax)||0,[k,v]=e(0),[w,P]=e(null),[$,y]=e(null),[H,N]=e(""),Y=r(null),[h,C]=i(),{translateValue:E}=s({containerBoundingClientRect:w,backgroundBoundingClientRect:$,speed:j}),L=o(c?.layout,d),M=u(x||{}),R=b&&Number(c?.speedParallax||0)>0&&M[d]?.type==="image"||!1;t(()=>{R?N(`translateY(${E}px)`):N("")},[E,R]);let T=n(()=>{if(!R||0===j||!C)return;let e=Number(window.scrollY.toFixed(0));k!==e&&(P(h?.current?h?.current?.getBoundingClientRect():null),y(Y?.current?Y?.current?.getBoundingClientRect():null),v(e))},[k,C,R,j,h,Y]),F=a(x,d),I=l(()=>!!(F?.videoHtml5&&"html5"===F.videoType),[F]);return t(()=>(m.register(T),()=>{m.unregister(T)}),[T]),t(()=>(m.register(T),()=>{m.unregister(T)}),[T]),{onMouseEnterParallax:()=>{g&&R&&N(`${H} scale(${f||"100%"})`)},onMouseLeaveParallax:()=>{g&&R&&N(`translateY(${E}px)`)},bgRef:Y,transform:H,elementRef:h,dataVideo:F,isShowVideoHtml5:I,openLinkBanner:e=>{B?.link&&!e?.srcElement?.closest("a")&&window.open(B?.link,B.target)},layoutResponsive:L}};export{p as default,p as useHeroBanner};
+import{useState as e,useRef as r,useEffect as t,useCallback as n,useMemo as l}from"react";import{getResponsiveValueByScreen as o,getBgVideoByDevice as s}from"@gem-sdk/core";import{useTranslateValue as a}from"./useTranslateValue.js";import i from"./useIntersectionObserver.js";import{getResponsiveSetting as m}from"../common/helpers.js";import u from"../common/animation-manager.js";let useHeroBanner=(p,c,d)=>{let{hoverEffect:g,hoverEffectScale:f,background:x}=p||{},{link:B,enableParallax:b}=c||{},j=Number(c?.speedParallax)||0,[w,H]=e(0),[$,k]=e(null),[v,y]=e(null),[N,Y]=e(""),h=r(null),[C,P]=i(),{translateValue:R}=a({containerBoundingClientRect:$,backgroundBoundingClientRect:v,speed:j}),T=o(c?.layout,d),E=m(x||{}),F=b&&Number(c?.speedParallax||0)>0&&E[d]?.type==="image"||!1,I=()=>{g&&F&&Y(`${N} scale(${f||"100%"})`)},O=()=>{g&&F&&Y(`translateY(${R}px)`)},V=e=>{B?.link&&!e?.srcElement?.closest("a")&&window.open(B?.link,B.target)};t(()=>{F?Y(`translateY(${R}px)`):Y("")},[R,F]);let q=n(()=>{if(!F||0===j||!P)return;let e=Number(window.scrollY.toFixed(0));w!==e&&(k(C?.current?C?.current?.getBoundingClientRect():null),y(h?.current?h?.current?.getBoundingClientRect():null),H(e))},[w,P,F,j,C,h]),z=s(x,d),A=l(()=>!!(z?.videoHtml5&&"html5"===z.videoType),[z]);return t(()=>(u.register(q),()=>{u.unregister(q)}),[q]),t(()=>(u.register(q),()=>{u.unregister(q)}),[q]),{onMouseEnterParallax:I,onMouseLeaveParallax:O,bgRef:h,transform:N,elementRef:C,dataVideo:z,isShowVideoHtml5:A,openLinkBanner:V,layoutResponsive:T}};export{useHeroBanner as default,useHeroBanner};

package/dist/esm/hero-banner/hooks/useHeroBannerItem.js

@@ -1 +1 @@
-import{useRef as e,useMemo as r,useEffect as t}from"react";import{useCurrentDevice as i,getResponsiveValueByScreen as o}from"@gem-sdk/core";import{getAspectRatio as n,getYoutubeAspectRatio as u,setVideoIframeAlign as l,resetVideoIframeStyle as m,resetVideoWrapperStyle as a,setVideoWrapperStyle as f,getResponsiveSetting as s,updateVideoIframeSize as c,getContainerRatio as d}from"../common/helpers.js";let v=({videoType:v,sizeSetting:y,background:b,videoObjectFit:p,heroBannerWrapperRef:E,isYoutubeVideoMigrated:w})=>{let L=i(),q=e(null),A=r(()=>n(y,b),[y,b]),R=r(()=>u(b,p,A),[b,p,A]),S=s(p||{}),g=o(S,L),j=o(b,L),F=j?.loop;return t(()=>{if("youtube"!==v)return;let e=q.current;if(!e)return;let r=e?.querySelector("iframe");if(!r)return;let t=o(b,L),i=t?.videoAlign;l(r,i)},[b,L,v]),t(()=>{let e=q.current,r=E?.current,t=()=>e?.querySelector("iframe"),i=i=>{let o=i||e;if(!o)return;let n=o.querySelector("iframe");c({iframeEl:n||t(),containerRatio:d(r),videoObjectFit:g||"cover",background:b,currentDevice:L,isYoutubeVideoMigrated:w})},o=e=>{let r=e.detail?.iframe;if(r){let e=r.closest("article"),t=e?.parentElement;setTimeout(()=>{i(t)},50)}};if(r&&r.addEventListener("youtube-iframe-ready",o),!e)return()=>{r&&r.removeEventListener("youtube-iframe-ready",o)};if("youtube"!==v){let i=t();return i&&m(i),a(e),()=>{r&&r.removeEventListener("youtube-iframe-ready",o)}}f(e),t()&&(window.requestAnimationFrame(()=>i()),setTimeout(()=>{i()},100));let n=window.ResizeObserver;if(!n)return()=>{r&&r.removeEventListener("youtube-iframe-ready",o)};let u=new n(()=>i());return r&&u.observe(r),()=>{if(u.disconnect(),r&&r.removeEventListener("youtube-iframe-ready",o),e){let r=t();r&&m(r),a(e)}}},[v,g,L,A,F]),{youtubeIframeWrapperRef:q,resolvedAspectRatio:A,youtubeAspectRatio:R}};export{v as default};
+import{useRef as e,useMemo as r,useEffect as t}from"react";import{useCurrentDevice as i,getResponsiveValueByScreen as o}from"@gem-sdk/core";import{getAspectRatio as n,getYoutubeAspectRatio as u,setVideoIframeAlign as m,resetVideoIframeStyle as a,resetVideoWrapperStyle as l,setVideoWrapperStyle as f,getResponsiveSetting as s,updateVideoIframeSize as c,getContainerRatio as d}from"../common/helpers.js";let useHeroBannerItem=({videoType:v,sizeSetting:y,background:b,videoObjectFit:p,heroBannerWrapperRef:E,isYoutubeVideoMigrated:w})=>{let L=i(),q=e(null),A=r(()=>n(y,b),[y,b]),R=r(()=>u(b,p,A),[b,p,A]),S=s(p||{}),g=o(S,L),j=o(b,L),B=j?.loop;return t(()=>{if("youtube"!==v)return;let e=q.current;if(!e)return;let r=()=>e?.querySelector("iframe"),t=r();if(!t)return;let i=o(b,L),n=i?.videoAlign;m(t,n)},[b,L,v]),t(()=>{let e=q.current,r=E?.current,t=()=>e?.querySelector("iframe"),i=i=>{let o=i||e;if(!o)return;let n=o.querySelector("iframe");c({iframeEl:n||t(),containerRatio:d(r),videoObjectFit:g||"cover",background:b,currentDevice:L,isYoutubeVideoMigrated:w})},o=e=>{let r=e.detail?.iframe;if(r){let e=r.closest("article"),t=e?.parentElement;setTimeout(()=>{i(t)},50)}};if(r&&r.addEventListener("youtube-iframe-ready",o),!e)return()=>{r&&r.removeEventListener("youtube-iframe-ready",o)};if("youtube"!==v){let i=t();return i&&a(i),l(e),()=>{r&&r.removeEventListener("youtube-iframe-ready",o)}}f(e),t()&&(window.requestAnimationFrame(()=>i()),setTimeout(()=>{i()},100));let n=window.ResizeObserver;if(!n)return()=>{r&&r.removeEventListener("youtube-iframe-ready",o)};let u=new n(()=>i());return r&&u.observe(r),()=>{if(u.disconnect(),r&&r.removeEventListener("youtube-iframe-ready",o),e){let r=t();r&&a(r),l(e)}}},[v,g,L,A,B]),{youtubeIframeWrapperRef:q,resolvedAspectRatio:A,youtubeAspectRatio:R}};export{useHeroBannerItem as default};

package/dist/esm/hero-banner/hooks/useIntersectionObserver.js

@@ -1 +1 @@
-import{useState as e,useRef as r,useEffect as t}from"react";let n=(n={})=>{let[s,l]=e(!1),o=r(null);return t(()=>{let e=new IntersectionObserver(e=>{let[r]=e;r&&(r.isIntersecting?l(!0):l(!1))},{...n}),{current:r}=o;return r&&e.observe(r),()=>{r&&e.unobserve(r)}},[n]),[o,s]};export{n as default};
+import{useState as e,useRef as r,useEffect as t}from"react";let useIntersectionObserver=(n={})=>{let[s,o]=e(!1),u=r(null);return t(()=>{let e=new IntersectionObserver(e=>{let[r]=e;r&&(r.isIntersecting?o(!0):o(!1))},{...n}),{current:r}=u;return r&&e.observe(r),()=>{r&&e.unobserve(r)}},[n]),[u,s]};export{useIntersectionObserver as default};

package/dist/esm/hero-banner/hooks/useTranslateValue.js

@@ -1 +1 @@
-import{useState as e,useEffect as r}from"react";import t from"./useWindowSize.js";import{getPercentageVisible as o}from"../common/helpers.js";let a=({containerBoundingClientRect:a,backgroundBoundingClientRect:l,speed:s=1})=>{let[i,m]=e(0),[u,n]=e(0),{height:f}=t();return r(()=>{l&&a&&m(l.height-a.height)},[a,l]),r(()=>{if(!a||!l||!f)return;let e=o(l,f),r=e/100*i-i/2;n(-(r*s*1))},[i,f,a,l,s]),{translateValue:u}};export{a as default,a as useTranslateValue};
+import{useState as e,useEffect as r}from"react";import t from"./useWindowSize.js";import{getPercentageVisible as a}from"../common/helpers.js";let useTranslateValue=({containerBoundingClientRect:l,backgroundBoundingClientRect:s,speed:o=1})=>{let[u,i]=e(0),[m,n]=e(0),{height:f}=t();return r(()=>{s&&l&&i(s.height-l.height)},[l,s]),r(()=>{if(!l||!s||!f)return;let e=a(s,f),r=e/100*u-u/2;n(-(r*o*1))},[u,f,l,s,o]),{translateValue:m}};export{useTranslateValue as default,useTranslateValue};

package/dist/esm/hero-banner/hooks/useWindowSize.js

@@ -1 +1 @@
-import{useState as e,useEffect as i}from"react";import{debounce as n}from"../common/helpers.js";let r=()=>{let[r,t]=e(null),[o,d]=e(null),w=n(()=>{t(window.innerHeight),d(window.innerWidth)},200);return i(()=>(w(),window.addEventListener("resize",w),()=>{window.removeEventListener("resize",w)}),[w]),{height:r,width:o}};export{r as default};
+import{useState as e,useEffect as i}from"react";import{debounce as n}from"../common/helpers.js";let useWindowSize=()=>{let[r,t]=e(null),[o,d]=e(null),w=()=>{t(window.innerHeight),d(window.innerWidth)},s=n(w,200);return i(()=>(s(),window.addEventListener("resize",s),()=>{window.removeEventListener("resize",s)}),[s]),{height:r,width:o}};export{useWindowSize 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"../image/components/AdaptiveImage.js";import"./common/animation-manager.js";import t from"./settings/HeroBanner.js";let bannerSetting={HeroBanner:t};export{bannerSetting};

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

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

package/dist/esm/hero-banner/settings/HeroBanner.js

@@ -1,5 +1,5 @@
-import{heroBanner1Col as e}from"./configs/presets/banner-1-col.js";import{heroBanner1ColPreSalesPage as r}from"./configs/presets/banner-1-col-pre-sales-page.js";import{heroBannerContentLeft as s}from"./configs/presets/banner-content-left.js";import{heroBannerContentLeftPreSalesPage as o}from"./configs/presets/banner-content-left-pre-sales-page.js";import{heroBannerContentRight as n}from"./configs/presets/banner-content-right.js";import{heroBannerContentRightPreSalesPage as t}from"./configs/presets/banner-content-right-pre-sales-page.js";import{heroBannerVideo as i}from"./configs/presets/banner-video.js";import{heroBannerVideoPreSalesPage as p}from"./configs/presets/banner-video-pre-sales-page.js";import{heroBannerParallax as a}from"./configs/presets/banner-parallax.js";import{heroBannerParallaxPreSalesPage as f}from"./configs/presets/banner-parallax-pre-sales-page.js";import{SettingUIV2 as l}from"./configs/ui-v2.js";import{SettingsV2 as g}from"./configs/settings.js";let m={tag:"HeroBanner",label:"Hero Banner",icon:`
+import{heroBanner1Col as e}from"./configs/presets/banner-1-col.js";import{heroBanner1ColPreSalesPage as r}from"./configs/presets/banner-1-col-pre-sales-page.js";import{heroBannerContentLeft as s}from"./configs/presets/banner-content-left.js";import{heroBannerContentLeftPreSalesPage as o}from"./configs/presets/banner-content-left-pre-sales-page.js";import{heroBannerContentRight as n}from"./configs/presets/banner-content-right.js";import{heroBannerContentRightPreSalesPage as t}from"./configs/presets/banner-content-right-pre-sales-page.js";import{heroBannerVideo as i}from"./configs/presets/banner-video.js";import{heroBannerVideoPreSalesPage as p}from"./configs/presets/banner-video-pre-sales-page.js";import{heroBannerParallax as a}from"./configs/presets/banner-parallax.js";import{heroBannerParallaxPreSalesPage as f}from"./configs/presets/banner-parallax-pre-sales-page.js";import{SettingUIV2 as l}from"./configs/ui-v2.js";import{SettingsV2 as g}from"./configs/settings.js";let config={tag:"HeroBanner",label:"Hero Banner",icon:`
   <svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
     <path fill-rule="evenodd" clip-rule="evenodd" d="M1.83301 34.6667C1.55687 34.6667 1.33301 34.4429 1.33301 34.1667V5.83337C1.33301 5.55723 1.55687 5.33337 1.83301 5.33337H38.1663C38.4425 5.33337 38.6663 5.55723 38.6663 5.83337V34.1667C38.6663 34.4429 38.4425 34.6667 38.1663 34.6667H1.83301ZM3.52909 32.4103H36.4703V7.58978H3.52909V32.4103ZM21.0977 17.7436H24.3055C24.7477 17.7436 24.9722 18.2755 24.6638 18.5924L14.5095 29.0257L18.9016 20H15.3089C14.9395 20 14.6976 19.6134 14.8593 19.2813L18.7648 11.2556C18.8485 11.0836 19.0231 10.9744 19.2144 10.9744H24.5694C24.966 10.9744 25.2047 11.4139 24.9889 11.7466L21.0977 17.7436Z" fill="currentColor"/>
   </svg>
-  `,settings:g,ui:[],uiV2:l,presets:[e,r,s,o,n,t,i,p,a,f],editorConfigs:{slots:{children:!0},placeholder:{notAppendTags:["MarqueeItem","Marquee"]}}};export{m as default};
+  `,settings:g,ui:[],uiV2:l,presets:[e,r,s,o,n,t,i,p,a,f],editorConfigs:{slots:{children:!0},placeholder:{notAppendTags:["MarqueeItem","Marquee"]}}};export{config as default};

package/dist/esm/hero-banner/settings/configs/presets/banner-1-col-pre-sales-page.js

@@ -1,4 +1,4 @@
-let t={id:"hero-banner-1-col-pre-sales-page",name:"Hero Banner",icon:{desktop:`
+let heroBanner1ColPreSalesPage={id:"hero-banner-1-col-pre-sales-page",name:"Hero Banner",icon:{desktop:`
       <svg width="94" height="48" viewBox="0 0 94 48" fill="none" xmlns="http://www.w3.org/2000/svg">
       <g clip-path="url(#clip0_1706_4280)">
       <rect width="94" height="48" rx="3" fill="#424242"/>
@@ -15,4 +15,4 @@ let t={id:"hero-banner-1-col-pre-sales-page",name:"Hero Banner",icon:{desktop:`
       </clipPath>
       </defs>
       </svg>
-    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[12],display:"fill"}},link:{type:"go-to-sales-page"}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"600px"},mobile:{shape:"custom",widthHeightLinked:!1,width:"1200px",height:"600px"}}},childrens:[{tag:"Col",childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your product's story<br/>                  or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]}]}]};export{t as heroBanner1ColPreSalesPage};
+    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[12],display:"fill"}},link:{type:"go-to-sales-page"}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"600px"},mobile:{shape:"custom",widthHeightLinked:!1,width:"1200px",height:"600px"}}},childrens:[{tag:"Col",childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your product's story<br/>                  or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]}]}]};export{heroBanner1ColPreSalesPage};

package/dist/esm/hero-banner/settings/configs/presets/banner-1-col.js

@@ -1,4 +1,4 @@
-let t={id:"hero-banner-1-col",name:"Hero Banner",icon:{desktop:`
+let heroBanner1Col={id:"hero-banner-1-col",name:"Hero Banner",icon:{desktop:`
       <svg width="94" height="48" viewBox="0 0 94 48" fill="none" xmlns="http://www.w3.org/2000/svg">
       <g clip-path="url(#clip0_1706_4280)">
       <rect width="94" height="48" rx="3" fill="#424242"/>
@@ -15,4 +15,4 @@ let t={id:"hero-banner-1-col",name:"Hero Banner",icon:{desktop:`
       </clipPath>
       </defs>
       </svg>
-    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[12],display:"fill"}}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"600px"},mobile:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"600px"}}},childrens:[{tag:"Col",childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your product's story<br/>                  or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]}]}]};export{t as heroBanner1Col};
+    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[12],display:"fill"}}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"600px"},mobile:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"600px"}}},childrens:[{tag:"Col",childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your product's story<br/>                  or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]}]}]};export{heroBanner1Col};

package/dist/esm/hero-banner/settings/configs/presets/banner-content-left-pre-sales-page.js

@@ -1,4 +1,4 @@
-let t={id:"hero-banner-content-left-pre-sales-page",name:"Hero Banner",icon:{desktop:`
+let heroBannerContentLeftPreSalesPage={id:"hero-banner-content-left-pre-sales-page",name:"Hero Banner",icon:{desktop:`
     <svg width="96" height="48" viewBox="0 0 96 48" fill="none" xmlns="http://www.w3.org/2000/svg">
     <g clip-path="url(#clip0_2825_116)">
     <rect width="96" height="48" rx="3" fill="#424242"/>
@@ -14,4 +14,4 @@ let t={id:"hero-banner-content-left-pre-sales-page",name:"Hero Banner",icon:{des
     </clipPath>
     </defs>
     </svg>
-    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[6,6],display:"fill"},mobile:{cols:[12],display:"fill"}},link:{type:"go-to-sales-page"}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"original",widthHeightLinked:!1,width:"100%",height:"600px"},mobile:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"auto"}}},childrens:[{tag:"Col",styles:{order:{desktop:0}},childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your<br/>                      product's story or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]},{tag:"Col",styles:{order:{desktop:1}},childrens:[]}]}]};export{t as heroBannerContentLeftPreSalesPage};
+    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[6,6],display:"fill"},mobile:{cols:[12],display:"fill"}},link:{type:"go-to-sales-page"}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"original",widthHeightLinked:!1,width:"100%",height:"600px"},mobile:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"auto"}}},childrens:[{tag:"Col",styles:{order:{desktop:0}},childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your<br/>                      product's story or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]},{tag:"Col",styles:{order:{desktop:1}},childrens:[]}]}]};export{heroBannerContentLeftPreSalesPage};

package/dist/esm/hero-banner/settings/configs/presets/banner-content-left.js

@@ -1,4 +1,4 @@
-let t={id:"hero-banner-content-left",name:"Hero Banner",icon:{desktop:`
+let heroBannerContentLeft={id:"hero-banner-content-left",name:"Hero Banner",icon:{desktop:`
     <svg width="96" height="48" viewBox="0 0 96 48" fill="none" xmlns="http://www.w3.org/2000/svg">
     <g clip-path="url(#clip0_2825_116)">
     <rect width="96" height="48" rx="3" fill="#424242"/>
@@ -14,4 +14,4 @@ let t={id:"hero-banner-content-left",name:"Hero Banner",icon:{desktop:`
     </clipPath>
     </defs>
     </svg>
-    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[6,6],display:"fill"},mobile:{cols:[12],display:"fill"}}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"original",width:"100%"},mobile:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"fit-content"}}},childrens:[{tag:"Col",styles:{order:{desktop:0}},childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your<br/>                      product's story or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]},{tag:"Col",styles:{order:{desktop:1}},childrens:[]}]}]};export{t as heroBannerContentLeft};
+    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[6,6],display:"fill"},mobile:{cols:[12],display:"fill"}}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"original",width:"100%"},mobile:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"fit-content"}}},childrens:[{tag:"Col",styles:{order:{desktop:0}},childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your<br/>                      product's story or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]},{tag:"Col",styles:{order:{desktop:1}},childrens:[]}]}]};export{heroBannerContentLeft};

package/dist/esm/hero-banner/settings/configs/presets/banner-content-right-pre-sales-page.js

@@ -1,4 +1,4 @@
-let t={id:"hero-banner-content-right-pre-sales-page",name:"Hero Banner",icon:{desktop:`
+let heroBannerContentRightPreSalesPage={id:"hero-banner-content-right-pre-sales-page",name:"Hero Banner",icon:{desktop:`
       <svg
         width="96"
         height="48"
@@ -23,4 +23,4 @@ let t={id:"hero-banner-content-right-pre-sales-page",name:"Hero Banner",icon:{de
           </clipPath>
         </defs>
       </svg>
-    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[6,6],display:"fill"},mobile:{cols:[12],display:"fill"}},link:{type:"go-to-sales-page"}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"original",widthHeightLinked:!1,width:"100%",height:"600px"},mobile:{shape:"original",widthHeightLinked:!0,width:"100%"}}},childrens:[{tag:"Col",styles:{order:{desktop:1}},childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your<br/>                      product's story or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]},{tag:"Col",styles:{order:{desktop:0}},childrens:[]}]}]};export{t as heroBannerContentRightPreSalesPage};
+    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[6,6],display:"fill"},mobile:{cols:[12],display:"fill"}},link:{type:"go-to-sales-page"}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"original",widthHeightLinked:!1,width:"100%",height:"600px"},mobile:{shape:"original",widthHeightLinked:!0,width:"100%"}}},childrens:[{tag:"Col",styles:{order:{desktop:1}},childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your<br/>                      product's story or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]},{tag:"Col",styles:{order:{desktop:0}},childrens:[]}]}]};export{heroBannerContentRightPreSalesPage};

package/dist/esm/hero-banner/settings/configs/presets/banner-content-right.js

@@ -1,4 +1,4 @@
-let t={id:"hero-banner-content-right",name:"Hero Banner",icon:{desktop:`
+let heroBannerContentRight={id:"hero-banner-content-right",name:"Hero Banner",icon:{desktop:`
       <svg
         width="96"
         height="48"
@@ -23,4 +23,4 @@ let t={id:"hero-banner-content-right",name:"Hero Banner",icon:{desktop:`
           </clipPath>
         </defs>
       </svg>
-    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[6,6],display:"fill"},mobile:{cols:[12],display:"fill"}}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"original",width:"100%"},mobile:{shape:"custom",width:"100%"}}},childrens:[{tag:"Col",styles:{order:{desktop:1}},childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your<br/>                      product's story or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]},{tag:"Col",styles:{order:{desktop:0}},childrens:[]}]}]};export{t as heroBannerContentRight};
+    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[6,6],display:"fill"},mobile:{cols:[12],display:"fill"}}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"original",width:"100%"},mobile:{shape:"custom",width:"100%"}}},childrens:[{tag:"Col",styles:{order:{desktop:1}},childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your<br/>                      product's story or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]},{tag:"Col",styles:{order:{desktop:0}},childrens:[]}]}]};export{heroBannerContentRight};

package/dist/esm/hero-banner/settings/configs/presets/banner-parallax-pre-sales-page.js

@@ -1,4 +1,4 @@
-let t={id:"hero-banner-parallax-pre-sales-page",name:"Hero Banner Parallax",icon:{desktop:`
+let heroBannerParallaxPreSalesPage={id:"hero-banner-parallax-pre-sales-page",name:"Hero Banner Parallax",icon:{desktop:`
       <svg width="96" height="48" viewBox="0 0 96 48" fill="none" xmlns="http://www.w3.org/2000/svg">
 <g clip-path="url(#clip0_21157_36120)">
 <rect width="96" height="48" rx="3" fill="#424242"/>
@@ -13,4 +13,4 @@ let t={id:"hero-banner-parallax-pre-sales-page",name:"Hero Banner Parallax",icon
 </defs>
 </svg>
 
-    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[12],display:"fill"}},enableParallax:!0,speedParallax:.6,link:{type:"go-to-sales-page"}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"600px"},mobile:{shape:"custom",widthHeightLinked:!1,width:"1200px",height:"600px"}}},childrens:[{tag:"Col",childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your product's story<br/>                  or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]}]}]};export{t as heroBannerParallaxPreSalesPage};
+    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[12],display:"fill"}},enableParallax:!0,speedParallax:.6,link:{type:"go-to-sales-page"}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"600px"},mobile:{shape:"custom",widthHeightLinked:!1,width:"1200px",height:"600px"}}},childrens:[{tag:"Col",childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your product's story<br/>                  or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]}]}]};export{heroBannerParallaxPreSalesPage};

package/dist/esm/hero-banner/settings/configs/presets/banner-parallax.js

@@ -1,4 +1,4 @@
-let t={id:"hero-banner-parallax",name:"Hero Banner Parallax",icon:{desktop:`
+let heroBannerParallax={id:"hero-banner-parallax",name:"Hero Banner Parallax",icon:{desktop:`
       <svg width="96" height="48" viewBox="0 0 96 48" fill="none" xmlns="http://www.w3.org/2000/svg">
 <g clip-path="url(#clip0_21157_36120)">
 <rect width="96" height="48" rx="3" fill="#424242"/>
@@ -13,4 +13,4 @@ let t={id:"hero-banner-parallax",name:"Hero Banner Parallax",icon:{desktop:`
 </defs>
 </svg>
 
-    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[12],display:"fill"}},enableParallax:!0,speedParallax:.6},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"600px"},mobile:{shape:"custom",widthHeightLinked:!1,width:"1200px",height:"600px"}}},childrens:[{tag:"Col",childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your product's story<br/>                  or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]}]}]};export{t as heroBannerParallax};
+    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[12],display:"fill"}},enableParallax:!0,speedParallax:.6},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"custom",widthHeightLinked:!1,width:"100%",height:"600px"},mobile:{shape:"custom",widthHeightLinked:!1,width:"1200px",height:"600px"}}},childrens:[{tag:"Col",childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your product's story<br/>                  or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]}]}]};export{heroBannerParallax};

package/dist/esm/hero-banner/settings/configs/presets/banner-video-pre-sales-page.js

@@ -1,4 +1,4 @@
-let e={id:"hero-banner-video-pre-sales-page",name:"Video Banner",icon:{desktop:`
+let heroBannerVideoPreSalesPage={id:"hero-banner-video-pre-sales-page",name:"Video Banner",icon:{desktop:`
     <svg width="96" height="48" viewBox="0 0 96 48" fill="none" xmlns="http://www.w3.org/2000/svg">
     <g clip-path="url(#clip0_12567_1327)">
     <rect width="96" height="48" rx="3" fill="#424242"/>
@@ -12,4 +12,4 @@ let e={id:"hero-banner-video-pre-sales-page",name:"Video Banner",icon:{desktop:`
     </clipPath>
     </defs>
     </svg>
-    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[12],display:"fill"}},link:{type:"go-to-sales-page"}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shapeVideo:"16/9",enableVideoShape:!0}},background:{desktop:{type:"video",image:{src:"",width:1920,height:900},videoType:"html5",video:"https://www.youtube.com/watch?v=drIt4RH_kyQ",videoHtml5:"https://cdn.shopify.com/videos/c/o/v/92a407d4e0c94a288eb54cac18c387dc.mp4"}}},childrens:[{tag:"Col",childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your product's story<br/>                  or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]}]}]};export{e as heroBannerVideoPreSalesPage};
+    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[12],display:"fill"}},link:{type:"go-to-sales-page"}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shapeVideo:"16/9",enableVideoShape:!0}},background:{desktop:{type:"video",image:{src:"",width:1920,height:900},videoType:"html5",video:"https://www.youtube.com/watch?v=drIt4RH_kyQ",videoHtml5:"https://cdn.shopify.com/videos/c/o/v/92a407d4e0c94a288eb54cac18c387dc.mp4"}}},childrens:[{tag:"Col",childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your product's story<br/>                  or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]}]}]};export{heroBannerVideoPreSalesPage};

package/dist/esm/hero-banner/settings/configs/presets/banner-video.js

@@ -1,4 +1,4 @@
-let e={id:"hero-banner-video",name:"Video Banner",icon:{desktop:`
+let heroBannerVideo={id:"hero-banner-video",name:"Video Banner",icon:{desktop:`
     <svg width="96" height="48" viewBox="0 0 96 48" fill="none" xmlns="http://www.w3.org/2000/svg">
     <g clip-path="url(#clip0_12567_1327)">
     <rect width="96" height="48" rx="3" fill="#424242"/>
@@ -12,4 +12,4 @@ let e={id:"hero-banner-video",name:"Video Banner",icon:{desktop:`
     </clipPath>
     </defs>
     </svg>
-    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[12],display:"fill"}}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"original",width:"100%",shapeVideo:"16/9",enableVideoShape:!0},mobile:{shape:"original",width:"100%",shapeVideo:"16/9",enableVideoShape:!0}},background:{desktop:{type:"video",image:{src:"",width:1920,height:900},videoType:"youtube",video:"https://www.youtube.com/watch?v=NfASaHFN1zg",videoHtml5:"https://cdn.shopify.com/videos/c/o/v/92a407d4e0c94a288eb54cac18c387dc.mp4"}}},childrens:[{tag:"Col",childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your product's story<br/>                  or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]}]}]};export{e as heroBannerVideo};
+    `},components:[{tag:"HeroBanner",settings:{layout:{desktop:{cols:[12],display:"fill"}}},styles:{contentWidth:{desktop:"1200px"},sizeSetting:{desktop:{shape:"original",width:"100%",shapeVideo:"16/9",enableVideoShape:!0},mobile:{shape:"original",width:"100%",shapeVideo:"16/9",enableVideoShape:!0}},background:{desktop:{type:"video",image:{src:"",width:1920,height:900},videoType:"youtube",video:"https://www.youtube.com/watch?v=NfASaHFN1zg",videoHtml5:"https://cdn.shopify.com/videos/c/o/v/92a407d4e0c94a288eb54cac18c387dc.mp4"}}},childrens:[{tag:"Col",childrens:[{tag:"Heading",settings:{text:"Click here to edit heading"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Text",settings:{text:"This is your text block. Click to edit and make it your own. Share your product's story<br/>                  or services offered. Get creative and make it yours!"},styles:{textAlign:{desktop:"center"},typo:{attrs:{color:"#FFFFFF"}}},advanced:{"spacing-setting":{desktop:{margin:{bottom:"var(--g-s-l)"}}}}},{tag:"Button",settings:{label:"Get started"},styles:{align:{desktop:"center"}}}]}]}]};export{heroBannerVideo};

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

@@ -1,4 +1,4 @@
-let e=[{id:"setting",controls:[{id:"layout",type:"layout-banner",devices:{desktop:{default:{cols:[12],display:"fill"}}}},{id:"verticalAlign",type:"segment",options:[{label:"Start",value:"start",icon:`<svg
+let SettingsV2=[{id:"setting",controls:[{id:"layout",type:"layout-banner",devices:{desktop:{default:{cols:[12],display:"fill"}}}},{id:"verticalAlign",type:"segment",options:[{label:"Start",value:"start",icon:`<svg
               xmlns="http://www.w3.org/2000/svg"
               width="20"
               height="20"
@@ -143,4 +143,4 @@ let e=[{id:"setting",controls:[{id:"layout",type:"layout-banner",devices:{deskto
                 d="M4.39584 15.625C3.36031 15.625 2.52084 14.7855 2.52084 13.75V12.5C2.52084 11.4645 3.36031 10.625 4.39584 10.625H14.3958C15.4314 10.625 16.2708 11.4645 16.2708 12.5V13.75C16.2708 14.7855 15.4314 15.625 14.3958 15.625H4.39584ZM3.77084 13.75C3.77084 14.0952 4.05066 14.375 4.39584 14.375H14.3958C14.741 14.375 15.0208 14.0952 15.0208 13.75V12.5C15.0208 12.1548 14.741 11.875 14.3958 11.875H4.39584C4.05066 11.875 3.77084 12.1548 3.77084 12.5V13.75Z"
                 fill="currentColor"
               />
-            </svg> `,tooltip:"Align right"}],devices:{desktop:{default:"center"}}},{id:"seo",type:"group",label:"SEO",controls:[{id:"alt",label:"Alt Text",type:"textarea",minHeight:56,autoHeight:!0,placeholder:"E.g: Classic white crewneck t-shirt with minimalist design",default:void 0},{id:"title",label:"Image title",info:"Show title when hover to image",type:"textarea",minHeight:56,autoHeight:!0,placeholder:"E.g: White t-shirt",default:void 0}]},{id:"ratioOptions",type:"ratio",min:1,useUnit:!1,useLink:!1,devices:{desktop:{default:{width:"16",height:"9"}}}},{id:"aspectRatio",type:"select",label:"Ratio",options:[{label:"Original",value:"auto"},{label:"Square",value:"1/1"},{label:"3:2",value:"3/2"},{label:"4:3",value:"4/3"},{label:"16:9",value:"16/9"},{label:"21:9",value:"21/9"},{label:"2:3",value:"2/3"},{label:"3:4",value:"3/4"},{label:"9:16",value:"9/16"},{label:"Cover",value:"cover"},{label:"Custom",value:"custom"}],devices:{desktop:{default:"16/9"},mobile:{default:"auto"}}},{id:"contentBanner",type:"banner",message:"The background image should be taller than the Hero Banner",closable:!0},{id:"isYoutubeVideoMigrated",type:"toggle",default:!1}]},{id:"style",controls:[{id:"sizeSetting",type:"size-setting",label:"",devices:{desktop:{default:{shape:"original",widthHeightLinked:!1,width:"100%",shapeVideo:"16/9",enableVideoShape:!1}},mobile:{default:{shape:"custom",width:"100%",shapeVideo:"custom",enableVideoShape:!1}}},settingConfig:{width:{displayOptions:["full","default"],name:"Width"},height:{displayOptions:["fit-content","fit-screen"],name:"Height"},shape:{displayOptions:["original","custom"],displayVideoOptions:["1/1","3/2","4/3","16/9","21/9","2/3","3/4","9/16","custom"],name:"Frame",shapeTitleConfig:{original:"As banner source"}}},hiddenSettings:["padding","gap"]},{id:"videoObjectFit",type:"option:illustration",enableTooltip:!0,label:"Image scale",options:[{label:"Fill video",value:"cover",type:"image",svgName:"gp-video-cover"},{label:"Fit video",value:"contain",type:"image",svgName:"gp-video-contain"}],devices:{desktop:{default:"cover"}}},{id:"background",type:"background-media",ignoreReRender:!0,showVideo:!0,showRatioVideo:!0,showDeviceControl:!0,devices:{desktop:{default:{type:"image",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1920,height:900},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll",video:"",videoHtml5:"",videoType:"youtube",loop:!0,lazyLoad:!1,videoAlign:"center"}}},compoDefaultValue:{desktop:{default:{type:"image",color:"bg-2",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1920,height:900},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll",video:"https://www.youtube.com/watch?v=NfASaHFN1zg",videoHtml5:"https://cdn.shopify.com/videos/c/o/v/92a407d4e0c94a288eb54cac18c387dc.mp4",videoType:"youtube",loop:!0,lazyLoad:!1}}}},{id:"hoverEffect",type:"toggle",default:!1},{id:"hoverEffectScale",type:"input:slider",label:"Zoom Value",units:["%"],min:100,max:200,step:5,default:"120%",showDefaultUnit:!0},{id:"hoverEffectDuration",label:"Zoom Time",type:"input:unit",units:["s"],min:0,default:.5,inputType:"number",placeholder:"",disableAutoValue:!0,showDefaultUnit:!0},{id:"height",label:"Height",type:"input:unit",units:["px"],placeholder:"Auto",devices:{desktop:{default:void 0}},info:"Full Width: To set Hero Banner full width, first you drag & drop a Section element from left sidebar, then make it full-width, after that you put your Hero Banner inside Section you have created."},{id:"contentPosition1Col",label:"Content Position",type:"option:value",options:[{label:"Top",value:"top",iconName:"gp-align-top"},{label:"Center",value:"center",iconName:"gp-align-center-vertical"},{label:"Bottom",value:"bottom",iconName:"gp-align-bottom"},{label:"Space between",value:"space-between",iconName:"gp-justify-content-space-between"}],devices:{desktop:{default:"center"}}},{id:"contentPosition2Col",label:"Content Position",type:"option:value",options:[{label:"Top",value:"top",iconName:"gp-align-top"},{label:"Center",value:"center",iconName:"gp-align-center-vertical"},{label:"Bottom",value:"bottom",iconName:"gp-align-bottom"},{label:"Space between",value:"space-between",iconName:"gp-justify-content-space-between"}],devices:{desktop:{default:"center"}}},{id:"wrapperWidth",type:"input:unit-width",label:"Width",placeholder:"Auto",min:0,units:["px","%"],devices:{desktop:{default:void 0},tablet:{default:void 0},mobile:{default:void 0}}},{id:"contentWidth",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,devices:{desktop:{default:"default"},tablet:{default:"default"},mobile:{default:"default"}},displayOptions:[{label:"Full",value:"100%",showValue:!0},{label:"Default",value:"default",showValue:!0}]},{id:"verticalGutter",type:"input:unit",units:["px"],min:0,label:"Spacing",devices:{desktop:{default:"32px"}}},{id:"overlayEnable",type:"toggle",default:!1},{id:"overlayOpacity",label:"Opacity",type:"input:slider",min:0,max:100,units:["%"],step:1,default:{normal:"20%"},state:{normal:!0,hover:!0},compoDefaultValue:{normal:"20%",hover:"20%"},showDefaultUnit:!0},{id:"overlayColor",label:"Color",type:"color-picker-v2",state:{normal:!0,hover:!0}},{id:"borderBg",type:"border-v2",label:"Border",compoDefaultValue:{border:"solid",color:"line-3",width:"1px",borderWidth:"1px"}},{id:"cornerBg",type:"corner-v2",label:"Corner",default:{radiusType:"none"}},{id:"hasActiveShadow",type:"toggle",label:"Enable Button Shadow",default:!1},{id:"shadowBg",type:"shadow-v2",label:"Button Shadow",compoDefaultValue:{type:"shadow-1",distance:"4px",blur:"4px",spread:"0px",color:"rgba(18, 18, 18, 0.2)",angle:45,enable:!0}},{id:"contentPadding",type:"padding-v2",devices:{desktop:{default:{top:"4px",left:"16px",bottom:"4px",right:"16px",linked:!1}},mobile:{default:{top:"16px",left:"16px",bottom:"16px",right:"16px",linked:!1}}},compoDefaultValue:{desktop:{default:{top:"4px",left:"16px",bottom:"4px",right:"16px",linked:!1}},mobile:{default:{top:"16px",left:"16px",bottom:"16px",right:"16px",linked:!1}}}}]}];export{e as SettingsV2};
+            </svg> `,tooltip:"Align right"}],devices:{desktop:{default:"center"}}},{id:"seo",type:"group",label:"SEO",controls:[{id:"alt",label:"Alt Text",type:"textarea",minHeight:56,autoHeight:!0,placeholder:"E.g: Classic white crewneck t-shirt with minimalist design",default:void 0},{id:"title",label:"Image title",info:"Show title when hover to image",type:"textarea",minHeight:56,autoHeight:!0,placeholder:"E.g: White t-shirt",default:void 0}]},{id:"ratioOptions",type:"ratio",min:1,useUnit:!1,useLink:!1,devices:{desktop:{default:{width:"16",height:"9"}}}},{id:"aspectRatio",type:"select",label:"Ratio",options:[{label:"Original",value:"auto"},{label:"Square",value:"1/1"},{label:"3:2",value:"3/2"},{label:"4:3",value:"4/3"},{label:"16:9",value:"16/9"},{label:"21:9",value:"21/9"},{label:"2:3",value:"2/3"},{label:"3:4",value:"3/4"},{label:"9:16",value:"9/16"},{label:"Cover",value:"cover"},{label:"Custom",value:"custom"}],devices:{desktop:{default:"16/9"},mobile:{default:"auto"}}},{id:"contentBanner",type:"banner",message:"The background image should be taller than the Hero Banner",closable:!0},{id:"isYoutubeVideoMigrated",type:"toggle",default:!1}]},{id:"style",controls:[{id:"sizeSetting",type:"size-setting",label:"",devices:{desktop:{default:{shape:"original",widthHeightLinked:!1,width:"100%",shapeVideo:"16/9",enableVideoShape:!1}},mobile:{default:{shape:"custom",width:"100%",shapeVideo:"custom",enableVideoShape:!1}}},settingConfig:{width:{displayOptions:["full","default"],name:"Width"},height:{displayOptions:["fit-content","fit-screen"],name:"Height"},shape:{displayOptions:["original","custom"],displayVideoOptions:["1/1","3/2","4/3","16/9","21/9","2/3","3/4","9/16","custom"],name:"Frame",shapeTitleConfig:{original:"As banner source"}}},hiddenSettings:["padding","gap"]},{id:"videoObjectFit",type:"option:illustration",enableTooltip:!0,label:"Image scale",options:[{label:"Fill video",value:"cover",type:"image",svgName:"gp-video-cover"},{label:"Fit video",value:"contain",type:"image",svgName:"gp-video-contain"}],devices:{desktop:{default:"cover"}}},{id:"background",type:"background-media",ignoreReRender:!0,showVideo:!0,showRatioVideo:!0,showDeviceControl:!0,devices:{desktop:{default:{type:"image",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1920,height:900},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll",video:"",videoHtml5:"",videoType:"youtube",loop:!0,lazyLoad:!1,videoAlign:"center"}}},compoDefaultValue:{desktop:{default:{type:"image",color:"bg-2",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1920,height:900},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll",video:"https://www.youtube.com/watch?v=NfASaHFN1zg",videoHtml5:"https://cdn.shopify.com/videos/c/o/v/92a407d4e0c94a288eb54cac18c387dc.mp4",videoType:"youtube",loop:!0,lazyLoad:!1}}}},{id:"hoverEffect",type:"toggle",default:!1},{id:"hoverEffectScale",type:"input:slider",label:"Zoom Value",units:["%"],min:100,max:200,step:5,default:"120%",showDefaultUnit:!0},{id:"hoverEffectDuration",label:"Zoom Time",type:"input:unit",units:["s"],min:0,default:.5,inputType:"number",placeholder:"",disableAutoValue:!0,showDefaultUnit:!0},{id:"height",label:"Height",type:"input:unit",units:["px"],placeholder:"Auto",devices:{desktop:{default:void 0}},info:"Full Width: To set Hero Banner full width, first you drag & drop a Section element from left sidebar, then make it full-width, after that you put your Hero Banner inside Section you have created."},{id:"contentPosition1Col",label:"Content Position",type:"option:value",options:[{label:"Top",value:"top",iconName:"gp-align-top"},{label:"Center",value:"center",iconName:"gp-align-center-vertical"},{label:"Bottom",value:"bottom",iconName:"gp-align-bottom"},{label:"Space between",value:"space-between",iconName:"gp-justify-content-space-between"}],devices:{desktop:{default:"center"}}},{id:"contentPosition2Col",label:"Content Position",type:"option:value",options:[{label:"Top",value:"top",iconName:"gp-align-top"},{label:"Center",value:"center",iconName:"gp-align-center-vertical"},{label:"Bottom",value:"bottom",iconName:"gp-align-bottom"},{label:"Space between",value:"space-between",iconName:"gp-justify-content-space-between"}],devices:{desktop:{default:"center"}}},{id:"wrapperWidth",type:"input:unit-width",label:"Width",placeholder:"Auto",min:0,units:["px","%"],devices:{desktop:{default:void 0},tablet:{default:void 0},mobile:{default:void 0}}},{id:"contentWidth",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,devices:{desktop:{default:"default"},tablet:{default:"default"},mobile:{default:"default"}},displayOptions:[{label:"Full",value:"100%",showValue:!0},{label:"Default",value:"default",showValue:!0}]},{id:"verticalGutter",type:"input:unit",units:["px"],min:0,label:"Spacing",devices:{desktop:{default:"32px"}}},{id:"overlayEnable",type:"toggle",default:!1},{id:"overlayOpacity",label:"Opacity",type:"input:slider",min:0,max:100,units:["%"],step:1,default:{normal:"20%"},state:{normal:!0,hover:!0},compoDefaultValue:{normal:"20%",hover:"20%"},showDefaultUnit:!0},{id:"overlayColor",label:"Color",type:"color-picker-v2",state:{normal:!0,hover:!0}},{id:"borderBg",type:"border-v2",label:"Border",compoDefaultValue:{border:"solid",color:"line-3",width:"1px",borderWidth:"1px"}},{id:"cornerBg",type:"corner-v2",label:"Corner",default:{radiusType:"none"}},{id:"hasActiveShadow",type:"toggle",label:"Enable Button Shadow",default:!1},{id:"shadowBg",type:"shadow-v2",label:"Button Shadow",compoDefaultValue:{type:"shadow-1",distance:"4px",blur:"4px",spread:"0px",color:"rgba(18, 18, 18, 0.2)",angle:45,enable:!0}},{id:"contentPadding",type:"padding-v2",devices:{desktop:{default:{top:"4px",left:"16px",bottom:"4px",right:"16px",linked:!1}},mobile:{default:{top:"16px",left:"16px",bottom:"16px",right:"16px",linked:!1}}},compoDefaultValue:{desktop:{default:{top:"4px",left:"16px",bottom:"4px",right:"16px",linked:!1}},mobile:{default:{top:"16px",left:"16px",bottom:"16px",right:"16px",linked:!1}}}}]}];export{SettingsV2};

package/dist/esm/hero-banner/settings/configs/translate.js

@@ -1 +1 @@
-let e={background:{id:"background",fields:["image.src","video","videoHtml5"]},alt:{id:"alt"},title:{id:"title"}};export{e as HeroBanner};
+let HeroBanner={background:{id:"background",fields:["image.src","video","videoHtml5"]},alt:{id:"alt"},title:{id:"title"}};export{HeroBanner};