@gem-sdk/core 1.14.0-dev.646 → 1.14.0-dev.648

package/dist/cjs/components/ComponentWrapperPreview.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),react=require("react"),composeAdvanceStyle=require("../helpers/compose-advance-style.js"),constant=require("./constant.js"),RenderCustomCode=require("./RenderCustomCode.js"),ComponentToolbarPreview=require("./ComponentToolbarPreview.js"),useApplyAnimation=require("../hooks/animation/useApplyAnimation.js");const ComponentWrapperPreview=({children:e,...t})=>{if(react.useEffect(()=>{let e=new CustomEvent("editor:component:render",{bubbles:!0,detail:{componentUid:t.uid}});window.dispatchEvent(e)},[t.uid]),useApplyAnimation.default({props:t}),"section"===t.type)return null;let o={};if("Section"===t.tag&&t.isThemeSection&&(o["data-theme-section"]=!0),t.editorConfigs){let e=t.editorConfigs;e.placeholder?.notAppendBeforeAfter&&(o["data-placeholder-not-append-before-after"]=!0),e.placeholder?.notAppendLeftRight&&(o["data-placeholder-not-append-left-right"]=!0),e.toolbar?.parent&&(o["data-toolbar-parent"]=!0),e.component?.noDelete&&(o["data-component-no-delete"]=!0),e.component?.noDuplicate&&(o["data-component-no-duplicate"]=!0),e.component?.noDragDrop&&(o["data-component-no-drag-drop"]=!0),e.component?.noSetting&&(o["data-component-no-setting"]=!0),e.component?.isThirdParty&&(o["data-component-is-third-party"]=!0),e.toolbar?.hide&&(o["data-toolbar-hide"]=!0),e.slots?.children&&(o["data-slots-children"]=!0),e.toolbar?.hide||(o["data-toolbar-wrap"]=!0)}t?.editorConfigs?.toolbar?.hide||(o["data-toolbar-wrap"]=!0);let n=composeAdvanceStyle.composeAdvanceStyle(t.advanced,t.tag),a=t.advanced,r={...o,"data-uid":t.uid,"data-component-type":"component","data-component-tag":t.tag,"data-component-label":t.label};return constant.disableWrap.includes(t.tag)&&react.isValidElement(e)?jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(RenderCustomCode.default,{uid:t.uid,advanced:a}),jsxRuntime.jsxs(e.type,{className:a?.cssClass,...e.props,style:n,builderAttrs:r,advanced:a,children:[e.props.children,jsxRuntime.jsx(ComponentToolbarPreview.ComponentToolbarPreview,{...t})]})]}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(RenderCustomCode.default,{uid:t.uid,advanced:a}),jsxRuntime.jsxs("div",{style:constant.excludeApplyStyle.includes(t.tag)?{"--mb":n?.["--mb"],"--mb-tablet":n?.["--mb-tablet"],"--mb-mobile":n?.["--mb-mobile"]}:n,className:`${t.uid} ${t.advanced?.cssClass?t.advanced?.cssClass:""}`,...r,children:[!constant.excludeApplyStyle.includes(t.tag)&&e,react.isValidElement(e)&&constant.excludeApplyStyle.includes(t.tag)&&jsxRuntime.jsx(e.type,{...e.props,style:n,advanced:a}),jsxRuntime.jsx(ComponentToolbarPreview.ComponentToolbarPreview,{...t})]})]})};exports.default=ComponentWrapperPreview;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),react=require("react"),composeAdvanceStyle=require("../helpers/compose-advance-style.js"),constant=require("./constant.js"),RenderCustomCode=require("./RenderCustomCode.js"),ComponentToolbarPreview=require("./ComponentToolbarPreview.js"),useApplyAnimation=require("../hooks/animation/useApplyAnimation.js");require("zustand"),require("swr"),require("@gem-sdk/adapter-shopify"),require("swr/mutation");var shop=require("../hooks/shop.js");require("vanilla-lazyload"),require("../hooks/useCartUI.js"),require("../helpers/convert.js");const ComponentWrapperPreview=({children:e,...t})=>{react.useEffect(()=>{let e=new CustomEvent("editor:component:render",{bubbles:!0,detail:{componentUid:t.uid}});window.dispatchEvent(e)},[t.uid]),useApplyAnimation.default({props:t});let o=shop.usePageType();if("section"===t.type)return null;let n={};if("Section"===t.tag&&t.isThemeSection&&(n["data-theme-section"]=!0),t.editorConfigs){let e=t.editorConfigs;e.placeholder?.notAppendBeforeAfter&&(n["data-placeholder-not-append-before-after"]=!0),e.placeholder?.notAppendLeftRight&&(n["data-placeholder-not-append-left-right"]=!0),e.toolbar?.parent&&(n["data-toolbar-parent"]=!0),e.component?.noDelete&&(n["data-component-no-delete"]=!0),e.component?.noDuplicate&&(n["data-component-no-duplicate"]=!0),e.component?.noDragDrop&&(n["data-component-no-drag-drop"]=!0),e.component?.noSetting&&(n["data-component-no-setting"]=!0),e.component?.isThirdParty&&(n["data-component-is-third-party"]=!0),e.toolbar?.hide&&(n["data-toolbar-hide"]=!0),e.slots?.children&&(n["data-slots-children"]=!0),e.toolbar?.hide||(n["data-toolbar-wrap"]=!0)}t?.editorConfigs?.toolbar?.hide||(n["data-toolbar-wrap"]=!0);let a=composeAdvanceStyle.composeAdvanceStyle(t.advanced,t.tag,o),r=t.advanced,s={...n,"data-uid":t.uid,"data-component-type":"component","data-component-tag":t.tag,"data-component-label":t.label};return constant.disableWrap.includes(t.tag)&&react.isValidElement(e)?jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(RenderCustomCode.default,{uid:t.uid,advanced:r}),jsxRuntime.jsxs(e.type,{className:r?.cssClass,...e.props,style:a,builderAttrs:s,advanced:r,children:[e.props.children,jsxRuntime.jsx(ComponentToolbarPreview.ComponentToolbarPreview,{...t})]})]}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(RenderCustomCode.default,{uid:t.uid,advanced:r}),jsxRuntime.jsxs("div",{style:constant.excludeApplyStyle.includes(t.tag)?{"--mb":a?.["--mb"],"--mb-tablet":a?.["--mb-tablet"],"--mb-mobile":a?.["--mb-mobile"]}:a,className:`${t.uid} ${t.advanced?.cssClass?t.advanced?.cssClass:""}`,...s,children:[!constant.excludeApplyStyle.includes(t.tag)&&e,react.isValidElement(e)&&constant.excludeApplyStyle.includes(t.tag)&&jsxRuntime.jsx(e.type,{...e.props,style:a,advanced:r}),jsxRuntime.jsx(ComponentToolbarPreview.ComponentToolbarPreview,{...t})]})]})};exports.default=ComponentWrapperPreview;

package/dist/cjs/helpers/colors.js

