@gem-sdk/core 2.0.0-staging.1077 → 2.0.0-staging.1082

package/dist/cjs/helpers/compose-advance-style.js

@@ -1 +1 @@
-"use strict";var borders=require("./borders.js"),colors=require("./colors.js"),constant=require("./constant.js"),makeStyle=require("./make-style.js"),radius=require("./radius.js"),shadow=require("./shadow.js"),device=require("../constants/device.js");const composeSpacing=({source:e,spacing:t,type:o,suffix:r=""})=>{let{top:a,left:s,bottom:n,right:i}=t;a&&(e[`--${o}t${r}`]=a),s&&(e[`--${o}l${r}`]=s),n&&(e[`--${o}b${r}`]=n),i&&(e[`--${o}r${r}`]=i)},composeSpacingV2=({source:e,spacing:t,suffix:o="",tag:r=""})=>{if(t&&t.margin){let{top:a,left:s,bottom:n,right:i}=t.margin;a&&(e[`--mt${o}`]=a),s&&(e[`--ml${o}`]=constant.layoutComponent.includes(r)&&"0px"===s?"auto":s),n&&(e[`--mb${o}`]=n),i&&(e[`--mr${o}`]=constant.layoutComponent.includes(r)&&"0px"===i?"auto":i)}if(t&&t.padding){let{top:r,left:a,bottom:s,right:n}=t.padding;r&&(e[`--pt${o}`]=r),a&&(e[`--pl${o}`]=a),s&&(e[`--pb${o}`]=s),n&&(e[`--pr${o}`]=n)}},getAttrValue=(e,t,o)=>{if(null!=t)switch(e){case"bgc":case"c":return colors.isColor(t.toString())?t:`var(--g-c-${t})`;case"d":if(!t)return"none";if(t&&o&&constant.layoutComponent.includes(o))return"grid";return"block";case"animation":case"hasBoxShadow":case"rounded":case"boxShadow":case"border":return;default:return t}},postPurchasePaddingMapping={loose:"21px",extraLoose:"38px",tight:"9px",extraTight:"5px",base:"14px"},composeAdvanceStyleForPostPurchase=(e,t)=>{if(!e)return{};let o={};return Object.keys(e).forEach(r=>{let a=e[r];if("blockPadding"===r){let e=postPurchasePaddingMapping[a];o["--pb"]=getAttrValue(r,e,t),o["--pt"]=getAttrValue(r,e,t),o["--mb"]="0px",o["--mt"]="0px"}if("inlinePadding"===r){let e=postPurchasePaddingMapping[a];o["--pl"]=getAttrValue(r,e,t),o["--pr"]=getAttrValue(r,e,t)}}),o};function composeAdvanceStyle(e,t,o){if(!e)return{};let r={},a=["hover","normal"];Object.keys(e).forEach(s=>{let n=e[s];if("cssClass"===s||null==n)return;let i=e.hasBoxShadow?e.hasBoxShadow:{};if("object"==typeof n){if(Array.isArray(n))return;Object.keys(n).forEach(o=>{if(device.DEVICES.includes(o)){let e=n[o];if(void 0!==e){"border"===s&&Object.assign(r,borders.handleConvertBorderStyle(n),borders.handleConvertBorderWidth(n),borders.handleConvertBorderColor(n)),"rounded"===s&&Object.assign(r,radius.composeRadius(n)),"boxShadow"===s&&Object.assign(r,shadow.getResponsiveStyleShadow(n,"box-shadow",i));let a=getAttrValue(s,e,t);if("desktop"===o)switch(s){case"padding":composeSpacing({source:r,spacing:e,type:"p"});break;case"margin":composeSpacing({source:r,spacing:e,type:"m"});break;case"spacing-setting":composeSpacingV2({source:r,spacing:e,tag:t});break;case"m":case"p":break;default:a&&(r[`--${s}`]=a)}else switch(s){case"padding":composeSpacing({source:r,spacing:e,type:"p",suffix:`-${o}`});break;case"margin":composeSpacing({source:r,spacing:e,type:"m",suffix:`-${o}`});break;case"spacing-setting":composeSpacingV2({source:r,spacing:e,suffix:`-${o}`,tag:t});break;case"m":case"p":break;default:a&&(r[`--${s}-${o}`]=a)}}}else if(a.includes(o))switch(s){case"hasBoxShadow":break;case"boxShadow":Object.assign(r,shadow.getStyleShadowState(n,"box-shadow",i))}else"border"===s&&("none"===n.border&&(n.border="solid",n.color="#121212",n.isCustom=!0,n.width="0px",n.position="all"),Object.assign(r,borders.getBorderStyle(n))),"rounded"===s&&Object.assign(r,radius.getCornerCSSFromGlobal(n)),"hasBoxShadow"===s&&Object.assign(r,shadow.getStyleShadow({value:e.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:e.hasBoxShadow})),"boxShadow"===s&&Object.assign(r,shadow.getStyleShadow({value:n,styleAppliedFor:"box-shadow",isEnableShadow:e.hasBoxShadow}))})}else{let o=getAttrValue(s,n,t);o&&(r[`--${s}`]=o),"hasBoxShadow"===s&&e.boxShadow&&Object.assign(r,shadow.getStyleShadow({value:e.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:e.hasBoxShadow}))}if("blockPadding"===s&&"POST_PURCHASE"===o){let e=postPurchasePaddingMapping[n];r["--pb"]=getAttrValue(s,e,t),r["--pt"]=getAttrValue(s,e,t),r["--mb"]="0px",r["--mt"]="0px"}if("inlinePadding"===s&&"POST_PURCHASE"===o){let e=postPurchasePaddingMapping[n];r["--pl"]=getAttrValue(s,e,t),r["--pr"]=getAttrValue(s,e,t)}});let s="POST_PURCHASE"===o?composeAdvanceStyleForPostPurchase(e,t):{};return{...r,...s}}const convertBoxShadowV1ToV2=(e,t,o)=>{let r=["Section","Row","Text","Heading","Image","Button","HeroBanner","ImageComparison","Countdown","Video"],a=["ProductTitle","ProductDescription","ProductPrice","ProductVendor","Product","ProductSku","StockCounter","Sticky","ProductBadge","ProductViewMore","ProductButton","DynamicCheckout","ProductList","ProductQuantity","ProductVariants"],s=["Icon","IconListHoz","Line","IconList","IconListV2","Tabs","Accordion","Marquee","Breadcrumb","EstimateDate"],n=["Newsletter","ContactForm","TextField","FormTextarea","FormEmail","FormDropdown","FormCheckbox","SubmitButton","TextInput"],i=["CollectionTitle","CollectionDescription","CollectionBanner","CollectionToolbar","CollectionPaginator"],c=[...r,...a,...s,...n,...i],d=e;return c.includes(o||"")&&(d={desktop:t.desktop??{},tablet:t.tablet??t.desktop??{},mobile:t.mobile??t.tablet??t.desktop??{}}),d},splitStyle=(e,t={})=>{let o=e.map(e=>makeStyle.makeStyleKey(e)).flat(),r=Object.keys(t).filter(e=>o.includes(e)),a=r.reduce((e,o)=>({...e,[o]:t[o]}),{}),s=Object.keys(t).filter(e=>!r.includes(e)).reduce((e,o)=>({...e,[o]:t[o]}),{});return[a,s]},filterAttrInStyle=(e,t)=>{if(!e||!t)return{};let o={...e};return Object.entries(o).forEach(([e])=>{t.includes(e)||delete o[e]}),o},removeAttrInStyle=(e,t)=>{if(!e||!t)return{};let o={...e};return Object.entries(o).forEach(([e])=>{t.includes(e)&&delete o[e]}),o},getCornerStyle=e=>composeAdvanceStyle({rounded:e?.rounded}),removePaddingYInStyle=e=>{let t=["--pt","--pt-tablet","--pt-mobile","--pb","--pb-tablet","--pb-mobile"];return removeAttrInStyle(e,t)};exports.composeAdvanceStyle=composeAdvanceStyle,exports.composeAdvanceStyleForPostPurchase=composeAdvanceStyleForPostPurchase,exports.convertBoxShadowV1ToV2=convertBoxShadowV1ToV2,exports.filterAttrInStyle=filterAttrInStyle,exports.getCornerStyle=getCornerStyle,exports.removeAttrInStyle=removeAttrInStyle,exports.removePaddingYInStyle=removePaddingYInStyle,exports.splitStyle=splitStyle;
+"use strict";var borders=require("./borders.js"),colors=require("./colors.js"),constant=require("./constant.js"),makeStyle=require("./make-style.js"),radius=require("./radius.js"),shadow=require("./shadow.js"),device=require("../constants/device.js");const composeSpacing=({source:e,spacing:t,type:o,suffix:r=""})=>{let{top:a,left:s,bottom:n,right:i}=t;a&&(e[`--${o}t${r}`]=a),s&&(e[`--${o}l${r}`]=s),n&&(e[`--${o}b${r}`]=n),i&&(e[`--${o}r${r}`]=i)},composeSpacingV2=({source:e,spacing:t,suffix:o="",tag:r=""})=>{if(t&&t.margin){let{top:a,left:s,bottom:n,right:i}=t.margin;a&&(e[`--mt${o}`]=a),s&&(e[`--ml${o}`]=constant.layoutComponent.includes(r)&&"0px"===s?"auto":s),n&&(e[`--mb${o}`]=n),i&&(e[`--mr${o}`]=constant.layoutComponent.includes(r)&&"0px"===i?"auto":i)}if(t&&t.padding){let{top:r,left:a,bottom:s,right:n}=t.padding;r&&(e[`--pt${o}`]=r),a&&(e[`--pl${o}`]=a),s&&(e[`--pb${o}`]=s),n&&(e[`--pr${o}`]=n)}},getAttrValue=(e,t,o)=>{if(null!=t)switch(e){case"bgc":case"c":return colors.isColor(t.toString())?t:`var(--g-c-${t})`;case"d":if(!t)return"none";if(t&&o&&constant.layoutComponent.includes(o))return"grid";return"block";case"animation":case"hasBoxShadow":case"rounded":case"boxShadow":case"border":return;default:return t}},postPurchasePaddingMapping={loose:"21px",extraLoose:"38px",tight:"9px",extraTight:"5px",base:"14px"},composeAdvanceStyleForPostPurchase=(e,t)=>{if(!e)return{};let o={};return Object.keys(e).forEach(r=>{let a=e[r];if("blockPadding"===r){let e=postPurchasePaddingMapping[a];o["--pb"]=getAttrValue(r,e,t),o["--pt"]=getAttrValue(r,e,t),o["--mb"]="0px",o["--mt"]="0px"}if("inlinePadding"===r){let e=postPurchasePaddingMapping[a];o["--pl"]=getAttrValue(r,e,t),o["--pr"]=getAttrValue(r,e,t)}}),o};function composeAdvanceStyle(e,t,o){if(!e)return{};let r={},a=["hover","normal"];Object.keys(e).forEach(s=>{let n=e[s];if("cssClass"===s||null==n)return;let i=e.hasBoxShadow?e.hasBoxShadow:{};if("object"==typeof n){if(Array.isArray(n))return;Object.keys(n).forEach(o=>{if(device.DEVICES.includes(o)){let e=n[o];if(void 0!==e){"border"===s&&Object.assign(r,borders.handleConvertBorderStyle(n),borders.handleConvertBorderWidth(n),borders.handleConvertBorderColor(n)),"rounded"===s&&Object.assign(r,radius.composeRadius(n,["normal"])),"boxShadow"===s&&Object.assign(r,shadow.getResponsiveStyleShadow(n,"box-shadow",i));let a=getAttrValue(s,e,t);if("desktop"===o)switch(s){case"padding":composeSpacing({source:r,spacing:e,type:"p"});break;case"margin":composeSpacing({source:r,spacing:e,type:"m"});break;case"spacing-setting":composeSpacingV2({source:r,spacing:e,tag:t});break;case"m":case"p":break;default:a&&(r[`--${s}`]=a)}else switch(s){case"padding":composeSpacing({source:r,spacing:e,type:"p",suffix:`-${o}`});break;case"margin":composeSpacing({source:r,spacing:e,type:"m",suffix:`-${o}`});break;case"spacing-setting":composeSpacingV2({source:r,spacing:e,suffix:`-${o}`,tag:t});break;case"m":case"p":break;default:a&&(r[`--${s}-${o}`]=a)}}}else if(a.includes(o))switch(s){case"hasBoxShadow":break;case"boxShadow":Object.assign(r,shadow.getStyleShadowState(n,"box-shadow",i))}else"border"===s&&("none"===n.border&&(n.border="solid",n.color="#121212",n.isCustom=!0,n.width="0px",n.position="all"),Object.assign(r,borders.getBorderStyle(n))),"rounded"===s&&Object.assign(r,radius.getCornerCSSFromGlobal(n)),"hasBoxShadow"===s&&Object.assign(r,shadow.getStyleShadow({value:e.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:e.hasBoxShadow})),"boxShadow"===s&&Object.assign(r,shadow.getStyleShadow({value:n,styleAppliedFor:"box-shadow",isEnableShadow:e.hasBoxShadow}))})}else{let o=getAttrValue(s,n,t);o&&(r[`--${s}`]=o),"hasBoxShadow"===s&&e.boxShadow&&Object.assign(r,shadow.getStyleShadow({value:e.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:e.hasBoxShadow}))}if("blockPadding"===s&&"POST_PURCHASE"===o){let e=postPurchasePaddingMapping[n];r["--pb"]=getAttrValue(s,e,t),r["--pt"]=getAttrValue(s,e,t),r["--mb"]="0px",r["--mt"]="0px"}if("inlinePadding"===s&&"POST_PURCHASE"===o){let e=postPurchasePaddingMapping[n];r["--pl"]=getAttrValue(s,e,t),r["--pr"]=getAttrValue(s,e,t)}});let s="POST_PURCHASE"===o?composeAdvanceStyleForPostPurchase(e,t):{};return{...r,...s}}const convertBoxShadowV1ToV2=(e,t,o)=>{let r=["Section","Row","Text","Heading","Image","Button","HeroBanner","ImageComparison","Countdown","Video"],a=["ProductTitle","ProductDescription","ProductPrice","ProductVendor","Product","ProductSku","StockCounter","Sticky","ProductBadge","ProductViewMore","ProductButton","DynamicCheckout","ProductList","ProductQuantity","ProductVariants"],s=["Icon","IconListHoz","Line","IconList","IconListV2","Tabs","Accordion","Marquee","Breadcrumb","EstimateDate"],n=["Newsletter","ContactForm","TextField","FormTextarea","FormEmail","FormDropdown","FormCheckbox","SubmitButton","TextInput"],i=["CollectionTitle","CollectionDescription","CollectionBanner","CollectionToolbar","CollectionPaginator"],c=[...r,...a,...s,...n,...i],d=e;return c.includes(o||"")&&(d={desktop:t.desktop??{},tablet:t.tablet??t.desktop??{},mobile:t.mobile??t.tablet??t.desktop??{}}),d},splitStyle=(e,t={})=>{let o=e.map(e=>makeStyle.makeStyleKey(e)).flat(),r=Object.keys(t).filter(e=>o.includes(e)),a=r.reduce((e,o)=>({...e,[o]:t[o]}),{}),s=Object.keys(t).filter(e=>!r.includes(e)).reduce((e,o)=>({...e,[o]:t[o]}),{});return[a,s]},filterAttrInStyle=(e,t)=>{if(!e||!t)return{};let o={...e};return Object.entries(o).forEach(([e])=>{t.includes(e)||delete o[e]}),o},removeAttrInStyle=(e,t)=>{if(!e||!t)return{};let o={...e};return Object.entries(o).forEach(([e])=>{t.includes(e)&&delete o[e]}),o},getCornerStyle=e=>composeAdvanceStyle({rounded:e?.rounded}),removePaddingYInStyle=e=>{let t=["--pt","--pt-tablet","--pt-mobile","--pb","--pb-tablet","--pb-mobile"];return removeAttrInStyle(e,t)};exports.composeAdvanceStyle=composeAdvanceStyle,exports.composeAdvanceStyleForPostPurchase=composeAdvanceStyleForPostPurchase,exports.convertBoxShadowV1ToV2=convertBoxShadowV1ToV2,exports.filterAttrInStyle=filterAttrInStyle,exports.getCornerStyle=getCornerStyle,exports.removeAttrInStyle=removeAttrInStyle,exports.removePaddingYInStyle=removePaddingYInStyle,exports.splitStyle=splitStyle;

