@gem-sdk/components 12.0.0-dev.132 → 12.0.0-dev.138

package/dist/esm/button/common/styles.js

@@ -1,7 +1,7 @@
-import{makeStyleResponsive,filterHoverVariables,getStyleShadowState,composeRadius,makeGlobalSize,composeTypographyStyle,getColor,getStyleShadow,getStyleBackgroundImage,getGlobalColorStateStyle,makeStyleState,composeBorderCss,composeCornerCss,GRADIENT_BGR_KEY}from"@gem-sdk/core";let getButtonWrapperStyles=(e,t)=>({...e,...makeStyleResponsive("ta",t?.align)}),getButtonStyles=(e,t)=>{let o={...getSizeStyles(e),...getRadiusStyles(e),...getShadowStyles(e),...getBackgroundStyles(e),...getTypographyStyles(e).textColorStyle,...getTypographyStyles(e).withoutTextColorStyles};return t?o:filterHoverVariables(o)},getButtonIconStyles=(e,t)=>({...getIconSpacingStyle(e,t),"--height-desktop":`${e?.size?.desktop}`,"--height-tablet":`${e?.size?.desktop||e?.size?.tablet}`,"--height-mobile":`${e?.size?.mobile||e?.size?.tablet||e?.size?.desktop}`}),ignoreStateNoneValue=(obj,condition)=>Object.entries(obj).reduce((acc,[key,value])=>((!["hover","focus","normal","active"].includes(key)||eval(condition))&&(acc[key]=value),acc),{}),getShadowStyles=e=>{let{boxShadowBtn:t,hasBoxShadowBtn:o}=e||{},r=ignoreStateNoneValue(t||{},"value?.type !== undefined ");return{...getStyleShadowState(r,"box-shadow",o)}},getRadiusStyles=e=>{let t=ignoreStateNoneValue(e?.roundedBtnV2||{},"value?.radiusType !== undefined");return composeRadius(t,["normal","hover"])},getIconSpacingStyle=(e,t)=>{let o=e?.iconSpacing||{desktop:"8px"};return t?.iconAlign==="left"?makeStyleResponsive("mr",o):makeStyleResponsive("ml",o)},getSizeStyles=e=>{let t=makeGlobalSize(e?.globalSize);return{...t.width,...t.height,...t.padding}},getTypographyStyles=e=>{let t=composeTypographyStyle(e?.typo,e?.typography),o={"--c":t?.["--c"]},r={...t};return delete r["--c"],{textColorStyle:{"--hvr-c":getColor(e?.textColor?.hover),...o},withoutTextColorStyles:r}},getTypoStyles=e=>({...getTypographyStyles(e).withoutTextColorStyles,...getStyleShadow({styleAppliedFor:"text-shadow",value:e?.typo?.custom?.textShadow,isEnableShadow:e?.typo?.custom?.hasShadowText}),"word-break":"break-word"}),getBgImageUrl=(e,t)=>{let{backgroundImage:o,backgroundColorV2:r}=e||{},a=o?.[t],n=r?.[t];if(!a&&!n)return"";let l=`url(${a?.image?.src})`,s=n?`, ${n}`:"";return n?.includes?.(GRADIENT_BGR_KEY)&&a?.image?.src?`${l}${s}`:n?.includes?.(GRADIENT_BGR_KEY)&&!a?.image?.src?n:a?.image?.src?l:""},getBackgroundImageSource=e=>{let t={normal:getBgImageUrl(e,"normal"),hover:getBgImageUrl(e,"hover")};return makeStyleState("bgi",t)},getBackgroundStyles=e=>{let{backgroundColorV2:t,backgroundImage:o}=e||{},r={...o,hover:o?.hover?.image?o?.hover:o?.normal},a={...t,hover:t?.hover||t?.normal};return{...getStyleBackgroundImage(r,{ignoreBackgroundImage:!0}),...getBackgroundImageSource({backgroundImage:r,backgroundColorV2:a}),...getGlobalColorStateStyle("bg",a)}},getCustomCssStyles=({styles:e,uid:t,builderAttrs:o,enableHoverEffect:r})=>{if(!t)return"";let{borderBtnV2:a,roundedBtnV2:n}=e??{},l=ignoreStateNoneValue(a||{},"value?.border !== undefined"),s=ignoreStateNoneValue(n||{},"value?.radiusType !== undefined"),g=generateBorderCornerStyles({uid:t,borderBtn:l,roundedBtn:s,builderAttrs:o,enableHoverEffect:r});return`
-      ${g.normalStyles}
-      ${g.hoverStyles}
-    `.trim()},generateBorderCornerStyles=({uid:e,borderBtn:t,roundedBtn:o,builderAttrs:r,enableHoverEffect:a})=>{let n=r?.["data-component-tag"],l=({styleObj:e,state:t})=>{if(e)return e?.[t]},s=l({styleObj:t,state:"normal"}),g=l({styleObj:a?t:void 0,state:"hover"}),d=l({styleObj:o,state:"normal"}),i=l({styleObj:o,state:"hover"}),u=`
+import{filterHoverVariables,getStyleShadow,makeStyleResponsive,composeTypographyStyle,getColor,getGlobalColorStateStyle,getStyleBackgroundImage,getStyleShadowState,composeRadius,makeGlobalSize,composeBorderCss,composeCornerCss,makeStyleState,GRADIENT_BGR_KEY}from"@gem-sdk/core";let getButtonWrapperStyles=(e,t)=>({...e,...makeStyleResponsive("ta",t?.align)}),getButtonStyles=(e,t)=>{let o={...getSizeStyles(e),...getRadiusStyles(e),...getShadowStyles(e),...getBackgroundStyles(e),...getTypographyStyles(e).textColorStyle,...getTypographyStyles(e).withoutTextColorStyles};return t?o:filterHoverVariables(o)},getButtonIconStyles=(e,t)=>({...getIconSpacingStyle(e,t),"--height-desktop":`${e?.size?.desktop}`,"--height-tablet":`${e?.size?.desktop||e?.size?.tablet}`,"--height-mobile":`${e?.size?.mobile||e?.size?.tablet||e?.size?.desktop}`}),ignoreStateNoneValue=(obj,condition)=>Object.entries(obj).reduce((acc,[key,value])=>((!["hover","focus","normal","active"].includes(key)||eval(condition))&&(acc[key]=value),acc),{}),getShadowStyles=e=>{let{boxShadowBtn:t,hasBoxShadowBtn:o}=e||{},r=ignoreStateNoneValue(t||{},"value?.type !== undefined ");return{...getStyleShadowState(r,"box-shadow",o)}},getRadiusStyles=e=>{let t=ignoreStateNoneValue(e?.roundedBtnV2||{},"value?.radiusType !== undefined");return composeRadius(t,["normal","hover"])},getIconSpacingStyle=(e,t)=>{let o=e?.iconSpacing||{desktop:"8px"};return t?.iconAlign==="left"?makeStyleResponsive("mr",o):makeStyleResponsive("ml",o)},getSizeStyles=e=>{let t=makeGlobalSize(e?.globalSize);return{...t.width,...t.height,...t.padding}},getTypographyStyles=e=>{let t=composeTypographyStyle(e?.typo,e?.typography),o={"--c":t?.["--c"]},r={...t};return delete r["--c"],{textColorStyle:{"--hvr-c":getColor(e?.textColor?.hover),...o},withoutTextColorStyles:r}},getTypoStyles=e=>({...getTypographyStyles(e).withoutTextColorStyles,...getStyleShadow({styleAppliedFor:"text-shadow",value:e?.typo?.custom?.textShadow,isEnableShadow:e?.typo?.custom?.hasShadowText}),"word-break":"break-word"}),getBgImageUrl=(e,t)=>{let{backgroundImage:o,backgroundColorV2:r}=e||{},n=o?.[t],a=r?.[t];if(!n&&!a)return"";let l=`url(${n?.image?.src})`,s=a?`, ${a}`:"";return a?.includes?.(GRADIENT_BGR_KEY)&&n?.image?.src?`${l}${s}`:a?.includes?.(GRADIENT_BGR_KEY)&&!n?.image?.src?a:n?.image?.src?l:""},getBackgroundImageSource=e=>{let t={normal:getBgImageUrl(e,"normal"),hover:getBgImageUrl(e,"hover")};return makeStyleState("bgi",t)},getBackgroundStyles=e=>{let{backgroundColorV2:t,backgroundImage:o}=e||{},r={...o,hover:o?.hover?.image?o?.hover:o?.normal},n={...t,hover:t?.hover||t?.normal};return{...getStyleBackgroundImage(r,{ignoreBackgroundImage:!0}),...getBackgroundImageSource({backgroundImage:r,backgroundColorV2:n}),...getGlobalColorStateStyle("bg",n)}},getCustomCssStyles=({styles:e,uid:t,builderAttrs:o,enableHoverEffect:r})=>{if(!t)return"";let{borderBtnV2:n,roundedBtnV2:a}=e??{},l=ignoreStateNoneValue(n||{},"value?.border !== undefined"),s=ignoreStateNoneValue(a||{},"value?.radiusType !== undefined"),d=generateBorderCornerStyles({uid:t,borderBtn:l,roundedBtn:s,builderAttrs:o,enableHoverEffect:r});return`
+      ${d.normalStyles}
+      ${d.hoverStyles}
+    `.trim()},generateBorderCornerStyles=({uid:e,borderBtn:t,roundedBtn:o,builderAttrs:r,enableHoverEffect:n})=>{let a=r?.["data-component-tag"],l=({styleObj:e,state:t})=>{if(e)return e?.[t]},s=l({styleObj:t,state:"normal"}),d=l({styleObj:n?t:void 0,state:"hover"}),i=l({styleObj:o,state:"normal"}),u=l({styleObj:o,state:"hover"}),b=`
     content: "";
     height: 100%;
     width: 100%;
@@ -10,23 +10,23 @@ import{makeStyleResponsive,filterHoverVariables,getStyleShadowState,composeRadiu
     top: 0;
     left: 0;
     ${composeBorderCss(s)}
-    ${composeCornerCss(d)}
-  `,y=`
+    ${composeCornerCss(i)}
+  `,g=`
     [data-id="${e}"].gp-button-base::before, [data-id="${e}-interaction"].gp-button-base::before {
-      ${u}
+      ${b}
     }
-  `,S=`
+  `,h=`
   [data-id="${e}"]:hover::before, [data-id="${e}-interaction"]:hover::before {
-    ${composeBorderCss(g)}
-    ${composeCornerCss(i)}
+    ${composeBorderCss(d)}
+    ${composeCornerCss(u)}
   }
-`;if("ProductButton"===n){let t=r?.["data-is-in-stock"]??!1;y=`
+`;if("ProductButton"===a){let t=r?.["data-is-in-stock"]??!1;g=`
       [data-is-in-stock="${t}"]>.${e}.gp-button-base::before {
-        ${u}
+        ${b}
       }
-    `,S=`
+    `,h=`
     [data-is-in-stock="${t}"]>.${e}.gp-button-base:hover::before {
-      ${composeBorderCss(g)}
-      ${composeCornerCss(i)}
+      ${composeBorderCss(d)}
+      ${composeCornerCss(u)}
     }
-  `}return{normalStyles:y,hoverStyles:S}};export{generateBorderCornerStyles,getButtonIconStyles,getButtonStyles,getButtonWrapperStyles,getCustomCssStyles,getRadiusStyles,getShadowStyles,getTypoStyles};
+  `}return{normalStyles:g,hoverStyles:h}};export{generateBorderCornerStyles,getButtonIconStyles,getButtonStyles,getButtonWrapperStyles,getCustomCssStyles,getRadiusStyles,getShadowStyles,getTypoStyles};