@@ -1 +1 @@
-"use strict";var isDefined=require("./is-defined.js"),constant=require("./constant.js");const getGlobalColorCSSProp=e=>getSingleColorVariable(e),getGlobalColorClass=(e,t)=>"string"!=typeof t||!t||t?.startsWith("#")||t?.startsWith("rgb")||t?.startsWith("hsl")||t?.startsWith("transparent")?"":`${e}-g-${t}`,getGlobalColorResponsiveClass=(e,t)=>t?Object.entries(t).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"desktop"===t?l:`${t}:${l}`}).filter(isDefined.isDefined).join(" "):"",getGlobalColorStateClass=(e,t)=>t?Object.entries(t).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?l:`${t}:${l}`}).filter(isDefined.isDefined).join(" "):"",getGlobalColorStateClassDynamicBtn=(e,t)=>t?Object.entries(t).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${l}`:String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${t}:${l}`}).filter(isDefined.isDefined).join(" "):"",getGlobalColorStateResponsiveClass=(e,t)=>t?Object.entries(t).map(([t,o])=>"desktop"===t?Object.entries(o).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?l:`${t}:${l}`}).filter(isDefined.isDefined).join(" "):Object.entries(o).map(([o,l])=>{let s=getGlobalColorClass(e,l);if(s)return"normal"===o?`${t}:${s}`:`${t}:${o}:${s}`}).filter(isDefined.isDefined).join(" ")).filter(Boolean).join(" "):"",getGlobalColorStateResponsiveClassDynamicBtn=(e,t)=>t?Object.entries(t).map(([t,o])=>"desktop"===t?Object.entries(o).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${l}`:String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${t}:${l}`}).filter(isDefined.isDefined).join(" "):Object.entries(o).map(([o,l])=>{let s=getGlobalColorClass(e,l);if(s)return"normal"===o?String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${t}:${s}`:String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${t}:${o}:${s}`}).filter(isDefined.isDefined).join(" ")).filter(Boolean).join(" "):"",getGlobalColorResponsiveStyle=(e,t)=>t?Object.fromEntries(Object.entries(t).map(([t,o])=>"desktop"===t?[`--${e}`,getSingleColorVariable(o)]:[`--${e}-${t}`,getSingleColorVariable(o)])):{},getGlobalColorStateStyle=(e,t)=>t?Object.fromEntries(Object.entries(t).map(([t,o])=>"active"===t?[]:[`-${constant.stateMapping?.[t]}-${e}`,getSingleColorVariable(o)]).filter(isDefined.isDefined)):{},getGlobalColorStateResponsiveStyle=(e,t)=>t?Object.entries(t).map(([t,o])=>"desktop"===t?Object.fromEntries(Object.entries(o).map(([t,o])=>"active"===t?[]:[`-${constant.stateMapping[t]}-${e}`,getSingleColorVariable(o)]).filter(isDefined.isDefined)):Object.fromEntries(Object.entries(o).map(([o,l])=>"active"===o?[]:[`-${constant.stateMapping[o]}-${e}-${t}`,getSingleColorVariable(l)]).filter(isDefined.isDefined))).reduce((e,t)=>({...e,...t}),{}):{},getSingleColorVariable=e=>{if(e&&"string"==typeof e)return isColor(e)?e:`var(--g-c-${e}, ${e})`};function isColor(e){return e?.startsWith("#")||e?.startsWith("rgb")||e?.startsWith("hsl")||e?.startsWith("transparent")}const getGlobalColorStyle=e=>e?{"--c":getSingleColorVariable(e)}:{},composeTextColorCss=e=>`${e?`color: ${getSingleColorVariable(e)} !important;`:""}`;exports.composeTextColorCss=composeTextColorCss,exports.getGlobalColorCSSProp=getGlobalColorCSSProp,exports.getGlobalColorClass=getGlobalColorClass,exports.getGlobalColorResponsiveClass=getGlobalColorResponsiveClass,exports.getGlobalColorResponsiveStyle=getGlobalColorResponsiveStyle,exports.getGlobalColorStateClass=getGlobalColorStateClass,exports.getGlobalColorStateClassDynamicBtn=getGlobalColorStateClassDynamicBtn,exports.getGlobalColorStateResponsiveClass=getGlobalColorStateResponsiveClass,exports.getGlobalColorStateResponsiveClassDynamicBtn=getGlobalColorStateResponsiveClassDynamicBtn,exports.getGlobalColorStateResponsiveStyle=getGlobalColorStateResponsiveStyle,exports.getGlobalColorStateStyle=getGlobalColorStateStyle,exports.getGlobalColorStyle=getGlobalColorStyle,exports.getSingleColorVariable=getSingleColorVariable,exports.isColor=isColor;
+"use strict";var isDefined=require("./is-defined.js"),constant=require("./constant.js");const getGlobalColorCSSProp=e=>getSingleColorVariable(e),getGlobalColorClass=(e,t)=>"string"!=typeof t||!t||t?.startsWith("#")||t?.startsWith("rgb")||t?.startsWith("hsl")||t?.startsWith("transparent")?"":`${e}-g-${t}`,getGlobalColorResponsiveClass=(e,t)=>t?Object.entries(t).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"desktop"===t?l:`${t}:${l}`}).filter(isDefined.isDefined).join(" "):"",getGlobalColorStateClass=(e,t)=>t?Object.entries(t).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?l:`${t}:${l}`}).filter(isDefined.isDefined).join(" "):"",getGlobalColorStateClassDynamicBtn=(e,t)=>t?Object.entries(t).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${l}`:String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${t}:${l}`}).filter(isDefined.isDefined).join(" "):"",getGlobalColorStateResponsiveClass=(e,t)=>t?Object.entries(t).map(([t,o])=>"desktop"===t?Object.entries(o).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?l:`${t}:${l}`}).filter(isDefined.isDefined).join(" "):Object.entries(o).map(([o,l])=>{let s=getGlobalColorClass(e,l);if(s)return"normal"===o?`${t}:${s}`:`${t}:${o}:${s}`}).filter(isDefined.isDefined).join(" ")).filter(Boolean).join(" "):"",getGlobalColorStateResponsiveClassDynamicBtn=(e,t)=>t?Object.entries(t).map(([t,o])=>"desktop"===t?Object.entries(o).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${l}`:String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${t}:${l}`}).filter(isDefined.isDefined).join(" "):Object.entries(o).map(([o,l])=>{let s=getGlobalColorClass(e,l);if(s)return"normal"===o?String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${t}:${s}`:String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${t}:${o}:${s}`}).filter(isDefined.isDefined).join(" ")).filter(Boolean).join(" "):"",getGlobalColorResponsiveStyle=(e,t)=>t?Object.fromEntries(Object.entries(t).map(([t,o])=>"desktop"===t?[`--${e}`,getSingleColorVariable(o)]:[`--${e}-${t}`,getSingleColorVariable(o)])):{},getGlobalColorStateStyle=(e,t)=>t?Object.fromEntries(Object.entries(t).map(([t,o])=>"active"===t?[]:[`-${constant.stateMapping?.[t]}-${e}`,getSingleColorVariable(o)]).filter(isDefined.isDefined)):{},getGlobalColorStateResponsiveStyle=(e,t)=>t?Object.entries(t).map(([t,o])=>"desktop"===t?Object.fromEntries(Object.entries(o).map(([t,o])=>"active"===t?[]:[`-${constant.stateMapping[t]}-${e}`,getSingleColorVariable(o)]).filter(isDefined.isDefined)):Object.fromEntries(Object.entries(o).map(([o,l])=>"active"===o?[]:[`-${constant.stateMapping[o]}-${e}-${t}`,getSingleColorVariable(l)]).filter(isDefined.isDefined))).reduce((e,t)=>({...e,...t}),{}):{},getSingleColorVariable=e=>{if(e&&"string"==typeof e)return isColor(e)?e:`var(--g-c-${e}, ${e})`};function isColor(e){return!!e&&"string"==typeof e&&(e?.startsWith("#")||e?.startsWith("rgb")||e?.startsWith("hsl")||e?.startsWith("transparent"))}const getGlobalColorStyle=e=>e?{"--c":getSingleColorVariable(e)}:{},composeTextColorCss=e=>`${e?`color: ${getSingleColorVariable(e)} !important;`:""}`;exports.composeTextColorCss=composeTextColorCss,exports.getGlobalColorCSSProp=getGlobalColorCSSProp,exports.getGlobalColorClass=getGlobalColorClass,exports.getGlobalColorResponsiveClass=getGlobalColorResponsiveClass,exports.getGlobalColorResponsiveStyle=getGlobalColorResponsiveStyle,exports.getGlobalColorStateClass=getGlobalColorStateClass,exports.getGlobalColorStateClassDynamicBtn=getGlobalColorStateClassDynamicBtn,exports.getGlobalColorStateResponsiveClass=getGlobalColorStateResponsiveClass,exports.getGlobalColorStateResponsiveClassDynamicBtn=getGlobalColorStateResponsiveClassDynamicBtn,exports.getGlobalColorStateResponsiveStyle=getGlobalColorStateResponsiveStyle,exports.getGlobalColorStateStyle=getGlobalColorStateStyle,exports.getGlobalColorStyle=getGlobalColorStyle,exports.getSingleColorVariable=getSingleColorVariable,exports.isColor=isColor;

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");const composeSpacing=({source:e,spacing:t,type:r,suffix:o=""})=>{let{top:a,left:s,bottom:l,right:n}=t;a&&(e[`--${r}t${o}`]=a),s&&(e[`--${r}l${o}`]=s),l&&(e[`--${r}b${o}`]=l),n&&(e[`--${r}r${o}`]=n)},composeSpacingV2=({source:e,spacing:t,suffix:r="",tag:o=""})=>{if(t&&t.margin){let{top:a,left:s,bottom:l,right:n}=t.margin;a&&(e[`--mt${r}`]=a),s&&(e[`--ml${r}`]=constant.layoutComponent.includes(o)&&"0px"===s?"auto":s),l&&(e[`--mb${r}`]=l),n&&(e[`--mr${r}`]=constant.layoutComponent.includes(o)&&"0px"===n?"auto":n)}if(t&&t.padding){let{top:o,left:a,bottom:s,right:l}=t.padding;o&&(e[`--pt${r}`]=o),a&&(e[`--pl${r}`]=a),s&&(e[`--pb${r}`]=s),l&&(e[`--pr${r}`]=l)}},getAttrValue=(e,t,r)=>{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&&r&&constant.layoutComponent.includes(r))return"grid";return"block";default:return t}},postPurchasePaddingMapping={loose:"21px",extraLoose:"38px",tight:"9px",extraTight:"5px",base:"14px"},composeAdvanceStyleForPostPurchase=(e,t)=>{if(!e)return{};let r={};return Object.keys(e).forEach(o=>{let a=e[o];if("blockPadding"===o){let e=postPurchasePaddingMapping[a];r["--pb"]=getAttrValue(o,e,t),r["--pt"]=getAttrValue(o,e,t),r["--mb"]="0px",r["--mt"]="0px"}if("inlinePadding"===o){let e=postPurchasePaddingMapping[a];r["--pl"]=getAttrValue(o,e,t),r["--pr"]=getAttrValue(o,e,t)}}),r};function composeAdvanceStyle(e,t){if(!e)return{};let r={"--pos":"relative"},o=["desktop","tablet","mobile"],a=["hover","normal"];Object.keys(e).forEach(s=>{let l=e[s];if("cssClass"===s||null==l)return;let n=e.hasBoxShadow?e.hasBoxShadow:{};if("object"==typeof l){if(Array.isArray(l))return;Object.keys(l).forEach(i=>{if(o.includes(i)){let e=l[i];if(void 0!==e){if("border"===s&&Object.assign(r,borders.handleConvertBorderStyle(l),borders.handleConvertBorderWidth(l),borders.handleConvertBorderColor(l)),"rounded"===s&&Object.assign(r,radius.composeRadius(l)),"pos"==s&&"static"==e&&(e="relative"),"desktop"===i)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:r[`--${s}`]=getAttrValue(s,e,t)}else switch(s){case"padding":composeSpacing({source:r,spacing:e,type:"p",suffix:`-${i}`});break;case"margin":composeSpacing({source:r,spacing:e,type:"m",suffix:`-${i}`});break;case"spacing-setting":composeSpacingV2({source:r,spacing:e,suffix:`-${i}`,tag:t});break;case"m":case"p":break;default:r[`--${s}-${i}`]=getAttrValue(s,e,t)}}}else if(a.includes(i))switch(s){case"hasBoxShadow":break;case"boxShadow":Object.assign(r,shadow.getStyleShadowState(l,"box-shadow",n))}else"border"===s&&("none"===l.border&&(l.border="solid",l.color="#121212",l.isCustom=!0,l.width="0px",l.position="all"),Object.assign(r,borders.getBorderStyle(l))),"rounded"===s&&Object.assign(r,radius.getCornerCSSFromGlobal(l)),"hasBoxShadow"===s&&Object.assign(r,shadow.getStyleShadow({value:e.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:e.hasBoxShadow})),"boxShadow"===s&&Object.assign(r,shadow.getStyleShadow({value:l,styleAppliedFor:"box-shadow",isEnableShadow:e.hasBoxShadow}))})}else r[`--${s}`]=getAttrValue(s,l,t),"hasBoxShadow"===s&&e.boxShadow&&Object.assign(r,shadow.getStyleShadow({value:e.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:e.hasBoxShadow}));if("blockPadding"===s){let e=postPurchasePaddingMapping[l];r["--pb"]=getAttrValue(s,e,t),r["--pt"]=getAttrValue(s,e,t),r["--mb"]="0px",r["--mt"]="0px"}if("inlinePadding"===s){let e=postPurchasePaddingMapping[l];r["--pl"]=getAttrValue(s,e,t),r["--pr"]=getAttrValue(s,e,t)}});let s=composeAdvanceStyleForPostPurchase(e,t);return{...r,...s}}const splitStyle=(e,t={})=>{let r=e.map(e=>makeStyle.makeStyleKey(e)).flat(),o=Object.keys(t).filter(e=>r.includes(e)),a=o.reduce((e,r)=>({...e,[r]:t[r]}),{}),s=Object.keys(t).filter(e=>!o.includes(e)).reduce((e,r)=>({...e,[r]:t[r]}),{});return[a,s]},filterAttrInStyle=(e,t)=>{if(!e||!t)return{};let r={...e};return Object.entries(r).forEach(([e])=>{t.includes(e)||delete r[e]}),r},removeAttrInStyle=(e,t)=>{if(!e||!t)return{};let r={...e};return Object.entries(r).forEach(([e])=>{t.includes(e)&&delete r[e]}),r},filterCornerInStyle=e=>{let t=["--bblr","--bbrr","--btlr","--btrr"];return filterAttrInStyle(e,t)},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.filterAttrInStyle=filterAttrInStyle,exports.filterCornerInStyle=filterCornerInStyle,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");const composeSpacing=({source:e,spacing:t,type:r,suffix:o=""})=>{let{top:a,left:s,bottom:l,right:n}=t;a&&(e[`--${r}t${o}`]=a),s&&(e[`--${r}l${o}`]=s),l&&(e[`--${r}b${o}`]=l),n&&(e[`--${r}r${o}`]=n)},composeSpacingV2=({source:e,spacing:t,suffix:r="",tag:o=""})=>{if(t&&t.margin){let{top:a,left:s,bottom:l,right:n}=t.margin;a&&(e[`--mt${r}`]=a),s&&(e[`--ml${r}`]=constant.layoutComponent.includes(o)&&"0px"===s?"auto":s),l&&(e[`--mb${r}`]=l),n&&(e[`--mr${r}`]=constant.layoutComponent.includes(o)&&"0px"===n?"auto":n)}if(t&&t.padding){let{top:o,left:a,bottom:s,right:l}=t.padding;o&&(e[`--pt${r}`]=o),a&&(e[`--pl${r}`]=a),s&&(e[`--pb${r}`]=s),l&&(e[`--pr${r}`]=l)}},getAttrValue=(e,t,r)=>{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&&r&&constant.layoutComponent.includes(r))return"grid";return"block";default:return t}},postPurchasePaddingMapping={loose:"21px",extraLoose:"38px",tight:"9px",extraTight:"5px",base:"14px"},composeAdvanceStyleForPostPurchase=(e,t)=>{if(!e)return{};let r={};return Object.keys(e).forEach(o=>{let a=e[o];if("blockPadding"===o){let e=postPurchasePaddingMapping[a];r["--pb"]=getAttrValue(o,e,t),r["--pt"]=getAttrValue(o,e,t),r["--mb"]="0px",r["--mt"]="0px"}if("inlinePadding"===o){let e=postPurchasePaddingMapping[a];r["--pl"]=getAttrValue(o,e,t),r["--pr"]=getAttrValue(o,e,t)}}),r};function composeAdvanceStyle(e,t,r){if(!e)return{};let o={"--pos":"relative"},a=["desktop","tablet","mobile"],s=["hover","normal"];Object.keys(e).forEach(l=>{let n=e[l];if("cssClass"===l||null==n)return;let i=e.hasBoxShadow?e.hasBoxShadow:{};if("object"==typeof n){if(Array.isArray(n))return;Object.keys(n).forEach(r=>{if(a.includes(r)){let e=n[r];if(void 0!==e){if("border"===l&&Object.assign(o,borders.handleConvertBorderStyle(n),borders.handleConvertBorderWidth(n),borders.handleConvertBorderColor(n)),"rounded"===l&&Object.assign(o,radius.composeRadius(n)),"pos"==l&&"static"==e&&(e="relative"),"desktop"===r)switch(l){case"padding":composeSpacing({source:o,spacing:e,type:"p"});break;case"margin":composeSpacing({source:o,spacing:e,type:"m"});break;case"spacing-setting":composeSpacingV2({source:o,spacing:e,tag:t});break;case"m":case"p":break;default:o[`--${l}`]=getAttrValue(l,e,t)}else switch(l){case"padding":composeSpacing({source:o,spacing:e,type:"p",suffix:`-${r}`});break;case"margin":composeSpacing({source:o,spacing:e,type:"m",suffix:`-${r}`});break;case"spacing-setting":composeSpacingV2({source:o,spacing:e,suffix:`-${r}`,tag:t});break;case"m":case"p":break;default:o[`--${l}-${r}`]=getAttrValue(l,e,t)}}}else if(s.includes(r))switch(l){case"hasBoxShadow":break;case"boxShadow":Object.assign(o,shadow.getStyleShadowState(n,"box-shadow",i))}else"border"===l&&("none"===n.border&&(n.border="solid",n.color="#121212",n.isCustom=!0,n.width="0px",n.position="all"),Object.assign(o,borders.getBorderStyle(n))),"rounded"===l&&Object.assign(o,radius.getCornerCSSFromGlobal(n)),"hasBoxShadow"===l&&Object.assign(o,shadow.getStyleShadow({value:e.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:e.hasBoxShadow})),"boxShadow"===l&&Object.assign(o,shadow.getStyleShadow({value:n,styleAppliedFor:"box-shadow",isEnableShadow:e.hasBoxShadow}))})}else o[`--${l}`]=getAttrValue(l,n,t),"hasBoxShadow"===l&&e.boxShadow&&Object.assign(o,shadow.getStyleShadow({value:e.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:e.hasBoxShadow}));if("blockPadding"===l&&"POST_PURCHASE"===r){let e=postPurchasePaddingMapping[n];o["--pb"]=getAttrValue(l,e,t),o["--pt"]=getAttrValue(l,e,t),o["--mb"]="0px",o["--mt"]="0px"}if("inlinePadding"===l&&"POST_PURCHASE"===r){let e=postPurchasePaddingMapping[n];o["--pl"]=getAttrValue(l,e,t),o["--pr"]=getAttrValue(l,e,t)}});let l="POST_PURCHASE"===r?composeAdvanceStyleForPostPurchase(e,t):{};return{...o,...l}}const splitStyle=(e,t={})=>{let r=e.map(e=>makeStyle.makeStyleKey(e)).flat(),o=Object.keys(t).filter(e=>r.includes(e)),a=o.reduce((e,r)=>({...e,[r]:t[r]}),{}),s=Object.keys(t).filter(e=>!o.includes(e)).reduce((e,r)=>({...e,[r]:t[r]}),{});return[a,s]},filterAttrInStyle=(e,t)=>{if(!e||!t)return{};let r={...e};return Object.entries(r).forEach(([e])=>{t.includes(e)||delete r[e]}),r},removeAttrInStyle=(e,t)=>{if(!e||!t)return{};let r={...e};return Object.entries(r).forEach(([e])=>{t.includes(e)&&delete r[e]}),r},filterCornerInStyle=e=>{let t=["--bblr","--bbrr","--btlr","--btrr"];return filterAttrInStyle(e,t)},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.filterAttrInStyle=filterAttrInStyle,exports.filterCornerInStyle=filterCornerInStyle,exports.removeAttrInStyle=removeAttrInStyle,exports.removePaddingYInStyle=removePaddingYInStyle,exports.splitStyle=splitStyle;