package/dist/cjs/helpers/radius.js

@@ -1,4 +1,4 @@
-"use strict";var constant=require("./constant.js"),makeStyle=require("./make-style.js");const getCornerCSSFromGlobal=e=>e?.radiusType?["custom","circle"].includes(e?.radiusType)?makeStyle.makeStyle({bblr:e.bblr,bbrr:e.bbrr,btlr:e.btlr,btrr:e.btrr}):makeStyle.makeStyle({radius:`var(--g-radius-${e?.radiusType})`}):{},getRadiusCSSFromGlobal=(e,s,t)=>{if(!s||!e)return{};let r=t&&"desktop"!==t?constant.devicesMapping?.[t]:"",a=constant.stateMapping?.[e];return{[`-${a}-radius${r}`]:`var(--g-radius-${s})`}},getCustomRadius=(e,s,t)=>{let r=["custom","pill","rounded","single","none","circle","square"];if(!s||!e||!r.includes(s?.radiusType??""))return{};let a=t&&"desktop"!==t?constant.devicesMapping?.[t]:"",o=constant.stateMapping?.[e];return{[`-${o}-bblr${a}`]:s.bblr,[`-${o}-bbrr${a}`]:s.bbrr,[`-${o}-btlr${a}`]:s.btlr,[`-${o}-btrr${a}`]:s.btrr}},composeRadius=e=>e?"desktop"in e||"tablet"in e||"mobile"in e?composeRadiusResponsiveState(e):composeRadiusState(e):{},composeRadiusResponsive=e=>{let s={};return Object.assign(s,getCustomRadius("normal",e?.desktop,"desktop")),Object.assign(s,getCustomRadius("normal",e?.tablet,"tablet")),Object.assign(s,getCustomRadius("normal",e?.mobile,"mobile")),s},composeRadiusState=(e,s)=>{let t={},r=["normal","hover","focus","active"];for(let a of r){let r=e?.[a]||e?.normal;if(r)switch(r.radiusType){case"medium":case"large":case"small":Object.assign(t,getRadiusCSSFromGlobal(a,r.radiusType,s));break;default:Object.assign(t,getCustomRadius(a,r,s))}}return t},composeRadiusResponsiveState=e=>{let s={};return Object.assign(s,composeRadiusState(e?.desktop,"desktop")),Object.assign(s,composeRadiusState(e?.tablet,"tablet")),Object.assign(s,composeRadiusState(e?.mobile,"mobile")),s},getRadiusStyleActiveState=e=>{let s=["circle","square","rounded","none","custom"],t=e?.active||e?.normal;return s.includes(t?.radiusType||"")?getCustomRadius("normal",t):getRadiusCSSFromGlobal("normal",t?.radiusType)},composeCornerCss=(e,s=!1)=>{let t;if(!e)return"";let{radiusType:r,bblr:a,bbrr:o,btlr:i,btrr:u}=e,l=s?" !important":"";switch(r){case"medium":case"large":case"small":t=`border-radius: var(--g-radius-${r});`;break;case"circle":case"square":case"none":case"rounded":case"custom":t=`
+"use strict";var constant=require("./constant.js"),makeStyle=require("./make-style.js");const getCornerCSSFromGlobal=e=>e?.radiusType?["custom","circle"].includes(e?.radiusType)?makeStyle.makeStyle({bblr:e.bblr,bbrr:e.bbrr,btlr:e.btlr,btrr:e.btrr}):makeStyle.makeStyle({radius:`var(--g-radius-${e?.radiusType})`}):{},getRadiusCSSFromGlobal=(e,s,t)=>{if(!s||!e)return{};let r=t&&"desktop"!==t?constant.devicesMapping?.[t]:"",a=constant.stateMapping?.[e];return{[`-${a}-radius${r}`]:`var(--g-radius-${s})`}},getCustomRadius=(e,s,t)=>{let r=["custom","pill","rounded","single","none","circle","square"];if(!s||!e||!r.includes(s?.radiusType??""))return{};let a=t&&"desktop"!==t?constant.devicesMapping?.[t]:"",o=constant.stateMapping?.[e];return{[`-${o}-bblr${a}`]:s.bblr,[`-${o}-bbrr${a}`]:s.bbrr,[`-${o}-btlr${a}`]:s.btlr,[`-${o}-btrr${a}`]:s.btrr}},composeRadius=(e,s)=>e?"desktop"in e||"tablet"in e||"mobile"in e?composeRadiusResponsiveState(e,s):composeRadiusState(e,void 0,s):{},composeRadiusResponsive=e=>{let s={};return Object.assign(s,getCustomRadius("normal",e?.desktop,"desktop")),Object.assign(s,getCustomRadius("normal",e?.tablet,"tablet")),Object.assign(s,getCustomRadius("normal",e?.mobile,"mobile")),s},composeRadiusState=(e,s,t=["normal","hover","focus","active"])=>{let r={};for(let a of t){let t=e?.[a]||e?.normal;if(t)switch(t.radiusType){case"medium":case"large":case"small":Object.assign(r,getRadiusCSSFromGlobal(a,t.radiusType,s));break;default:Object.assign(r,getCustomRadius(a,t,s))}}return r},composeRadiusResponsiveState=(e,s)=>{let t={};return Object.assign(t,composeRadiusState(e?.desktop,"desktop",s)),Object.assign(t,composeRadiusState(e?.tablet,"tablet",s)),Object.assign(t,composeRadiusState(e?.mobile,"mobile",s)),t},getRadiusStyleActiveState=e=>{let s=["circle","square","rounded","none","custom"],t=e?.active||e?.normal;return s.includes(t?.radiusType||"")?getCustomRadius("normal",t):getRadiusCSSFromGlobal("normal",t?.radiusType)},composeCornerCss=(e,s=!1)=>{let t;if(!e)return"";let{radiusType:r,bblr:a,bbrr:o,btlr:i,btrr:u}=e,l=s?" !important":"";switch(r){case"medium":case"large":case"small":t=`border-radius: var(--g-radius-${r});`;break;case"circle":case"square":case"none":case"rounded":case"custom":t=`
       ${a?`border-bottom-left-radius: ${a}${l};`:""}
       ${o?`border-bottom-right-radius: ${o}${l};`:""}
       ${i?`border-top-left-radius: ${i}${l};`:""}

package/dist/esm/helpers/compose-advance-style.js

@@ -1 +1 @@
-import{handleConvertBorderStyle as e,handleConvertBorderWidth as t,handleConvertBorderColor as o,getBorderStyle as a}from"./borders.js";import{isColor as r}from"./colors.js";import{layoutComponent as s}from"./constant.js";import{makeStyleKey as i}from"./make-style.js";import{composeRadius as n,getCornerCSSFromGlobal as c}from"./radius.js";import{getResponsiveStyleShadow as l,getStyleShadowState as d,getStyleShadow as p}from"./shadow.js";import{DEVICES as u}from"../constants/device.js";let composeSpacing=({source:e,spacing:t,type:o,suffix:a=""})=>{let{top:r,left:s,bottom:i,right:n}=t;r&&(e[`--${o}t${a}`]=r),s&&(e[`--${o}l${a}`]=s),i&&(e[`--${o}b${a}`]=i),n&&(e[`--${o}r${a}`]=n)},composeSpacingV2=({source:e,spacing:t,suffix:o="",tag:a=""})=>{if(t&&t.margin){let{top:r,left:i,bottom:n,right:c}=t.margin;r&&(e[`--mt${o}`]=r),i&&(e[`--ml${o}`]=s.includes(a)&&"0px"===i?"auto":i),n&&(e[`--mb${o}`]=n),c&&(e[`--mr${o}`]=s.includes(a)&&"0px"===c?"auto":c)}if(t&&t.padding){let{top:a,left:r,bottom:s,right:i}=t.padding;a&&(e[`--pt${o}`]=a),r&&(e[`--pl${o}`]=r),s&&(e[`--pb${o}`]=s),i&&(e[`--pr${o}`]=i)}},getAttrValue=(e,t,o)=>{if(null!=t)switch(e){case"bgc":case"c":return r(t.toString())?t:`var(--g-c-${t})`;case"d":if(!t)return"none";if(t&&o&&s.includes(o))return"grid";return"block";case"animation":case"hasBoxShadow":case"rounded":case"boxShadow":case"border":return;default:return t}},postPurchasePaddingMapping={loose:"21px",extraLoose:"38px",tight:"9px",extraTight:"5px",base:"14px"},composeAdvanceStyleForPostPurchase=(e,t)=>{if(!e)return{};let o={};return Object.keys(e).forEach(a=>{let r=e[a];if("blockPadding"===a){let e=postPurchasePaddingMapping[r];o["--pb"]=getAttrValue(a,e,t),o["--pt"]=getAttrValue(a,e,t),o["--mb"]="0px",o["--mt"]="0px"}if("inlinePadding"===a){let e=postPurchasePaddingMapping[r];o["--pl"]=getAttrValue(a,e,t),o["--pr"]=getAttrValue(a,e,t)}}),o};function composeAdvanceStyle(r,s,i){if(!r)return{};let b={},g=["hover","normal"];Object.keys(r).forEach(m=>{let h=r[m];if("cssClass"===m||null==h)return;let S=r.hasBoxShadow?r.hasBoxShadow:{};if("object"==typeof h){if(Array.isArray(h))return;Object.keys(h).forEach(i=>{if(u.includes(i)){let a=h[i];if(void 0!==a){"border"===m&&Object.assign(b,e(h),t(h),o(h)),"rounded"===m&&Object.assign(b,n(h)),"boxShadow"===m&&Object.assign(b,l(h,"box-shadow",S));let r=getAttrValue(m,a,s);if("desktop"===i)switch(m){case"padding":composeSpacing({source:b,spacing:a,type:"p"});break;case"margin":composeSpacing({source:b,spacing:a,type:"m"});break;case"spacing-setting":composeSpacingV2({source:b,spacing:a,tag:s});break;case"m":case"p":break;default:r&&(b[`--${m}`]=r)}else switch(m){case"padding":composeSpacing({source:b,spacing:a,type:"p",suffix:`-${i}`});break;case"margin":composeSpacing({source:b,spacing:a,type:"m",suffix:`-${i}`});break;case"spacing-setting":composeSpacingV2({source:b,spacing:a,suffix:`-${i}`,tag:s});break;case"m":case"p":break;default:r&&(b[`--${m}-${i}`]=r)}}}else if(g.includes(i))switch(m){case"hasBoxShadow":break;case"boxShadow":Object.assign(b,d(h,"box-shadow",S))}else"border"===m&&("none"===h.border&&(h.border="solid",h.color="#121212",h.isCustom=!0,h.width="0px",h.position="all"),Object.assign(b,a(h))),"rounded"===m&&Object.assign(b,c(h)),"hasBoxShadow"===m&&Object.assign(b,p({value:r.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:r.hasBoxShadow})),"boxShadow"===m&&Object.assign(b,p({value:h,styleAppliedFor:"box-shadow",isEnableShadow:r.hasBoxShadow}))})}else{let e=getAttrValue(m,h,s);e&&(b[`--${m}`]=e),"hasBoxShadow"===m&&r.boxShadow&&Object.assign(b,p({value:r.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:r.hasBoxShadow}))}if("blockPadding"===m&&"POST_PURCHASE"===i){let e=postPurchasePaddingMapping[h];b["--pb"]=getAttrValue(m,e,s),b["--pt"]=getAttrValue(m,e,s),b["--mb"]="0px",b["--mt"]="0px"}if("inlinePadding"===m&&"POST_PURCHASE"===i){let e=postPurchasePaddingMapping[h];b["--pl"]=getAttrValue(m,e,s),b["--pr"]=getAttrValue(m,e,s)}});let m="POST_PURCHASE"===i?composeAdvanceStyleForPostPurchase(r,s):{};return{...b,...m}}let convertBoxShadowV1ToV2=(e,t,o)=>{let a=["Section","Row","Text","Heading","Image","Button","HeroBanner","ImageComparison","Countdown","Video"],r=["ProductTitle","ProductDescription","ProductPrice","ProductVendor","Product","ProductSku","StockCounter","Sticky","ProductBadge","ProductViewMore","ProductButton","DynamicCheckout","ProductList","ProductQuantity","ProductVariants"],s=["Icon","IconListHoz","Line","IconList","IconListV2","Tabs","Accordion","Marquee","Breadcrumb","EstimateDate"],i=["Newsletter","ContactForm","TextField","FormTextarea","FormEmail","FormDropdown","FormCheckbox","SubmitButton","TextInput"],n=["CollectionTitle","CollectionDescription","CollectionBanner","CollectionToolbar","CollectionPaginator"],c=[...a,...r,...s,...i,...n],l=e;return c.includes(o||"")&&(l={desktop:t.desktop??{},tablet:t.tablet??t.desktop??{},mobile:t.mobile??t.tablet??t.desktop??{}}),l},splitStyle=(e,t={})=>{let o=e.map(e=>i(e)).flat(),a=Object.keys(t).filter(e=>o.includes(e)),r=a.reduce((e,o)=>({...e,[o]:t[o]}),{}),s=Object.keys(t).filter(e=>!a.includes(e)).reduce((e,o)=>({...e,[o]:t[o]}),{});return[r,s]},filterAttrInStyle=(e,t)=>{if(!e||!t)return{};let o={...e};return Object.entries(o).forEach(([e])=>{t.includes(e)||delete o[e]}),o},removeAttrInStyle=(e,t)=>{if(!e||!t)return{};let o={...e};return Object.entries(o).forEach(([e])=>{t.includes(e)&&delete o[e]}),o},getCornerStyle=e=>composeAdvanceStyle({rounded:e?.rounded}),removePaddingYInStyle=e=>{let t=["--pt","--pt-tablet","--pt-mobile","--pb","--pb-tablet","--pb-mobile"];return removeAttrInStyle(e,t)};export{composeAdvanceStyle,composeAdvanceStyleForPostPurchase,convertBoxShadowV1ToV2,filterAttrInStyle,getCornerStyle,removeAttrInStyle,removePaddingYInStyle,splitStyle};
+import{handleConvertBorderStyle as e,handleConvertBorderWidth as t,handleConvertBorderColor as o,getBorderStyle as a}from"./borders.js";import{isColor as r}from"./colors.js";import{layoutComponent as s}from"./constant.js";import{makeStyleKey as i}from"./make-style.js";import{composeRadius as n,getCornerCSSFromGlobal as c}from"./radius.js";import{getResponsiveStyleShadow as l,getStyleShadowState as d,getStyleShadow as p}from"./shadow.js";import{DEVICES as u}from"../constants/device.js";let composeSpacing=({source:e,spacing:t,type:o,suffix:a=""})=>{let{top:r,left:s,bottom:i,right:n}=t;r&&(e[`--${o}t${a}`]=r),s&&(e[`--${o}l${a}`]=s),i&&(e[`--${o}b${a}`]=i),n&&(e[`--${o}r${a}`]=n)},composeSpacingV2=({source:e,spacing:t,suffix:o="",tag:a=""})=>{if(t&&t.margin){let{top:r,left:i,bottom:n,right:c}=t.margin;r&&(e[`--mt${o}`]=r),i&&(e[`--ml${o}`]=s.includes(a)&&"0px"===i?"auto":i),n&&(e[`--mb${o}`]=n),c&&(e[`--mr${o}`]=s.includes(a)&&"0px"===c?"auto":c)}if(t&&t.padding){let{top:a,left:r,bottom:s,right:i}=t.padding;a&&(e[`--pt${o}`]=a),r&&(e[`--pl${o}`]=r),s&&(e[`--pb${o}`]=s),i&&(e[`--pr${o}`]=i)}},getAttrValue=(e,t,o)=>{if(null!=t)switch(e){case"bgc":case"c":return r(t.toString())?t:`var(--g-c-${t})`;case"d":if(!t)return"none";if(t&&o&&s.includes(o))return"grid";return"block";case"animation":case"hasBoxShadow":case"rounded":case"boxShadow":case"border":return;default:return t}},postPurchasePaddingMapping={loose:"21px",extraLoose:"38px",tight:"9px",extraTight:"5px",base:"14px"},composeAdvanceStyleForPostPurchase=(e,t)=>{if(!e)return{};let o={};return Object.keys(e).forEach(a=>{let r=e[a];if("blockPadding"===a){let e=postPurchasePaddingMapping[r];o["--pb"]=getAttrValue(a,e,t),o["--pt"]=getAttrValue(a,e,t),o["--mb"]="0px",o["--mt"]="0px"}if("inlinePadding"===a){let e=postPurchasePaddingMapping[r];o["--pl"]=getAttrValue(a,e,t),o["--pr"]=getAttrValue(a,e,t)}}),o};function composeAdvanceStyle(r,s,i){if(!r)return{};let b={},g=["hover","normal"];Object.keys(r).forEach(m=>{let h=r[m];if("cssClass"===m||null==h)return;let S=r.hasBoxShadow?r.hasBoxShadow:{};if("object"==typeof h){if(Array.isArray(h))return;Object.keys(h).forEach(i=>{if(u.includes(i)){let a=h[i];if(void 0!==a){"border"===m&&Object.assign(b,e(h),t(h),o(h)),"rounded"===m&&Object.assign(b,n(h,["normal"])),"boxShadow"===m&&Object.assign(b,l(h,"box-shadow",S));let r=getAttrValue(m,a,s);if("desktop"===i)switch(m){case"padding":composeSpacing({source:b,spacing:a,type:"p"});break;case"margin":composeSpacing({source:b,spacing:a,type:"m"});break;case"spacing-setting":composeSpacingV2({source:b,spacing:a,tag:s});break;case"m":case"p":break;default:r&&(b[`--${m}`]=r)}else switch(m){case"padding":composeSpacing({source:b,spacing:a,type:"p",suffix:`-${i}`});break;case"margin":composeSpacing({source:b,spacing:a,type:"m",suffix:`-${i}`});break;case"spacing-setting":composeSpacingV2({source:b,spacing:a,suffix:`-${i}`,tag:s});break;case"m":case"p":break;default:r&&(b[`--${m}-${i}`]=r)}}}else if(g.includes(i))switch(m){case"hasBoxShadow":break;case"boxShadow":Object.assign(b,d(h,"box-shadow",S))}else"border"===m&&("none"===h.border&&(h.border="solid",h.color="#121212",h.isCustom=!0,h.width="0px",h.position="all"),Object.assign(b,a(h))),"rounded"===m&&Object.assign(b,c(h)),"hasBoxShadow"===m&&Object.assign(b,p({value:r.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:r.hasBoxShadow})),"boxShadow"===m&&Object.assign(b,p({value:h,styleAppliedFor:"box-shadow",isEnableShadow:r.hasBoxShadow}))})}else{let e=getAttrValue(m,h,s);e&&(b[`--${m}`]=e),"hasBoxShadow"===m&&r.boxShadow&&Object.assign(b,p({value:r.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:r.hasBoxShadow}))}if("blockPadding"===m&&"POST_PURCHASE"===i){let e=postPurchasePaddingMapping[h];b["--pb"]=getAttrValue(m,e,s),b["--pt"]=getAttrValue(m,e,s),b["--mb"]="0px",b["--mt"]="0px"}if("inlinePadding"===m&&"POST_PURCHASE"===i){let e=postPurchasePaddingMapping[h];b["--pl"]=getAttrValue(m,e,s),b["--pr"]=getAttrValue(m,e,s)}});let m="POST_PURCHASE"===i?composeAdvanceStyleForPostPurchase(r,s):{};return{...b,...m}}let convertBoxShadowV1ToV2=(e,t,o)=>{let a=["Section","Row","Text","Heading","Image","Button","HeroBanner","ImageComparison","Countdown","Video"],r=["ProductTitle","ProductDescription","ProductPrice","ProductVendor","Product","ProductSku","StockCounter","Sticky","ProductBadge","ProductViewMore","ProductButton","DynamicCheckout","ProductList","ProductQuantity","ProductVariants"],s=["Icon","IconListHoz","Line","IconList","IconListV2","Tabs","Accordion","Marquee","Breadcrumb","EstimateDate"],i=["Newsletter","ContactForm","TextField","FormTextarea","FormEmail","FormDropdown","FormCheckbox","SubmitButton","TextInput"],n=["CollectionTitle","CollectionDescription","CollectionBanner","CollectionToolbar","CollectionPaginator"],c=[...a,...r,...s,...i,...n],l=e;return c.includes(o||"")&&(l={desktop:t.desktop??{},tablet:t.tablet??t.desktop??{},mobile:t.mobile??t.tablet??t.desktop??{}}),l},splitStyle=(e,t={})=>{let o=e.map(e=>i(e)).flat(),a=Object.keys(t).filter(e=>o.includes(e)),r=a.reduce((e,o)=>({...e,[o]:t[o]}),{}),s=Object.keys(t).filter(e=>!a.includes(e)).reduce((e,o)=>({...e,[o]:t[o]}),{});return[r,s]},filterAttrInStyle=(e,t)=>{if(!e||!t)return{};let o={...e};return Object.entries(o).forEach(([e])=>{t.includes(e)||delete o[e]}),o},removeAttrInStyle=(e,t)=>{if(!e||!t)return{};let o={...e};return Object.entries(o).forEach(([e])=>{t.includes(e)&&delete o[e]}),o},getCornerStyle=e=>composeAdvanceStyle({rounded:e?.rounded}),removePaddingYInStyle=e=>{let t=["--pt","--pt-tablet","--pt-mobile","--pb","--pb-tablet","--pb-mobile"];return removeAttrInStyle(e,t)};export{composeAdvanceStyle,composeAdvanceStyleForPostPurchase,convertBoxShadowV1ToV2,filterAttrInStyle,getCornerStyle,removeAttrInStyle,removePaddingYInStyle,splitStyle};

package/dist/esm/helpers/radius.js

@@ -1,4 +1,4 @@
-import{devicesMapping as e,stateMapping as s}from"./constant.js";import{makeStyle as t}from"./make-style.js";let getCornerCSSFromGlobal=e=>e?.radiusType?["custom","circle"].includes(e?.radiusType)?t({bblr:e.bblr,bbrr:e.bbrr,btlr:e.btlr,btrr:e.btrr}):t({radius:`var(--g-radius-${e?.radiusType})`}):{},getRadiusCSSFromGlobal=(t,r,a)=>{if(!r||!t)return{};let o=a&&"desktop"!==a?e?.[a]:"",i=s?.[t];return{[`-${i}-radius${o}`]:`var(--g-radius-${r})`}},getCustomRadius=(t,r,a)=>{let o=["custom","pill","rounded","single","none","circle","square"];if(!r||!t||!o.includes(r?.radiusType??""))return{};let i=a&&"desktop"!==a?e?.[a]:"",u=s?.[t];return{[`-${u}-bblr${i}`]:r.bblr,[`-${u}-bbrr${i}`]:r.bbrr,[`-${u}-btlr${i}`]:r.btlr,[`-${u}-btrr${i}`]:r.btrr}},composeRadius=e=>e?"desktop"in e||"tablet"in e||"mobile"in e?composeRadiusResponsiveState(e):composeRadiusState(e):{},composeRadiusResponsive=e=>{let s={};return Object.assign(s,getCustomRadius("normal",e?.desktop,"desktop")),Object.assign(s,getCustomRadius("normal",e?.tablet,"tablet")),Object.assign(s,getCustomRadius("normal",e?.mobile,"mobile")),s},composeRadiusState=(e,s)=>{let t={},r=["normal","hover","focus","active"];for(let a of r){let r=e?.[a]||e?.normal;if(r)switch(r.radiusType){case"medium":case"large":case"small":Object.assign(t,getRadiusCSSFromGlobal(a,r.radiusType,s));break;default:Object.assign(t,getCustomRadius(a,r,s))}}return t},composeRadiusResponsiveState=e=>{let s={};return Object.assign(s,composeRadiusState(e?.desktop,"desktop")),Object.assign(s,composeRadiusState(e?.tablet,"tablet")),Object.assign(s,composeRadiusState(e?.mobile,"mobile")),s},getRadiusStyleActiveState=e=>{let s=["circle","square","rounded","none","custom"],t=e?.active||e?.normal;return s.includes(t?.radiusType||"")?getCustomRadius("normal",t):getRadiusCSSFromGlobal("normal",t?.radiusType)},composeCornerCss=(e,s=!1)=>{let t;if(!e)return"";let{radiusType:r,bblr:a,bbrr:o,btlr:i,btrr:u}=e,l=s?" !important":"";switch(r){case"medium":case"large":case"small":t=`border-radius: var(--g-radius-${r});`;break;case"circle":case"square":case"none":case"rounded":case"custom":t=`
+import{devicesMapping as e,stateMapping as s}from"./constant.js";import{makeStyle as t}from"./make-style.js";let getCornerCSSFromGlobal=e=>e?.radiusType?["custom","circle"].includes(e?.radiusType)?t({bblr:e.bblr,bbrr:e.bbrr,btlr:e.btlr,btrr:e.btrr}):t({radius:`var(--g-radius-${e?.radiusType})`}):{},getRadiusCSSFromGlobal=(t,r,a)=>{if(!r||!t)return{};let o=a&&"desktop"!==a?e?.[a]:"",i=s?.[t];return{[`-${i}-radius${o}`]:`var(--g-radius-${r})`}},getCustomRadius=(t,r,a)=>{let o=["custom","pill","rounded","single","none","circle","square"];if(!r||!t||!o.includes(r?.radiusType??""))return{};let i=a&&"desktop"!==a?e?.[a]:"",u=s?.[t];return{[`-${u}-bblr${i}`]:r.bblr,[`-${u}-bbrr${i}`]:r.bbrr,[`-${u}-btlr${i}`]:r.btlr,[`-${u}-btrr${i}`]:r.btrr}},composeRadius=(e,s)=>e?"desktop"in e||"tablet"in e||"mobile"in e?composeRadiusResponsiveState(e,s):composeRadiusState(e,void 0,s):{},composeRadiusResponsive=e=>{let s={};return Object.assign(s,getCustomRadius("normal",e?.desktop,"desktop")),Object.assign(s,getCustomRadius("normal",e?.tablet,"tablet")),Object.assign(s,getCustomRadius("normal",e?.mobile,"mobile")),s},composeRadiusState=(e,s,t=["normal","hover","focus","active"])=>{let r={};for(let a of t){let t=e?.[a]||e?.normal;if(t)switch(t.radiusType){case"medium":case"large":case"small":Object.assign(r,getRadiusCSSFromGlobal(a,t.radiusType,s));break;default:Object.assign(r,getCustomRadius(a,t,s))}}return r},composeRadiusResponsiveState=(e,s)=>{let t={};return Object.assign(t,composeRadiusState(e?.desktop,"desktop",s)),Object.assign(t,composeRadiusState(e?.tablet,"tablet",s)),Object.assign(t,composeRadiusState(e?.mobile,"mobile",s)),t},getRadiusStyleActiveState=e=>{let s=["circle","square","rounded","none","custom"],t=e?.active||e?.normal;return s.includes(t?.radiusType||"")?getCustomRadius("normal",t):getRadiusCSSFromGlobal("normal",t?.radiusType)},composeCornerCss=(e,s=!1)=>{let t;if(!e)return"";let{radiusType:r,bblr:a,bbrr:o,btlr:i,btrr:u}=e,l=s?" !important":"";switch(r){case"medium":case"large":case"small":t=`border-radius: var(--g-radius-${r});`;break;case"circle":case"square":case"none":case"rounded":case"custom":t=`
       ${a?`border-bottom-left-radius: ${a}${l};`:""}
       ${o?`border-bottom-right-radius: ${o}${l};`:""}
       ${i?`border-top-left-radius: ${i}${l};`:""}

package/dist/types/index.d.ts

@@ -42764,7 +42764,7 @@ declare const generateProductsQueryKey: (args: FetchProductsParams) => ['query/p
 declare const getCornerCSSFromGlobal: (corner?: CornerRadius) => React.CSSProperties;
 declare const getRadiusCSSFromGlobal: (state: StateType, key?: RoundedSize, device?: NameDevices) => React.CSSProperties;
 declare const getCustomRadius: (state: StateType, radius?: CornerRadius, device?: NameDevices) => React.CSSProperties;
-declare const composeRadius: (value?: StateProp<CornerRadius> | ResponsiveStateProp<CornerRadius>) => React.CSSProperties;
+declare const composeRadius: (value?: StateProp<CornerRadius> | ResponsiveStateProp<CornerRadius>, states?: StateType[]) => React.CSSProperties;
 declare const composeRadiusResponsive: (radiusValue?: ObjectDevices<CornerRadius>) => React.CSSProperties;
 declare const getRadiusStyleActiveState: (radiusValue?: StateProp<CornerRadius>) => React.CSSProperties;
 declare const composeCornerCss: (value?: CornerRadius | undefined, important?: boolean) => string | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gem-sdk/core",
-  "version": "2.0.0-staging.1077",
+  "version": "2.0.0-staging.1082",
   "license": "MIT",
   "sideEffects": false,
   "main": "dist/cjs/index.js",