package/dist/esm/button/components/Button.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as t,jsxs as e}from"react/jsx-runtime";import{useEditorMode as s,usePageType as o}from"@gem-sdk/core";import{createStyle as r,createClass as m,createAttr as l,If as a}from"@gem-sdk/system";import{handleClickLink as i}from"../../helpers.js";import{getButtonAttributes as n}from"../common/attrs.js";import{getButtonStyles as c,getTypoStyles as d,getButtonIconStyles as f,getButtonWrapperStyles as p}from"../common/styles.js";import{getButtonClasses as g,getButtonIconClasses as u,getButtonLabelClasses as h,getButtonWrapperClasses as y,getButtonContentWrapperClasses as j,getButtonContainerClasses as b}from"../common/classes.js";import v from"./ButtonIcon.js";import B from"./ButtonLabel.js";import L from"./ButtonLoadingIndicator.js";import{getData as N,getInsertLinkData as k}from"../common/helpers.js";let Button=I=>{let{children:T,advanced:x,className:H,nodePrice:C,customAttrs:M,styles:S={},setting:_={},builderProps:E,builderAttrs:q,wrapClassName:w="",onClick:z}=I,{iconSvg:A,btnLink:D,htmlType:F,loading:G,disabled:J,shouldClearSpace:K,enableBtnLink:O}=_,{enableTextStyle:P=!0}=S,Q=s(),R=o(),{customCss:U,wrapStyle:V,restStyle:W,dataState:X,dataIdAttr:Y,isShowIcon:Z,isScrollToElement:$,getArialLabel:tt,getLabelToDisplay:te,checkIsShowLabel:ts,checkIsEditableLabel:to}=N(I),{HTMLTag:tr,urlData:tm,shouldRenderLink:tl}=k({enableBtnLink:O,htmlType:F,setting:D,defaultTag:"button",pageType:R}),ta=r({...c(S,_.enableHoverEffect)}),ti=r({...d(S)}),tn=r({...d(S),...f(S,_)}),tc=r({...p(W,S)}),td=m({...g({styles:S,className:H,shouldRenderLink:tl,uid:E?.uid,advanced:x})}),tf=m({...u(te(),K,P)}),tp=m({...h(S,to({mode:Q}))}),tg=m({...y(w,H,x?.cssClass)}),tu=m({...j(_)}),th=m({...b()}),ty=l({...n({disabled:J,dataState:X,dataId:Y,arialLabel:tt()})}),tj=t=>{z?.(t),i(D,Q)};return t("div",{style:V,className:th,children:e("div",{...q,style:tc,className:tg,children:[t("style",{type:"text/css",dangerouslySetInnerHTML:{__html:U}}),a($,t("a",{className:"gp-trigger-button-link gp-hidden",href:tm.href,target:tm.target})),e(tr,{...ty,...M,..."button"!==tr&&{setting:tm},style:ta,className:td,onClick:tj,children:[a(G,t(L,{})),e("div",{className:tu,children:[a(Z,t(v,{iconSvg:A??"",styles:tn,classes:tf})),a(P&&ts(),t(B,{label:te(),styles:ti,classes:tp}))]}),a(!!C,C??"")]}),T]})})};export{Button as default};
+import{jsx as t,jsxs as e}from"react/jsx-runtime";import{useEditorMode as s,usePageType as o}from"@gem-sdk/core";import{createStyle as r,createClass as m,createAttr as l,If as a}from"@gem-sdk/system";import{handleClickLink as i}from"../../helpers.js";import{getButtonAttributes as n}from"../common/attrs.js";import{getButtonStyles as c,getTypoStyles as d,getButtonIconStyles as f,getButtonWrapperStyles as p}from"../common/styles.js";import{getButtonClasses as g,getButtonIconClasses as u,getButtonLabelClasses as h,getButtonWrapperClasses as y,getButtonContentWrapperClasses as j,getButtonContainerClasses as b}from"../common/classes.js";import v from"./ButtonIcon.js";import L from"./ButtonLabel.js";import N from"./ButtonLoadingIndicator.js";import{getData as k,getInsertLinkData as B}from"../common/helpers.js";let I=I=>{let{children:T,advanced:x,className:H,nodePrice:C,customAttrs:M,styles:S={},setting:_={},builderProps:E,builderAttrs:q,wrapClassName:w="",onClick:z}=I,{iconSvg:A,btnLink:D,htmlType:F,loading:G,disabled:J,shouldClearSpace:K,enableBtnLink:O}=_,{enableTextStyle:P=!0}=S,Q=s(),R=o(),{customCss:U,wrapStyle:V,restStyle:W,dataState:X,dataIdAttr:Y,isShowIcon:Z,isScrollToElement:$,getArialLabel:tt,getLabelToDisplay:te,checkIsShowLabel:ts,checkIsEditableLabel:to}=k(I),{HTMLTag:tr,urlData:tm,shouldRenderLink:tl}=B({enableBtnLink:O,htmlType:F,setting:D,defaultTag:"button",pageType:R}),ta=r({...c(S,_.enableHoverEffect)}),ti=r({...d(S)}),tn=r({...d(S),...f(S,_)}),tc=r({...p(W,S)}),td=m({...g({styles:S,className:H,shouldRenderLink:tl,uid:E?.uid,advanced:x})}),tf=m({...u(te(),K,P)}),tp=m({...h(S,to({mode:Q}))}),tg=m({...y(w,H,x?.cssClass)}),tu=m({...j(_)}),th=m({...b()}),ty=l({...n({disabled:J,dataState:X,dataId:Y,arialLabel:tt()})});return t("div",{style:V,className:th,children:e("div",{...q,style:tc,className:tg,children:[t("style",{type:"text/css",dangerouslySetInnerHTML:{__html:U}}),a($,t("a",{className:"gp-trigger-button-link gp-hidden",href:tm.href,target:tm.target})),e(tr,{...ty,...M,..."button"!==tr&&{setting:tm},style:ta,className:td,onClick:t=>{z?.(t),i(D,Q)},children:[a(G,t(N,{})),e("div",{className:tu,children:[a(Z,t(v,{iconSvg:A??"",styles:tn,classes:tf})),a(P&&ts(),t(L,{label:te(),styles:ti,classes:tp}))]}),a(!!C,C??"")]}),T]})})};export{I as default};

package/dist/esm/button/components/Button.liquid.js

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

package/dist/esm/button/components/ButtonIcon.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";let ButtonIcon=({iconSvg:e,classes:n,styles:o})=>t("span",{className:n,style:o,dangerouslySetInnerHTML:{__html:e}});export{ButtonIcon as default};
+import{jsx as t}from"react/jsx-runtime";let e=({iconSvg:e,classes:a,styles:n})=>t("span",{className:a,style:n,dangerouslySetInnerHTML:{__html:e}});export{e as default};

package/dist/esm/button/components/ButtonIcon.liquid.js

@@ -1,8 +1,8 @@
-import{template as t}from"@gem-sdk/core";let ButtonIcon=({iconSvg:o,classes:s,styles:e})=>t`
+import{template as s}from"@gem-sdk/core";let t=({iconSvg:t,classes:e,styles:o})=>s`
     <span
-      style="${e}"
-      class="${s}"
+      style="${o}"
+      class="${e}"
     >
-      ${o}
+      ${t}
     </span>
-  `;export{ButtonIcon as default};
+  `;export{t as default};

package/dist/esm/button/components/ButtonLabel.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import"react";let ButtonLabel=({label:e,styles:a,classes:r})=>t("div",{"data-gp-text":!0,style:a,className:r,dangerouslySetInnerHTML:{__html:e}});export{ButtonLabel as default};
+import{jsx as t}from"react/jsx-runtime";import"react";let e=({label:e,styles:a,classes:r})=>t("div",{"data-gp-text":!0,style:a,className:r,dangerouslySetInnerHTML:{__html:e}});export{e as default};

package/dist/esm/button/components/ButtonLabel.liquid.js

@@ -1,8 +1,8 @@
-import{template as t}from"@gem-sdk/core";let ButtonLabel=({label:a,styles:e,classes:s})=>t`
+import{template as t}from"@gem-sdk/core";let a=({label:a,styles:e,classes:s})=>t`
     <span
       data-gp-text
       style="${e}"
       class="${s}"
     >
       ${a}
-    </span>`;export{ButtonLabel as default};
+    </span>`;export{a as default};

package/dist/esm/button/components/ButtonLoadingIndicator.js

