@gem-sdk/components 19.1.0-staging.34 → 19.1.0-staging.35

package/dist/cjs/stock-counter/common/attrs.js

@@ -1 +1 @@
-"use strict";exports.getIconAttrs=(t,s)=>({"data-slot-type":t?"oos-icon":"has-stock-icon","data-visible":s?"true":"false"}),exports.getLiquidProgressBarAttrs=()=>({"data-slot-type":"progress-bar","data-visible":"{{ show_progress_bar }}"}),exports.getLiquidTagAttrs=(t,s,e)=>{let{displayByDefault:a,scarcityThreshold:r=0,template:i,outOfStockMessage:o,continueSelling:l,unlimitedQuantityMessage:p,hiddenCounterWhenOutOfStock:d}=s??{},{displayProgressBar:g,textColor:c,oosTextColor:u,typo:n}=e??{},y=n?.attrs?.color;return{"data-id":t?.uid??"","data-visible":"{{ should_display }}","data-policy":"{{ variant_policy_list | escape }}","gp-setting":JSON.stringify({displayByDefault:a,displayProgressBar:g,scarcityThreshold:r,template:i,outOfStockMessage:o,continueSelling:l,unlimitedQuantityMessage:p,color:c||"brand",hiddenCounterWhenOutOfStock:d,oosTextColor:u,typoColor:y}).replaceAll('"',""")}},exports.getLiquidTextAttrs=()=>({"data-slot-type":"message"}),exports.getWrapperAttrs=t=>({"data-id":t?.uid??""});
+"use strict";exports.getIconAttrs=(t,e)=>({"data-slot-type":t?"oos-icon":"has-stock-icon","data-visible":e?"true":"false"}),exports.getLiquidTagAttrs=(t,e,a)=>{let{displayByDefault:s,scarcityThreshold:i=0,template:r,outOfStockMessage:o,continueSelling:l,unlimitedQuantityMessage:d,hiddenCounterWhenOutOfStock:p}=e??{},{displayProgressBar:c,textColor:g,oosTextColor:n,typo:u}=a??{},y=u?.attrs?.color;return{"data-id":t?.uid??"","data-visible":"{{ should_display }}","data-policy":"{{ variant_policy_list | escape }}","gp-setting":JSON.stringify({displayByDefault:s,displayProgressBar:c,scarcityThreshold:i,template:r,outOfStockMessage:o,continueSelling:l,unlimitedQuantityMessage:d,color:g||"brand",hiddenCounterWhenOutOfStock:p,oosTextColor:n,typoColor:y}).replaceAll('"',""")}},exports.getLiquidTextAttrs=()=>({"data-slot-type":"message"}),exports.getWrapperAttrs=t=>({"data-id":t?.uid??""});

package/dist/cjs/stock-counter/common/classes.js

@@ -1 +1 @@
-"use strict";var e=require("@gem-sdk/core");exports.getContainerClasses=s=>{let{progressBarPosition:o="bottom"}=s??{},p="bottom"===o;return{...e.composeClasses("gp-inline-block gp-flex"),"gp-flex-col":p,"gp-flex-col-reverse":!p}},exports.getIconClasses=()=>({...e.composeClasses("[&>svg]:!gp-h-[var(--w)] [&>svg]:!gp-w-auto tablet:[&>svg]:!gp-h-[var(--w-tablet)] mobile:[&>svg]:!gp-h-[var(--w-mobile)]")}),exports.getLiquidTagClasses=s=>({...e.composeClasses("gp-product-stock-counter data-[visible=true]:gp-block data-[visible=false]:gp-hidden"),...e.composeClasses(s?.cssClass)}),exports.getOuterIconClasses=()=>({...e.composeClasses("gp-shrink-0 ")}),exports.getProgressBarClasses=s=>{let{effect:o}=s??{},p=o?e.composeClasses("before:gp-absolute before:gp-left-0 before:gp-h-full before:gp-w-full before:gp-animate-shift before:gp-content-[''] before:gp-bg-stock-counter-animate before:gp-bg-[length:60px_100%] before:gp-shadow-stock-counter"):{};return{...e.composeClasses("gp-sc-progress-bar gp-relative gp-w-full -gp-scale-100 !gp-bg-[length:200%] gp-mt-2"),...p}},exports.getTextClasses=s=>{let{typo:o}=s??{},p=e.composeTypographyClassName(o,s?.typography);return{...e.composeClasses(p),"!gp-whitespace-normal gp-min-w-4":!0}},exports.getWrapperClasses=(s,o)=>{let{hiddenCounterWhenOutOfStock:p}=s??{};return{...e.composeClasses("gp-flex"),"gp-opacity-50":o&&p}},exports.getWrapperIconClasses=s=>{let{iconPosition:o="left"}=s??{};return{...e.composeClasses("gp-flex gp-items-baseline gp-gap-x-1"),"gp-flex-row":"left"===o,"gp-flex-row-reverse gp-justify-end":"right"===o}};
+"use strict";var e=require("@gem-sdk/core");exports.getContainerClasses=s=>{let{progressBarPosition:o="bottom"}=s??{},p="bottom"===o;return{...e.composeClasses("gp-inline-block gp-flex"),"gp-flex-col":p,"gp-flex-col-reverse":!p}},exports.getIconClasses=()=>({...e.composeClasses("[&>svg]:!gp-h-[var(--w)] [&>svg]:!gp-w-auto tablet:[&>svg]:!gp-h-[var(--w-tablet)] mobile:[&>svg]:!gp-h-[var(--w-mobile)]")}),exports.getLiquidTagClasses=s=>({...e.composeClasses("gp-product-stock-counter data-[visible=true]:gp-block data-[visible=false]:gp-hidden"),...e.composeClasses(s?.cssClass)}),exports.getOuterIconClasses=()=>({...e.composeClasses("gp-shrink-0 ")}),exports.getTextClasses=s=>{let{typo:o}=s??{},p=e.composeTypographyClassName(o,s?.typography);return{...e.composeClasses(p),"!gp-whitespace-normal gp-min-w-4":!0}},exports.getWrapperClasses=(s,o)=>{let{hiddenCounterWhenOutOfStock:p}=s??{};return{...e.composeClasses("gp-flex"),"gp-opacity-50":o&&p}},exports.getWrapperIconClasses=s=>{let{iconPosition:o="left"}=s??{};return{...e.composeClasses("gp-flex gp-items-baseline gp-gap-x-1"),"gp-flex-row":"left"===o,"gp-flex-row-reverse gp-justify-end":"right"===o}};

package/dist/cjs/stock-counter/common/styles.js