package/dist/cjs/helpers/typography.js

@@ -14,4 +14,4 @@
   ${n?`font-style: italic${c};`:""}
   ${g?`text-decoration-line: underline ${c};`:""}
   ${m?`text-transform: ${m} ${c};`:""}
-  `};function getCustomCSSByDevice(e,o){if(!e||!o)return{};let t="desktop"!==o&&o?`-${o}`:"",{fontFamily:p}=e?.[o]??{};return{[`--size${t}`]:e?.[o]?.fontSize,[`--lh${t}`]:e?.[o]?.lineHeight,[`--fs${t}`]:e?.[o]?.fontStyle,[`--ff${t}`]:p?`var(--g-font-${p}, ${p})`:void 0,[`--weight${t}`]:e?.[o]?.fontWeight,[`--ls${t}`]:e?.[o]?.letterSpacing}}const composeTypography=e=>e?makeStyle.removeNullUndefined({...getCustomCSSByDevice(e,"desktop"),...getCustomCSSByDevice(e,"tablet"),...getCustomCSSByDevice(e,"mobile")}):{},composeTypographyV2=(e,o)=>e?makeStyle.removeNullUndefined({...makeStyle.makeStyle({fs:o?.italic?void 0:e?.fontStyle,ff:e?.fontFamily?`var(--g-font-${e.fontFamily.replace(/ /g,"-")}, '${e.fontFamily}'), ${e.fallbackFontFamily}`:void 0,weight:o?.bold?void 0:e?.fontWeight,ls:e?.letterSpacing,lh:e?.lineHeight}),...makeStyle.makeStyleResponsive("size",e?.fontSize)}):{},composeTypographyAttr=e=>e?makeStyle.removeNullUndefined({...makeStyle.makeStyle({fs:e?.italic?"italic":void 0,weight:e?.bold?"bold":void 0,c:colors.getSingleColorVariable(e?.color),tt:e?.transform,tdl:e?.underline?"underline":void 0})}):{},composeTypographyClassName=(e,o)=>e?e?.type&&!e.custom?genTypoClass(e.type):"":o?.type&&genTypoClass(o?.type),composeFallbackTypographyStyle=e=>["heading","heading-1","heading-2","heading-3","heading-4","heading-5","heading-6"].includes(e)?"var(--g-font-heading, heading)":"var(--g-font-body, body)",composeTypographyStyle=(e,o,t)=>{if(e){let o=composeFallbackTypographyStyle(e.type??"heading"),p={...e.custom,fallbackFontFamily:o};return{...composeTypographyV2(p,e.attrs),...!t&&composeTypographyAttr(e.attrs)}}return{...o?.type?{}:composeTypography(o?.custom)}};exports.composeFallbackTypographyStyle=composeFallbackTypographyStyle,exports.composeTypography=composeTypography,exports.composeTypographyAttr=composeTypographyAttr,exports.composeTypographyClassName=composeTypographyClassName,exports.composeTypographyCss=composeTypographyCss,exports.composeTypographyStyle=composeTypographyStyle,exports.composeTypographyV2=composeTypographyV2,exports.composeTypographyV2Css=composeTypographyV2Css,exports.genTypoClass=genTypoClass;
+  `};function getCustomCSSByDevice(e,o){if(!e||!o)return{};let t="desktop"!==o&&o?`-${o}`:"",{fontFamily:p}=e?.[o]??{};return{[`--size${t}`]:e?.[o]?.fontSize,[`--lh${t}`]:e?.[o]?.lineHeight,[`--fs${t}`]:e?.[o]?.fontStyle,[`--ff${t}`]:p?`var(--g-font-${p}, ${p})`:void 0,[`--weight${t}`]:e?.[o]?.fontWeight,[`--ls${t}`]:e?.[o]?.letterSpacing}}const composeTypography=e=>e?makeStyle.removeNullUndefined({...getCustomCSSByDevice(e,"desktop"),...getCustomCSSByDevice(e,"tablet"),...getCustomCSSByDevice(e,"mobile")}):{},composeTypographyV2=(e,o)=>e?makeStyle.removeNullUndefined({...makeStyle.makeStyle({fs:o?.italic?void 0:e?.fontStyle,ff:e?.fontFamily?`var(--g-font-${e.fontFamily.replace(/ /g,"-")}, '${e.fontFamily}'), ${e.fallbackFontFamily}`:void 0,weight:o?.bold?void 0:e?.fontWeight,ls:e?.letterSpacing,lh:e?.lineHeight}),...makeStyle.makeStyleResponsive("size",e?.fontSize)}):{},composeTypographyAttr=e=>e?makeStyle.removeNullUndefined({...makeStyle.makeStyle({fs:e?.italic?"italic":void 0,weight:e?.bold?"bold":void 0,c:colors.getSingleColorVariable(e?.color),tt:e?.transform,tdl:e?.underline?"underline":void 0})}):{},composeTypographyClassName=(e,o)=>e?e?.type&&!e.custom?genTypoClass(e.type):"":o?.type&&genTypoClass(o?.type),composeFallbackTypographyStyle=e=>["heading","heading-1","heading-2","heading-3","heading-4","heading-5","heading-6"].includes(e)?"var(--g-font-heading, heading)":"var(--g-font-body, body)",composeTypographyStyle=(e,o,t)=>{if(e){let o=composeFallbackTypographyStyle(e.type??"heading"),p={...e.custom,fallbackFontFamily:o};return{...composeTypographyV2(p,e.attrs),...!t&&composeTypographyAttr(e.attrs)}}return{...o?.type?{}:composeTypography(o?.custom)}};exports.composeFallbackTypographyStyle=composeFallbackTypographyStyle,exports.composeTypography=composeTypography,exports.composeTypographyAttr=composeTypographyAttr,exports.composeTypographyClassName=composeTypographyClassName,exports.composeTypographyCss=composeTypographyCss,exports.composeTypographyStyle=composeTypographyStyle,exports.composeTypographyV2=composeTypographyV2,exports.composeTypographyV2Css=composeTypographyV2Css,exports.genTypoClass=genTypoClass;