@@ -1 +1 @@
-import{jsxs as t,jsx as a}from"react/jsx-runtime";import"react";let ButtonLoadingIndicator=()=>t("svg",{className:"gp-invisible gp-h-5 gp-w-5 gp-animate-spin group-data-[state=loading]:gp-visible gp-absolute",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",children:[a("circle",{className:"gp-opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),a("path",{className:"gp-opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]});export{ButtonLoadingIndicator as default};
+import{jsxs as t,jsx as a}from"react/jsx-runtime";import"react";let e=()=>t("svg",{className:"gp-invisible gp-h-5 gp-w-5 gp-animate-spin group-data-[state=loading]:gp-visible gp-absolute",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",children:[a("circle",{className:"gp-opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),a("path",{className:"gp-opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]});export{e as default};

package/dist/esm/button/components/ButtonLoadingIndicator.liquid.js

@@ -1 +1 @@
-import{template as o}from"@gem-sdk/core";import{LOADING_INDICATOR as t}from"../common/helpers.js";let ButtonLoadingIndicator=()=>o`${t}`;export{ButtonLoadingIndicator as default};
+import{template as o}from"@gem-sdk/core";import{LOADING_INDICATOR as r}from"../common/helpers.js";let t=()=>o`${r}`;export{t as default};

package/dist/esm/button/index.js

@@ -1 +1 @@
-import"react/jsx-runtime";import"@gem-sdk/core";import"@gem-sdk/system";import"react";import"next/link";import t from"./settings/Button.js";let buttonSetting={Button:t};export{buttonSetting};
+import"react/jsx-runtime";import"@gem-sdk/core";import"@gem-sdk/system";import"react";import"next/link";import t from"./settings/Button.js";let e={Button:t};export{e as buttonSetting};

package/dist/esm/button/next.js

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

package/dist/esm/button/settings/Button.js

@@ -1,4 +1,4 @@
-import{ButtonSettings as t}from"./configs/settings.js";import{SettingUIV2 as e}from"./configs/ui-v2.js";let config={tag:"Button",label:"Button",icon:`
+import{ButtonSettings as t}from"./configs/settings.js";import{SettingUIV2 as e}from"./configs/ui-v2.js";let o={tag:"Button",label:"Button",icon:`
   <svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
     <path d="M3.16699 6.66663C2.89085 6.66663 2.66699 6.89048 2.66699 7.16663V26.1666C2.66699 26.4428 2.89085 26.6666 3.16699 26.6666H13.5531C13.8587 26.6666 14.0929 26.3948 14.0475 26.0925L13.7975 24.4258C13.7608 24.181 13.5506 24 13.3031 24H5.33366V9.33329H34.667V24H32.5003C32.2242 24 32.0003 24.2238 32.0003 24.5V25.1121C32.0003 25.253 32.0597 25.3873 32.164 25.4821L33.324 26.5366C33.416 26.6203 33.5359 26.6666 33.6603 26.6666H36.8337C37.1098 26.6666 37.3337 26.4428 37.3337 26.1666V7.16663C37.3337 6.89048 37.1098 6.66663 36.8337 6.66663H3.16699ZM19.8589 29.6767C19.9172 30.0846 20.4161 30.2509 20.7074 29.9595L22.667 28L27.6468 32.9797C27.842 33.175 28.1586 33.175 28.3539 32.9797L30.3134 31.0202C30.5087 30.8249 30.5087 30.5083 30.3134 30.3131L25.3337 25.3333L27.2932 23.3737C27.5846 23.0824 27.4183 22.5835 27.0104 22.5252L19.327 21.4276C18.997 21.3804 18.7141 21.6633 18.7613 21.9933L19.8589 29.6767Z" fill="currentColor"/>
   </svg>
@@ -24,4 +24,4 @@ import{ButtonSettings as t}from"./configs/settings.js";import{SettingUIV2 as e}f
           <path d="M23.6415 17.8126C23.7882 17.5153 24.2121 17.5153 24.3589 17.8126L26.1255 21.3922C26.1838 21.5102 26.2964 21.5921 26.4267 21.611L30.377 22.185C30.7051 22.2327 30.8361 22.6359 30.5987 22.8673L27.7402 25.6536C27.6459 25.7455 27.6029 25.8779 27.6252 26.0077L28.3 29.9421C28.356 30.2688 28.0131 30.518 27.7196 30.3638L24.1863 28.5062C24.0698 28.4449 23.9306 28.4449 23.814 28.5062L20.2807 30.3637C19.9873 30.518 19.6443 30.2688 19.7004 29.9421L20.3752 26.0077C20.3974 25.8779 20.3544 25.7455 20.2601 25.6536L17.4016 22.8673C17.1642 22.6359 17.2952 22.2327 17.6233 22.185L21.5737 21.611C21.7039 21.5921 21.8166 21.5102 21.8748 21.3922L23.6415 17.8126Z" fill="#F9F9F9"/>
           <rect x="40" y="20" width="40" height="8" rx="4" fill="#757575"/>
           </svg>
-        `},components:[{tag:"Button",settings:{iconVisible:!0,iconAlign:"left",iconSvg:'<svg data-name="star-filled" height="100%" width="100%" xmlns="http://www.w3.org/2000/svg" className="w-6 h-6"  viewBox="0 0 512 512" fill="currentColor"> <path fill="currentColor" strokeLinecap="round" strokeLinejoin="round" fill="currentColor" d="M115.584 494.176c-12.352 6.336 -26.368 -4.768 -23.872 -18.944l26.56 -151.36L5.536 216.48c-10.528 -10.048 -5.056 -28.416 9.056 -30.4l156.736 -22.272L241.216 25.344c6.304 -12.48 23.36 -12.48 29.664 0l69.888 138.464 156.736 22.272c14.112 1.984 19.584 20.352 9.024 30.4l-112.704 107.392 26.56 151.36c2.496 14.176 -11.52 25.28 -23.872 18.944L256 421.984l-140.448 72.192z" /></svg>',btnLink:{type:"go-to-sales-page"},enableBtnLink:!0},advanced:{"spacing-setting":{desktop:{margin:{bottom:0}}},editorData:{cssPlaceholder:"button.{{rootClassName}} {\n\n}"}}}]}],rootOverride:{styles:{width:{desktop:"auto"},align:{desktop:"center"}},advanced:{"spacing-setting":{desktop:{margin:{bottom:0}}}}}};export{config as default};
+        `},components:[{tag:"Button",settings:{iconVisible:!0,iconAlign:"left",iconSvg:'<svg data-name="star-filled" height="100%" width="100%" xmlns="http://www.w3.org/2000/svg" className="w-6 h-6"  viewBox="0 0 512 512" fill="currentColor"> <path fill="currentColor" strokeLinecap="round" strokeLinejoin="round" fill="currentColor" d="M115.584 494.176c-12.352 6.336 -26.368 -4.768 -23.872 -18.944l26.56 -151.36L5.536 216.48c-10.528 -10.048 -5.056 -28.416 9.056 -30.4l156.736 -22.272L241.216 25.344c6.304 -12.48 23.36 -12.48 29.664 0l69.888 138.464 156.736 22.272c14.112 1.984 19.584 20.352 9.024 30.4l-112.704 107.392 26.56 151.36c2.496 14.176 -11.52 25.28 -23.872 18.944L256 421.984l-140.448 72.192z" /></svg>',btnLink:{type:"go-to-sales-page"},enableBtnLink:!0},advanced:{"spacing-setting":{desktop:{margin:{bottom:0}}},editorData:{cssPlaceholder:"button.{{rootClassName}} {\n\n}"}}}]}],rootOverride:{styles:{width:{desktop:"auto"},align:{desktop:"center"}},advanced:{"spacing-setting":{desktop:{margin:{bottom:0}}}}}};export{o as default};

package/dist/esm/button/settings/configs/settings.js

@@ -1,4 +1,4 @@
-let ButtonSettings=[{id:"setting",controls:[{id:"label",label:"Text",type:"input",default:"<p>Button</p>"},{id:"enableBtnLink",type:"toggle",default:!1},{id:"enableHoverEffect",type:"toggle",default:!0},{id:"btnLink",type:"pick-link",pickLinkLabel:"Button link",label:"Pick Link",default:{type:"open-page",link:"",target:"_self"},hiddenOptions:{"stay-on-page":!0}},{id:"iconGroup",type:"group",label:"Icon",controls:[{id:"iconVisible",label:"Icon Visible",type:"toggle",default:!1},{id:"iconSvg",label:"SVG Icon",type:"icon",default:`
+let e=[{id:"setting",controls:[{id:"label",label:"Text",type:"input",default:"<p>Button</p>"},{id:"enableBtnLink",type:"toggle",default:!1},{id:"enableHoverEffect",type:"toggle",default:!0},{id:"btnLink",type:"pick-link",pickLinkLabel:"Button link",label:"Pick Link",default:{type:"open-page",link:"",target:"_self"},hiddenOptions:{"stay-on-page":!0}},{id:"iconGroup",type:"group",label:"Icon",controls:[{id:"iconVisible",label:"Icon Visible",type:"toggle",default:!1},{id:"iconSvg",label:"SVG Icon",type:"icon",default:`
               <svg height="20" width="20" data-name="star-filled" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" data-id="508817759863701864">
               <path fill="currentColor" strokelinecap="round" strokelinejoin="round" d="M234.29,114.85l-45,38.83L203,211.75a16.4,16.4,0,0,1-24.5,17.82L128,198.49,77.47,229.57A16.4,16.4,0,0,1,53,211.75l13.76-58.07-45-38.83A16.46,16.46,0,0,1,31.08,86l59-4.76,22.76-55.08a16.36,16.36,0,0,1,30.27,0l22.75,55.08,59,4.76a16.46,16.46,0,0,1,9.37,28.86Z"></path></svg>
-            `},{id:"iconAlign",label:"Icon Alignment",type:"option:value",options:[{label:"Left",value:"left"},{label:"Right",value:"right"}],default:"left"}]},{id:"htmlType",label:"HTML Type",type:"select",default:"button",options:[{label:"Open link, popup & scroll to",value:"button"},{label:"Clear form",value:"reset"},{label:"Submit form",value:"submit"}]},{id:"disabled",label:"Disabled",type:"toggle",default:!1},{id:"shouldClearSpace",label:"",type:"toggle",default:!1}]},{id:"style",controls:[{id:"borderBtnV2",type:"border-v2",default:{normal:{borderType:"none",border:"none",borderWidth:"1px",width:"1px 1px 1px 1px",color:"line-3",isCustom:!0}},compoDefaultValue:{normal:{border:"solid",color:"line-3",width:"1px",borderWidth:"1px"},hover:{border:"solid",color:"line-3",width:"1px",borderWidth:"1px"}}},{id:"roundedBtnV2",type:"corner-v2",default:{normal:{btrr:"0px",bblr:"0px",bbrr:"0px",btlr:"0px",radiusType:"none"}},compoDefaultValue:{normal:{btrr:"8px",bblr:"8px",bbrr:"8px",btlr:"8px",radiusType:"rounded"}}},{id:"hasBoxShadowBtn",type:"toggle",label:"Enable Button Shadow",default:{normal:!1},state:{normal:!0,hover:!0}},{id:"boxShadowBtn",type:"shadow-v2",compoDefaultValue:{normal:{type:"shadow-1",distance:"4px",blur:"4px",spread:"0px",color:"rgba(18, 18, 18, 0.2)",angle:45,enable:!0}}},{id:"backgroundColorV2",type:"color-picker-v2",default:{normal:"brand",hover:"highlight"},compoDefaultValue:{normal:"brand",hover:"highlight"},enableGradient:!0},{id:"backgroundImage",type:"background-image",compoDefaultValue:{normal:{size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:480,hiddenSEO:!0}},hover:{size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:480,hiddenSEO:!0}}}},{id:"align",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"left"}}},{id:"enableTextStyle",label:"",type:"toggle",default:!0},{id:"typo",type:"typography-v2",default:{type:"paragraph-1",attrs:{color:"text-3"}},compoDefaultValue:{attrs:{color:"text-3"}},ignoreReRender:!0,hiddenSetting:{textAlign:!0}},{id:"textColor",type:"color-picker-v2",default:{normal:"text-3"},compoDefaultValue:{normal:"text-3"},state:{hover:!0,normal:!0},enableGradient:!1},{id:"transform",label:"Text Transform",type:"select",options:[{value:"default",label:"None"},{value:"capitalize",label:"Capitalize"},{value:"uppercase",label:"Uppercase"},{value:"lowercase",label:"Lowercase"}],default:"default"},{id:"dimensions1",type:"group",label:"Icon Dimension",controls:[{id:"iconSizeAuto",type:"toggle",label:"Icon Auto Size",default:!0},{id:"size",label:"Size Icon",type:"select",options:[{label:"Large",value:"1.2em"},{label:"Medium",value:"1em"},{label:"Small",value:"0.8em"}],devices:{desktop:{default:"1em"}}},{id:"iconDimension",type:"input:slider",label:"Size",hide:!0,min:0,max:100,step:1,units:["px","em","rem"],devices:{desktop:{default:"24px"}}}]},{id:"globalSize",type:"size-setting",devices:{desktop:{default:{width:"Auto",height:"Auto",padding:{type:"medium",top:"12px",bottom:"12px",left:"24px",right:"24px"}}}},settingConfig:{width:{displayOptions:["full","auto"],sizeConfig:{small:"100px",medium:"116px",large:"132px"}},height:{displayOptions:["auto"],sizeConfig:{small:"28px",medium:"36px",large:"44px"}}},hiddenSettings:["shape","gap"]},{id:"iconSpacing",type:"input:slider",units:["px"],step:1,max:40,ignoreMax:!0,devices:{desktop:{default:"8px"}}},{id:"textAlign",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"text",tooltip:"Align left",iconName:"gp-text-align-left"},{label:"Center",value:"center",type:"text",tooltip:"Align center",iconName:"gp-text-align-center"},{label:"Right",value:"right",type:"text",tooltip:"Align right",iconName:"gp-text-align-right"},{label:"Justify",value:"justify",type:"text",tooltip:"Align justify",iconName:"gp-text-align-justify"}],devices:{desktop:{default:"left"}}}]}];export{ButtonSettings};
+            `},{id:"iconAlign",label:"Icon Alignment",type:"option:value",options:[{label:"Left",value:"left"},{label:"Right",value:"right"}],default:"left"}]},{id:"htmlType",label:"HTML Type",type:"select",default:"button",options:[{label:"Open link, popup & scroll to",value:"button"},{label:"Clear form",value:"reset"},{label:"Submit form",value:"submit"}]},{id:"disabled",label:"Disabled",type:"toggle",default:!1},{id:"shouldClearSpace",label:"",type:"toggle",default:!1}]},{id:"style",controls:[{id:"borderBtnV2",type:"border-v2",default:{normal:{borderType:"none",border:"none",borderWidth:"1px",width:"1px 1px 1px 1px",color:"line-3",isCustom:!0}},compoDefaultValue:{normal:{border:"solid",color:"line-3",width:"1px",borderWidth:"1px"},hover:{border:"solid",color:"line-3",width:"1px",borderWidth:"1px"}}},{id:"roundedBtnV2",type:"corner-v2",default:{normal:{btrr:"0px",bblr:"0px",bbrr:"0px",btlr:"0px",radiusType:"none"}},compoDefaultValue:{normal:{btrr:"8px",bblr:"8px",bbrr:"8px",btlr:"8px",radiusType:"rounded"}}},{id:"hasBoxShadowBtn",type:"toggle",label:"Enable Button Shadow",default:{normal:!1},state:{normal:!0,hover:!0}},{id:"boxShadowBtn",type:"shadow-v2",compoDefaultValue:{normal:{type:"shadow-1",distance:"4px",blur:"4px",spread:"0px",color:"rgba(18, 18, 18, 0.2)",angle:45,enable:!0}}},{id:"backgroundColorV2",type:"color-picker-v2",default:{normal:"brand",hover:"highlight"},compoDefaultValue:{normal:"brand",hover:"highlight"},enableGradient:!0},{id:"backgroundImage",type:"background-image",compoDefaultValue:{normal:{size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:480,hiddenSEO:!0}},hover:{size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:480,hiddenSEO:!0}}}},{id:"align",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"left"}}},{id:"enableTextStyle",label:"",type:"toggle",default:!0},{id:"typo",type:"typography-v2",default:{type:"paragraph-1",attrs:{color:"text-3"}},compoDefaultValue:{attrs:{color:"text-3"}},ignoreReRender:!0,hiddenSetting:{textAlign:!0}},{id:"textColor",type:"color-picker-v2",default:{normal:"text-3"},compoDefaultValue:{normal:"text-3"},state:{hover:!0,normal:!0},enableGradient:!1},{id:"transform",label:"Text Transform",type:"select",options:[{value:"default",label:"None"},{value:"capitalize",label:"Capitalize"},{value:"uppercase",label:"Uppercase"},{value:"lowercase",label:"Lowercase"}],default:"default"},{id:"dimensions1",type:"group",label:"Icon Dimension",controls:[{id:"iconSizeAuto",type:"toggle",label:"Icon Auto Size",default:!0},{id:"size",label:"Size Icon",type:"select",options:[{label:"Large",value:"1.2em"},{label:"Medium",value:"1em"},{label:"Small",value:"0.8em"}],devices:{desktop:{default:"1em"}}},{id:"iconDimension",type:"input:slider",label:"Size",hide:!0,min:0,max:100,step:1,units:["px","em","rem"],devices:{desktop:{default:"24px"}}}]},{id:"globalSize",type:"size-setting",devices:{desktop:{default:{width:"Auto",height:"Auto",padding:{type:"medium",top:"12px",bottom:"12px",left:"24px",right:"24px"}}}},settingConfig:{width:{displayOptions:["full","auto"],sizeConfig:{small:"100px",medium:"116px",large:"132px"}},height:{displayOptions:["auto"],sizeConfig:{small:"28px",medium:"36px",large:"44px"}}},hiddenSettings:["shape","gap"]},{id:"iconSpacing",type:"input:slider",units:["px"],step:1,max:40,ignoreMax:!0,devices:{desktop:{default:"8px"}}},{id:"textAlign",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"text",tooltip:"Align left",iconName:"gp-text-align-left"},{label:"Center",value:"center",type:"text",tooltip:"Align center",iconName:"gp-text-align-center"},{label:"Right",value:"right",type:"text",tooltip:"Align right",iconName:"gp-text-align-right"},{label:"Justify",value:"justify",type:"text",tooltip:"Align justify",iconName:"gp-text-align-justify"}],devices:{desktop:{default:"left"}}}]}];export{e as ButtonSettings};