@@ -1 +1 @@
-"use strict";var e=require("@gem-sdk/core"),t=require("./helpers.js");exports.getContainerStyles=t=>{let{width:r,textColor:o}=t??{};return{...e.makeStyleResponsive("w",e.makeWidth(r)),...e.makeStyle({c:e.getSingleColorVariable(o)})}},exports.getIconStyles=(r,o,a)=>{let{iconColor:s,oosIconColor:l}=r??{};return{...e.makeStyle({c:e.getSingleColorVariable(a?l:s)}),...function(r,o){let{typo:a}=r??{},{iconSize:s}=o??{};if(s?.desktop)return{...e.makeStyleResponsive("w",e.makeWidth(s),"px")};let l=a&&!a.custom?e.genVariable(e.getShortName(`typography-${a.type}-fontSize`)):void 0,p=a&&a.custom?t.convertSizeToWidth(e.composeTypographyV2(a.custom)):{};return l?e.makeStyle({w:l}):p}(r,o)}},exports.getProgressBarStyles=(t,r)=>{let o;let{progressBarHeight:a,color:s}=t??{},{remainingPercentage:l}=r??{};return a&&(o=Object.fromEntries(Object.entries(a).map(([e,t])=>[e,Number((t+"").replace("px",""))]))),{...e.makeStyleResponsive("h",e.makeWidth(o),"px"),...e.makeStyle({bg:"linear-gradient(90deg, #eee 50%, transparent 50%)",bgc:e.getSingleColorVariable(s),bgp:`${parseInt(String(l||0))}% center`})}},exports.getTextStyles=(t,r)=>{let{typo:o,oosTextColor:a}=t??{},s={...o,attrs:{...o?.attrs,color:r?a:o?.attrs?.color}},l=e.composeTypographyStyle(s,t?.typography);return{...l,...e.getStyleShadow({value:o?.custom?.textShadow,styleAppliedFor:"text-shadow",isEnableShadow:o?.custom?.hasShadowText})}},exports.getWrapperStyles=t=>{let{alignment:r}=t??{};return{...e.makeStyleResponsive("jc",r)}};
+"use strict";var e=require("@gem-sdk/core"),t=require("./helpers.js");exports.getContainerStyles=t=>{let{width:o,textColor:r}=t??{};return{...e.makeStyleResponsive("w",e.makeWidth(o)),...e.makeStyle({c:e.getSingleColorVariable(r)})}},exports.getIconStyles=(o,r,s)=>{let{iconColor:a,oosIconColor:l}=o??{};return{...e.makeStyle({c:e.getSingleColorVariable(s?l:a)}),...function(o,r){let{typo:s}=o??{},{iconSize:a}=r??{};if(a?.desktop)return{...e.makeStyleResponsive("w",e.makeWidth(a),"px")};let l=s&&!s.custom?e.genVariable(e.getShortName(`typography-${s.type}-fontSize`)):void 0,p=s&&s.custom?t.convertSizeToWidth(e.composeTypographyV2(s.custom)):{};return l?e.makeStyle({w:l}):p}(o,r)}},exports.getTextStyles=(t,o)=>{let{typo:r,oosTextColor:s}=t??{},a={...r,attrs:{...r?.attrs,color:o?s:r?.attrs?.color}},l=e.composeTypographyStyle(a,t?.typography);return{...l,...e.getStyleShadow({value:r?.custom?.textShadow,styleAppliedFor:"text-shadow",isEnableShadow:r?.custom?.hasShadowText})}},exports.getWrapperStyles=t=>{let{alignment:o}=t??{};return{...e.makeStyleResponsive("jc",o)}};