package/dist/esm/components/ComponentWrapperPreview.js

@@ -1 +1 @@
-import{jsxs as e,Fragment as t,jsx as o}from"react/jsx-runtime";import{useEffect as a,isValidElement as n}from"react";import{composeAdvanceStyle as d}from"../helpers/compose-advance-style.js";import{disableWrap as r,excludeApplyStyle as i}from"./constant.js";import p from"./RenderCustomCode.js";import{ComponentToolbarPreview as l}from"./ComponentToolbarPreview.js";import c from"../hooks/animation/useApplyAnimation.js";let ComponentWrapperPreview=({children:s,...m})=>{if(a(()=>{let e=new CustomEvent("editor:component:render",{bubbles:!0,detail:{componentUid:m.uid}});window.dispatchEvent(e)},[m.uid]),c({props:m}),"section"===m.type)return null;let b={};if("Section"===m.tag&&m.isThemeSection&&(b["data-theme-section"]=!0),m.editorConfigs){let e=m.editorConfigs;e.placeholder?.notAppendBeforeAfter&&(b["data-placeholder-not-append-before-after"]=!0),e.placeholder?.notAppendLeftRight&&(b["data-placeholder-not-append-left-right"]=!0),e.toolbar?.parent&&(b["data-toolbar-parent"]=!0),e.component?.noDelete&&(b["data-component-no-delete"]=!0),e.component?.noDuplicate&&(b["data-component-no-duplicate"]=!0),e.component?.noDragDrop&&(b["data-component-no-drag-drop"]=!0),e.component?.noSetting&&(b["data-component-no-setting"]=!0),e.component?.isThirdParty&&(b["data-component-is-third-party"]=!0),e.toolbar?.hide&&(b["data-toolbar-hide"]=!0),e.slots?.children&&(b["data-slots-children"]=!0),e.toolbar?.hide||(b["data-toolbar-wrap"]=!0)}m?.editorConfigs?.toolbar?.hide||(b["data-toolbar-wrap"]=!0);let h=d(m.advanced,m.tag),u=m.advanced,f={...b,"data-uid":m.uid,"data-component-type":"component","data-component-tag":m.tag,"data-component-label":m.label};return r.includes(m.tag)&&n(s)?e(t,{children:[o(p,{uid:m.uid,advanced:u}),e(s.type,{className:u?.cssClass,...s.props,style:h,builderAttrs:f,advanced:u,children:[s.props.children,o(l,{...m})]})]}):e(t,{children:[o(p,{uid:m.uid,advanced:u}),e("div",{style:i.includes(m.tag)?{"--mb":h?.["--mb"],"--mb-tablet":h?.["--mb-tablet"],"--mb-mobile":h?.["--mb-mobile"]}:h,className:`${m.uid} ${m.advanced?.cssClass?m.advanced?.cssClass:""}`,...f,children:[!i.includes(m.tag)&&s,n(s)&&i.includes(m.tag)&&o(s.type,{...s.props,style:h,advanced:u}),o(l,{...m})]})]})};export{ComponentWrapperPreview as default};
+import{jsxs as e,Fragment as t,jsx as o}from"react/jsx-runtime";import{useEffect as a,isValidElement as n}from"react";import{composeAdvanceStyle as r}from"../helpers/compose-advance-style.js";import{disableWrap as d,excludeApplyStyle as i}from"./constant.js";import p from"./RenderCustomCode.js";import{ComponentToolbarPreview as l}from"./ComponentToolbarPreview.js";import s from"../hooks/animation/useApplyAnimation.js";import"zustand";import"swr";import"@gem-sdk/adapter-shopify";import"swr/mutation";import{usePageType as m}from"../hooks/shop.js";import"vanilla-lazyload";import"../hooks/useCartUI.js";import"../helpers/convert.js";let ComponentWrapperPreview=({children:c,...h})=>{a(()=>{let e=new CustomEvent("editor:component:render",{bubbles:!0,detail:{componentUid:h.uid}});window.dispatchEvent(e)},[h.uid]),s({props:h});let u=m();if("section"===h.type)return null;let b={};if("Section"===h.tag&&h.isThemeSection&&(b["data-theme-section"]=!0),h.editorConfigs){let e=h.editorConfigs;e.placeholder?.notAppendBeforeAfter&&(b["data-placeholder-not-append-before-after"]=!0),e.placeholder?.notAppendLeftRight&&(b["data-placeholder-not-append-left-right"]=!0),e.toolbar?.parent&&(b["data-toolbar-parent"]=!0),e.component?.noDelete&&(b["data-component-no-delete"]=!0),e.component?.noDuplicate&&(b["data-component-no-duplicate"]=!0),e.component?.noDragDrop&&(b["data-component-no-drag-drop"]=!0),e.component?.noSetting&&(b["data-component-no-setting"]=!0),e.component?.isThirdParty&&(b["data-component-is-third-party"]=!0),e.toolbar?.hide&&(b["data-toolbar-hide"]=!0),e.slots?.children&&(b["data-slots-children"]=!0),e.toolbar?.hide||(b["data-toolbar-wrap"]=!0)}h?.editorConfigs?.toolbar?.hide||(b["data-toolbar-wrap"]=!0);let f=r(h.advanced,h.tag,u),g=h.advanced,v={...b,"data-uid":h.uid,"data-component-type":"component","data-component-tag":h.tag,"data-component-label":h.label};return d.includes(h.tag)&&n(c)?e(t,{children:[o(p,{uid:h.uid,advanced:g}),e(c.type,{className:g?.cssClass,...c.props,style:f,builderAttrs:v,advanced:g,children:[c.props.children,o(l,{...h})]})]}):e(t,{children:[o(p,{uid:h.uid,advanced:g}),e("div",{style:i.includes(h.tag)?{"--mb":f?.["--mb"],"--mb-tablet":f?.["--mb-tablet"],"--mb-mobile":f?.["--mb-mobile"]}:f,className:`${h.uid} ${h.advanced?.cssClass?h.advanced?.cssClass:""}`,...v,children:[!i.includes(h.tag)&&c,n(c)&&i.includes(h.tag)&&o(c.type,{...c.props,style:f,advanced:g}),o(l,{...h})]})]})};export{ComponentWrapperPreview as default};