package/dist/esm/button/settings/configs/translate.js

@@ -1 +1 @@
-let Button={label:{id:"label"}};export{Button};
+let l={label:{id:"label"}};export{l as Button};

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

@@ -1 +1 @@
-let SettingUIV2=[{label:"Size",controls:[{id:"Width",label:"Width",controlConfig:{id:"width",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,fallbackValue:"Auto",linkWithSetting:{name:"globalSize",field:"width"},displayOptions:[{label:"Fit content",value:"Auto",showValue:!0},{label:"Full",value:"100%",showValue:!0}]},layout:"horizontal"},{id:"Height",label:"Height",controlConfig:{id:"height",type:"dropdown:input",label:"height",inputType:"number",units:["px"],hideUnit:!1,fallbackValue:"Auto",linkWithSetting:{name:"globalSize",field:"height"},displayOptions:[{label:"Fit content",value:"Auto",showValue:!0}]},layout:"horizontal"},{label:"Padding",controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"globalSize",field:"padding"},compoDefaultValue:{desktop:{default:{type:"medium",top:"12px",bottom:"12px",left:"24px",right:"24px"}}}}}]},{label:"Background",conditionDisplay:'pageType != "POST_PURCHASE"',controls:[{label:"Color",setting:{id:"backgroundColorV2",state:"normal"}},{label:"Image",setting:{id:"backgroundImage",state:"normal"}}]},{label:"Shape",conditionDisplay:'pageType != "POST_PURCHASE"',controls:[{label:"Border",setting:{id:"borderBtnV2",state:"normal"}},{label:"Corner",setting:{id:"roundedBtnV2",state:"normal"}},{label:"Shadow",setting:{id:"boxShadowBtn",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadowBtn",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadowBtn.normal.enable === true",source:["boxShadowBtn","hasBoxShadowBtn"],action:{controlId:"hasBoxShadowBtn",groupType:"style",controlType:"style",state:"normal",newValue:!0}},{condition:"boxShadowBtn.normal.enable === false",source:["boxShadowBtn","hasBoxShadowBtn"],action:{controlId:"hasBoxShadowBtn",groupType:"style",controlType:"style",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{controls:[{label:"Icon",setting:{id:"iconVisible"},options:{labelVariant:"primary",toggleStyle:"switch"}},{label:"Icon",setting:{id:"iconSvg"},conditionDisplay:"iconVisible == true"},{type:"control",label:"Position",setting:{id:"iconAlign"},conditionDisplay:"iconVisible == true"},{type:"control",label:"Gap",setting:{id:"iconSpacing"},conditionDisplay:"iconVisible == true"}]},{controls:[{label:"Text",setting:{id:"enableTextStyle"},options:{labelVariant:"primary",toggleStyle:"switch"},controlChangeTrigger:{settings:[{condition:'enableTextStyle === true && label === ""',source:["enableTextStyle","label"],action:{controlId:"label",groupType:"setting",controlType:"setting",newValue:"<p>Button</p>"}}],options:{noRecordHistory:!0}}},{id:"typo",label:"Basic",setting:{id:"typo"},conditionDisplay:"enableTextStyle == true",options:{hideLabel:!0,fullWidth:!0,updateFields:[{field:"attrs.textAlign",settingId:"textAlign"},{field:"attrs.color",settingId:"textColor",state:"normal"}]},layout:"vertical",controlChangeTrigger:{settings:[{action:{controlId:"textAlign",valueFromField:"attrs.textAlign",groupType:"style",controlType:"style"}},{action:{controlId:"textColor",valueFromField:"attrs.color",groupType:"style",controlType:"style",removeDevice:!0,state:"normal"}}],options:{noRecordHistory:!0}}}]},{label:"Effect",conditionDisplay:'pageType != "POST_PURCHASE"',controls:[{label:"Hover",iconName:"polaris-check-hover",type:"combo",fixedValue:"Styled",setting:{id:"enableHoverEffect"},popoverLabel:"Hover",state:"hover",controls:[{type:"group",label:"Background",controls:[{label:"Color",setting:{id:"backgroundColorV2",state:"hover"}},{label:"Image",setting:{id:"backgroundImage",state:"hover"}}]},{type:"group",label:"Text",controls:[{label:"Text color",setting:{id:"textColor",state:"hover"}}]},{type:"group",label:"Shape",controls:[{label:"Border",setting:{id:"borderBtnV2",state:"hover"}},{label:"Corner",setting:{id:"roundedBtnV2",state:"hover"}},{label:"Shadow",setting:{id:"boxShadowBtn",state:"hover"},options:{updateFields:[{field:"hover.enable",settingId:"hasBoxShadowBtn",state:"hover"}]},controlChangeTrigger:{settings:[{condition:"boxShadowBtn.hover.enable === true",source:["boxShadowBtn","hasBoxShadowBtn"],action:{controlId:"hasBoxShadowBtn",groupType:"style",controlType:"style",state:"hover",newValue:!0}},{condition:"boxShadowBtn.hover.enable === false",source:["boxShadowBtn","hasBoxShadowBtn"],action:{controlId:"hasBoxShadowBtn",groupType:"style",controlType:"style",state:"hover",newValue:!1}}],options:{noRecordHistory:!0}}},{label:"Shadow",setting:{id:"hasBoxShadowBtn",state:"hover"},conditionDisplay:"false"}]}]}]},{controls:[{label:"Link",setting:{id:"enableBtnLink"},options:{labelVariant:"primary",toggleStyle:"switch"}},{layout:"vertical",controlConfig:{id:"linkedToPreSalesPageBanner",type:"banner",message:"Pre-sales page elements with link should redirect to the Sales page."},conditionDisplay:'pageType === "GP_PRE_SALE_PAGE" && enableBtnLink == true'},{type:"control",layout:"vertical",conditionDisplay:"enableBtnLink == true",setting:{id:"btnLink"}}]},{controls:[{label:"Align",conditionEnable:'!(globalSize.width === "default" || (parseInt(globalSize.width) >= 100 && globalSize.width?.includes("%")))',setting:{id:"align"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"}}]}];export{SettingUIV2};
+let e=[{label:"Size",controls:[{id:"Width",label:"Width",controlConfig:{id:"width",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,fallbackValue:"Auto",linkWithSetting:{name:"globalSize",field:"width"},displayOptions:[{label:"Fit content",value:"Auto",showValue:!0},{label:"Full",value:"100%",showValue:!0}]},layout:"horizontal"},{id:"Height",label:"Height",controlConfig:{id:"height",type:"dropdown:input",label:"height",inputType:"number",units:["px"],hideUnit:!1,fallbackValue:"Auto",linkWithSetting:{name:"globalSize",field:"height"},displayOptions:[{label:"Fit content",value:"Auto",showValue:!0}]},layout:"horizontal"},{label:"Padding",controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"globalSize",field:"padding"},compoDefaultValue:{desktop:{default:{type:"medium",top:"12px",bottom:"12px",left:"24px",right:"24px"}}}}}]},{label:"Background",conditionDisplay:'pageType != "POST_PURCHASE"',controls:[{label:"Color",setting:{id:"backgroundColorV2",state:"normal"}},{label:"Image",setting:{id:"backgroundImage",state:"normal"}}]},{label:"Shape",conditionDisplay:'pageType != "POST_PURCHASE"',controls:[{label:"Border",setting:{id:"borderBtnV2",state:"normal"}},{label:"Corner",setting:{id:"roundedBtnV2",state:"normal"}},{label:"Shadow",setting:{id:"boxShadowBtn",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadowBtn",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadowBtn.normal.enable === true",source:["boxShadowBtn","hasBoxShadowBtn"],action:{controlId:"hasBoxShadowBtn",groupType:"style",controlType:"style",state:"normal",newValue:!0}},{condition:"boxShadowBtn.normal.enable === false",source:["boxShadowBtn","hasBoxShadowBtn"],action:{controlId:"hasBoxShadowBtn",groupType:"style",controlType:"style",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{controls:[{label:"Icon",setting:{id:"iconVisible"},options:{labelVariant:"primary",toggleStyle:"switch"}},{label:"Icon",setting:{id:"iconSvg"},conditionDisplay:"iconVisible == true"},{type:"control",label:"Position",setting:{id:"iconAlign"},conditionDisplay:"iconVisible == true"},{type:"control",label:"Gap",setting:{id:"iconSpacing"},conditionDisplay:"iconVisible == true"}]},{controls:[{label:"Text",setting:{id:"enableTextStyle"},options:{labelVariant:"primary",toggleStyle:"switch"},controlChangeTrigger:{settings:[{condition:'enableTextStyle === true && label === ""',source:["enableTextStyle","label"],action:{controlId:"label",groupType:"setting",controlType:"setting",newValue:"<p>Button</p>"}}],options:{noRecordHistory:!0}}},{id:"typo",label:"Basic",setting:{id:"typo"},conditionDisplay:"enableTextStyle == true",options:{hideLabel:!0,fullWidth:!0,updateFields:[{field:"attrs.textAlign",settingId:"textAlign"},{field:"attrs.color",settingId:"textColor",state:"normal"}]},layout:"vertical",controlChangeTrigger:{settings:[{action:{controlId:"textAlign",valueFromField:"attrs.textAlign",groupType:"style",controlType:"style"}},{action:{controlId:"textColor",valueFromField:"attrs.color",groupType:"style",controlType:"style",removeDevice:!0,state:"normal"}}],options:{noRecordHistory:!0}}}]},{label:"Effect",conditionDisplay:'pageType != "POST_PURCHASE"',controls:[{label:"Hover",iconName:"polaris-check-hover",type:"combo",fixedValue:"Styled",setting:{id:"enableHoverEffect"},popoverLabel:"Hover",state:"hover",controls:[{type:"group",label:"Background",controls:[{label:"Color",setting:{id:"backgroundColorV2",state:"hover"}},{label:"Image",setting:{id:"backgroundImage",state:"hover"}}]},{type:"group",label:"Text",controls:[{label:"Text color",setting:{id:"textColor",state:"hover"}}]},{type:"group",label:"Shape",controls:[{label:"Border",setting:{id:"borderBtnV2",state:"hover"}},{label:"Corner",setting:{id:"roundedBtnV2",state:"hover"}},{label:"Shadow",setting:{id:"boxShadowBtn",state:"hover"},options:{updateFields:[{field:"hover.enable",settingId:"hasBoxShadowBtn",state:"hover"}]},controlChangeTrigger:{settings:[{condition:"boxShadowBtn.hover.enable === true",source:["boxShadowBtn","hasBoxShadowBtn"],action:{controlId:"hasBoxShadowBtn",groupType:"style",controlType:"style",state:"hover",newValue:!0}},{condition:"boxShadowBtn.hover.enable === false",source:["boxShadowBtn","hasBoxShadowBtn"],action:{controlId:"hasBoxShadowBtn",groupType:"style",controlType:"style",state:"hover",newValue:!1}}],options:{noRecordHistory:!0}}},{label:"Shadow",setting:{id:"hasBoxShadowBtn",state:"hover"},conditionDisplay:"false"}]}]}]},{controls:[{label:"Link",setting:{id:"enableBtnLink"},options:{labelVariant:"primary",toggleStyle:"switch"}},{layout:"vertical",controlConfig:{id:"linkedToPreSalesPageBanner",type:"banner",message:"Pre-sales page elements with link should redirect to the Sales page."},conditionDisplay:'pageType === "GP_PRE_SALE_PAGE" && enableBtnLink == true'},{type:"control",layout:"vertical",conditionDisplay:"enableBtnLink == true",setting:{id:"btnLink"}}]},{controls:[{label:"Align",conditionEnable:'!(globalSize.width === "default" || (parseInt(globalSize.width) >= 100 && globalSize.width?.includes("%")))',setting:{id:"align"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"}}]}];export{e as SettingUIV2};

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

@@ -1 +1 @@
-import{DEVICES as e,makeStyleResponsive as a,makeWidth as s,getResponsiveValueByScreen as t}from"@gem-sdk/core";import{convertUnitToNumber as k}from"../../helpers.js";let getInitialWidthForCarouselItem=t=>{let k={};return e.forEach(e=>{if(!t?.vertical?.[e]){let e={...a("minw",s(getWidthForCarouselItem({spacing:t?.spacing,slidesToShow:t?.slidesToShow,sneakPeak:t?.sneakPeak,sneakPeakType:t?.sneakPeakType,sneakPeakOffsetCenter:t?.sneakPeakOffsetCenter,sneakPeakOffsetForward:t?.sneakPeakOffsetForward}))),...a("maxw",s(getWidthForCarouselItem({spacing:t?.spacing,slidesToShow:t?.slidesToShow,sneakPeak:t?.sneakPeak,sneakPeakType:t?.sneakPeakType,sneakPeakOffsetCenter:t?.sneakPeakOffsetCenter,sneakPeakOffsetForward:t?.sneakPeakOffsetForward})))};k={...k,...e}}}),k},getSlideToShow=a=>{let s={};return e.forEach(e=>{let k=t(a.sneakPeak,e),o=k?"center"===t(a.sneakPeakType,e)?t(a.sneakPeakOffsetCenter,e)??0:t(a.sneakPeakOffsetForward,e)??0:0,r=t(a.slidesToShow,e)||1,n="center"===t(a.sneakPeakType,e)?-2:-1;s[e]="auto"===r?r:r+o/100*n}),s},getWidthForCarouselItem=a=>{let s={};return e.forEach(e=>{let o=k(t(a.spacing,e),44),r=t(a.sneakPeak,e,!1),n=k(t(r?getSlideToShow({slidesToShow:a?.slidesToShow,sneakPeak:a?.sneakPeak,sneakPeakType:a?.sneakPeakType,sneakPeakOffsetCenter:a?.sneakPeakOffsetCenter,sneakPeakOffsetForward:a?.sneakPeakOffsetForward}):a.slidesToShow,e),4);s={...s,[e]:`calc(100% / ${n} - ${(n-1)*o/n}px)`}}),s},DOT_CONTAINER_SELECTOR="gp-carousel-dot-container";export{DOT_CONTAINER_SELECTOR,getInitialWidthForCarouselItem,getSlideToShow,getWidthForCarouselItem};
+import{DEVICES as e,makeStyleResponsive as a,makeWidth as s,getResponsiveValueByScreen as k}from"@gem-sdk/core";import{convertUnitToNumber as n}from"../../helpers.js";let t=k=>{let n={};return e.forEach(e=>{if(!k?.vertical?.[e]){let e={...a("minw",s(o({spacing:k?.spacing,slidesToShow:k?.slidesToShow,sneakPeak:k?.sneakPeak,sneakPeakType:k?.sneakPeakType,sneakPeakOffsetCenter:k?.sneakPeakOffsetCenter,sneakPeakOffsetForward:k?.sneakPeakOffsetForward}))),...a("maxw",s(o({spacing:k?.spacing,slidesToShow:k?.slidesToShow,sneakPeak:k?.sneakPeak,sneakPeakType:k?.sneakPeakType,sneakPeakOffsetCenter:k?.sneakPeakOffsetCenter,sneakPeakOffsetForward:k?.sneakPeakOffsetForward})))};n={...n,...e}}}),n},r=a=>{let s={};return e.forEach(e=>{let n=k(a.sneakPeak,e),t=n?"center"===k(a.sneakPeakType,e)?k(a.sneakPeakOffsetCenter,e)??0:k(a.sneakPeakOffsetForward,e)??0:0,r=k(a.slidesToShow,e)||1,o="center"===k(a.sneakPeakType,e)?-2:-1;s[e]="auto"===r?r:r+t/100*o}),s},o=a=>{let s={};return e.forEach(e=>{let t=n(k(a.spacing,e),44),o=k(a.sneakPeak,e,!1),f=n(k(o?r({slidesToShow:a?.slidesToShow,sneakPeak:a?.sneakPeak,sneakPeakType:a?.sneakPeakType,sneakPeakOffsetCenter:a?.sneakPeakOffsetCenter,sneakPeakOffsetForward:a?.sneakPeakOffsetForward}):a.slidesToShow,e),4);s={...s,[e]:`calc(100% / ${f} - ${(f-1)*t/f}px)`}}),s},f="gp-carousel-dot-container";export{f as DOT_CONTAINER_SELECTOR,t as getInitialWidthForCarouselItem,r as getSlideToShow,o as getWidthForCarouselItem};

package/dist/esm/carousel/components/arrow/Arrow.js

@@ -1,5 +1,5 @@
 'use client';
-import{jsxs as t,jsx as e}from"react/jsx-runtime";import{getClass as r}from"./common/classes.js";import{getStyle as o}from"./common/styles.js";import{getData as s}from"./common/helpers.js";import{If as l}from"@gem-sdk/system";let Arrow=m=>{let{custom:a,left:n,onClick:i}=m,{isRenderCustomIcon:c}=s(m),{buttonClass:p,buttonContentClass:h}=r(m),{buttonStyle:u,buttonContentStyle:w,innerBorderCss:y}=o(m,"react"),d=l(c,a??"",`<svg
+import{jsxs as t,jsx as e}from"react/jsx-runtime";import{getClass as r}from"./common/classes.js";import{getStyle as s}from"./common/styles.js";import{getData as o}from"./common/helpers.js";import{If as l}from"@gem-sdk/system";let m=m=>{let{custom:a,left:n,onClick:i}=m,{isRenderCustomIcon:c}=o(m),{buttonClass:p,buttonContentClass:h}=r(m),{buttonStyle:u,buttonContentStyle:y,innerBorderCss:d}=s(m,"react"),g=l(c,a??"",`<svg
       height="100%"
       width="100%"
       xmlns="http://www.w3.org/2000/svg"
@@ -7,4 +7,4 @@ import{jsxs as t,jsx as e}from"react/jsx-runtime";import{getClass as r}from"./co
       fill="currentColor"
     >
       <path d="M5 3l3.057-3 11.943 12-11.943 12-3.057-3 9-9z" />
-    </svg>`),g=e("div",{className:h,style:w,dangerouslySetInnerHTML:{__html:d||""}});return t("button",{type:"button","aria-label":`Carousel ${n?"Back":"Next"} Arrow`,className:p,style:u,onClick:i,children:[e("style",{type:"text/css",dangerouslySetInnerHTML:{__html:y}}),g]})};export{Arrow as default};
+    </svg>`),w=e("div",{className:h,style:y,dangerouslySetInnerHTML:{__html:g||""}});return t("button",{type:"button","aria-label":`Carousel ${n?"Back":"Next"} Arrow`,className:p,style:u,onClick:i,children:[e("style",{type:"text/css",dangerouslySetInnerHTML:{__html:d}}),w]})};export{m as default};

package/dist/esm/carousel/components/arrow/Arrow.liquid.js

@@ -1,4 +1,4 @@
-import{template as t}from"@gem-sdk/core";import{getClass as o}from"./common/classes.js";import{getStyle as s}from"./common/styles.js";import{getData as r}from"./common/helpers.js";import{If as e}from"@gem-sdk/system";let Arrow=l=>{let{custom:m,left:i}=l,{isRenderCustomIcon:a}=r(l),{buttonClass:p,buttonContentClass:c}=o(l),{buttonStyle:n,buttonContentStyle:w,innerBorderCss:y}=s(l),$=e(a,m??"",`<svg
+import{template as t}from"@gem-sdk/core";import{getClass as s}from"./common/classes.js";import{getStyle as o}from"./common/styles.js";import{getData as e}from"./common/helpers.js";import{If as r}from"@gem-sdk/system";let l=l=>{let{custom:m,left:i}=l,{isRenderCustomIcon:a}=e(l),{buttonClass:p,buttonContentClass:c}=s(l),{buttonStyle:n,buttonContentStyle:w,innerBorderCss:y}=o(l),$=r(a,m??"",`<svg
       height="100%"
       width="100%"
       xmlns="http://www.w3.org/2000/svg"
@@ -23,4 +23,4 @@ import{template as t}from"@gem-sdk/core";import{getClass as o}from"./common/clas
       <style type="text/css">${y}</style>
       ${d}
     </button>
-  `};export{Arrow as default};
+  `};export{l as default};

package/dist/esm/carousel/components/arrow/common/classes.js

@@ -1 +1 @@
-import{createClass as e}from"@gem-sdk/system";import{getClassArrowDisplay as r,getClassArrowRotate as g,getResponsiveSetting as s}from"./helpers.js";let getClass=p=>{let{className:t,componentId:i,rootId:l,left:o,uid:n,isHiddenWhenDisabled:u,disabled:a,showWhenHover:c,showArrow:m,vertical:f}=p,v="gp-carousel-arrow-"+n,d=s(m||{}),x=o?"gp-carousel-action-back gem-slider-previous":"gp-carousel-action-next gem-slider-next",h=e({"gp-z-1 gp-items-center gp-justify-center gp-overflow-hidden gp-shrink-0":!0,[v]:!0,...t&&{[t]:!0},...i&&{[i]:!0},...l&&{[l]:!0},...x&&{[x]:!0},...{"gp-invisible":u&&a,"gp-cursor-default gp-text-gray-300":a,"gp-cursor-pointer gp-text-gray-500":!a,"!gp-invisible group-hover/carousel:!gp-visible":c,...r(d)}}),y=e({"gp-flex gp-items-center gp-justify-center [&>svg]:gp-h-full [&>svg]:gp-w-full":!0,...g(!!o,f)});return{buttonClass:h,buttonContentClass:y}};export{getClass};
+import{createClass as e}from"@gem-sdk/system";import{getClassArrowDisplay as r,getClassArrowRotate as g,getResponsiveSetting as p}from"./helpers.js";let s=s=>{let{className:t,componentId:i,rootId:l,left:o,uid:n,isHiddenWhenDisabled:u,disabled:c,showWhenHover:a,showArrow:m,vertical:f}=s,v=p(m||{}),d=o?"gp-carousel-action-back gem-slider-previous":"gp-carousel-action-next gem-slider-next",x=e({"gp-z-1 gp-items-center gp-justify-center gp-overflow-hidden gp-shrink-0":!0,["gp-carousel-arrow-"+n]:!0,...t&&{[t]:!0},...i&&{[i]:!0},...l&&{[l]:!0},[d]:!0,...{"gp-invisible":u&&c,"gp-cursor-default gp-text-gray-300":c,"gp-cursor-pointer gp-text-gray-500":!c,"!gp-invisible group-hover/carousel:!gp-visible":a,...r(v)}}),h=e({"gp-flex gp-items-center gp-justify-center [&>svg]:gp-h-full [&>svg]:gp-w-full":!0,...g(!!o,f)});return{buttonClass:x,buttonContentClass:h}};export{s as getClass};

package/dist/esm/carousel/components/arrow/common/helpers.js

@@ -1 +1 @@
-import{DEVICES as t,getResponsiveValueByScreen as e}from"@gem-sdk/core";let getResponsiveSetting=t=>{let e=t.desktop,l=t.tablet?t.tablet:e,i=t.mobile?t.mobile:l;return{desktop:e,tablet:l,mobile:i}},getArrowPositionStyle=({vertical:l,arrowType:i,gapToEachSize:o,left:a})=>{let r={};return t.forEach(t=>{let p=e(l,t,!1),g="desktop"===t?"":`-${t}`;p?(r[`top${g}`]="inside"===i[t]&&a?o+"px":"initial",r[`left${g}`]=a?"initial":"",r[`bottom${g}`]="inside"!==i[t]||a?"initial":o+"px",r[`right${g}`]=a?"":"initial"):(a?(r[`left${g}`]="inside"===i[t]?o+"px":"3px",r[`right${g}`]="initial"):(r[`right${g}`]="inside"===i[t]?o+"px":"3px",r[`left${g}`]="initial"),r[`top${g}`]=a?"initial":"",r[`bottom${g}`]=a?"":"initial")}),r},getClassArrowRotate=(l,i)=>{let o={},a={vertical:{left:{desktop:"gp-rotate-[-90deg]",tablet:"tablet:gp-rotate-[-90deg]",mobile:"mobile:gp-rotate-[-90deg]"},right:{desktop:"gp-rotate-90",tablet:"tablet:gp-rotate-90",mobile:"mobile:gp-rotate-90"}},horizontal:{left:{desktop:"gp-rotate-180",tablet:"tablet:gp-rotate-180",mobile:"mobile:gp-rotate-180"},right:{desktop:"gp-rotate-0",tablet:"tablet:gp-rotate-0",mobile:"mobile:gp-rotate-0"}}};return t.forEach(t=>{let r=e(i,t,!1),p=r?"vertical":"horizontal",g=l?"left":"right",n=a[p][g][t];o[n]=!0}),o},getClassArrowDisplay=e=>{let l={inside:{desktop:"!gp-flex !gp-absolute gp-z-2",tablet:"tablet:!gp-flex tablet:!gp-absolute tablet:gp-z-2",mobile:"mobile:!gp-flex mobile:!gp-absolute mobile:gp-z-2"},outside:{desktop:"!gp-flex !gp-relative",tablet:"tablet:!gp-flex tablet:!gp-relative",mobile:"mobile:!gp-flex mobile:!gp-relative"},none:{desktop:"!gp-hidden",tablet:"tablet:!gp-hidden",mobile:"mobile:!gp-hidden"}},i={};return t.forEach(t=>{let o=e?.[t];o&&l[o]||(o="none");let a=l[o][t];i[a]=!0}),i},getArrowDisplayStyle=l=>{let i={};return t.forEach(t=>{let o=e(l,t,"none");i={...i,[t]:"none"===o?"none":"flex"}}),i},mappingNavigationCarousel=e=>{let l=e=>{let l={...e},i=t.filter(t=>!Object.keys(l).includes(t));return i.forEach(t=>{"tablet"===t&&(l[t]=l.desktop),"mobile"===t&&(l[t]=l.tablet)}),l};if(e?.layout==="vertical"){let{controlOverContent:i,arrow:o}=e,a=l(o),r=l(i),p={};return t.forEach(t=>{a[t]?a[t]&&r[t]?p[t]="inside":p[t]="outside":p[t]="none"}),{...e,navigationStyle:p}}return e},getData=t=>{let e=!!t.custom&&""!==t.custom;return{isRenderCustomIcon:e}};export{getArrowDisplayStyle,getArrowPositionStyle,getClassArrowDisplay,getClassArrowRotate,getData,getResponsiveSetting,mappingNavigationCarousel};
+import{DEVICES as t,getResponsiveValueByScreen as e}from"@gem-sdk/core";let l=t=>{let e=t.desktop,l=t.tablet?t.tablet:e,i=t.mobile?t.mobile:l;return{desktop:e,tablet:l,mobile:i}},i=({vertical:l,arrowType:i,gapToEachSize:o,left:a})=>{let r={};return t.forEach(t=>{let p=e(l,t,!1),g="desktop"===t?"":`-${t}`;p?(r[`top${g}`]="inside"===i[t]&&a?o+"px":"initial",r[`left${g}`]=a?"initial":"",r[`bottom${g}`]="inside"!==i[t]||a?"initial":o+"px",r[`right${g}`]=a?"":"initial"):(a?(r[`left${g}`]="inside"===i[t]?o+"px":"3px",r[`right${g}`]="initial"):(r[`right${g}`]="inside"===i[t]?o+"px":"3px",r[`left${g}`]="initial"),r[`top${g}`]=a?"initial":"",r[`bottom${g}`]=a?"":"initial")}),r},o=(l,i)=>{let o={},a={vertical:{left:{desktop:"gp-rotate-[-90deg]",tablet:"tablet:gp-rotate-[-90deg]",mobile:"mobile:gp-rotate-[-90deg]"},right:{desktop:"gp-rotate-90",tablet:"tablet:gp-rotate-90",mobile:"mobile:gp-rotate-90"}},horizontal:{left:{desktop:"gp-rotate-180",tablet:"tablet:gp-rotate-180",mobile:"mobile:gp-rotate-180"},right:{desktop:"gp-rotate-0",tablet:"tablet:gp-rotate-0",mobile:"mobile:gp-rotate-0"}}};return t.forEach(t=>{let r=e(i,t,!1),p=a[r?"vertical":"horizontal"][l?"left":"right"][t];o[p]=!0}),o},a=e=>{let l={inside:{desktop:"!gp-flex !gp-absolute gp-z-2",tablet:"tablet:!gp-flex tablet:!gp-absolute tablet:gp-z-2",mobile:"mobile:!gp-flex mobile:!gp-absolute mobile:gp-z-2"},outside:{desktop:"!gp-flex !gp-relative",tablet:"tablet:!gp-flex tablet:!gp-relative",mobile:"mobile:!gp-flex mobile:!gp-relative"},none:{desktop:"!gp-hidden",tablet:"tablet:!gp-hidden",mobile:"mobile:!gp-hidden"}},i={};return t.forEach(t=>{let o=e?.[t];o&&l[o]||(o="none");let a=l[o][t];i[a]=!0}),i},r=l=>{let i={};return t.forEach(t=>{let o=e(l,t,"none");i={...i,[t]:"none"===o?"none":"flex"}}),i},p=e=>{let l=e=>{let l={...e},i=t.filter(t=>!Object.keys(l).includes(t));return i.forEach(t=>{"tablet"===t&&(l[t]=l.desktop),"mobile"===t&&(l[t]=l.tablet)}),l};if(e?.layout==="vertical"){let{controlOverContent:i,arrow:o}=e,a=l(o),r=l(i),p={};return t.forEach(t=>{a[t]?a[t]&&r[t]?p[t]="inside":p[t]="outside":p[t]="none"}),{...e,navigationStyle:p}}return e},g=t=>{let e=!!t.custom&&""!==t.custom;return{isRenderCustomIcon:e}};export{r as getArrowDisplayStyle,i as getArrowPositionStyle,a as getClassArrowDisplay,o as getClassArrowRotate,g as getData,l as getResponsiveSetting,p as mappingNavigationCarousel};

package/dist/esm/carousel/components/arrow/common/styles.js

@@ -1,8 +1,8 @@
-import{createStyleReact as e,createStyle as o}from"@gem-sdk/system";import{makeStyle as r,getSingleColorVariable as t,getResponsiveStyleShadowWithoutState as a,getPaddingGlobalSize as l,makeGlobalSizeWidthResponsive as p,makeGlobalSizeHeightResponsive as i,makeStyleResponsive as s,composeCornerCss as $,composeBorderCss as d}from"@gem-sdk/core";import{getArrowDisplayStyle as m,getArrowPositionStyle as n,getResponsiveSetting as c}from"./helpers.js";let getStyle=(g,b="liquid")=>{let{uid:w,vertical:h,showArrow:x,gapToEachSize:u,left:f,arrowBackgroundColor:k,arrowButtonSize:y,rootId:S,arrowBorder:z,arrowCorner:j,arrowCustomColor:q,arrowIconSize:v,arrowShadow:E}=g,T=r({bg:t(k)}),A=r({c:t(q)}),B=a(E,"box-shadow",E),C=c(z||{}),D=c(j||{}),F=l(y),G=c(v||{}),H=c(x||{}),I=p(y),J=i(y),K=s("w",G,"px"),L=s("h",G,"px"),M=s("d",m(H)),N=r(n({vertical:h,arrowType:H,gapToEachSize:u??"",left:!!f})),O={...T,...M,...N,...I,...J,...F,...B},P={...A,...K,...L},Q="react"===b?e(O):o(O),R="react"===b?e(P):o(P),U=`
-      ${S?"."+S:""}.gp-carousel-arrow-${w} {
+import{createStyleReact as e,createStyle as o}from"@gem-sdk/system";import{makeStyle as r,getSingleColorVariable as t,getResponsiveStyleShadowWithoutState as a,getPaddingGlobalSize as p,makeGlobalSizeWidthResponsive as i,makeGlobalSizeHeightResponsive as l,makeStyleResponsive as s,composeCornerCss as $,composeBorderCss as d}from"@gem-sdk/core";import{getArrowDisplayStyle as m,getArrowPositionStyle as n,getResponsiveSetting as c}from"./helpers.js";let b=(b,g="liquid")=>{let{uid:w,vertical:h,showArrow:x,gapToEachSize:u,left:f,arrowBackgroundColor:k,arrowButtonSize:y,rootId:z,arrowBorder:S,arrowCorner:j,arrowCustomColor:q,arrowIconSize:v,arrowShadow:E}=b,T=r({bg:t(k)}),A=r({c:t(q)}),B=a(E,"box-shadow",E),C=c(S||{}),D=c(j||{}),F=p(y),G=c(v||{}),H=c(x||{}),I=i(y),J=l(y),K=s("w",G,"px"),L=s("h",G,"px"),M=s("d",m(H)),N=r(n({vertical:h,arrowType:H,gapToEachSize:u??"",left:!!f})),O={...T,...M,...N,...I,...J,...F,...B},P={...A,...K,...L},Q="react"===g?e(O):o(O),R="react"===g?e(P):o(P),U=`
+      ${z?"."+z:""}.gp-carousel-arrow-${w} {
         ${$(D.desktop)}
       }
-      ${S?"."+S:""}.gp-carousel-arrow-${w}::before {
+      ${z?"."+z:""}.gp-carousel-arrow-${w}::before {
         content: '';
         height: 100%;
         width: 100%;
@@ -13,21 +13,21 @@ import{createStyleReact as e,createStyle as o}from"@gem-sdk/system";import{makeS
         ${$(D.desktop)}
       }
       @media only screen and (max-width: 1024px) and (min-width: 768px) {
-        ${S?"."+S:""}.gp-carousel-arrow-${w} {
+        ${z?"."+z:""}.gp-carousel-arrow-${w} {
           ${$(D.tablet)}
         }
-        ${S?"."+S:""}.gp-carousel-arrow-${w}::before {
+        ${z?"."+z:""}.gp-carousel-arrow-${w}::before {
           ${d(C.tablet)}
           ${$(D.tablet)}
         }
       }
       @media only screen and (max-width: 768px) {
-        ${S?"."+S:""}.gp-carousel-arrow-${w} {
+        ${z?"."+z:""}.gp-carousel-arrow-${w} {
           ${$(D.mobile)}
         }
-        ${S?"."+S:""}.gp-carousel-arrow-${w}::before {
+        ${z?"."+z:""}.gp-carousel-arrow-${w}::before {
           ${d(C.mobile)}
           ${$(D.mobile)}
         }
       }
-    `;return{buttonStyle:Q,buttonContentStyle:R,innerBorderCss:U}};export{getStyle};
+    `;return{buttonStyle:Q,buttonContentStyle:R,innerBorderCss:U}};export{b as getStyle};

package/dist/esm/carousel/components/dot/Dots.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as e,Fragment as o}from"react/jsx-runtime";import{makeStyleResponsive as t,getGlobalColorResponsiveStyle as r,cls as s}from"@gem-sdk/core";import{getData as m}from"./common/helpers.js";import{getDotClass as l}from"./common/classes.js";import{getDotStyle as i}from"./common/styles.js";import{useDotsSetting as a}from"../../hooks/useDotsSetting.js";import{If as c}from"@gem-sdk/system";let Dots=p=>{let{onHandleClick:d,dotSize:n,dotActiveColor:g,dotColor:f}=p,{isLoop:u,checkIsActive:h}=a(p),{checkHidden:j,getDotItems:b}=m(p),k=b(u),{dotClass:y}=l(p),{dotStyle:D}=i(p,"react"),v=()=>e(o,{children:k?.map(o=>{let m=h(o);return e("button",{"aria-label":"Dot",onClick:()=>{d&&d(o,u)},style:{...t("w",n,"px"),...m?r("bg",g):r("bg",f)},className:s("gp-aspect-square gp-w-3 gp-rounded-full gp-shadow-md",{"gem-slider-dot-active":m,"gem-slider-dot-inactive":!m})},o)})});return e(o,{children:c(!j(k),e("div",{className:y,style:D,children:v()}))})};export{Dots as default};
+import{jsx as e,Fragment as o}from"react/jsx-runtime";import{cls as t,getGlobalColorResponsiveStyle as r,makeStyleResponsive as s}from"@gem-sdk/core";import{getData as m}from"./common/helpers.js";import{getDotClass as l}from"./common/classes.js";import{getDotStyle as i}from"./common/styles.js";import{useDotsSetting as a}from"../../hooks/useDotsSetting.js";import{If as c}from"@gem-sdk/system";let p=p=>{let{onHandleClick:d,dotSize:n,dotActiveColor:g,dotColor:f}=p,{isLoop:u,checkIsActive:h}=a(p),{checkHidden:j,getDotItems:b}=m(p),k=b(u),{dotClass:y}=l(p),{dotStyle:v}=i(p,"react");return e(o,{children:c(!j(k),e("div",{className:y,style:v,children:e(o,{children:k?.map(o=>{let m=h(o);return e("button",{"aria-label":"Dot",onClick:()=>{d&&d(o,u)},style:{...s("w",n,"px"),...m?r("bg",g):r("bg",f)},className:t("gp-aspect-square gp-w-3 gp-rounded-full gp-shadow-md",{"gem-slider-dot-active":m,"gem-slider-dot-inactive":!m})},o)})})}))})};export{p as default};

package/dist/esm/carousel/components/dot/Dots.liquid.js

@@ -1,7 +1,7 @@
-import{getResponsiveValueByScreen as o,template as s}from"@gem-sdk/core";import{getDotClass as m}from"./common/classes.js";import{getDotStyle as e}from"./common/styles.js";import{If as r}from"@gem-sdk/system";import{getData as t}from"./common/helpers.js";let Dots=l=>{let p=o(l.loop,"desktop",!1),{checkHidden:i,getDotItems:d}=t(l),c=d(p),{dotClass:f}=m(l),{dotStyle:n}=e(l);return s`
-    ${r(!i(c),s`
+import{getResponsiveValueByScreen as o,template as m}from"@gem-sdk/core";import{getDotClass as s}from"./common/classes.js";import{getDotStyle as e}from"./common/styles.js";import{If as r}from"@gem-sdk/system";import{getData as t}from"./common/helpers.js";let l=l=>{let p=o(l.loop,"desktop",!1),{checkHidden:i,getDotItems:d}=t(l),c=d(p),{dotClass:f}=s(l),{dotStyle:n}=e(l);return m`
+    ${r(!i(c),m`
         <div class="${f}" style="${n}">
           <!-- item render by js -->
         </div>
       `)}
-  `};export{Dots as default};
+  `};export{l as default};

package/dist/esm/carousel/components/dot/common/classes.js

@@ -1 +1 @@
-import{DEVICES as t,getResponsiveValueByScreen as e}from"@gem-sdk/core";import{createClass as l}from"@gem-sdk/system";import{DOT_CONTAINER_SELECTOR as o}from"../../../common/helpers.js";let getDotClass=p=>{let{dotStyle:g,vertical:i,className:b,uniqueComponentId:m}=p,a=()=>{let l={},o={inside:{desktop:"gp-absolute",tablet:"tablet:gp-absolute",mobile:"mobile:gp-absolute"},outside:{desktop:"gp-static",tablet:"tablet:gp-static",mobile:"mobile:gp-static"}},p={vertical:{desktop:"gp-flex-col gp-ml-2 gp-w-fit gp-h-full",tablet:"tablet:gp-flex-col tablet:gp-ml-2 tablet:gp-w-fit tablet:gp-h-full",mobile:"mobile:gp-flex-col mobile:gp-ml-2 mobile:gp-w-fit mobile:gp-h-full"},horizontal:{desktop:"gp-flex-row gp-left-0 gp-right-0",tablet:"tablet:gp-flex-row tablet:gp-left-0 tablet:gp-right-0",mobile:"mobile:gp-flex-row mobile:gp-left-0 mobile:gp-right-0"}};return t.forEach(t=>{let b=e(g,t),m=e(i,t),a="inside"===b?"inside":"outside",r=m?"vertical":"horizontal",s=o[a][t],f=p[r][t];l[s]=!0,l[f]=!0}),l},r=l({[`${o} ${o}-${m}`]:!0,"gp-z-2 gp-flex gp-flex-1 gp-items-center gp-justify-center gp-gap-2 gp-text-center":!0,...b&&{[b]:!0},...a()});return{dotClass:r}};export{getDotClass};
+import{DEVICES as t,getResponsiveValueByScreen as e}from"@gem-sdk/core";import{createClass as l}from"@gem-sdk/system";import{DOT_CONTAINER_SELECTOR as o}from"../../../common/helpers.js";let p=p=>{let{dotStyle:g,vertical:i,className:b,uniqueComponentId:m}=p,r=l({[`${o} ${o}-${m}`]:!0,"gp-z-2 gp-flex gp-flex-1 gp-items-center gp-justify-center gp-gap-2 gp-text-center":!0,...b&&{[b]:!0},...(()=>{let l={},o={inside:{desktop:"gp-absolute",tablet:"tablet:gp-absolute",mobile:"mobile:gp-absolute"},outside:{desktop:"gp-static",tablet:"tablet:gp-static",mobile:"mobile:gp-static"}},p={vertical:{desktop:"gp-flex-col gp-ml-2 gp-w-fit gp-h-full",tablet:"tablet:gp-flex-col tablet:gp-ml-2 tablet:gp-w-fit tablet:gp-h-full",mobile:"mobile:gp-flex-col mobile:gp-ml-2 mobile:gp-w-fit mobile:gp-h-full"},horizontal:{desktop:"gp-flex-row gp-left-0 gp-right-0",tablet:"tablet:gp-flex-row tablet:gp-left-0 tablet:gp-right-0",mobile:"mobile:gp-flex-row mobile:gp-left-0 mobile:gp-right-0"}};return t.forEach(t=>{let b=e(g,t),m=e(i,t),r=o["inside"===b?"inside":"outside"][t],a=p[m?"vertical":"horizontal"][t];l[r]=!0,l[a]=!0}),l})()});return{dotClass:r}};export{p as getDotClass};

package/dist/esm/carousel/components/dot/common/helpers.js

@@ -1 +1 @@
-import{DEVICES as t,getResponsiveValueByScreen as e}from"@gem-sdk/core";let getData=t=>{let{hiddenWhenOnlyOne:e}=t,r=e=>{let{enabledSneakPeak:r,totalSlideItem:l=0,numberOfFullWidthShow:a=0,slideItemsPerPage:o=0}=t;return r?Array.from({length:e?l:l-a+1},(t,e)=>e):Array.from({length:e?l:Math.ceil(l/o)},(t,e)=>e)},l=t=>e&&t?.length<2;return{checkHidden:l,getDotItems:r}},getUpdatedDotStyle=(r,l)=>{let a={};return t.forEach(t=>{let o=e(r,t),g=e(l,t);a={...a,[t]:o?g:"none"}}),a};export{getData,getUpdatedDotStyle};
+import{DEVICES as e,getResponsiveValueByScreen as t}from"@gem-sdk/core";let r=e=>{let{hiddenWhenOnlyOne:t}=e;return{checkHidden:e=>t&&e?.length<2,getDotItems:t=>{let{enabledSneakPeak:r,totalSlideItem:l=0,numberOfFullWidthShow:o=0,slideItemsPerPage:n=0}=e;return r?Array.from({length:t?l:l-o+1},(e,t)=>t):Array.from({length:t?l:Math.ceil(l/n)},(e,t)=>t)}}},l=(r,l)=>{let o={};return e.forEach(e=>{let n=t(r,e),a=t(l,e);o={...o,[e]:n?a:"none"}}),o};export{r as getData,l as getUpdatedDotStyle};

package/dist/esm/carousel/components/dot/common/styles.js

@@ -1 +1 @@
-import{createStyleReact as e,createStyle as t}from"@gem-sdk/system";import{makeDotGapToCarouselStyle as o,DEVICES as r,getResponsiveValueByScreen as l}from"@gem-sdk/core";let getDotStyle=(m,n)=>{let{dotStyle:d,dotGapToCarousel:g,vertical:s,showDots:f}=m,p="react"===n,y=()=>{let e={};return r.forEach(t=>{let o=l(d,t),r=l(f,t),m="desktop"===t?"":`${t}`;e[`--d${0===m.length?"":"-"+m}`]=o&&"none"!==o&&r?"flex":"none"}),e},c={...o(d,g,s),...y()},k=p?e(c):t(c);return{dotStyle:k}};export{getDotStyle};
+import{createStyleReact as e,createStyle as t}from"@gem-sdk/system";import{makeDotGapToCarouselStyle as o,DEVICES as r,getResponsiveValueByScreen as l}from"@gem-sdk/core";let m=(m,n)=>{let{dotStyle:d,dotGapToCarousel:s,vertical:f,showDots:g}=m,p={...o(d,s,f),...(()=>{let e={};return r.forEach(t=>{let o=l(d,t),r=l(g,t),m="desktop"===t?"":`${t}`;e[`--d${0===m.length?"":"-"+m}`]=o&&"none"!==o&&r?"flex":"none"}),e})()},c="react"===n?e(p):t(p);return{dotStyle:c}};export{m as getDotStyle};

package/dist/esm/carousel/components/item/CarouselItem.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as e}from"react/jsx-runtime";import{isEmptyChildren as o}from"@gem-sdk/core";import{getStyle as r}from"./common/styles.js";import{getClass as s}from"./common/classes.js";import{useCarouselItem as m}from"../../hooks/useCarouseItem.js";import t from"../../../grid/components/ChildrenDroppable.js";let CarouselItem=i=>{let{children:l,builderAttrs:a}=i,{handleClick:n,handleMouseMove:c,handleMouseOut:d}=m(i),{carouselItemStyle:p,carouselItemInnerStyle:u}=r(i),{carouselItemClass:f,carouselItemInnerClass:h}=s(i);return e("div",{...a,"aria-hidden":!0,className:f,style:p,onClick:n,onMouseMove:c,onMouseLeave:d,children:e("div",{className:h,style:u,children:o(l)?e(t,{}):l})})};export{CarouselItem as default};
+import{jsx as e}from"react/jsx-runtime";import{isEmptyChildren as o}from"@gem-sdk/core";import{getStyle as r}from"./common/styles.js";import{getClass as s}from"./common/classes.js";import{useCarouselItem as m}from"../../hooks/useCarouseItem.js";import t from"../../../grid/components/ChildrenDroppable.js";let i=i=>{let{children:l,builderAttrs:a}=i,{handleClick:n,handleMouseMove:c,handleMouseOut:d}=m(i),{carouselItemStyle:p,carouselItemInnerStyle:u}=r(i),{carouselItemClass:f,carouselItemInnerClass:h}=s(i);return e("div",{...a,"aria-hidden":!0,className:f,style:p,onClick:n,onMouseMove:c,onMouseLeave:d,children:e("div",{className:h,style:u,children:o(l)?e(t,{}):l})})};export{i as default};

package/dist/esm/carousel/components/item/CarouselItem.liquid.js

@@ -1,6 +1,6 @@
-import{template as e}from"@gem-sdk/core";import{getStyle as r}from"./common/styles.js";import{getClass as i}from"./common/classes.js";let CarouselItem=s=>{let{builderAttrs:d,index:m,children:a,id:o}=s,{carouselItemStyle:t,carouselItemInnerStyle:l}=r(s),{carouselItemClass:c,carouselItemInnerClass:u}=i(s);return e`
+import{template as e}from"@gem-sdk/core";import{getStyle as i}from"./common/styles.js";import{getClass as r}from"./common/classes.js";let d=d=>{let{builderAttrs:s,index:m,children:a,id:o}=d,{carouselItemStyle:t,carouselItemInnerStyle:l}=i(d),{carouselItemClass:c,carouselItemInnerClass:u}=r(d);return e`
     <div
-      ${{...d}}
+      ${{...s}}
       id="${o}"
       class="${c}"
       style="${t}"
@@ -19,4 +19,4 @@ import{template as e}from"@gem-sdk/core";import{getStyle as r}from"./common/styl
       ${a}
       </div>
     </div>
-  `};export{CarouselItem as default};
+  `};export{d as default};

package/dist/esm/carousel/components/item/common/classes.js

@@ -1 +1 @@
-import{createClass as e}from"@gem-sdk/system";let getClass=l=>{let{parentId:t,parentUid:g,builderProps:i,className:m}=l,s=e({"gem-slider-item gp-w-full":!0,[`gem-slider-item-${t||g}`]:!0,...g&&{[`gp-child-item-${g}`]:!0},...i?.uid&&{[i?.uid]:!0},...m&&{[m]:!0}}),r=e({"gp-w-full gp-h-full":!0});return{carouselItemClass:s,carouselItemInnerClass:r}};export{getClass};
+import{createClass as e}from"@gem-sdk/system";let l=l=>{let{parentId:t,parentUid:i,builderProps:m,className:g}=l,r=e({"gem-slider-item gp-w-full":!0,[`gem-slider-item-${t||i}`]:!0,...i&&{[`gp-child-item-${i}`]:!0},...m?.uid&&{[m?.uid]:!0},...g&&{[g]:!0}}),s=e({"gp-w-full gp-h-full":!0});return{carouselItemClass:r,carouselItemInnerClass:s}};export{l as getClass};

package/dist/esm/carousel/components/item/common/styles.js

@@ -1 +1 @@
-import{makeGlobalSize as e,getStyleBackgroundByDevice as t,getGradientBgrStyleByDevice as o,getStyleShadow as r,makeStyle as a,getSingleColorVariable as s,getRadiusStyleActiveState as n}from"@gem-sdk/core";import{createStyle as d}from"@gem-sdk/system";import{getInitialWidthForCarouselItem as i}from"../../../common/helpers.js";let getStyle=k=>{let{style:l,contentType:m,parentStyle:p,parentSettings:c,background:b,customStyle:f}=k,u=e(p?.itemPadding),h=()=>{let e=["--radius"];return(e.forEach(e=>{delete l?.[e]}),"productImage"===m)?l:{...l,...a({bs:p?.borderContent?.border,bw:p?.borderContent?.width,bc:s(p?.borderContent?.color)}),...n({...p?.roundedContent,active:{...p?.roundedContent||{},radiusType:"custom"}})}},w={...f,...u&&u.padding,...i({spacing:p?.spacing,slidesToShow:c?.itemNumber??c?.slidesToShow,sneakPeak:c?.sneakPeak,sneakPeakType:c?.sneakPeakType,sneakPeakOffsetCenter:c?.sneakPeakOffsetCenter,sneakPeakOffsetForward:c?.sneakPeakOffsetForward,vertical:c?.vertical}),...t(b),...o(b,{desktop:!0,tablet:!0,mobile:!0})},g=d({...r({value:p?.carouselShadow,styleAppliedFor:"box-shadow",isEnableShadow:p?.hasActiveShadow})}),P=d({...w,...h()});return{carouselItemStyle:P,carouselItemInnerStyle:g}};export{getStyle};
+import{makeGlobalSize as e,getGradientBgrStyleByDevice as o,getStyleBackgroundByDevice as t,getStyleShadow as a,getRadiusStyleActiveState as r,makeStyle as s,getSingleColorVariable as d}from"@gem-sdk/core";import{createStyle as n}from"@gem-sdk/system";import{getInitialWidthForCarouselItem as i}from"../../../common/helpers.js";let k=k=>{let{style:l,contentType:m,parentStyle:p,parentSettings:c,background:b,customStyle:f}=k,h=e(p?.itemPadding),u={...f,...h&&h.padding,...i({spacing:p?.spacing,slidesToShow:c?.itemNumber??c?.slidesToShow,sneakPeak:c?.sneakPeak,sneakPeakType:c?.sneakPeakType,sneakPeakOffsetCenter:c?.sneakPeakOffsetCenter,sneakPeakOffsetForward:c?.sneakPeakOffsetForward,vertical:c?.vertical}),...t(b),...o(b,{desktop:!0,tablet:!0,mobile:!0})},w=n({...a({value:p?.carouselShadow,styleAppliedFor:"box-shadow",isEnableShadow:p?.hasActiveShadow})}),P=n({...u,...(["--radius"].forEach(e=>{delete l?.[e]}),"productImage"===m)?l:{...l,...s({bs:p?.borderContent?.border,bw:p?.borderContent?.width,bc:d(p?.borderContent?.color)}),...r({...p?.roundedContent,active:{...p?.roundedContent||{},radiusType:"custom"}})}});return{carouselItemStyle:P,carouselItemInnerStyle:w}};export{k as getStyle};

package/dist/esm/carousel/components/root/Carousel.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as o,jsxs as e,Fragment as r}from"react/jsx-runtime";import{useCurrentDevice as t,filterToolbarPreview as a,isEmptyChildren as s}from"@gem-sdk/core";import{forwardRef as l,Children as i,isValidElement as d}from"react";import n from"../dot/Dots.js";import m from"../arrow/Arrow.js";import{mappingNavigationCarousel as c}from"../arrow/common/helpers.js";import{useCarousel as p}from"../../hooks/useCarousel.js";import{getClass as u}from"./common/classes.js";import{getStyle as h}from"./common/styles.js";import{getAttr as f}from"./common/attrs.js";import{getData as k}from"./common/helpers.js";let Carousel=l((l,w)=>{let{children:C,builderAttrs:S,builderProps:v,styles:y,isHiddenArrowWhenDisabled:g=!0,hiddenDotWhenOnlyOne:j,elmRef:b}=l,P=c(l.setting),x={...l,setting:P},{arrowButtonSize:z,arrowBackgroundColor:N,arrowGapToEachSide:T="16",roundedArrow:A,arrowIconSize:I,arrowCustomColor:W,arrowBorder:B,arrowShadow:D,showWhenHover:H}=P??{},{totalSlideItem:O,isInfinity:E,slider:G,currentSlide:F,localRef:U,showNavigation:q,isRenderDots:J,slideMaxIndex:K,handleDotClick:L,getItemsPerPage:M,sliderRef:Q,handleNextAndPrevSlide:R,dispatchEventSelectSlide:V,getNumberOfFullWidthShow:X}=p(x,w),{loopConfig:Y,arrowShowConfig:Z}=k(x),{rootClassRender:$,wrapperClassRender:_,wrapperInnerClass:oo,sliderClass:oe}=u(x),{rootStyleRender:or,wrapperStyleRender:ot,wrapperInnerStyle:oa}=h(x),{rootAttrRender:os,sliderAttr:ol}=f(x),oi=t(),od=P?.sneakPeak?.[oi],on=e=>{let r="next"===e,t=r?!E&&G?.track?.details?.abs===K:!E&&G?.track?.details?.abs===0;return o(m,{uid:v?.uid,custom:P?.arrowCustom??"",showArrow:Z,arrowButtonSize:z||{},arrowIconSize:I||{},arrowBackgroundColor:N||"",arrowCustomColor:W,gapToEachSize:T,showWhenHover:H,arrowBorder:B||{},arrowCorner:A||{},arrowShadow:D||{},onClick:o=>{o.stopPropagation(),R(e)},left:!r,disabled:t,vertical:P?.vertical,isHiddenWhenDisabled:g,rootId:l?.parentClass})},om=()=>o(r,{children:s(C)?o("div",{children:"No Slider"}):i.map(a(C),(e,r)=>d(e)?o(e.type,{...e.props,index:r,parentSettings:P,parentStyle:y,background:P?.background,parentUid:v?.uid,dispatchEventSelectSlide:V}):null)});return o("div",{ref:b,...os,className:$,style:or,children:e("div",{ref:U,...S,className:_,style:ot,children:[e("div",{className:oo,style:oa,children:[q&&on("prev"),o("div",{ref:Q,...ol,className:oe,children:om()}),q&&on("next")]}),J&&o(n,{showDots:P?.dot,dotStyle:P?.dotStyle,totalSlideItem:O,slideItemsPerPage:M(),currentSlide:F,enabledSneakPeak:od,vertical:P?.vertical,loop:Y,dotColor:P?.dotColor,dotGapToCarousel:P?.dotGapToCarousel,dotSize:P?.dotSize,dotActiveColor:P?.dotActiveColor,hiddenWhenOnlyOne:j,sneakPeakType:P?.sneakPeakType,numberOfFullWidthShow:X(oi),onHandleClick:L}),a(C,!0)]})})});export{Carousel as default};
+import{jsx as o,jsxs as e,Fragment as r}from"react/jsx-runtime";import{useCurrentDevice as t,filterToolbarPreview as a,isEmptyChildren as s}from"@gem-sdk/core";import{forwardRef as l,Children as i,isValidElement as d}from"react";import n from"../dot/Dots.js";import m from"../arrow/Arrow.js";import{mappingNavigationCarousel as c}from"../arrow/common/helpers.js";import{useCarousel as p}from"../../hooks/useCarousel.js";import{getClass as u}from"./common/classes.js";import{getStyle as h}from"./common/styles.js";import{getAttr as f}from"./common/attrs.js";import{getData as k}from"./common/helpers.js";let w=l((l,w)=>{let{children:S,builderAttrs:C,builderProps:v,styles:y,isHiddenArrowWhenDisabled:g=!0,hiddenDotWhenOnlyOne:j,elmRef:b}=l,P=c(l.setting),x={...l,setting:P},{arrowButtonSize:z,arrowBackgroundColor:N,arrowGapToEachSide:T="16",roundedArrow:A,arrowIconSize:I,arrowCustomColor:W,arrowBorder:B,arrowShadow:D,showWhenHover:H}=P??{},{totalSlideItem:O,isInfinity:E,slider:G,currentSlide:F,localRef:U,showNavigation:q,isRenderDots:J,slideMaxIndex:K,handleDotClick:L,getItemsPerPage:M,sliderRef:Q,handleNextAndPrevSlide:R,dispatchEventSelectSlide:V,getNumberOfFullWidthShow:X}=p(x,w),{loopConfig:Y,arrowShowConfig:Z}=k(x),{rootClassRender:$,wrapperClassRender:_,wrapperInnerClass:oo,sliderClass:oe}=u(x),{rootStyleRender:or,wrapperStyleRender:ot,wrapperInnerStyle:oa}=h(x),{rootAttrRender:os,sliderAttr:ol}=f(x),oi=t(),od=P?.sneakPeak?.[oi],on=e=>{let r="next"===e,t=r?!E&&G?.track?.details?.abs===K:!E&&G?.track?.details?.abs===0;return o(m,{uid:v?.uid,custom:P?.arrowCustom??"",showArrow:Z,arrowButtonSize:z||{},arrowIconSize:I||{},arrowBackgroundColor:N||"",arrowCustomColor:W,gapToEachSize:T,showWhenHover:H,arrowBorder:B||{},arrowCorner:A||{},arrowShadow:D||{},onClick:o=>{o.stopPropagation(),R(e)},left:!r,disabled:t,vertical:P?.vertical,isHiddenWhenDisabled:g,rootId:l?.parentClass})};return o("div",{ref:b,...os,className:$,style:or,children:e("div",{ref:U,...C,className:_,style:ot,children:[e("div",{className:oo,style:oa,children:[q&&on("prev"),o("div",{ref:Q,...ol,className:oe,children:o(r,{children:s(S)?o("div",{children:"No Slider"}):i.map(a(S),(e,r)=>d(e)?o(e.type,{...e.props,index:r,parentSettings:P,parentStyle:y,background:P?.background,parentUid:v?.uid,dispatchEventSelectSlide:V}):null)})}),q&&on("next")]}),J&&o(n,{showDots:P?.dot,dotStyle:P?.dotStyle,totalSlideItem:O,slideItemsPerPage:M(),currentSlide:F,enabledSneakPeak:od,vertical:P?.vertical,loop:Y,dotColor:P?.dotColor,dotGapToCarousel:P?.dotGapToCarousel,dotSize:P?.dotSize,dotActiveColor:P?.dotActiveColor,hiddenWhenOnlyOne:j,sneakPeakType:P?.sneakPeakType,numberOfFullWidthShow:X(oi),onHandleClick:L}),a(S,!0)]})})});export{w as default};

package/dist/esm/carousel/components/root/Carousel.liquid.js

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

package/dist/esm/carousel/components/root/common/attrs.js

@@ -1 +1 @@
-import{createAttr as t}from"@gem-sdk/system";import{getData as r}from"./helpers.js";let getAttr=e=>{let{rootAttrs:o,builderProps:d,rootId:i}=e,{uniqueComponentId:s}=r(e),m=t({"data-id":`${d?.uid}`,id:`gp-root-carousel-${s}`,...o}),p=t({...(d?.uid||i)&&{id:`gp-carousel-${s}`}});return{rootAttrRender:m,sliderAttr:p}};export{getAttr};
+import{createAttr as r}from"@gem-sdk/system";import{getData as t}from"./helpers.js";let e=e=>{let{rootAttrs:o,builderProps:d,rootId:i}=e,{uniqueComponentId:s}=t(e),m=r({"data-id":`${d?.uid}`,id:`gp-root-carousel-${s}`,...o}),p=r({...(d?.uid||i)&&{id:`gp-carousel-${s}`}});return{rootAttrRender:m,sliderAttr:p}};export{e as getAttr};