package/dist/cjs/stock-counter/components/StockCounter.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("react"),t=require("../hooks/useStockCounterInteraction.js"),r=require("@gem-sdk/system"),l=require("../hooks/useStockCounter.js"),a=require("../common/helpers.js"),c=require("../common/classes.js"),n=require("../common/styles.js"),o=require("../common/attrs.js");exports.default=({setting:i,styles:u,builderProps:m})=>{let{displayProgressBar:y,borderRadius:d}=u??{},{showIcon:g,icon:C,layout:S="full",oosIcon:j}=i??{},{outputMessage:p,isOutOfStock:x,inventoryQuantity:I,shouldHideCounter:h}=l.useStockCounter(i,u),N=s.useRef(null),{dispatchStockCounterInteraction:_}=t.useStockCounterInteraction({element:N,uid:m?.uid}),f=a.getInlineCss(m?.uid,d),k=!1!==y&&!x,q=r.createClass({...c.getProgressBarClasses(u)}),v=r.createStyle({...n.getProgressBarStyles(u,i)}),O=r.createStyle({...n.getContainerStyles(u)}),T=r.createClass({...c.getContainerClasses(i)}),M=r.createStyle({...n.getWrapperStyles(u)}),b=r.createClass({...c.getWrapperIconClasses(i)}),A=r.createClass({...c.getIconClasses()}),H=r.createClass({...c.getOuterIconClasses()}),L=e=>r.createStyle({...n.getIconStyles(u,i,e)}),W=({isOutOfStockIcon:e,isVisible:s})=>r.createAttr({...o.getIconAttrs(e,s)}),P=r.createClass({...c.getTextClasses(u)}),B=e=>r.createStyle({...n.getTextStyles(u,e)}),V=r.createClass({...c.getWrapperClasses(i,x)}),E=r.createAttr({...o.getWrapperAttrs(m)});return(s.useEffect(()=>{_(I)},[I]),h)?null:e.jsxs("div",{...E,style:M,ref:N,className:V,children:[e.jsx("style",{children:f}),e.jsxs("div",{className:T,style:O,children:[e.jsxs("div",{className:b,children:[g&&(x?e.jsx("div",{...W({isOutOfStockIcon:x,isVisible:x}),style:L(!0),className:H,children:e.jsx("span",{className:A,dangerouslySetInnerHTML:{__html:j||""}})}):e.jsx("div",{...W({isOutOfStockIcon:!x,isVisible:!x}),style:L(!1),className:H,children:e.jsx("span",{className:A,dangerouslySetInnerHTML:{__html:C||""}})})),"progress-bar"!==S&&(x?e.jsx("p",{dangerouslySetInnerHTML:{__html:p()},className:P,style:B(!0)}):e.jsx("p",{dangerouslySetInnerHTML:{__html:p()},className:P,style:B(!1)}))]}),k&&e.jsx("div",{style:v,className:q})]})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("react"),t=require("../hooks/useStockCounterInteraction.js"),r=require("@gem-sdk/system"),l=require("../hooks/useStockCounter.js"),a=require("../common/helpers.js"),c=require("../common/classes.js"),n=require("../common/styles.js"),o=require("../common/attrs.js");exports.default=({setting:i,styles:u,builderProps:m})=>{let{borderRadius:y}=u??{},{showIcon:d,icon:g,layout:C="full",oosIcon:j}=i??{},{outputMessage:S,isOutOfStock:p,inventoryQuantity:x,shouldHideCounter:I}=l.useStockCounter(i,u),h=s.useRef(null),{dispatchStockCounterInteraction:_}=t.useStockCounterInteraction({element:h,uid:m?.uid}),f=a.getInlineCss(m?.uid,y),k=r.createStyle({...n.getContainerStyles(u)}),q=r.createClass({...c.getContainerClasses(i)}),N=r.createStyle({...n.getWrapperStyles(u)}),v=r.createClass({...c.getWrapperIconClasses(i)}),O=r.createClass({...c.getIconClasses()}),T=r.createClass({...c.getOuterIconClasses()}),M=e=>r.createStyle({...n.getIconStyles(u,i,e)}),b=({isOutOfStockIcon:e,isVisible:s})=>r.createAttr({...o.getIconAttrs(e,s)}),A=r.createClass({...c.getTextClasses(u)}),H=e=>r.createStyle({...n.getTextStyles(u,e)}),L=r.createClass({...c.getWrapperClasses(i,p)}),W=r.createAttr({...o.getWrapperAttrs(m)});return(s.useEffect(()=>{_(x)},[x]),I)?null:e.jsxs("div",{...W,style:N,ref:h,className:L,children:[e.jsx("style",{children:f}),e.jsx("div",{className:q,style:k,children:e.jsxs("div",{className:v,children:[d&&(p?e.jsx("div",{...b({isOutOfStockIcon:p,isVisible:p}),style:M(!0),className:T,children:e.jsx("span",{className:O,dangerouslySetInnerHTML:{__html:j||""}})}):e.jsx("div",{...b({isOutOfStockIcon:!p,isVisible:!p}),style:M(!1),className:T,children:e.jsx("span",{className:O,dangerouslySetInnerHTML:{__html:g||""}})})),"progress-bar"!==C&&(p?e.jsx("p",{dangerouslySetInnerHTML:{__html:S()},className:A,style:H(!0)}):e.jsx("p",{dangerouslySetInnerHTML:{__html:S()},className:A,style:H(!1)}))]})})]})};

package/dist/cjs/stock-counter/components/StockCounter.liquid.js

@@ -1,68 +1,62 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../helpers.js"),s=require("../common/helpers.js"),a=require("../common/classes.js"),i=require("../common/styles.js"),r=require("../common/attrs.js"),l=require("@gem-sdk/system"),c=require("../settings/configs/translate.js");exports.default=({setting:o,styles:d,style:n,advanced:g,builderProps:u,pageContext:p})=>{let{borderRadius:$}=d??{},{showIcon:y,icon:S,oosIcon:v,layout:m="full",template:C,outOfStockMessage:I,continueSelling:k,unlimitedQuantityMessage:f}=o??{},q=s.getInlineCss(u?.uid,$),L=t.getDynamicSourceLocales({val:C,uid:u?.uid,settingId:t.createSettingId({id:c.StockCounter?.template?.id}),pageContext:p,isReplaceInventoryQuantity:!0}),b=t.getDynamicSourceLocales({val:I,uid:u?.uid,settingId:t.createSettingId({id:c.StockCounter?.outOfStockMessage?.id}),pageContext:p}),O=t.getDynamicSourceLocales({val:k,uid:u?.uid,settingId:t.createSettingId({id:c.StockCounter?.continueSelling?.id}),pageContext:p}),A=t.getDynamicSourceLocales({val:f,uid:u?.uid,settingId:t.createSettingId({id:c.StockCounter?.unlimitedQuantityMessage?.id}),pageContext:p}),_=l.createAttr({...r.getLiquidTagAttrs(u,o,d)}),j=l.createClass({...e.composeClasses("gp-stock-counter-progress gp-mt-2 data-[visible=true]:gp-block data-[visible=false]:gp-hidden"),...a.getProgressBarClasses(d)}),D=l.createStyle({...i.getProgressBarStyles(d,o)}),T=l.createStyle({...i.getContainerStyles(d)}),x=l.createClass({...a.getContainerClasses(o)}),P=l.createClass({...a.getLiquidTagClasses(g)}),R=l.createStyle({...n}),h=l.createStyle({...i.getWrapperStyles(d)}),E=s.getLiquidInitData(o,d),V=s.getLiquidTextContent({templateStringDisplay:L,outOfStockMessageDisplay:b,continueSellingDisplay:O,unlimitedQuantityMessageDisplay:A}),M=l.createClass({...a.getWrapperIconClasses(o)}),B=l.createClass({...e.composeClasses("gp-stock-counter-icon data-[visible=true]:gp-block data-[visible=false]:gp-hidden"),...a.getIconClasses(),...a.getOuterIconClasses()}),W=l.createClass({...a.getWrapperClasses(o)}),G=e=>l.createStyle({...i.getIconStyles(d,o,e)}),Q=({isOutOfStockIcon:e,isVisible:t})=>l.createAttr({...r.getIconAttrs(e,t)}),N=l.createAttr({...r.getLiquidProgressBarAttrs()}),U=l.createClass({...a.getTextClasses(d),...e.composeClasses("gp-stock-counter-mark")}),w=e=>l.createStyle({...i.getTextStyles(d,e)}),z=l.createAttr({...r.getLiquidTextAttrs()}),F=s.getTextDisplayData({templateStringDisplay:L,outOfStockMessageDisplay:b,continueSellingDisplay:O,unlimitedQuantityMessageDisplay:A},d);return e.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../helpers.js"),s=require("../common/helpers.js"),i=require("../common/classes.js"),a=require("../common/styles.js"),r=require("../common/attrs.js"),l=require("@gem-sdk/system"),c=require("../settings/configs/translate.js");exports.default=({setting:o,styles:d,style:n,advanced:u,builderProps:g,pageContext:p})=>{let{borderRadius:$}=d??{},{showIcon:y,icon:S,oosIcon:m,layout:v="full",template:I,outOfStockMessage:f,continueSelling:k,unlimitedQuantityMessage:C}=o??{},q=s.getInlineCss(g?.uid,$),L=t.getDynamicSourceLocales({val:I,uid:g?.uid,settingId:t.createSettingId({id:c.StockCounter?.template?.id}),pageContext:p,isReplaceInventoryQuantity:!0}),O=t.getDynamicSourceLocales({val:f,uid:g?.uid,settingId:t.createSettingId({id:c.StockCounter?.outOfStockMessage?.id}),pageContext:p}),b=t.getDynamicSourceLocales({val:k,uid:g?.uid,settingId:t.createSettingId({id:c.StockCounter?.continueSelling?.id}),pageContext:p}),_=t.getDynamicSourceLocales({val:C,uid:g?.uid,settingId:t.createSettingId({id:c.StockCounter?.unlimitedQuantityMessage?.id}),pageContext:p}),j=l.createAttr({...r.getLiquidTagAttrs(g,o,d)}),A=l.createStyle({...a.getContainerStyles(d)}),D=l.createClass({...i.getContainerClasses(o)}),T=l.createClass({...i.getLiquidTagClasses(u)}),x=l.createStyle({...n}),R=l.createStyle({...a.getWrapperStyles(d)}),E=s.getLiquidInitData(o,d),V=s.getLiquidTextContent({templateStringDisplay:L,outOfStockMessageDisplay:O,continueSellingDisplay:b,unlimitedQuantityMessageDisplay:_}),h=l.createClass({...i.getWrapperIconClasses(o)}),M=l.createClass({...e.composeClasses("gp-stock-counter-icon data-[visible=true]:gp-block data-[visible=false]:gp-hidden"),...i.getIconClasses(),...i.getOuterIconClasses()}),P=l.createClass({...i.getWrapperClasses(o)}),W=e=>l.createStyle({...a.getIconStyles(d,o,e)}),G=({isOutOfStockIcon:e,isVisible:t})=>l.createAttr({...r.getIconAttrs(e,t)}),Q=l.createClass({...i.getTextClasses(d),...e.composeClasses("gp-stock-counter-mark")}),N=e=>l.createStyle({...a.getTextStyles(d,e)}),U=l.createAttr({...r.getLiquidTextAttrs()}),w=s.getTextDisplayData({templateStringDisplay:L,outOfStockMessageDisplay:O,continueSellingDisplay:b,unlimitedQuantityMessageDisplay:_},d);return e.template`
     ${E}
-    <gp-product-stock-counter ${{..._}} class="${P}"
-      style="${R}">
-      <div class="${W}" style="${h}">
+    <gp-product-stock-counter ${{...j}} class="${T}"
+      style="${x}">
+      <div class="${P}" style="${R}">
       <style>${q}</style>
         <div
-          class="${x}"
-          style="${T}"
+          class="${D}"
+          style="${A}"
         >
-          <div class="${M}">
+          <div class="${h}">
             ${e.RenderIf(y,e.template`
               ${l.LiquidIf("is_out_of_stock",e.template`<div
-                    ${{...Q({isOutOfStockIcon:!0,isVisible:!0})}}
-                    class="${B}"
-                    style="${G(!0)}"
+                    ${{...G({isOutOfStockIcon:!0,isVisible:!0})}}
+                    class="${M}"
+                    style="${W(!0)}"
                   >
-                    ${v}
+                    ${m}
                   </div>
               <div
-                    ${{...Q({isOutOfStockIcon:!1,isVisible:!1})}}
+                    ${{...G({isOutOfStockIcon:!1,isVisible:!1})}}
                      data-slot-type="false"
-                    class="${B}"
-                    style="${G(!1)}"
+                    class="${M}"
+                    style="${W(!1)}"
                 >
                   ${S}
                 </div>`,e.template` <div
-                    ${{...Q({isOutOfStockIcon:!0,isVisible:!1})}}
-                    class="${B}"
-                    style="${G(!0)}"
+                    ${{...G({isOutOfStockIcon:!0,isVisible:!1})}}
+                    class="${M}"
+                    style="${W(!0)}"
                 >
-                  ${v}
+                  ${m}
               </div>
               <div
-                    ${{...Q({isOutOfStockIcon:!1,isVisible:!0})}}
-                    class="${B}"
-                    style="${G(!1)}"
+                    ${{...G({isOutOfStockIcon:!1,isVisible:!0})}}
+                    class="${M}"
+                    style="${W(!1)}"
                 >
                   ${S}
                 </div>`)}
             `)}
-            ${F}
-            ${e.RenderIf("progress-bar"!==m,e.template`
+            ${w}
+            ${e.RenderIf("progress-bar"!==v,e.template`
               ${l.LiquidIf("is_out_of_stock",e.template`<p
-                ${{...z}}
-                class="${U}"
-                style="${w(!0)}"
+                ${{...U}}
+                class="${Q}"
+                style="${N(!0)}"
               >
                 ${V}
               </p>`,e.template`<p
-                ${{...z}}
-                class="${U}"
-                style="${w(!1)}"
+                ${{...U}}
+                class="${Q}"
+                style="${N(!1)}"
               >
                 ${V}
               </p>`)}
               `)}
 
           </div>
-
-          <div
-            ${{...N}}
-            style="${D}"
-            class="${j}"
-          ></div>
         </div>
         </div>
       </gp-product-stock-counter>

package/dist/cjs/stock-counter/settings/configs/ui-v2.js

@@ -1 +1 @@
-"use strict";exports.SettingUIV2=[{label:"layout",controls:[{setting:{id:"layout"},layout:"vertical",controlChangeTrigger:{settings:[{action:{controlId:"displayProgressBar",newValue:!0,groupType:"style",controlType:"style"},source:["layout"],condition:"layout !== 'icon-and-text' && layout !== 'text-only'"},{action:{controlId:"displayProgressBar",newValue:!1,groupType:"style",controlType:"style"},source:["layout"],condition:"layout === 'icon-and-text' || layout === 'text-only'"},{action:{controlId:"showIcon",newValue:!0,groupType:"setting",controlType:"setting"},source:["layout"],condition:"layout === 'full' || layout === 'icon-and-text'"},{action:{controlId:"showIcon",newValue:!1,groupType:"setting",controlType:"setting"},source:["layout"],condition:"layout === 'text-and-progress-bar' || layout === 'progress-bar' || layout === 'text-only'"}],options:{noRecordHistory:!0}}}]},{controls:[{label:"Progress bar",setting:{id:"displayProgressBar"},options:{labelVariant:"primary",toggleStyle:"switch"}},{conditionDisplay:"displayProgressBar == true",label:"Percentage left",setting:{id:"remainingPercentage"}},{conditionDisplay:"displayProgressBar == true",label:"Color",setting:{id:"color"}},{conditionDisplay:"displayProgressBar == true",label:"Effect",setting:{id:"effect"}}],moreSettings:{type:"collapse",controls:[{conditionDisplay:"displayProgressBar == true",label:"Height",setting:{id:"progressBarHeight"}},{conditionDisplay:"displayProgressBar == true",label:"Position",setting:{id:"progressBarPosition"}},{conditionDisplay:"displayProgressBar == true",hiddenOnMobile:!0,label:"Corner",setting:{id:"borderRadius"}}]}},{hiddenOnMobile:!0,controls:[{label:"Icon",setting:{id:"showIcon"},options:{labelVariant:"primary",toggleStyle:"switch"}},{label:"Icon",conditionDisplay:"showIcon == true",setting:{id:"icon"},layout:"horizontal"},{label:"Size",conditionDisplay:"showIcon == true",setting:{id:"iconSize"},layout:"horizontal"},{conditionDisplay:"showIcon == true",label:"Color",setting:{id:"iconColor"}},{label:"Position",conditionDisplay:"showIcon == true",setting:{id:"iconPosition"},layout:"horizontal"}]},{label:"Size",hiddenOnMobile:!0,controls:[{label:"Width",setting:{id:"width"}}]},{label:"Text",controls:[{label:"Content",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"template",isHideClear:!0,controls:[{label:"Content",setting:{id:"template"},layout:"vertical"}]},{setting:{id:"typo"},layout:"vertical"}]},{label:"Out of stock state",controls:[{label:"Action",setting:{id:"hiddenCounterWhenOutOfStock"}},{label:"Icon",setting:{id:"oosIcon"},conditionDisplay:"hiddenCounterWhenOutOfStock == false"},{label:"Content",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"outOfStockMessage",isHideClear:!0,controls:[{label:"Content",setting:{id:"outOfStockMessage"},layout:"vertical"}],conditionDisplay:"hiddenCounterWhenOutOfStock == false"},{label:"Icon color",setting:{id:"oosIconColor"},conditionDisplay:"hiddenCounterWhenOutOfStock == false"},{label:"Text color",setting:{id:"oosTextColor"},conditionDisplay:"hiddenCounterWhenOutOfStock == false"}]},{label:"Message",controls:[{label:"Sell when OOS",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"continueSelling",isHideClear:!0,popoverLabel:"Out of stock sell",controls:[{label:"Content",setting:{id:"continueSelling"},layout:"vertical"}]},{label:"Unlimited stock",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"unlimitedQuantityMessage",isHideClear:!0,popoverLabel:"Unlimited quantity",controls:[{label:"Content",setting:{id:"unlimitedQuantityMessage"},layout:"vertical"}]}]},{label:"Display option",controls:[{label:"Display",setting:{id:"displayByDefault"}},{label:"Stock",conditionDisplay:"displayByDefault == false",setting:{id:"scarcityThreshold"}}]},{controls:[{label:"Align",hiddenOnMobile:!0,conditionEnable:'!(parseInt(width) >= 100 && width?.includes("%"))',setting:{id:"alignment"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"}}]}];
+"use strict";exports.SettingUIV2=[{label:"layout",controls:[{setting:{id:"layout"},layout:"vertical",controlChangeTrigger:{settings:[{action:{controlId:"displayProgressBar",newValue:!0,groupType:"style",controlType:"style"},source:["layout"],condition:"layout !== 'icon-and-text' && layout !== 'text-only'"},{action:{controlId:"displayProgressBar",newValue:!1,groupType:"style",controlType:"style"},source:["layout"],condition:"layout === 'icon-and-text' || layout === 'text-only'"},{action:{controlId:"showIcon",newValue:!0,groupType:"setting",controlType:"setting"},source:["layout"],condition:"layout === 'full' || layout === 'icon-and-text'"},{action:{controlId:"showIcon",newValue:!1,groupType:"setting",controlType:"setting"},source:["layout"],condition:"layout === 'text-and-progress-bar' || layout === 'progress-bar' || layout === 'text-only'"}],options:{noRecordHistory:!0}}}]},{moreSettings:{type:"collapse",controls:[{conditionDisplay:"displayProgressBar == true",label:"Height",setting:{id:"progressBarHeight"}},{conditionDisplay:"displayProgressBar == true",label:"Position",setting:{id:"progressBarPosition"}},{conditionDisplay:"displayProgressBar == true",hiddenOnMobile:!0,label:"Corner",setting:{id:"borderRadius"}}]}},{hiddenOnMobile:!0,controls:[{label:"Icon",setting:{id:"showIcon"},options:{labelVariant:"primary",toggleStyle:"switch"}},{label:"Icon",conditionDisplay:"showIcon == true",setting:{id:"icon"},layout:"horizontal"},{label:"Size",conditionDisplay:"showIcon == true",setting:{id:"iconSize"},layout:"horizontal"},{conditionDisplay:"showIcon == true",label:"Color",setting:{id:"iconColor"}},{label:"Position",conditionDisplay:"showIcon == true",setting:{id:"iconPosition"},layout:"horizontal"}]},{label:"Size",hiddenOnMobile:!0,controls:[{label:"Width",setting:{id:"width"}}]},{label:"Text",controls:[{label:"Content",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"template",isHideClear:!0,controls:[{label:"Content",setting:{id:"template"},layout:"vertical"}]},{setting:{id:"typo"},layout:"vertical"}]},{label:"Out of stock state",controls:[{label:"Action",setting:{id:"hiddenCounterWhenOutOfStock"}},{label:"Icon",setting:{id:"oosIcon"},conditionDisplay:"hiddenCounterWhenOutOfStock == false"},{label:"Content",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"outOfStockMessage",isHideClear:!0,controls:[{label:"Content",setting:{id:"outOfStockMessage"},layout:"vertical"}],conditionDisplay:"hiddenCounterWhenOutOfStock == false"},{label:"Icon color",setting:{id:"oosIconColor"},conditionDisplay:"hiddenCounterWhenOutOfStock == false"},{label:"Text color",setting:{id:"oosTextColor"},conditionDisplay:"hiddenCounterWhenOutOfStock == false"}]},{label:"Message",controls:[{label:"Sell when OOS",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"continueSelling",isHideClear:!0,popoverLabel:"Out of stock sell",controls:[{label:"Content",setting:{id:"continueSelling"},layout:"vertical"}]},{label:"Unlimited stock",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"unlimitedQuantityMessage",isHideClear:!0,popoverLabel:"Unlimited quantity",controls:[{label:"Content",setting:{id:"unlimitedQuantityMessage"},layout:"vertical"}]}]},{label:"Display option",controls:[{label:"Display",setting:{id:"displayByDefault"}},{label:"Stock",conditionDisplay:"displayByDefault == false",setting:{id:"scarcityThreshold"}}]},{controls:[{label:"Align",hiddenOnMobile:!0,conditionEnable:'!(parseInt(width) >= 100 && width?.includes("%"))',setting:{id:"alignment"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"}}]}];

package/dist/esm/stock-counter/common/attrs.js

@@ -1 +1 @@
-let t=(t,a,e)=>{let{displayByDefault:s,scarcityThreshold:r=0,template:i,outOfStockMessage:l,continueSelling:o,unlimitedQuantityMessage:d,hiddenCounterWhenOutOfStock:p}=a??{},{displayProgressBar:g,textColor:c,oosTextColor:n,typo:u}=e??{},y=u?.attrs?.color;return{"data-id":t?.uid??"","data-visible":"{{ should_display }}","data-policy":"{{ variant_policy_list | escape }}","gp-setting":JSON.stringify({displayByDefault:s,displayProgressBar:g,scarcityThreshold:r,template:i,outOfStockMessage:l,continueSelling:o,unlimitedQuantityMessage:d,color:c||"brand",hiddenCounterWhenOutOfStock:p,oosTextColor:n,typoColor:y}).replaceAll('"',""")}},a=()=>({"data-slot-type":"progress-bar","data-visible":"{{ show_progress_bar }}"}),e=()=>({"data-slot-type":"message"}),s=t=>({"data-id":t?.uid??""}),r=(t,a)=>({"data-slot-type":t?"oos-icon":"has-stock-icon","data-visible":a?"true":"false"});export{r as getIconAttrs,a as getLiquidProgressBarAttrs,t as getLiquidTagAttrs,e as getLiquidTextAttrs,s as getWrapperAttrs};
+let t=(t,a,e)=>{let{displayByDefault:i,scarcityThreshold:s=0,template:l,outOfStockMessage:r,continueSelling:d,unlimitedQuantityMessage:o,hiddenCounterWhenOutOfStock:p}=a??{},{displayProgressBar:c,textColor:g,oosTextColor:n,typo:u}=e??{},y=u?.attrs?.color;return{"data-id":t?.uid??"","data-visible":"{{ should_display }}","data-policy":"{{ variant_policy_list | escape }}","gp-setting":JSON.stringify({displayByDefault:i,displayProgressBar:c,scarcityThreshold:s,template:l,outOfStockMessage:r,continueSelling:d,unlimitedQuantityMessage:o,color:g||"brand",hiddenCounterWhenOutOfStock:p,oosTextColor:n,typoColor:y}).replaceAll('"',""")}},a=()=>({"data-slot-type":"message"}),e=t=>({"data-id":t?.uid??""}),i=(t,a)=>({"data-slot-type":t?"oos-icon":"has-stock-icon","data-visible":a?"true":"false"});export{i as getIconAttrs,t as getLiquidTagAttrs,a as getLiquidTextAttrs,e as getWrapperAttrs};

package/dist/esm/stock-counter/common/classes.js

@@ -1 +1 @@
-import{composeClasses as e,composeTypographyClassName as t}from"@gem-sdk/core";let g=t=>{let{effect:g}=t??{},s=g?e("before:gp-absolute before:gp-left-0 before:gp-h-full before:gp-w-full before:gp-animate-shift before:gp-content-[''] before:gp-bg-stock-counter-animate before:gp-bg-[length:60px_100%] before:gp-shadow-stock-counter"):{};return{...e("gp-sc-progress-bar gp-relative gp-w-full -gp-scale-100 !gp-bg-[length:200%] gp-mt-2"),...s}},s=t=>{let{progressBarPosition:g="bottom"}=t??{},s="bottom"===g;return{...e("gp-inline-block gp-flex"),"gp-flex-col":s,"gp-flex-col-reverse":!s}},r=t=>({...e("gp-product-stock-counter data-[visible=true]:gp-block data-[visible=false]:gp-hidden"),...e(t?.cssClass)}),p=t=>{let{iconPosition:g="left"}=t??{};return{...e("gp-flex gp-items-baseline gp-gap-x-1"),"gp-flex-row":"left"===g,"gp-flex-row-reverse gp-justify-end":"right"===g}},l=()=>({...e("[&>svg]:!gp-h-[var(--w)] [&>svg]:!gp-w-auto tablet:[&>svg]:!gp-h-[var(--w-tablet)] mobile:[&>svg]:!gp-h-[var(--w-mobile)]")}),o=()=>({...e("gp-shrink-0 ")}),a=g=>{let{typo:s}=g??{},r=t(s,g?.typography);return{...e(r),"!gp-whitespace-normal gp-min-w-4":!0}},n=(t,g)=>{let{hiddenCounterWhenOutOfStock:s}=t??{};return{...e("gp-flex"),"gp-opacity-50":g&&s}};export{s as getContainerClasses,l as getIconClasses,r as getLiquidTagClasses,o as getOuterIconClasses,g as getProgressBarClasses,a as getTextClasses,n as getWrapperClasses,p as getWrapperIconClasses};
+import{composeClasses as e,composeTypographyClassName as t}from"@gem-sdk/core";let s=t=>{let{progressBarPosition:s="bottom"}=t??{},g="bottom"===s;return{...e("gp-inline-block gp-flex"),"gp-flex-col":g,"gp-flex-col-reverse":!g}},g=t=>({...e("gp-product-stock-counter data-[visible=true]:gp-block data-[visible=false]:gp-hidden"),...e(t?.cssClass)}),l=t=>{let{iconPosition:s="left"}=t??{};return{...e("gp-flex gp-items-baseline gp-gap-x-1"),"gp-flex-row":"left"===s,"gp-flex-row-reverse gp-justify-end":"right"===s}},p=()=>({...e("[&>svg]:!gp-h-[var(--w)] [&>svg]:!gp-w-auto tablet:[&>svg]:!gp-h-[var(--w-tablet)] mobile:[&>svg]:!gp-h-[var(--w-mobile)]")}),r=()=>({...e("gp-shrink-0 ")}),a=s=>{let{typo:g}=s??{},l=t(g,s?.typography);return{...e(l),"!gp-whitespace-normal gp-min-w-4":!0}},o=(t,s)=>{let{hiddenCounterWhenOutOfStock:g}=t??{};return{...e("gp-flex"),"gp-opacity-50":s&&g}};export{s as getContainerClasses,p as getIconClasses,g as getLiquidTagClasses,r as getOuterIconClasses,a as getTextClasses,o as getWrapperClasses,l as getWrapperIconClasses};

package/dist/esm/stock-counter/common/styles.js

@@ -1 +1 @@
-import{makeStyle as t,getSingleColorVariable as e,makeStyleResponsive as r,makeWidth as o,composeTypographyStyle as s,getStyleShadow as l,genVariable as n,getShortName as a,composeTypographyV2 as p}from"@gem-sdk/core";import{convertSizeToWidth as c}from"./helpers.js";let g=(s,l)=>{let n;let{progressBarHeight:a,color:p}=s??{},{remainingPercentage:c}=l??{};return a&&(n=Object.fromEntries(Object.entries(a).map(([t,e])=>[t,Number((e+"").replace("px",""))]))),{...r("h",o(n),"px"),...t({bg:"linear-gradient(90deg, #eee 50%, transparent 50%)",bgc:e(p),bgp:`${parseInt(String(c||0))}% center`})}},u=s=>{let{width:l,textColor:n}=s??{};return{...r("w",o(l)),...t({c:e(n)})}},i=t=>{let{alignment:e}=t??{};return{...r("jc",e)}},m=(s,l,g)=>{let{iconColor:u,oosIconColor:i}=s??{};return{...t({c:e(g?i:u)}),...function(e,s){let{typo:l}=e??{},{iconSize:g}=s??{};if(g?.desktop)return{...r("w",o(g),"px")};let u=l&&!l.custom?n(a(`typography-${l.type}-fontSize`)):void 0,i=l&&l.custom?c(p(l.custom)):{};return u?t({w:u}):i}(s,l)}},y=(t,e)=>{let{typo:r,oosTextColor:o}=t??{},n={...r,attrs:{...r?.attrs,color:e?o:r?.attrs?.color}},a=s(n,t?.typography);return{...a,...l({value:r?.custom?.textShadow,styleAppliedFor:"text-shadow",isEnableShadow:r?.custom?.hasShadowText})}};export{u as getContainerStyles,m as getIconStyles,g as getProgressBarStyles,y as getTextStyles,i as getWrapperStyles};
+import{makeStyle as t,getSingleColorVariable as e,makeStyleResponsive as r,makeWidth as o,composeTypographyStyle as s,getStyleShadow as l,genVariable as p,getShortName as a,composeTypographyV2 as c}from"@gem-sdk/core";import{convertSizeToWidth as n}from"./helpers.js";let u=s=>{let{width:l,textColor:p}=s??{};return{...r("w",o(l)),...t({c:e(p)})}},m=t=>{let{alignment:e}=t??{};return{...r("jc",e)}},y=(s,l,u)=>{let{iconColor:m,oosIconColor:y}=s??{};return{...t({c:e(u?y:m)}),...function(e,s){let{typo:l}=e??{},{iconSize:u}=s??{};if(u?.desktop)return{...r("w",o(u),"px")};let m=l&&!l.custom?p(a(`typography-${l.type}-fontSize`)):void 0,y=l&&l.custom?n(c(l.custom)):{};return m?t({w:m}):y}(s,l)}},i=(t,e)=>{let{typo:r,oosTextColor:o}=t??{},p={...r,attrs:{...r?.attrs,color:e?o:r?.attrs?.color}},a=s(p,t?.typography);return{...a,...l({value:r?.custom?.textShadow,styleAppliedFor:"text-shadow",isEnableShadow:r?.custom?.hasShadowText})}};export{u as getContainerStyles,y as getIconStyles,i as getTextStyles,m as getWrapperStyles};

package/dist/esm/stock-counter/components/StockCounter.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsxs as s,jsx as e}from"react/jsx-runtime";import{useRef as t,useEffect as r}from"react";import{useStockCounterInteraction as l}from"../hooks/useStockCounterInteraction.js";import{createClass as o,createStyle as m,createAttr as n}from"@gem-sdk/system";import{useStockCounter as a}from"../hooks/useStockCounter.js";import{getInlineCss as i}from"../common/helpers.js";import{getProgressBarClasses as c,getContainerClasses as d,getWrapperIconClasses as u,getIconClasses as p,getOuterIconClasses as f,getTextClasses as y,getWrapperClasses as h}from"../common/classes.js";import{getProgressBarStyles as N,getContainerStyles as S,getWrapperStyles as k,getIconStyles as _,getTextStyles as j}from"../common/styles.js";import{getWrapperAttrs as I,getIconAttrs as g}from"../common/attrs.js";let v=({setting:v,styles:H,builderProps:L})=>{let{displayProgressBar:M,borderRadius:O}=H??{},{showIcon:T,icon:b,layout:C="full",oosIcon:x}=v??{},{outputMessage:V,isOutOfStock:q,inventoryQuantity:w,shouldHideCounter:z}=a(v,H),A=t(null),{dispatchStockCounterInteraction:B}=l({element:A,uid:L?.uid}),D=i(L?.uid,O),E=!1!==M&&!q,F=o({...c(H)}),G=m({...N(H,v)}),J=m({...S(H)}),K=o({...d(v)}),P=m({...k(H)}),Q=o({...u(v)}),R=o({...p()}),U=o({...f()}),W=s=>m({..._(H,v,s)}),X=({isOutOfStockIcon:s,isVisible:e})=>n({...g(s,e)}),Y=o({...y(H)}),Z=s=>m({...j(H,s)}),$=o({...h(v,q)}),ss=n({...I(L)});return(r(()=>{B(w)},[w]),z)?null:s("div",{...ss,style:P,ref:A,className:$,children:[e("style",{children:D}),s("div",{className:K,style:J,children:[s("div",{className:Q,children:[T&&(q?e("div",{...X({isOutOfStockIcon:q,isVisible:q}),style:W(!0),className:U,children:e("span",{className:R,dangerouslySetInnerHTML:{__html:x||""}})}):e("div",{...X({isOutOfStockIcon:!q,isVisible:!q}),style:W(!1),className:U,children:e("span",{className:R,dangerouslySetInnerHTML:{__html:b||""}})})),"progress-bar"!==C&&(q?e("p",{dangerouslySetInnerHTML:{__html:V()},className:Y,style:Z(!0)}):e("p",{dangerouslySetInnerHTML:{__html:V()},className:Y,style:Z(!1)}))]}),E&&e("div",{style:G,className:F})]})]})};export{v as default};
+import{jsxs as e,jsx as s}from"react/jsx-runtime";import{useRef as t,useEffect as r}from"react";import{useStockCounterInteraction as o}from"../hooks/useStockCounterInteraction.js";import{createStyle as l,createClass as m,createAttr as n}from"@gem-sdk/system";import{useStockCounter as i}from"../hooks/useStockCounter.js";import{getInlineCss as a}from"../common/helpers.js";import{getContainerClasses as c,getWrapperIconClasses as d,getIconClasses as u,getOuterIconClasses as p,getTextClasses as f,getWrapperClasses as h}from"../common/classes.js";import{getContainerStyles as y,getWrapperStyles as N,getIconStyles as S,getTextStyles as k}from"../common/styles.js";import{getWrapperAttrs as _,getIconAttrs as j}from"../common/attrs.js";let I=({setting:I,styles:g,builderProps:v})=>{let{borderRadius:H}=g??{},{showIcon:L,icon:M,layout:O="full",oosIcon:T}=I??{},{outputMessage:b,isOutOfStock:C,inventoryQuantity:x,shouldHideCounter:V}=i(I,g),q=t(null),{dispatchStockCounterInteraction:w}=o({element:q,uid:v?.uid}),z=a(v?.uid,H),A=l({...y(g)}),B=m({...c(I)}),D=l({...N(g)}),E=m({...d(I)}),F=m({...u()}),G=m({...p()}),J=e=>l({...S(g,I,e)}),K=({isOutOfStockIcon:e,isVisible:s})=>n({...j(e,s)}),P=m({...f(g)}),Q=e=>l({...k(g,e)}),R=m({...h(I,C)}),U=n({..._(v)});return(r(()=>{w(x)},[x]),V)?null:e("div",{...U,style:D,ref:q,className:R,children:[s("style",{children:z}),s("div",{className:B,style:A,children:e("div",{className:E,children:[L&&(C?s("div",{...K({isOutOfStockIcon:C,isVisible:C}),style:J(!0),className:G,children:s("span",{className:F,dangerouslySetInnerHTML:{__html:T||""}})}):s("div",{...K({isOutOfStockIcon:!C,isVisible:!C}),style:J(!1),className:G,children:s("span",{className:F,dangerouslySetInnerHTML:{__html:M||""}})})),"progress-bar"!==O&&(C?s("p",{dangerouslySetInnerHTML:{__html:b()},className:P,style:Q(!0)}):s("p",{dangerouslySetInnerHTML:{__html:b()},className:P,style:Q(!1)}))]})})]})};export{I as default};

package/dist/esm/stock-counter/components/StockCounter.liquid.js

@@ -1,70 +1,64 @@
-import{composeClasses as s,RenderIf as t,template as i,isLocalEnv as e,baseAssetURL as o}from"@gem-sdk/core";import{getDynamicSourceLocales as l,createSettingId as c,getSettingPreloadData as d}from"../../helpers.js";import{getLiquidInitData as r,getInlineCss as a,getTextDisplayData as $,getLiquidTextContent as p}from"../common/helpers.js";import{getProgressBarClasses as u,getContainerClasses as n,getLiquidTagClasses as m,getWrapperIconClasses as v,getOuterIconClasses as g,getIconClasses as f,getWrapperClasses as k,getTextClasses as y}from"../common/classes.js";import{getProgressBarStyles as S,getContainerStyles as b,getWrapperStyles as I,getIconStyles as O,getTextStyles as j}from"../common/styles.js";import{getLiquidTagAttrs as _,getLiquidProgressBarAttrs as h,getLiquidTextAttrs as V,getIconAttrs as E}from"../common/attrs.js";import{createAttr as M,createClass as A,createStyle as C,LiquidIf as G}from"@gem-sdk/system";import{StockCounter as Q}from"../settings/configs/translate.js";let R=({setting:R,styles:x,style:N,advanced:P,builderProps:T,pageContext:q})=>{let{borderRadius:w}=x??{},{showIcon:z,icon:B,oosIcon:D,layout:F="full",template:H,outOfStockMessage:J,continueSelling:K,unlimitedQuantityMessage:L}=R??{},U=a(T?.uid,w),W=l({val:H,uid:T?.uid,settingId:c({id:Q?.template?.id}),pageContext:q,isReplaceInventoryQuantity:!0}),X=l({val:J,uid:T?.uid,settingId:c({id:Q?.outOfStockMessage?.id}),pageContext:q}),Y=l({val:K,uid:T?.uid,settingId:c({id:Q?.continueSelling?.id}),pageContext:q}),Z=l({val:L,uid:T?.uid,settingId:c({id:Q?.unlimitedQuantityMessage?.id}),pageContext:q}),ss=M({..._(T,R,x)}),st=A({...s("gp-stock-counter-progress gp-mt-2 data-[visible=true]:gp-block data-[visible=false]:gp-hidden"),...u(x)}),si=C({...S(x,R)}),se=C({...b(x)}),so=A({...n(R)}),sl=A({...m(P)}),sc=C({...N}),sd=C({...I(x)}),sr=r(R,x),sa=p({templateStringDisplay:W,outOfStockMessageDisplay:X,continueSellingDisplay:Y,unlimitedQuantityMessageDisplay:Z}),s$=A({...v(R)}),sp=A({...s("gp-stock-counter-icon data-[visible=true]:gp-block data-[visible=false]:gp-hidden"),...f(),...g()}),su=A({...k(R)}),sn=s=>C({...O(x,R,s)}),sm=({isOutOfStockIcon:s,isVisible:t})=>M({...E(s,t)}),sv=M({...h()}),sg=A({...y(x),...s("gp-stock-counter-mark")}),sf=s=>C({...j(x,s)}),sk=M({...V()}),sy=$({templateStringDisplay:W,outOfStockMessageDisplay:X,continueSellingDisplay:Y,unlimitedQuantityMessageDisplay:Z},x);return i`
-    ${sr}
-    <gp-product-stock-counter ${{...ss}} class="${sl}"
-      style="${sc}">
-      <div class="${su}" style="${sd}">
-      <style>${U}</style>
+import{composeClasses as s,RenderIf as t,template as i,isLocalEnv as e,baseAssetURL as o}from"@gem-sdk/core";import{getDynamicSourceLocales as l,createSettingId as c,getSettingPreloadData as d}from"../../helpers.js";import{getLiquidInitData as r,getInlineCss as a,getTextDisplayData as $,getLiquidTextContent as p}from"../common/helpers.js";import{getContainerClasses as u,getLiquidTagClasses as n,getWrapperIconClasses as m,getOuterIconClasses as f,getIconClasses as v,getWrapperClasses as g,getTextClasses as k}from"../common/classes.js";import{getContainerStyles as y,getWrapperStyles as S,getIconStyles as I,getTextStyles as O}from"../common/styles.js";import{getLiquidTagAttrs as b,getLiquidTextAttrs as j,getIconAttrs as _}from"../common/attrs.js";import{createAttr as V,createStyle as h,createClass as E,LiquidIf as M}from"@gem-sdk/system";import{StockCounter as A}from"../settings/configs/translate.js";let C=({setting:C,styles:G,style:Q,advanced:R,builderProps:x,pageContext:N})=>{let{borderRadius:P}=G??{},{showIcon:T,icon:q,oosIcon:w,layout:z="full",template:B,outOfStockMessage:D,continueSelling:F,unlimitedQuantityMessage:H}=C??{},J=a(x?.uid,P),K=l({val:B,uid:x?.uid,settingId:c({id:A?.template?.id}),pageContext:N,isReplaceInventoryQuantity:!0}),L=l({val:D,uid:x?.uid,settingId:c({id:A?.outOfStockMessage?.id}),pageContext:N}),U=l({val:F,uid:x?.uid,settingId:c({id:A?.continueSelling?.id}),pageContext:N}),W=l({val:H,uid:x?.uid,settingId:c({id:A?.unlimitedQuantityMessage?.id}),pageContext:N}),X=V({...b(x,C,G)}),Y=h({...y(G)}),Z=E({...u(C)}),ss=E({...n(R)}),st=h({...Q}),si=h({...S(G)}),se=r(C,G),so=p({templateStringDisplay:K,outOfStockMessageDisplay:L,continueSellingDisplay:U,unlimitedQuantityMessageDisplay:W}),sl=E({...m(C)}),sc=E({...s("gp-stock-counter-icon data-[visible=true]:gp-block data-[visible=false]:gp-hidden"),...v(),...f()}),sd=E({...g(C)}),sr=s=>h({...I(G,C,s)}),sa=({isOutOfStockIcon:s,isVisible:t})=>V({..._(s,t)}),s$=E({...k(G),...s("gp-stock-counter-mark")}),sp=s=>h({...O(G,s)}),su=V({...j()}),sn=$({templateStringDisplay:K,outOfStockMessageDisplay:L,continueSellingDisplay:U,unlimitedQuantityMessageDisplay:W},G);return i`
+    ${se}
+    <gp-product-stock-counter ${{...X}} class="${ss}"
+      style="${st}">
+      <div class="${sd}" style="${si}">
+      <style>${J}</style>
         <div
-          class="${so}"
-          style="${se}"
+          class="${Z}"
+          style="${Y}"
         >
-          <div class="${s$}">
-            ${t(z,i`
-              ${G("is_out_of_stock",i`<div
-                    ${{...sm({isOutOfStockIcon:!0,isVisible:!0})}}
-                    class="${sp}"
-                    style="${sn(!0)}"
+          <div class="${sl}">
+            ${t(T,i`
+              ${M("is_out_of_stock",i`<div
+                    ${{...sa({isOutOfStockIcon:!0,isVisible:!0})}}
+                    class="${sc}"
+                    style="${sr(!0)}"
                   >
-                    ${D}
+                    ${w}
                   </div>
               <div
-                    ${{...sm({isOutOfStockIcon:!1,isVisible:!1})}}
+                    ${{...sa({isOutOfStockIcon:!1,isVisible:!1})}}
                      data-slot-type="false"
-                    class="${sp}"
-                    style="${sn(!1)}"
+                    class="${sc}"
+                    style="${sr(!1)}"
                 >
-                  ${B}
+                  ${q}
                 </div>`,i` <div
-                    ${{...sm({isOutOfStockIcon:!0,isVisible:!1})}}
-                    class="${sp}"
-                    style="${sn(!0)}"
+                    ${{...sa({isOutOfStockIcon:!0,isVisible:!1})}}
+                    class="${sc}"
+                    style="${sr(!0)}"
                 >
-                  ${D}
+                  ${w}
               </div>
               <div
-                    ${{...sm({isOutOfStockIcon:!1,isVisible:!0})}}
-                    class="${sp}"
-                    style="${sn(!1)}"
+                    ${{...sa({isOutOfStockIcon:!1,isVisible:!0})}}
+                    class="${sc}"
+                    style="${sr(!1)}"
                 >
-                  ${B}
+                  ${q}
                 </div>`)}
             `)}
-            ${sy}
-            ${t("progress-bar"!==F,i`
-              ${G("is_out_of_stock",i`<p
-                ${{...sk}}
-                class="${sg}"
-                style="${sf(!0)}"
+            ${sn}
+            ${t("progress-bar"!==z,i`
+              ${M("is_out_of_stock",i`<p
+                ${{...su}}
+                class="${s$}"
+                style="${sp(!0)}"
               >
-                ${sa}
+                ${so}
               </p>`,i`<p
-                ${{...sk}}
-                class="${sg}"
-                style="${sf(!1)}"
+                ${{...su}}
+                class="${s$}"
+                style="${sp(!1)}"
               >
-                ${sa}
+                ${so}
               </p>`)}
               `)}
 
           </div>
-
-          <div
-            ${{...sv}}
-            style="${si}"
-            class="${st}"
-          ></div>
         </div>
         </div>
       </gp-product-stock-counter>
       ${t(e,`<script ${d('class="gps-link" delay',"src")}="{{ 'gp-product-stock-counter-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${d('class="gps-link" delay',"src")}="${o}/assets-v2/gp-product-stock-counter-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
-  `};export{R as default};
+  `};export{C as default};

package/dist/esm/stock-counter/settings/configs/ui-v2.js

@@ -1 +1 @@
-let t=[{label:"layout",controls:[{setting:{id:"layout"},layout:"vertical",controlChangeTrigger:{settings:[{action:{controlId:"displayProgressBar",newValue:!0,groupType:"style",controlType:"style"},source:["layout"],condition:"layout !== 'icon-and-text' && layout !== 'text-only'"},{action:{controlId:"displayProgressBar",newValue:!1,groupType:"style",controlType:"style"},source:["layout"],condition:"layout === 'icon-and-text' || layout === 'text-only'"},{action:{controlId:"showIcon",newValue:!0,groupType:"setting",controlType:"setting"},source:["layout"],condition:"layout === 'full' || layout === 'icon-and-text'"},{action:{controlId:"showIcon",newValue:!1,groupType:"setting",controlType:"setting"},source:["layout"],condition:"layout === 'text-and-progress-bar' || layout === 'progress-bar' || layout === 'text-only'"}],options:{noRecordHistory:!0}}}]},{controls:[{label:"Progress bar",setting:{id:"displayProgressBar"},options:{labelVariant:"primary",toggleStyle:"switch"}},{conditionDisplay:"displayProgressBar == true",label:"Percentage left",setting:{id:"remainingPercentage"}},{conditionDisplay:"displayProgressBar == true",label:"Color",setting:{id:"color"}},{conditionDisplay:"displayProgressBar == true",label:"Effect",setting:{id:"effect"}}],moreSettings:{type:"collapse",controls:[{conditionDisplay:"displayProgressBar == true",label:"Height",setting:{id:"progressBarHeight"}},{conditionDisplay:"displayProgressBar == true",label:"Position",setting:{id:"progressBarPosition"}},{conditionDisplay:"displayProgressBar == true",hiddenOnMobile:!0,label:"Corner",setting:{id:"borderRadius"}}]}},{hiddenOnMobile:!0,controls:[{label:"Icon",setting:{id:"showIcon"},options:{labelVariant:"primary",toggleStyle:"switch"}},{label:"Icon",conditionDisplay:"showIcon == true",setting:{id:"icon"},layout:"horizontal"},{label:"Size",conditionDisplay:"showIcon == true",setting:{id:"iconSize"},layout:"horizontal"},{conditionDisplay:"showIcon == true",label:"Color",setting:{id:"iconColor"}},{label:"Position",conditionDisplay:"showIcon == true",setting:{id:"iconPosition"},layout:"horizontal"}]},{label:"Size",hiddenOnMobile:!0,controls:[{label:"Width",setting:{id:"width"}}]},{label:"Text",controls:[{label:"Content",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"template",isHideClear:!0,controls:[{label:"Content",setting:{id:"template"},layout:"vertical"}]},{setting:{id:"typo"},layout:"vertical"}]},{label:"Out of stock state",controls:[{label:"Action",setting:{id:"hiddenCounterWhenOutOfStock"}},{label:"Icon",setting:{id:"oosIcon"},conditionDisplay:"hiddenCounterWhenOutOfStock == false"},{label:"Content",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"outOfStockMessage",isHideClear:!0,controls:[{label:"Content",setting:{id:"outOfStockMessage"},layout:"vertical"}],conditionDisplay:"hiddenCounterWhenOutOfStock == false"},{label:"Icon color",setting:{id:"oosIconColor"},conditionDisplay:"hiddenCounterWhenOutOfStock == false"},{label:"Text color",setting:{id:"oosTextColor"},conditionDisplay:"hiddenCounterWhenOutOfStock == false"}]},{label:"Message",controls:[{label:"Sell when OOS",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"continueSelling",isHideClear:!0,popoverLabel:"Out of stock sell",controls:[{label:"Content",setting:{id:"continueSelling"},layout:"vertical"}]},{label:"Unlimited stock",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"unlimitedQuantityMessage",isHideClear:!0,popoverLabel:"Unlimited quantity",controls:[{label:"Content",setting:{id:"unlimitedQuantityMessage"},layout:"vertical"}]}]},{label:"Display option",controls:[{label:"Display",setting:{id:"displayByDefault"}},{label:"Stock",conditionDisplay:"displayByDefault == false",setting:{id:"scarcityThreshold"}}]},{controls:[{label:"Align",hiddenOnMobile:!0,conditionEnable:'!(parseInt(width) >= 100 && width?.includes("%"))',setting:{id:"alignment"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"}}]}];export{t as SettingUIV2};
+let t=[{label:"layout",controls:[{setting:{id:"layout"},layout:"vertical",controlChangeTrigger:{settings:[{action:{controlId:"displayProgressBar",newValue:!0,groupType:"style",controlType:"style"},source:["layout"],condition:"layout !== 'icon-and-text' && layout !== 'text-only'"},{action:{controlId:"displayProgressBar",newValue:!1,groupType:"style",controlType:"style"},source:["layout"],condition:"layout === 'icon-and-text' || layout === 'text-only'"},{action:{controlId:"showIcon",newValue:!0,groupType:"setting",controlType:"setting"},source:["layout"],condition:"layout === 'full' || layout === 'icon-and-text'"},{action:{controlId:"showIcon",newValue:!1,groupType:"setting",controlType:"setting"},source:["layout"],condition:"layout === 'text-and-progress-bar' || layout === 'progress-bar' || layout === 'text-only'"}],options:{noRecordHistory:!0}}}]},{moreSettings:{type:"collapse",controls:[{conditionDisplay:"displayProgressBar == true",label:"Height",setting:{id:"progressBarHeight"}},{conditionDisplay:"displayProgressBar == true",label:"Position",setting:{id:"progressBarPosition"}},{conditionDisplay:"displayProgressBar == true",hiddenOnMobile:!0,label:"Corner",setting:{id:"borderRadius"}}]}},{hiddenOnMobile:!0,controls:[{label:"Icon",setting:{id:"showIcon"},options:{labelVariant:"primary",toggleStyle:"switch"}},{label:"Icon",conditionDisplay:"showIcon == true",setting:{id:"icon"},layout:"horizontal"},{label:"Size",conditionDisplay:"showIcon == true",setting:{id:"iconSize"},layout:"horizontal"},{conditionDisplay:"showIcon == true",label:"Color",setting:{id:"iconColor"}},{label:"Position",conditionDisplay:"showIcon == true",setting:{id:"iconPosition"},layout:"horizontal"}]},{label:"Size",hiddenOnMobile:!0,controls:[{label:"Width",setting:{id:"width"}}]},{label:"Text",controls:[{label:"Content",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"template",isHideClear:!0,controls:[{label:"Content",setting:{id:"template"},layout:"vertical"}]},{setting:{id:"typo"},layout:"vertical"}]},{label:"Out of stock state",controls:[{label:"Action",setting:{id:"hiddenCounterWhenOutOfStock"}},{label:"Icon",setting:{id:"oosIcon"},conditionDisplay:"hiddenCounterWhenOutOfStock == false"},{label:"Content",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"outOfStockMessage",isHideClear:!0,controls:[{label:"Content",setting:{id:"outOfStockMessage"},layout:"vertical"}],conditionDisplay:"hiddenCounterWhenOutOfStock == false"},{label:"Icon color",setting:{id:"oosIconColor"},conditionDisplay:"hiddenCounterWhenOutOfStock == false"},{label:"Text color",setting:{id:"oosTextColor"},conditionDisplay:"hiddenCounterWhenOutOfStock == false"}]},{label:"Message",controls:[{label:"Sell when OOS",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"continueSelling",isHideClear:!0,popoverLabel:"Out of stock sell",controls:[{label:"Content",setting:{id:"continueSelling"},layout:"vertical"}]},{label:"Unlimited stock",type:"combo",iconName:"polaris-text-block",getValueFromSettingID:"unlimitedQuantityMessage",isHideClear:!0,popoverLabel:"Unlimited quantity",controls:[{label:"Content",setting:{id:"unlimitedQuantityMessage"},layout:"vertical"}]}]},{label:"Display option",controls:[{label:"Display",setting:{id:"displayByDefault"}},{label:"Stock",conditionDisplay:"displayByDefault == false",setting:{id:"scarcityThreshold"}}]},{controls:[{label:"Align",hiddenOnMobile:!0,conditionEnable:'!(parseInt(width) >= 100 && width?.includes("%"))',setting:{id:"alignment"},options:{labelVariant:"primary",fullWidth:!0,disableMessage:"Horizontal alignment is disabled when the width is set to 100% or greater"}}]}];export{t as SettingUIV2};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gem-sdk/components",
-  "version": "19.1.0-staging.34",
+  "version": "19.1.0-staging.35",
   "license": "MIT",
   "sideEffects": false,
   "main": "dist/cjs/index.js",