package/dist/esm/helpers/colors.js

@@ -1 +1 @@
-import{isDefined as t}from"./is-defined.js";import{stateMapping as e}from"./constant.js";let getGlobalColorCSSProp=t=>getSingleColorVariable(t),getGlobalColorClass=(t,e)=>"string"!=typeof e||!e||e?.startsWith("#")||e?.startsWith("rgb")||e?.startsWith("hsl")||e?.startsWith("transparent")?"":`${t}-g-${e}`,getGlobalColorResponsiveClass=(e,o)=>o?Object.entries(o).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"desktop"===t?l:`${t}:${l}`}).filter(t).join(" "):"",getGlobalColorStateClass=(e,o)=>o?Object.entries(o).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?l:`${t}:${l}`}).filter(t).join(" "):"",getGlobalColorStateClassDynamicBtn=(e,o)=>o?Object.entries(o).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${l}`:String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${t}:${l}`}).filter(t).join(" "):"",getGlobalColorStateResponsiveClass=(e,o)=>o?Object.entries(o).map(([o,l])=>"desktop"===o?Object.entries(l).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?l:`${t}:${l}`}).filter(t).join(" "):Object.entries(l).map(([t,l])=>{let r=getGlobalColorClass(e,l);if(r)return"normal"===t?`${o}:${r}`:`${o}:${t}:${r}`}).filter(t).join(" ")).filter(Boolean).join(" "):"",getGlobalColorStateResponsiveClassDynamicBtn=(e,o)=>o?Object.entries(o).map(([o,l])=>"desktop"===o?Object.entries(l).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${l}`:String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${t}:${l}`}).filter(t).join(" "):Object.entries(l).map(([t,l])=>{let r=getGlobalColorClass(e,l);if(r)return"normal"===t?String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${o}:${r}`:String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${o}:${t}:${r}`}).filter(t).join(" ")).filter(Boolean).join(" "):"",getGlobalColorResponsiveStyle=(t,e)=>e?Object.fromEntries(Object.entries(e).map(([e,o])=>"desktop"===e?[`--${t}`,getSingleColorVariable(o)]:[`--${t}-${e}`,getSingleColorVariable(o)])):{},getGlobalColorStateStyle=(o,l)=>l?Object.fromEntries(Object.entries(l).map(([t,l])=>"active"===t?[]:[`-${e?.[t]}-${o}`,getSingleColorVariable(l)]).filter(t)):{},getGlobalColorStateResponsiveStyle=(o,l)=>l?Object.entries(l).map(([l,r])=>"desktop"===l?Object.fromEntries(Object.entries(r).map(([t,l])=>"active"===t?[]:[`-${e[t]}-${o}`,getSingleColorVariable(l)]).filter(t)):Object.fromEntries(Object.entries(r).map(([t,r])=>"active"===t?[]:[`-${e[t]}-${o}-${l}`,getSingleColorVariable(r)]).filter(t))).reduce((t,e)=>({...t,...e}),{}):{},getSingleColorVariable=t=>{if(t&&"string"==typeof t)return isColor(t)?t:`var(--g-c-${t}, ${t})`};function isColor(t){return t?.startsWith("#")||t?.startsWith("rgb")||t?.startsWith("hsl")||t?.startsWith("transparent")}let getGlobalColorStyle=t=>t?{"--c":getSingleColorVariable(t)}:{},composeTextColorCss=t=>`${t?`color: ${getSingleColorVariable(t)} !important;`:""}`;export{composeTextColorCss,getGlobalColorCSSProp,getGlobalColorClass,getGlobalColorResponsiveClass,getGlobalColorResponsiveStyle,getGlobalColorStateClass,getGlobalColorStateClassDynamicBtn,getGlobalColorStateResponsiveClass,getGlobalColorStateResponsiveClassDynamicBtn,getGlobalColorStateResponsiveStyle,getGlobalColorStateStyle,getGlobalColorStyle,getSingleColorVariable,isColor};
+import{isDefined as t}from"./is-defined.js";import{stateMapping as e}from"./constant.js";let getGlobalColorCSSProp=t=>getSingleColorVariable(t),getGlobalColorClass=(t,e)=>"string"!=typeof e||!e||e?.startsWith("#")||e?.startsWith("rgb")||e?.startsWith("hsl")||e?.startsWith("transparent")?"":`${t}-g-${e}`,getGlobalColorResponsiveClass=(e,o)=>o?Object.entries(o).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"desktop"===t?l:`${t}:${l}`}).filter(t).join(" "):"",getGlobalColorStateClass=(e,o)=>o?Object.entries(o).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?l:`${t}:${l}`}).filter(t).join(" "):"",getGlobalColorStateClassDynamicBtn=(e,o)=>o?Object.entries(o).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${l}`:String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${t}:${l}`}).filter(t).join(" "):"",getGlobalColorStateResponsiveClass=(e,o)=>o?Object.entries(o).map(([o,l])=>"desktop"===o?Object.entries(l).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?l:`${t}:${l}`}).filter(t).join(" "):Object.entries(l).map(([t,l])=>{let r=getGlobalColorClass(e,l);if(r)return"normal"===t?`${o}:${r}`:`${o}:${t}:${r}`}).filter(t).join(" ")).filter(Boolean).join(" "):"",getGlobalColorStateResponsiveClassDynamicBtn=(e,o)=>o?Object.entries(o).map(([o,l])=>"desktop"===o?Object.entries(l).map(([t,o])=>{let l=getGlobalColorClass(e,o);if(l)return"normal"===t?String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${l}`:String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${t}:${l}`}).filter(t).join(" "):Object.entries(l).map(([t,l])=>{let r=getGlobalColorClass(e,l);if(r)return"normal"===t?String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${o}:${r}`:String.raw`[&_.shopify-payment-button\_\_button--unbranded]:${o}:${t}:${r}`}).filter(t).join(" ")).filter(Boolean).join(" "):"",getGlobalColorResponsiveStyle=(t,e)=>e?Object.fromEntries(Object.entries(e).map(([e,o])=>"desktop"===e?[`--${t}`,getSingleColorVariable(o)]:[`--${t}-${e}`,getSingleColorVariable(o)])):{},getGlobalColorStateStyle=(o,l)=>l?Object.fromEntries(Object.entries(l).map(([t,l])=>"active"===t?[]:[`-${e?.[t]}-${o}`,getSingleColorVariable(l)]).filter(t)):{},getGlobalColorStateResponsiveStyle=(o,l)=>l?Object.entries(l).map(([l,r])=>"desktop"===l?Object.fromEntries(Object.entries(r).map(([t,l])=>"active"===t?[]:[`-${e[t]}-${o}`,getSingleColorVariable(l)]).filter(t)):Object.fromEntries(Object.entries(r).map(([t,r])=>"active"===t?[]:[`-${e[t]}-${o}-${l}`,getSingleColorVariable(r)]).filter(t))).reduce((t,e)=>({...t,...e}),{}):{},getSingleColorVariable=t=>{if(t&&"string"==typeof t)return isColor(t)?t:`var(--g-c-${t}, ${t})`};function isColor(t){return!!t&&"string"==typeof t&&(t?.startsWith("#")||t?.startsWith("rgb")||t?.startsWith("hsl")||t?.startsWith("transparent"))}let getGlobalColorStyle=t=>t?{"--c":getSingleColorVariable(t)}:{},composeTextColorCss=t=>`${t?`color: ${getSingleColorVariable(t)} !important;`:""}`;export{composeTextColorCss,getGlobalColorCSSProp,getGlobalColorClass,getGlobalColorResponsiveClass,getGlobalColorResponsiveStyle,getGlobalColorStateClass,getGlobalColorStateClassDynamicBtn,getGlobalColorStateResponsiveClass,getGlobalColorStateResponsiveClassDynamicBtn,getGlobalColorStateResponsiveStyle,getGlobalColorStateStyle,getGlobalColorStyle,getSingleColorVariable,isColor};

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

@@ -1 +1 @@
-import{handleConvertBorderStyle as e,handleConvertBorderWidth as t,handleConvertBorderColor as r,getBorderStyle as a}from"./borders.js";import{isColor as s}from"./colors.js";import{layoutComponent as o}from"./constant.js";import{makeStyleKey as i}from"./make-style.js";import{composeRadius as l,getCornerCSSFromGlobal as n}from"./radius.js";import{getStyleShadowState as c,getStyleShadow as p}from"./shadow.js";let composeSpacing=({source:e,spacing:t,type:r,suffix:a=""})=>{let{top:s,left:o,bottom:i,right:l}=t;s&&(e[`--${r}t${a}`]=s),o&&(e[`--${r}l${a}`]=o),i&&(e[`--${r}b${a}`]=i),l&&(e[`--${r}r${a}`]=l)},composeSpacingV2=({source:e,spacing:t,suffix:r="",tag:a=""})=>{if(t&&t.margin){let{top:s,left:i,bottom:l,right:n}=t.margin;s&&(e[`--mt${r}`]=s),i&&(e[`--ml${r}`]=o.includes(a)&&"0px"===i?"auto":i),l&&(e[`--mb${r}`]=l),n&&(e[`--mr${r}`]=o.includes(a)&&"0px"===n?"auto":n)}if(t&&t.padding){let{top:a,left:s,bottom:o,right:i}=t.padding;a&&(e[`--pt${r}`]=a),s&&(e[`--pl${r}`]=s),o&&(e[`--pb${r}`]=o),i&&(e[`--pr${r}`]=i)}},getAttrValue=(e,t,r)=>{if(null!=t)switch(e){case"bgc":case"c":return s(t.toString())?t:`var(--g-c-${t})`;case"d":if(!t)return"none";if(t&&r&&o.includes(r))return"grid";return"block";default:return t}},postPurchasePaddingMapping={loose:"21px",extraLoose:"38px",tight:"9px",extraTight:"5px",base:"14px"},composeAdvanceStyleForPostPurchase=(e,t)=>{if(!e)return{};let r={};return Object.keys(e).forEach(a=>{let s=e[a];if("blockPadding"===a){let e=postPurchasePaddingMapping[s];r["--pb"]=getAttrValue(a,e,t),r["--pt"]=getAttrValue(a,e,t),r["--mb"]="0px",r["--mt"]="0px"}if("inlinePadding"===a){let e=postPurchasePaddingMapping[s];r["--pl"]=getAttrValue(a,e,t),r["--pr"]=getAttrValue(a,e,t)}}),r};function composeAdvanceStyle(s,o){if(!s)return{};let i={"--pos":"relative"},d=["desktop","tablet","mobile"],u=["hover","normal"];Object.keys(s).forEach(b=>{let g=s[b];if("cssClass"===b||null==g)return;let m=s.hasBoxShadow?s.hasBoxShadow:{};if("object"==typeof g){if(Array.isArray(g))return;Object.keys(g).forEach(f=>{if(d.includes(f)){let a=g[f];if(void 0!==a){if("border"===b&&Object.assign(i,e(g),t(g),r(g)),"rounded"===b&&Object.assign(i,l(g)),"pos"==b&&"static"==a&&(a="relative"),"desktop"===f)switch(b){case"padding":composeSpacing({source:i,spacing:a,type:"p"});break;case"margin":composeSpacing({source:i,spacing:a,type:"m"});break;case"spacing-setting":composeSpacingV2({source:i,spacing:a,tag:o});break;case"m":case"p":break;default:i[`--${b}`]=getAttrValue(b,a,o)}else switch(b){case"padding":composeSpacing({source:i,spacing:a,type:"p",suffix:`-${f}`});break;case"margin":composeSpacing({source:i,spacing:a,type:"m",suffix:`-${f}`});break;case"spacing-setting":composeSpacingV2({source:i,spacing:a,suffix:`-${f}`,tag:o});break;case"m":case"p":break;default:i[`--${b}-${f}`]=getAttrValue(b,a,o)}}}else if(u.includes(f))switch(b){case"hasBoxShadow":break;case"boxShadow":Object.assign(i,c(g,"box-shadow",m))}else"border"===b&&("none"===g.border&&(g.border="solid",g.color="#121212",g.isCustom=!0,g.width="0px",g.position="all"),Object.assign(i,a(g))),"rounded"===b&&Object.assign(i,n(g)),"hasBoxShadow"===b&&Object.assign(i,p({value:s.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:s.hasBoxShadow})),"boxShadow"===b&&Object.assign(i,p({value:g,styleAppliedFor:"box-shadow",isEnableShadow:s.hasBoxShadow}))})}else i[`--${b}`]=getAttrValue(b,g,o),"hasBoxShadow"===b&&s.boxShadow&&Object.assign(i,p({value:s.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:s.hasBoxShadow}));if("blockPadding"===b){let e=postPurchasePaddingMapping[g];i["--pb"]=getAttrValue(b,e,o),i["--pt"]=getAttrValue(b,e,o),i["--mb"]="0px",i["--mt"]="0px"}if("inlinePadding"===b){let e=postPurchasePaddingMapping[g];i["--pl"]=getAttrValue(b,e,o),i["--pr"]=getAttrValue(b,e,o)}});let b=composeAdvanceStyleForPostPurchase(s,o);return{...i,...b}}let splitStyle=(e,t={})=>{let r=e.map(e=>i(e)).flat(),a=Object.keys(t).filter(e=>r.includes(e)),s=a.reduce((e,r)=>({...e,[r]:t[r]}),{}),o=Object.keys(t).filter(e=>!a.includes(e)).reduce((e,r)=>({...e,[r]:t[r]}),{});return[s,o]},filterAttrInStyle=(e,t)=>{if(!e||!t)return{};let r={...e};return Object.entries(r).forEach(([e])=>{t.includes(e)||delete r[e]}),r},removeAttrInStyle=(e,t)=>{if(!e||!t)return{};let r={...e};return Object.entries(r).forEach(([e])=>{t.includes(e)&&delete r[e]}),r},filterCornerInStyle=e=>{let t=["--bblr","--bbrr","--btlr","--btrr"];return filterAttrInStyle(e,t)},removePaddingYInStyle=e=>{let t=["--pt","--pt-tablet","--pt-mobile","--pb","--pb-tablet","--pb-mobile"];return removeAttrInStyle(e,t)};export{composeAdvanceStyle,composeAdvanceStyleForPostPurchase,filterAttrInStyle,filterCornerInStyle,removeAttrInStyle,removePaddingYInStyle,splitStyle};
+import{handleConvertBorderStyle as e,handleConvertBorderWidth as t,handleConvertBorderColor as r,getBorderStyle as a}from"./borders.js";import{isColor as s}from"./colors.js";import{layoutComponent as o}from"./constant.js";import{makeStyleKey as i}from"./make-style.js";import{composeRadius as l,getCornerCSSFromGlobal as n}from"./radius.js";import{getStyleShadowState as c,getStyleShadow as p}from"./shadow.js";let composeSpacing=({source:e,spacing:t,type:r,suffix:a=""})=>{let{top:s,left:o,bottom:i,right:l}=t;s&&(e[`--${r}t${a}`]=s),o&&(e[`--${r}l${a}`]=o),i&&(e[`--${r}b${a}`]=i),l&&(e[`--${r}r${a}`]=l)},composeSpacingV2=({source:e,spacing:t,suffix:r="",tag:a=""})=>{if(t&&t.margin){let{top:s,left:i,bottom:l,right:n}=t.margin;s&&(e[`--mt${r}`]=s),i&&(e[`--ml${r}`]=o.includes(a)&&"0px"===i?"auto":i),l&&(e[`--mb${r}`]=l),n&&(e[`--mr${r}`]=o.includes(a)&&"0px"===n?"auto":n)}if(t&&t.padding){let{top:a,left:s,bottom:o,right:i}=t.padding;a&&(e[`--pt${r}`]=a),s&&(e[`--pl${r}`]=s),o&&(e[`--pb${r}`]=o),i&&(e[`--pr${r}`]=i)}},getAttrValue=(e,t,r)=>{if(null!=t)switch(e){case"bgc":case"c":return s(t.toString())?t:`var(--g-c-${t})`;case"d":if(!t)return"none";if(t&&r&&o.includes(r))return"grid";return"block";default:return t}},postPurchasePaddingMapping={loose:"21px",extraLoose:"38px",tight:"9px",extraTight:"5px",base:"14px"},composeAdvanceStyleForPostPurchase=(e,t)=>{if(!e)return{};let r={};return Object.keys(e).forEach(a=>{let s=e[a];if("blockPadding"===a){let e=postPurchasePaddingMapping[s];r["--pb"]=getAttrValue(a,e,t),r["--pt"]=getAttrValue(a,e,t),r["--mb"]="0px",r["--mt"]="0px"}if("inlinePadding"===a){let e=postPurchasePaddingMapping[s];r["--pl"]=getAttrValue(a,e,t),r["--pr"]=getAttrValue(a,e,t)}}),r};function composeAdvanceStyle(s,o,i){if(!s)return{};let d={"--pos":"relative"},u=["desktop","tablet","mobile"],b=["hover","normal"];Object.keys(s).forEach(g=>{let m=s[g];if("cssClass"===g||null==m)return;let f=s.hasBoxShadow?s.hasBoxShadow:{};if("object"==typeof m){if(Array.isArray(m))return;Object.keys(m).forEach(i=>{if(u.includes(i)){let a=m[i];if(void 0!==a){if("border"===g&&Object.assign(d,e(m),t(m),r(m)),"rounded"===g&&Object.assign(d,l(m)),"pos"==g&&"static"==a&&(a="relative"),"desktop"===i)switch(g){case"padding":composeSpacing({source:d,spacing:a,type:"p"});break;case"margin":composeSpacing({source:d,spacing:a,type:"m"});break;case"spacing-setting":composeSpacingV2({source:d,spacing:a,tag:o});break;case"m":case"p":break;default:d[`--${g}`]=getAttrValue(g,a,o)}else switch(g){case"padding":composeSpacing({source:d,spacing:a,type:"p",suffix:`-${i}`});break;case"margin":composeSpacing({source:d,spacing:a,type:"m",suffix:`-${i}`});break;case"spacing-setting":composeSpacingV2({source:d,spacing:a,suffix:`-${i}`,tag:o});break;case"m":case"p":break;default:d[`--${g}-${i}`]=getAttrValue(g,a,o)}}}else if(b.includes(i))switch(g){case"hasBoxShadow":break;case"boxShadow":Object.assign(d,c(m,"box-shadow",f))}else"border"===g&&("none"===m.border&&(m.border="solid",m.color="#121212",m.isCustom=!0,m.width="0px",m.position="all"),Object.assign(d,a(m))),"rounded"===g&&Object.assign(d,n(m)),"hasBoxShadow"===g&&Object.assign(d,p({value:s.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:s.hasBoxShadow})),"boxShadow"===g&&Object.assign(d,p({value:m,styleAppliedFor:"box-shadow",isEnableShadow:s.hasBoxShadow}))})}else d[`--${g}`]=getAttrValue(g,m,o),"hasBoxShadow"===g&&s.boxShadow&&Object.assign(d,p({value:s.boxShadow,styleAppliedFor:"box-shadow",isEnableShadow:s.hasBoxShadow}));if("blockPadding"===g&&"POST_PURCHASE"===i){let e=postPurchasePaddingMapping[m];d["--pb"]=getAttrValue(g,e,o),d["--pt"]=getAttrValue(g,e,o),d["--mb"]="0px",d["--mt"]="0px"}if("inlinePadding"===g&&"POST_PURCHASE"===i){let e=postPurchasePaddingMapping[m];d["--pl"]=getAttrValue(g,e,o),d["--pr"]=getAttrValue(g,e,o)}});let g="POST_PURCHASE"===i?composeAdvanceStyleForPostPurchase(s,o):{};return{...d,...g}}let splitStyle=(e,t={})=>{let r=e.map(e=>i(e)).flat(),a=Object.keys(t).filter(e=>r.includes(e)),s=a.reduce((e,r)=>({...e,[r]:t[r]}),{}),o=Object.keys(t).filter(e=>!a.includes(e)).reduce((e,r)=>({...e,[r]:t[r]}),{});return[s,o]},filterAttrInStyle=(e,t)=>{if(!e||!t)return{};let r={...e};return Object.entries(r).forEach(([e])=>{t.includes(e)||delete r[e]}),r},removeAttrInStyle=(e,t)=>{if(!e||!t)return{};let r={...e};return Object.entries(r).forEach(([e])=>{t.includes(e)&&delete r[e]}),r},filterCornerInStyle=e=>{let t=["--bblr","--bbrr","--btlr","--btrr"];return filterAttrInStyle(e,t)},removePaddingYInStyle=e=>{let t=["--pt","--pt-tablet","--pt-mobile","--pb","--pb-tablet","--pb-mobile"];return removeAttrInStyle(e,t)};export{composeAdvanceStyle,composeAdvanceStyleForPostPurchase,filterAttrInStyle,filterCornerInStyle,removeAttrInStyle,removePaddingYInStyle,splitStyle};

package/dist/esm/helpers/typography.js

@@ -14,4 +14,4 @@ import{getSingleColorVariable as o}from"./colors.js";import{removeNullUndefined
   ${r?`font-style: italic${$};`:""}
   ${g?`text-decoration-line: underline ${$};`:""}
   ${c?`text-transform: ${c} ${$};`:""}
-  `};function getCustomCSSByDevice(o,e){if(!o||!e)return{};let t="desktop"!==e&&e?`-${e}`:"",{fontFamily:p}=o?.[e]??{};return{[`--size${t}`]:o?.[e]?.fontSize,[`--lh${t}`]:o?.[e]?.lineHeight,[`--fs${t}`]:o?.[e]?.fontStyle,[`--ff${t}`]:p?`var(--g-font-${p}, ${p})`:void 0,[`--weight${t}`]:o?.[e]?.fontWeight,[`--ls${t}`]:o?.[e]?.letterSpacing}}let composeTypography=o=>o?e({...getCustomCSSByDevice(o,"desktop"),...getCustomCSSByDevice(o,"tablet"),...getCustomCSSByDevice(o,"mobile")}):{},composeTypographyV2=(o,a)=>o?e({...t({fs:a?.italic?void 0:o?.fontStyle,ff:o?.fontFamily?`var(--g-font-${o.fontFamily.replace(/ /g,"-")}, '${o.fontFamily}'), ${o.fallbackFontFamily}`:void 0,weight:a?.bold?void 0:o?.fontWeight,ls:o?.letterSpacing,lh:o?.lineHeight}),...p("size",o?.fontSize)}):{},composeTypographyAttr=p=>p?e({...t({fs:p?.italic?"italic":void 0,weight:p?.bold?"bold":void 0,c:o(p?.color),tt:p?.transform,tdl:p?.underline?"underline":void 0})}):{},composeTypographyClassName=(o,e)=>o?o?.type&&!o.custom?genTypoClass(o.type):"":e?.type&&genTypoClass(e?.type),composeFallbackTypographyStyle=o=>["heading","heading-1","heading-2","heading-3","heading-4","heading-5","heading-6"].includes(o)?"var(--g-font-heading, heading)":"var(--g-font-body, body)",composeTypographyStyle=(o,e,t)=>{if(o){let e=composeFallbackTypographyStyle(o.type??"heading"),p={...o.custom,fallbackFontFamily:e};return{...composeTypographyV2(p,o.attrs),...!t&&composeTypographyAttr(o.attrs)}}return{...e?.type?{}:composeTypography(e?.custom)}};export{composeFallbackTypographyStyle,composeTypography,composeTypographyAttr,composeTypographyClassName,composeTypographyCss,composeTypographyStyle,composeTypographyV2,composeTypographyV2Css,genTypoClass};
+  `};function getCustomCSSByDevice(o,e){if(!o||!e)return{};let t="desktop"!==e&&e?`-${e}`:"",{fontFamily:p}=o?.[e]??{};return{[`--size${t}`]:o?.[e]?.fontSize,[`--lh${t}`]:o?.[e]?.lineHeight,[`--fs${t}`]:o?.[e]?.fontStyle,[`--ff${t}`]:p?`var(--g-font-${p}, ${p})`:void 0,[`--weight${t}`]:o?.[e]?.fontWeight,[`--ls${t}`]:o?.[e]?.letterSpacing}}let composeTypography=o=>o?e({...getCustomCSSByDevice(o,"desktop"),...getCustomCSSByDevice(o,"tablet"),...getCustomCSSByDevice(o,"mobile")}):{},composeTypographyV2=(o,a)=>o?e({...t({fs:a?.italic?void 0:o?.fontStyle,ff:o?.fontFamily?`var(--g-font-${o.fontFamily.replace(/ /g,"-")}, '${o.fontFamily}'), ${o.fallbackFontFamily}`:void 0,weight:a?.bold?void 0:o?.fontWeight,ls:o?.letterSpacing,lh:o?.lineHeight}),...p("size",o?.fontSize)}):{},composeTypographyAttr=p=>p?e({...t({fs:p?.italic?"italic":void 0,weight:p?.bold?"bold":void 0,c:o(p?.color),tt:p?.transform,tdl:p?.underline?"underline":void 0})}):{},composeTypographyClassName=(o,e)=>o?o?.type&&!o.custom?genTypoClass(o.type):"":e?.type&&genTypoClass(e?.type),composeFallbackTypographyStyle=o=>["heading","heading-1","heading-2","heading-3","heading-4","heading-5","heading-6"].includes(o)?"var(--g-font-heading, heading)":"var(--g-font-body, body)",composeTypographyStyle=(o,e,t)=>{if(o){let e=composeFallbackTypographyStyle(o.type??"heading"),p={...o.custom,fallbackFontFamily:e};return{...composeTypographyV2(p,o.attrs),...!t&&composeTypographyAttr(o.attrs)}}return{...e?.type?{}:composeTypography(e?.custom)}};export{composeFallbackTypographyStyle,composeTypography,composeTypographyAttr,composeTypographyClassName,composeTypographyCss,composeTypographyStyle,composeTypographyV2,composeTypographyV2Css,genTypoClass};

package/dist/types/index.d.ts

@@ -6281,7 +6281,7 @@ type PublishedThemePageOnlineStoreDataWhereInput = {
     updatedAtNotIn?: InputMaybe<Scalars['Time'][]>;
 };
 type PublishedThemePageStatus = 'DRAFT' | 'PUBLISHED';
-type PublishedThemePageType = 'ARTICLE' | 'BLOG' | 'COLLECTION' | 'GP_ARTICLE' | 'GP_BLOG' | 'GP_COLLECTION' | 'GP_INDEX' | 'GP_PRODUCT' | 'GP_STATIC' | 'PRODUCT' | 'STATIC' | 'POST_PURCHASE';
+type PublishedThemePageType = 'ARTICLE' | 'BLOG' | 'COLLECTION' | 'GP_ARTICLE' | 'GP_BLOG' | 'GP_COLLECTION' | 'GP_INDEX' | 'GP_PRODUCT' | 'GP_STATIC' | 'PRODUCT' | 'STATIC' | 'POST_PURCHASE' | 'GP_FUNNEL_PAGE';
 /**
  * PublishedThemePageWhereInput is used for filtering PublishedThemePage objects.
  * Input was generated by ent.
@@ -7360,6 +7360,7 @@ declare namespace shop {
 
 type PageContext = {
     numberOfProductOfProductList: number;
+    pageType?: string;
 };
 type DeepPartial<T> = {
     [P in keyof T]?: DeepPartial<T[P]>;
@@ -9993,7 +9994,7 @@ declare const generateProductsQueryKey: (args: FetchProductsParams) => ['query/p
 
 type AdvanceValue = Primitive | ObjectDevices<Primitive>;
 declare const composeAdvanceStyleForPostPurchase: (data?: Record<string, AdvanceValue>, tag?: string) => React.CSSProperties;
-declare function composeAdvanceStyle(data?: Record<string, AdvanceValue>, tag?: string): React.CSSProperties;
+declare function composeAdvanceStyle(data?: Record<string, AdvanceValue>, tag?: string, pageType?: PublishedThemePageType): React.CSSProperties;
 declare const splitStyle: (keys: ShortHandProperty[], style?: React.CSSProperties) => React.CSSProperties[];
 declare const filterAttrInStyle: (style?: React.CSSProperties, filterKeys?: string[]) => {
     [x: string]: any;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gem-sdk/core",
-  "version": "1.14.0-dev.646",
+  "version": "1.14.0-dev.648",
   "license": "MIT",
   "sideEffects": false,
   "main": "dist/cjs/index.js",