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

package/dist/cjs/product/components/product-price/common/classes.js

@@ -1 +1 @@
-"use strict";exports.getWrapperClasses=s=>{let{builderProps:e,classNames:t,advanced:a}=s;return{"gp-product-price group-data-[state=loading]:gp-invisible data-[hidden=true]:!gp-hidden":!0,...e?.uid&&{[e.uid]:!0},...a?.cssClass&&{[a.cssClass]:!0},...t&&{[t]:!0}}};
+"use strict";const getWrapperClasses=s=>{let{builderProps:e,classNames:t,advanced:a}=s;return{"gp-product-price group-data-[state=loading]:gp-invisible data-[hidden=true]:!gp-hidden":!0,...e?.uid&&{[e.uid]:!0},...a?.cssClass&&{[a.cssClass]:!0},...t&&{[t]:!0}}};exports.getWrapperClasses=getWrapperClasses;

package/dist/cjs/product/components/product-price/common/helpers.js

@@ -1,11 +1,11 @@
-"use strict";var e=require("@gem-sdk/core");exports.getTextProps=(r,i)=>{let{setting:o,styles:c,builderProps:t,classNames:n,pageContext:a}=r,p=o?.priceType==="compare",l=e.getGlobalColorClass("decoration",c?.lineColor);return{id:`p-price-${t?.uid}`,styles:{...c,lineThrough:p&&c?.lineThrough,lineColor:{normal:c?.lineColor},opacity:o?.opacityPrice},setting:{text:i??`${p?`
+"use strict";var core=require("@gem-sdk/core");const getTextProps=(e,r)=>{let{setting:o,styles:c,builderProps:i,classNames:t,pageContext:n}=e,p=o?.priceType==="compare",a=core.getGlobalColorClass("decoration",c?.lineColor),l=()=>`
       {% if variant.compare_at_price  %}
-        {{ variant.compare_at_price | ${a?.showPriceCurrency?"money_with_currency":"money"}}}
+        {{ variant.compare_at_price | ${n?.showPriceCurrency?"money_with_currency":"money"}}}
       {% else %}
 
       {% endif %}
-    `:`
+    `,s=()=>`
      {% if variant.price %}
-       {{ variant.price | ${a?.showPriceCurrency?"money_with_currency":"money"}}}
+       {{ variant.price | ${n?.showPriceCurrency?"money_with_currency":"money"}}}
      {% endif %}
-   `}`,excludeFlex:!0},className:e.cls("gp-price",{"gp-money":!p,"gp-product-compare-price":p},l,n)}};
+   `;return{id:`p-price-${i?.uid}`,styles:{...c,lineThrough:p&&c?.lineThrough,lineColor:{normal:c?.lineColor},opacity:o?.opacityPrice},setting:{text:r??`${p?l():s()}`,excludeFlex:!0},className:core.cls("gp-price",{"gp-money":!p,"gp-product-compare-price":p},a,t)}};exports.getTextProps=getTextProps;

package/dist/cjs/product/components/product-price/hooks/useGpPrice.js

@@ -1 +1 @@
-"use strict";var e=require("react"),r=require("../../product-variants/common/common.js"),t=require("@gem-sdk/core");exports.useGpPrice=u=>{let{setting:i,builderProps:c}=u,o=e.useRef(null),a=t.useEditorMode(),{quantity:n,hasUpdatePrice:s}=t.useQuantity(),d=t.useCurrentVariant(),{useProductCompareAtPrice:p}=t.useProductBundleDiscount(),l=u["bundle-item"],m=t.convertDecimalToNumber(d?.price)??0,g=t.convertDecimalToNumber(d?.salePrice)??0,b=i?.priceType==="compare",{trigger:y}=t.useInteraction(),P=t.useProduct(),h=P?.baseID?.replace("gid://shopify/Product/",""),v=t.useShopStore(e=>e.showPriceCurrency),M=e.useMemo(()=>l?.quantity?l.quantity:s&&n||1,[n,s,l?.quantity]),T=e.useMemo(()=>{let e=Number(l?.discountValue);return l?.discountType==="percentage"?m*M*e/100:e},[l?.discountType,l?.discountValue,m,M]),q=e.useMemo(()=>l?.discountValue?p?(g||m)*M:m*M:g*M,[l?.discountValue,m,M,g,p]),w=e.useMemo(()=>{let e=m*M;return b?q:T?Math.max(0,e-T):e},[m,M,T,q,b]),D=e.useMemo(()=>!!b&&(!(g>m)||!(g>=0)),[b,g,m]),N=(e,r)=>{y({event:"price"===r?"gp:rollback:price-change":"gp:rollback:compare-price-change",selector:`[data-id="${c?.uid}"]`,element:o.current}),y({event:"price"===r?"gp:price-change":"gp:compare-price-change",data:e,selector:`[data-id="${c?.uid}"]`,element:o.current})};r.useTransition(e=>{e!==m&&N(m,"price")},[m]),r.useTransition(e=>{e!==g&&N(g,"compare")},[g]);let V=t.useFormatMoney(w??0,v||!1),C=b&&!w;return{elementRef:o,moneyFormatted:V,currentProductId:h,isNoComparePrice:C,isNoComparePriceILP:"edit"!==a&&C,emitNoDataSignal:()=>{if("edit"!==a)return;let e=new CustomEvent("editor:product-source-no-data-warning",{bubbles:!0,detail:{uid:c?.uid,value:!w&&b,tag:"ProductPrice"}});window.dispatchEvent(e)},shouldHiddenComparePrice:D}};
+"use strict";var React=require("react"),common=require("../../product-variants/common/common.js"),core=require("@gem-sdk/core");const useGpPrice=e=>{let{setting:r,builderProps:c}=e,t=React.useRef(null),o=core.useEditorMode(),{quantity:u,hasUpdatePrice:i}=core.useQuantity(),a=core.useCurrentVariant(),{useProductCompareAtPrice:n}=core.useProductBundleDiscount(),s=e["bundle-item"],d=core.convertDecimalToNumber(a?.price)??0,m=core.convertDecimalToNumber(a?.salePrice)??0,p=r?.priceType==="compare",{trigger:l}=core.useInteraction(),g=core.useProduct(),b=g?.baseID?.replace("gid://shopify/Product/",""),y=core.useShopStore(e=>e.showPriceCurrency),P=React.useMemo(()=>s?.quantity?s.quantity:i&&u||1,[u,i,s?.quantity]),h=React.useMemo(()=>{let e=Number(s?.discountValue);return s?.discountType==="percentage"?d*P*e/100:e},[s?.discountType,s?.discountValue,d,P]),v=React.useMemo(()=>s?.discountValue?n?(m||d)*P:d*P:m*P,[s?.discountValue,d,P,m,n]),M=React.useMemo(()=>{let e=d*P;return p?v:h?Math.max(0,e-h):e},[d,P,h,v,p]),R=React.useMemo(()=>!!p&&(!(m>d)||!(m>=0)),[p,m,d]),T=(e,r)=>{l({event:"price"===r?"gp:rollback:price-change":"gp:rollback:compare-price-change",selector:`[data-id="${c?.uid}"]`,element:t.current}),l({event:"price"===r?"gp:price-change":"gp:compare-price-change",data:e,selector:`[data-id="${c?.uid}"]`,element:t.current})};common.useTransition(e=>{e!==d&&T(d,"price")},[d]),common.useTransition(e=>{e!==m&&T(m,"compare")},[m]);let q=()=>{if("edit"!==o)return;let e=new CustomEvent("editor:product-source-no-data-warning",{bubbles:!0,detail:{uid:c?.uid,value:!M&&p,tag:"ProductPrice"}});window.dispatchEvent(e)},w=core.useFormatMoney(M??0,y||!1),V=p&&!M,D="edit"!==o&&V;return{elementRef:t,moneyFormatted:w,currentProductId:b,isNoComparePrice:V,isNoComparePriceILP:D,emitNoDataSignal:q,shouldHiddenComparePrice:R}};exports.useGpPrice=useGpPrice;

package/dist/cjs/product/components/product-properties/ProductProperties.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@gem-sdk/core"),r=require("react"),s=require("./property-choice/ProductPropertyChoice.js"),a=require("./property-input/ProductPropertyInput.js"),l=require("./property-select/ProductPropertySelect.js"),u=require("@gem-sdk/system"),i=require("./common/helpers.js"),c=require("./common/styles.js"),d=require("./common/attrs.js"),o=require("./common/classes.js");exports.default=({setting:n,styles:g,builderProps:p})=>{let{name:m,label:y,type:v,required:h,minChar:C,maxChar:f,numberOnly:b,minNumber:x,maxNumber:j,childItem:S,requiredMessage:P,invalidEmailMessage:k,invalidLengthMessage:w,invalidNumberMessage:q}=n??{},{isDisplayLabel:N=!0}=g??{},M=t.useUniqProductID(),E=t.useProductStore(e=>e.updateProperty),L=t.useProductStore(e=>e.addProperty),$=t.useProductStore(e=>e.isSubmit),[I,W]=r.useState(""),[R,V]=r.useState(!1),[Z,A]=r.useState([]),D=t.usePrevious(m),O=t.useProduct(),_=r.useRef(null),{trigger:B}=t.useInteraction(),F=r.useCallback((e,t)=>{B({event:"gp:rollback:option-selected",selector:`[data-id="${p?.uid}"`,element:t}),B({event:"gp:option-selected",data:e,selector:`[data-id="${p?.uid}"`,element:t})},[p?.uid,B]),T=r.useCallback(e=>{if(window.interactionLoaded){e();return}window.addEventListener("gp:flow-actions-loaded",()=>{e()})},[]);r.useEffect(()=>{if("dropdown"===v){let e=_.current?.querySelector("select")?.value;T(()=>{F(e,_.current)})}},[F,T,v]),r.useEffect(()=>{m&&(D?E(D,{key:m,value:I,required:h}):L({key:m,value:"",required:h}))},[L,D,E,m,h,I]);let U=r.useCallback(e=>{let t=e?.length??0;return!h&&0===t||(b?(Number(x)||0)<=Number(e)&&Number(t)<=(Number(j)||0):(C??0)<=t&&t<=(f??0))},[f,j,C,x,b,h]),X=r.useCallback(e=>h&&!e?{message:P}:b&&e&&!/^\d+$/.test(e)?{message:q}:U(e)?void 0:{message:w},[U,b,h,P,w,q]),z=r.useCallback(e=>{if(!e?.trim()||!t.validateEmail(e))return{message:k}},[k]),G=r.useCallback(e=>{if(!e?.trim()&&h)return{message:P}},[h,P]),H=r.useCallback(e=>{if(h&&(!e||e.length<=0))return{message:P}},[h,P]),J=e=>{if(V(!0),"checkbox"===v){let t=[];A(t=e.target.checked?[...Z,e.target.value]:Z.filter(t=>t!==e.target.value)),F(t,_.current),E(e.target.name,{value:t.join(", ")})}else W(e.target.value),F(e.target.value,_.current),E(e.target.name,{value:e.target.value})},K=r.useMemo(()=>{let e=(()=>{switch(v){case"email":return z(I);case"checkbox":return H(Z);case"radio":case"dropdown":return G(I);default:return X(I)}})()?.message,t=void 0!==I&&""!==I,r=!$&&!R||!e;return{isValid:r,isRequired:t,message:e}},[I,$,R,v,z,H,Z,G,X]),Q=O?.baseID?.replace("gid://shopify/Product/",""),Y=u.createAttr({...d.getWrapperTSXAttrs(p?.uid,Q)}),ee=u.createStyle({...c.getWrapperStyles(g)}),et=u.createStyle({...c.getLabelStyles(g)}),er=u.createClass({...o.getLabelClasses(g)}),es=u.createStyle({...c.getLabelContentStyles()}),ea=i.getLabelContent(n),el=u.createClass({...o.getWrapperErrorMessageClasses(),"gp-hidden":K.isValid}),eu=u.createStyle({...c.getWrapperErrorMessageStyles(g)});return e.jsxs("div",{...Y,style:ee,id:`shopify-text-element-${p?.uid}`,ref:_,children:[N&&e.jsx("div",{children:e.jsxs("label",{htmlFor:`${M}-${m}`,className:er,style:et,children:[y,e.jsx("span",{style:es,children:ea})]})}),e.jsxs("div",{children:["dropdown"===v&&e.jsx(l.default,{setting:{...n,handleChangeOption:e=>{V(!0),W(e.target.value),F(e.target.value,_.current),E(e.target.name,{value:e.target.value})}},styles:g}),("checkbox"===v||"radio"===v)&&e.jsx(s.default,{setting:{...n,childItem:S,name:m,handleChange:J},currentProductId:Q,styles:g,defaultName:p?.uid}),("text"===v||"textarea"===v||"email"===v||"hidden"===v)&&e.jsx(a.default,{setting:{...n,handleChange:J,validationData:K},styles:g}),e.jsxs("div",{className:el,style:eu,children:[e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"currentColor",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M15 8C15 11.866 11.866 15 8 15C4.13401 15 1 11.866 1 8C1 4.13401 4.13401 1 8 1C11.866 1 15 4.13401 15 8ZM8 10.5C7.58579 10.5 7.25 10.8358 7.25 11.25C7.25 11.6642 7.58579 12 8 12C8.41421 12 8.75 11.6642 8.75 11.25C8.75 10.8358 8.41421 10.5 8 10.5ZM8.5 4C8.5 3.72386 8.27614 3.5 8 3.5C7.72386 3.5 7.5 3.72386 7.5 4V9C7.5 9.27614 7.72386 9.5 8 9.5C8.27614 9.5 8.5 9.27614 8.5 9V4Z",fill:"currentColor"})}),e.jsx("span",{className:"gp-pl-1",children:K.message})]})]})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),React=require("react"),ProductPropertyChoice=require("./property-choice/ProductPropertyChoice.js"),ProductPropertyInput=require("./property-input/ProductPropertyInput.js"),ProductPropertySelect=require("./property-select/ProductPropertySelect.js"),system=require("@gem-sdk/system"),helpers=require("./common/helpers.js"),styles=require("./common/styles.js"),attrs=require("./common/attrs.js"),classes=require("./common/classes.js");const ProductProperties=({setting:e,styles:t,builderProps:r})=>{let{name:s,label:a,type:l,required:u,minChar:c,maxChar:o,numberOnly:i,minNumber:d,maxNumber:n,childItem:m,requiredMessage:p,invalidEmailMessage:y,invalidLengthMessage:g,invalidNumberMessage:x}=e??{},{isDisplayLabel:j=!0}=t??{},P=core.useUniqProductID(),h=core.useProductStore(e=>e.updateProperty),v=core.useProductStore(e=>e.addProperty),R=core.useProductStore(e=>e.isSubmit),[C,f]=React.useState(""),[b,S]=React.useState(!1),[k,w]=React.useState([]),q=core.usePrevious(s),N=core.useProduct(),I=React.useRef(null),{trigger:M}=core.useInteraction(),E=React.useCallback((e,t)=>{M({event:"gp:rollback:option-selected",selector:`[data-id="${r?.uid}"`,element:t}),M({event:"gp:option-selected",data:e,selector:`[data-id="${r?.uid}"`,element:t})},[r?.uid,M]),L=React.useCallback(e=>{if(window.interactionLoaded){e();return}window.addEventListener("gp:flow-actions-loaded",()=>{e()})},[]);React.useEffect(()=>{if("dropdown"===l){let e=I.current?.querySelector("select")?.value;L(()=>{E(e,I.current)})}},[E,L,l]),React.useEffect(()=>{s&&(q?h(q,{key:s,value:C,required:u}):v({key:s,value:"",required:u}))},[v,q,h,s,u,C]);let $=React.useCallback(e=>{let t=e?.length??0;return!u&&0===t||(i?(Number(d)||0)<=Number(e)&&Number(t)<=(Number(n)||0):(c??0)<=t&&t<=(o??0))},[o,n,c,d,i,u]),W=React.useCallback(e=>u&&!e?{message:p}:i&&e&&!/^\d+$/.test(e)?{message:x}:$(e)?void 0:{message:g},[$,i,u,p,g,x]),V=React.useCallback(e=>{if(!e?.trim()||!core.validateEmail(e))return{message:y}},[y]),Z=React.useCallback(e=>{if(!e?.trim()&&u)return{message:p}},[u,p]),A=React.useCallback(e=>{if(u&&(!e||e.length<=0))return{message:p}},[u,p]),D=e=>{if(S(!0),"checkbox"===l){let t=[];w(t=e.target.checked?[...k,e.target.value]:k.filter(t=>t!==e.target.value)),E(t,I.current),h(e.target.name,{value:t.join(", ")})}else f(e.target.value),E(e.target.value,I.current),h(e.target.name,{value:e.target.value})},_=e=>{S(!0),f(e.target.value),E(e.target.value,I.current),h(e.target.name,{value:e.target.value})},B=React.useMemo(()=>{let e=()=>{switch(l){case"email":return V(C);case"checkbox":return A(k);case"radio":case"dropdown":return Z(C);default:return W(C)}},t=e()?.message,r=void 0!==C&&""!==C,s=!R&&!b||!t;return{isValid:s,isRequired:r,message:t}},[C,R,b,l,V,A,k,Z,W]),F=N?.baseID?.replace("gid://shopify/Product/",""),O=system.createAttr({...attrs.getWrapperTSXAttrs(r?.uid,F)}),T=system.createStyle({...styles.getWrapperStyles(t)}),U=system.createStyle({...styles.getLabelStyles(t)}),X=system.createClass({...classes.getLabelClasses(t)}),z=system.createStyle({...styles.getLabelContentStyles()}),G=helpers.getLabelContent(e),H=system.createClass({...classes.getWrapperErrorMessageClasses(),"gp-hidden":B.isValid}),J=system.createStyle({...styles.getWrapperErrorMessageStyles(t)});return jsxRuntime.jsxs("div",{...O,style:T,id:`shopify-text-element-${r?.uid}`,ref:I,children:[j&&jsxRuntime.jsx("div",{children:jsxRuntime.jsxs("label",{htmlFor:`${P}-${s}`,className:X,style:U,children:[a,jsxRuntime.jsx("span",{style:z,children:G})]})}),jsxRuntime.jsxs("div",{children:["dropdown"===l&&jsxRuntime.jsx(ProductPropertySelect.default,{setting:{...e,handleChangeOption:_},styles:t}),("checkbox"===l||"radio"===l)&&jsxRuntime.jsx(ProductPropertyChoice.default,{setting:{...e,childItem:m,name:s,handleChange:D},currentProductId:F,styles:t,defaultName:r?.uid}),("text"===l||"textarea"===l||"email"===l||"hidden"===l)&&jsxRuntime.jsx(ProductPropertyInput.default,{setting:{...e,handleChange:D,validationData:B},styles:t}),jsxRuntime.jsxs("div",{className:H,style:J,children:[jsxRuntime.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"currentColor",xmlns:"http://www.w3.org/2000/svg",children:jsxRuntime.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M15 8C15 11.866 11.866 15 8 15C4.13401 15 1 11.866 1 8C1 4.13401 4.13401 1 8 1C11.866 1 15 4.13401 15 8ZM8 10.5C7.58579 10.5 7.25 10.8358 7.25 11.25C7.25 11.6642 7.58579 12 8 12C8.41421 12 8.75 11.6642 8.75 11.25C8.75 10.8358 8.41421 10.5 8 10.5ZM8.5 4C8.5 3.72386 8.27614 3.5 8 3.5C7.72386 3.5 7.5 3.72386 7.5 4V9C7.5 9.27614 7.72386 9.5 8 9.5C8.27614 9.5 8.5 9.27614 8.5 9V4Z",fill:"currentColor"})}),jsxRuntime.jsx("span",{className:"gp-pl-1",children:B.message})]})]})]})};exports.default=ProductProperties;

package/dist/cjs/product/components/product-properties/ProductProperties.liquid.js

@@ -1,22 +1,22 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("./property-choice/ProductPropertyChoice.liquid.js"),r=require("./property-input/ProductPropertyInput.liquid.js"),s=require("./property-select/ProductPropertySelect.liquid.js"),l=require("../../../helpers.js"),a=require("@gem-sdk/system"),p=require("./common/helpers.js"),o=require("./common/attrs.js"),d=require("./common/styles.js"),i=require("./common/classes.js");exports.default=({setting:c,styles:n,builderProps:g,advanced:u,pageContext:y})=>{let{name:C,type:$,childItem:m}=c??{},{isDisplayLabel:v=!0}=n??{};c&&!C&&(c.name="Property");let f=g?.uid,{displayLabel:h}=p.getContents({uniqId:f,pageContext:y??{},setting:c}),S=a.createAttr({...o.getWrapperLiquidAttrs({uniqId:f,pageContext:y??{},setting:c})}),q=a.createStyle({...d.getWrapperStyles(n)}),j=a.createStyle({...d.getLabelStyles(n)}),P=a.createClass({...i.getLabelClasses(n)}),b=a.createClass({...i.getLiquidTagClasses(c)}),x=a.createClass({...i.getLabelWrapperClasses(u)}),L=a.createStyle({...d.getLabelContentStyles()}),E=p.getLabelContent(c),M=a.createClass({...i.getWrapperErrorMessageClasses(),...e.composeClasses("data-[hidden=true]:gp-hidden")}),w=a.createStyle({...d.getWrapperErrorMessageStyles(n)}),A=a.createAttr({...o.getWrapperErrorMessageAttrs()});return e.template`
-    <gp-product-property ${{...S}} class="${b}"
-      style="${q}"
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),ProductPropertyChoice_liquid=require("./property-choice/ProductPropertyChoice.liquid.js"),ProductPropertyInput_liquid=require("./property-input/ProductPropertyInput.liquid.js"),ProductPropertySelect_liquid=require("./property-select/ProductPropertySelect.liquid.js"),helpers$1=require("../../../helpers.js"),system=require("@gem-sdk/system"),helpers=require("./common/helpers.js"),attrs=require("./common/attrs.js"),styles=require("./common/styles.js"),classes=require("./common/classes.js");const ProductProperties=({setting:e,styles:s,builderProps:t,advanced:r,pageContext:l})=>{let{name:a,type:o,childItem:p}=e??{},{isDisplayLabel:c=!0}=s??{};e&&!a&&(e.name="Property");let d=t?.uid,{displayLabel:i}=helpers.getContents({uniqId:d,pageContext:l??{},setting:e}),u=system.createAttr({...attrs.getWrapperLiquidAttrs({uniqId:d,pageContext:l??{},setting:e})}),y=system.createStyle({...styles.getWrapperStyles(s)}),n=system.createStyle({...styles.getLabelStyles(s)}),g=system.createClass({...classes.getLabelClasses(s)}),m=system.createClass({...classes.getLiquidTagClasses(e)}),C=system.createClass({...classes.getLabelWrapperClasses(r)}),P=system.createStyle({...styles.getLabelContentStyles()}),$=helpers.getLabelContent(e),h=system.createClass({...classes.getWrapperErrorMessageClasses(),...core.composeClasses("data-[hidden=true]:gp-hidden")}),q=system.createStyle({...styles.getWrapperErrorMessageStyles(s)}),v=system.createAttr({...attrs.getWrapperErrorMessageAttrs()});return core.template`
+    <gp-product-property ${{...u}} class="${m}"
+      style="${y}"
     >
-      ${e.RenderIf(v,e.template`<div class="${x}">
-        <label htmlFor="${f}-${C}" class="${P}" style="${j}">
-          ${h}
-          <span style="${L}">${E}</span>
+      ${core.RenderIf(c,core.template`<div class="${C}">
+        <label htmlFor="${d}-${a}" class="${g}" style="${n}">
+          ${i}
+          <span style="${P}">${$}</span>
         </label>
       </div>`)}
 
       <div>
-        ${e.RenderIf("dropdown"===$,s.default({setting:c,styles:n,builderProps:g,pageContext:y}))}
-        ${e.RenderIf("checkbox"===$||"radio"===$,t.default({setting:{...c,childItem:m,name:C},styles:n,builderProps:g,pageContext:y}))}
-        ${e.RenderIf("text"===$||"textarea"===$||"email"===$||"hidden"===$,r.default({setting:c,styles:n,builderProps:g,pageContext:y}))}
+        ${core.RenderIf("dropdown"===o,ProductPropertySelect_liquid.default({setting:e,styles:s,builderProps:t,pageContext:l}))}
+        ${core.RenderIf("checkbox"===o||"radio"===o,ProductPropertyChoice_liquid.default({setting:{...e,childItem:p,name:a},styles:s,builderProps:t,pageContext:l}))}
+        ${core.RenderIf("text"===o||"textarea"===o||"email"===o||"hidden"===o,ProductPropertyInput_liquid.default({setting:e,styles:s,builderProps:t,pageContext:l}))}
         <div
-          ${{...A}}
-          class="${M}"
-          style="${w}"
+          ${{...v}}
+          class="${h}"
+          style="${q}"
         >
           <svg
             width="16"
@@ -36,4 +36,4 @@
         </div>
       </div>
     </gp-product-property>
-    ${e.RenderIf(e.isLocalEnv,`<script ${l.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-product-property-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${l.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-product-property-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}`};
+    ${core.RenderIf(core.isLocalEnv,`<script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-product-property-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="${core.baseAssetURL}/assets-v2/gp-product-property-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}`};exports.default=ProductProperties;

package/dist/cjs/product/components/product-properties/common/attrs.js

@@ -1 +1 @@
-"use strict";var e=require("./helpers.js");exports.getWrapperErrorMessageAttrs=()=>({"data-slot-type":"message","data-hidden":"true"}),exports.getWrapperLiquidAttrs=({uniqId:t,pageContext:a,setting:r})=>{let{invalidNumberMessageDisplay:s,invalidEmailMessageDisplay:i,requiredMessageDisplay:d,invalidLengthMessageDisplay:g}=e.getContents({uniqId:t,pageContext:a,setting:r});return{"data-id":t??"","data-invalid":!1,"data-gp-setting":JSON.stringify(r).replaceAll('"',"""),"data-translate-setting":JSON.stringify({requiredMessage:d,invalidEmailMessage:i,invalidLengthMessage:g,invalidNumberMessage:s}).replaceAll('"',""")}},exports.getWrapperTSXAttrs=(e,t)=>({"data-product-id":t??"","data-id":e??""});
+"use strict";var helpers=require("./helpers.js");const getWrapperLiquidAttrs=({uniqId:e,pageContext:t,setting:r})=>{let{invalidNumberMessageDisplay:a,invalidEmailMessageDisplay:s,requiredMessageDisplay:p,invalidLengthMessageDisplay:i}=helpers.getContents({uniqId:e,pageContext:t,setting:r});return{"data-id":e??"","data-invalid":!1,"data-gp-setting":JSON.stringify(r).replaceAll('"',"""),"data-translate-setting":JSON.stringify({requiredMessage:p,invalidEmailMessage:s,invalidLengthMessage:i,invalidNumberMessage:a}).replaceAll('"',""")}},getWrapperTSXAttrs=(e,t)=>({"data-product-id":t??"","data-id":e??""}),getWrapperErrorMessageAttrs=()=>({"data-slot-type":"message","data-hidden":"true"});exports.getWrapperErrorMessageAttrs=getWrapperErrorMessageAttrs,exports.getWrapperLiquidAttrs=getWrapperLiquidAttrs,exports.getWrapperTSXAttrs=getWrapperTSXAttrs;

package/dist/cjs/product/components/product-properties/common/classes.js

@@ -1 +1 @@
-"use strict";var s=require("@gem-sdk/core");exports.getLabelClasses=e=>{let{labelBgColor:o,labelTextColor:r,labelTypography:p,labelTypo:l}=e??{},t=s.composeTypographyClassName(l,p),a=s.getGlobalColorClass("bg",o),g=s.getGlobalColorClass("text",r);return{...s.composeClasses(t),...s.composeClasses(a),...s.composeClasses(g)}},exports.getLabelWrapperClasses=e=>({...s.composeClasses(e?.cssClass)}),exports.getLiquidTagClasses=e=>{let{type:o}=e??{};return{...s.composeClasses(`gp-block gp-group gp-property_${o}`)}},exports.getWrapperErrorMessageClasses=()=>({...s.composeClasses("gp-flex gp-flex-row gp-items-center gp-pt-1 gp-text-sm gp-text-g-error")});
+"use strict";var core=require("@gem-sdk/core");const getLiquidTagClasses=e=>{let{type:s}=e??{};return{...core.composeClasses(`gp-block gp-group gp-property_${s}`)}},getLabelClasses=e=>{let{labelBgColor:s,labelTextColor:r,labelTypography:a,labelTypo:o}=e??{},l=core.composeTypographyClassName(o,a),p=core.getGlobalColorClass("bg",s),t=core.getGlobalColorClass("text",r);return{...core.composeClasses(l),...core.composeClasses(p),...core.composeClasses(t)}},getLabelWrapperClasses=e=>({...core.composeClasses(e?.cssClass)}),getWrapperErrorMessageClasses=()=>({...core.composeClasses("gp-flex gp-flex-row gp-items-center gp-pt-1 gp-text-sm gp-text-g-error")});exports.getLabelClasses=getLabelClasses,exports.getLabelWrapperClasses=getLabelWrapperClasses,exports.getLiquidTagClasses=getLiquidTagClasses,exports.getWrapperErrorMessageClasses=getWrapperErrorMessageClasses;

package/dist/cjs/product/components/product-properties/common/helpers.js

@@ -1 +1 @@
-"use strict";var e=require("../../../../helpers.js"),t=require("../../../settings/product-properties/configs/translate.js");exports.getContents=({uniqId:i,pageContext:r,setting:s})=>{let{label:d,invalidNumberMessage:a,invalidEmailMessage:c,requiredMessage:n,invalidLengthMessage:o}=s??{},g=e.getDynamicSourceLocales({val:d,uid:i,settingId:e.createSettingId({id:t.ProductProperties?.label?.id}),pageContext:r}),u=e.getDynamicSourceLocales({val:a,uid:i,settingId:e.createSettingId({id:t.ProductProperties?.invalidNumberMessage?.id}),pageContext:r}),l=e.getDynamicSourceLocales({val:c,uid:i,settingId:e.createSettingId({id:t.ProductProperties?.invalidEmailMessage?.id}),pageContext:r}),p=e.getDynamicSourceLocales({val:n,uid:i,settingId:e.createSettingId({id:t.ProductProperties?.requiredMessage?.id}),pageContext:r}),I=e.getDynamicSourceLocales({val:o,uid:i,settingId:e.createSettingId({id:t.ProductProperties?.invalidLengthMessage?.id}),pageContext:r});return{displayLabel:g,invalidNumberMessageDisplay:u,invalidEmailMessageDisplay:l,requiredMessageDisplay:p,invalidLengthMessageDisplay:I}},exports.getLabelContent=e=>{let{label:t,required:i}=e??{};return i&&t?" *":""};
+"use strict";var helpers=require("../../../../helpers.js"),translate=require("../../../settings/product-properties/configs/translate.js");const getContents=({uniqId:e,pageContext:t,setting:r})=>{let{label:s,invalidNumberMessage:i,invalidEmailMessage:a,requiredMessage:n,invalidLengthMessage:l}=r??{},d=helpers.getDynamicSourceLocales({val:s,uid:e,settingId:helpers.createSettingId({id:translate.ProductProperties?.label?.id}),pageContext:t}),o=helpers.getDynamicSourceLocales({val:i,uid:e,settingId:helpers.createSettingId({id:translate.ProductProperties?.invalidNumberMessage?.id}),pageContext:t}),c=helpers.getDynamicSourceLocales({val:a,uid:e,settingId:helpers.createSettingId({id:translate.ProductProperties?.invalidEmailMessage?.id}),pageContext:t}),g=helpers.getDynamicSourceLocales({val:n,uid:e,settingId:helpers.createSettingId({id:translate.ProductProperties?.requiredMessage?.id}),pageContext:t}),u=helpers.getDynamicSourceLocales({val:l,uid:e,settingId:helpers.createSettingId({id:translate.ProductProperties?.invalidLengthMessage?.id}),pageContext:t});return{displayLabel:d,invalidNumberMessageDisplay:o,invalidEmailMessageDisplay:c,requiredMessageDisplay:g,invalidLengthMessageDisplay:u}},getLabelContent=e=>{let{label:t,required:r}=e??{};return r&&t?" *":""};exports.getContents=getContents,exports.getLabelContent=getLabelContent;

package/dist/cjs/product/components/product-properties/common/styles.js

@@ -1 +1 @@
-"use strict";var e=require("@gem-sdk/core");exports.getLabelContentStyles=()=>({...e.makeStyle({c:"red"}),"":""}),exports.getLabelStyles=t=>{let{labelBgColor:r,labelTextColor:l,labelTypography:s,labelTypo:o}=t??{},a=e.composeTypographyStyle(o,s),p=e.getGlobalColorClass("bg",r),g=e.getGlobalColorClass("text",l);return{...e.makeStyle({bg:""===p?r:void 0,c:""===g?l:void 0,tt:t?.labelTransform}),...a}},exports.getWrapperErrorMessageStyles=t=>{let{textAlign:r}=t??{};return{...e.makeStyleResponsive("jc",r)}},exports.getWrapperStyles=t=>{let{textAlign:r}=t??{};return{...e.makeStyleResponsive("ta",r)}};
+"use strict";var core=require("@gem-sdk/core");const getWrapperStyles=e=>{let{textAlign:t}=e??{};return{...core.makeStyleResponsive("ta",t)}},getLabelStyles=e=>{let{labelBgColor:t,labelTextColor:r,labelTypography:l,labelTypo:s}=e??{},o=core.composeTypographyStyle(s,l),a=core.getGlobalColorClass("bg",t),g=core.getGlobalColorClass("text",r);return{...core.makeStyle({bg:""===a?t:void 0,c:""===g?r:void 0,tt:e?.labelTransform}),...o}},getLabelContentStyles=()=>({...core.makeStyle({c:"red"}),"":""}),getWrapperErrorMessageStyles=e=>{let{textAlign:t}=e??{};return{...core.makeStyleResponsive("jc",t)}};exports.getLabelContentStyles=getLabelContentStyles,exports.getLabelStyles=getLabelStyles,exports.getWrapperErrorMessageStyles=getWrapperErrorMessageStyles,exports.getWrapperStyles=getWrapperStyles;

package/dist/cjs/product/components/product-properties/property-choice/ProductPropertyChoice.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("@gem-sdk/core"),t=require("./common/getProductPropertiesChoiceClasses.js"),r=require("./common/getProductPropertiesChoiceStyles.js"),l=require("./common/getProductPropertiesChoiceInlineCss.js"),a=require("@gem-sdk/system");exports.default=({setting:c,styles:i,defaultName:o,currentProductId:P})=>{let n=s.useUniqProductID(),{name:C,type:u,handleChange:y,childItem:d}=c??{},{valueTextColor:m}=i??{},p=`${(C||o)??""}-${P}`,g=l.getPPCInlineStyleChoice(o,m),h=a.createClass({...t.getPPCWrapperClasses()}),j=a.createClass({...t.getPPCLabelClasses(i)}),S=a.createStyle({...r.getPPCWrapperStyles(i)}),x=a.createClass({...t.getPPCWrapperClassesMain()}),$=a.createStyle({...r.getPPCContainerStyles(i)}),q=a.createStyle({...r.getPPCLabelStyles(i)}),v=a.createStyle({...r.getPPCInputStyles(i)});return e.jsxs("div",{style:S,className:x,children:[e.jsx("style",{children:g}),d?.map((s,t)=>e.jsxs("div",{style:$,className:h,children:[e.jsx("input",{type:u,id:`${n}-${p}-${t}`,name:p,value:s,style:v,onChange:y}),e.jsx("label",{htmlFor:`${n}-${p}-${t}`,className:j,style:q,children:s})]},t))]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),getProductPropertiesChoiceClasses=require("./common/getProductPropertiesChoiceClasses.js"),getProductPropertiesChoiceStyles=require("./common/getProductPropertiesChoiceStyles.js"),getProductPropertiesChoiceInlineCss=require("./common/getProductPropertiesChoiceInlineCss.js"),system=require("@gem-sdk/system");const ProductPropertyChoice=({setting:e,styles:s,defaultName:t,currentProductId:r})=>{let o=core.useUniqProductID(),{name:i,type:c,handleChange:l,childItem:P}=e??{},{valueTextColor:C}=s??{},a=`${(i||t)??""}-${r}`,u=getProductPropertiesChoiceInlineCss.getPPCInlineStyleChoice(t,C),n=system.createClass({...getProductPropertiesChoiceClasses.getPPCWrapperClasses()}),y=system.createClass({...getProductPropertiesChoiceClasses.getPPCLabelClasses(s)}),m=system.createStyle({...getProductPropertiesChoiceStyles.getPPCWrapperStyles(s)}),d=system.createClass({...getProductPropertiesChoiceClasses.getPPCWrapperClassesMain()}),p=system.createStyle({...getProductPropertiesChoiceStyles.getPPCContainerStyles(s)}),g=system.createStyle({...getProductPropertiesChoiceStyles.getPPCLabelStyles(s)}),h=system.createStyle({...getProductPropertiesChoiceStyles.getPPCInputStyles(s)});return jsxRuntime.jsxs("div",{style:m,className:d,children:[jsxRuntime.jsx("style",{children:u}),P?.map((e,s)=>jsxRuntime.jsxs("div",{style:p,className:n,children:[jsxRuntime.jsx("input",{type:c,id:`${o}-${a}-${s}`,name:a,value:e,style:h,onChange:l}),jsxRuntime.jsx("label",{htmlFor:`${o}-${a}-${s}`,className:y,style:g,children:e})]},s))]})};exports.default=ProductPropertyChoice;

package/dist/cjs/product/components/product-properties/property-choice/ProductPropertyChoice.liquid.js

@@ -1,24 +1,24 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("./common/getProductPropertiesChoiceInlineCss.js"),r=require("../../../../helpers.js"),s=require("@gem-sdk/system"),i=require("./common/getProductPropertiesChoiceClasses.js"),l=require("./common/getProductPropertiesChoiceStyles.js"),o=require("./common/getProductPropertiesChoiceAttrs.js"),a=require("../../../settings/product-properties/configs/translate.js");exports.default=({setting:c,styles:p,builderProps:u,pageContext:d,attributes:n})=>{let P=u?.uid,{name:C,type:$,childItem:m}=c??{},{valueTextColor:g,fullWidth:y,width:S}=p??{},h=e.makeStyleResponsive("w",e.makeWidth(S,y)),v=`properties[${C}]`,j=t.getPPCInlineStyleChoice(P,g),q=s.createClass({...i.getPPCWrapperClasses()}),I=s.createClass({...i.getPPCLabelClasses(p)}),b=s.createStyle({...l.getPPCContainerStyles(p)}),f=s.createClass({...i.getPPCWrapperClassesMain()}),k=s.createStyle({...l.getPPCLabelStyles(p)}),x=s.createAttr({...o.getPPCInputAttrs(n)}),_=s.createStyle({...l.getPPCInputStyles(p)});return e.template`<div style="${{...h}}" class="${f}">
-      <style>${j}</style>
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),getProductPropertiesChoiceInlineCss=require("./common/getProductPropertiesChoiceInlineCss.js"),helpers=require("../../../../helpers.js"),system=require("@gem-sdk/system"),getProductPropertiesChoiceClasses=require("./common/getProductPropertiesChoiceClasses.js"),getProductPropertiesChoiceStyles=require("./common/getProductPropertiesChoiceStyles.js"),getProductPropertiesChoiceAttrs=require("./common/getProductPropertiesChoiceAttrs.js"),translate=require("../../../settings/product-properties/configs/translate.js");const ProductPropertyChoice=({setting:e,styles:t,builderProps:r,pageContext:s,attributes:o})=>{let i=r?.uid,{name:c,type:l,childItem:P}=e??{},{valueTextColor:a,fullWidth:p,width:C}=t??{},u=core.makeStyleResponsive("w",core.makeWidth(C,p)),d=`properties[${c}]`,n=getProductPropertiesChoiceInlineCss.getPPCInlineStyleChoice(i,a),y=system.createClass({...getProductPropertiesChoiceClasses.getPPCWrapperClasses()}),g=system.createClass({...getProductPropertiesChoiceClasses.getPPCLabelClasses(t)}),m=system.createStyle({...getProductPropertiesChoiceStyles.getPPCContainerStyles(t)}),h=system.createClass({...getProductPropertiesChoiceClasses.getPPCWrapperClassesMain()}),$=system.createStyle({...getProductPropertiesChoiceStyles.getPPCLabelStyles(t)}),S=system.createAttr({...getProductPropertiesChoiceAttrs.getPPCInputAttrs(o)}),v=system.createStyle({...getProductPropertiesChoiceStyles.getPPCInputStyles(t)});return core.template`<div style="${{...u}}" class="${h}">
+      <style>${n}</style>
 
-      ${m?.map((t,s)=>{let i=r.getDynamicSourceLocales({val:t,uid:P,settingId:r.createSettingId({id:a.ProductProperties?.childItem?.id,index:s}),pageContext:d??{}});return e.template`
-            <div class="${q}" style="${b}">
+      ${P?.map((e,t)=>{let r=helpers.getDynamicSourceLocales({val:e,uid:i,settingId:helpers.createSettingId({id:translate.ProductProperties?.childItem?.id,index:t}),pageContext:s??{}});return core.template`
+            <div class="${y}" style="${m}">
               <input
-                ${{...x}}
-                type="${$}"
-                id="${P}-${C}-${s}"
-                name="${"radio"===$||"checkbox"===$?v:`${v}[]`}"
-                value="${i}"
-                style="${_}"
+                ${{...S}}
+                type="${l}"
+                id="${i}-${c}-${t}"
+                name="${"radio"===l||"checkbox"===l?d:`${d}[]`}"
+                value="${r}"
+                style="${v}"
                 form="{{ product_form_id }}"
               />
               <label
-                for="${P}-${C}-${s}"
-                class="${I}"
-                style="${k}"
+                for="${i}-${c}-${t}"
+                class="${g}"
+                style="${$}"
               >
-                ${i}
+                ${r}
               </label>
             </div>`}).join("")}
       </div>
-  `};
+  `};exports.default=ProductPropertyChoice;

package/dist/cjs/product/components/product-properties/property-choice/common/getProductPropertiesChoiceAttrs.js

@@ -1 +1 @@
-"use strict";exports.getPPCInputAttrs=t=>({"data-id":t?.dataId??"","data-slot-type":"input"});
+"use strict";const getPPCInputAttrs=t=>({"data-id":t?.dataId??"","data-slot-type":"input"});exports.getPPCInputAttrs=getPPCInputAttrs;

package/dist/cjs/product/components/product-properties/property-choice/common/getProductPropertiesChoiceClasses.js

@@ -1 +1 @@
-"use strict";var s=require("@gem-sdk/core");exports.getPPCLabelClasses=e=>{let{valueTextColor:o,valueBgColor:a,valueTypo:l,valueTypography:p}=e??{},t=s.composeTypographyClassName(l,p);return{...s.composeClasses("gp-p-2 gp-outline-none gp-break-words"),...s.composeClasses(s.getGlobalColorStateClass("text",o)),...s.composeClasses(s.getGlobalColorStateResponsiveClass("bg",a)),...s.composeClasses(t)}},exports.getPPCWrapperClasses=()=>s.composeClasses("gp-flex gp-items-center"),exports.getPPCWrapperClassesMain=()=>s.composeClasses("gp-inline-block");
+"use strict";var core=require("@gem-sdk/core");const getPPCWrapperClasses=()=>core.composeClasses("gp-flex gp-items-center"),getPPCWrapperClassesMain=()=>core.composeClasses("gp-inline-block"),getPPCLabelClasses=e=>{let{valueTextColor:s,valueBgColor:o,valueTypo:a,valueTypography:r}=e??{},l=core.composeTypographyClassName(a,r);return{...core.composeClasses("gp-p-2 gp-outline-none gp-break-words"),...core.composeClasses(core.getGlobalColorStateClass("text",s)),...core.composeClasses(core.getGlobalColorStateResponsiveClass("bg",o)),...core.composeClasses(l)}};exports.getPPCLabelClasses=getPPCLabelClasses,exports.getPPCWrapperClasses=getPPCWrapperClasses,exports.getPPCWrapperClassesMain=getPPCWrapperClassesMain;

package/dist/cjs/product/components/product-properties/property-choice/common/getProductPropertiesChoiceInlineCss.js

@@ -1,6 +1,6 @@
-"use strict";var e=require("@gem-sdk/core");exports.getPPCInlineStyleChoice=(r,t)=>{let l=t?.active||t?.normal;return l&&r?`
-      .${r} {
+"use strict";var core=require("@gem-sdk/core");const getPPCInlineStyleChoice=(e,t)=>{let r=t?.active||t?.normal;return r&&e?`
+      .${e} {
         input:checked + label {
-          color: ${e.getSingleColorVariable(l)} !important;
+          color: ${core.getSingleColorVariable(r)} !important;
         }
-      }`:""};
+      }`:""};exports.getPPCInlineStyleChoice=getPPCInlineStyleChoice;

package/dist/cjs/product/components/product-properties/property-choice/common/getProductPropertiesChoiceStyles.js

@@ -1 +1 @@
-"use strict";var e=require("@gem-sdk/core");exports.getPPCContainerStyles=t=>{let{height:r}=t??{};return r?e.makeStyleResponsive("h",r):{}},exports.getPPCInputStyles=e=>{let{spacing:t}=e??{};return{"--mr":t}},exports.getPPCLabelStyles=t=>{let{valueBgColor:r,valueTextColor:l,valueTypography:o,valueTypo:s}=t??{},p=e.composeTypographyStyle(s,o);return{...e.getGlobalColorStateResponsiveStyle("bg",r),...e.getGlobalColorStateStyle("c",l),...p}},exports.getPPCWrapperStyles=t=>{let{width:r,fullWidth:l}=t??{};return e.makeStyleResponsive("w",e.makeWidth(r,l))};
+"use strict";var core=require("@gem-sdk/core");const getPPCWrapperStyles=e=>{let{width:t,fullWidth:r}=e??{};return core.makeStyleResponsive("w",core.makeWidth(t,r))},getPPCContainerStyles=e=>{let{height:t}=e??{};return t?core.makeStyleResponsive("h",t):{}},getPPCLabelStyles=e=>{let{valueBgColor:t,valueTextColor:r,valueTypography:l,valueTypo:o}=e??{},s=core.composeTypographyStyle(o,l);return{...core.getGlobalColorStateResponsiveStyle("bg",t),...core.getGlobalColorStateStyle("c",r),...s}},getPPCInputStyles=e=>{let{spacing:t}=e??{};return{"--mr":t}};exports.getPPCContainerStyles=getPPCContainerStyles,exports.getPPCInputStyles=getPPCInputStyles,exports.getPPCLabelStyles=getPPCLabelStyles,exports.getPPCWrapperStyles=getPPCWrapperStyles;

package/dist/cjs/product/components/product-properties/property-input/ProductPropertyInput.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("@gem-sdk/core"),r=require("@gem-sdk/system"),t=require("react"),a=require("./common/helpers.js"),u=require("./common/classes.js"),l=require("./common/styles.js");exports.default=({setting:n,styles:i})=>{let d=s.useUniqProductID(),{name:c,type:o,placeholder:m,required:h,handleChange:y,label:g,validationData:p}=n??{},q=t.useMemo(()=>{switch(o){case"textarea":case"hidden":return"textarea";default:return"input"}},[o]),x=t.useMemo(()=>"hidden"===o,[o]),j=`${m}${m&&h&&!g?" *":""}`,C=r.createClass({...u.getClasses(i),...s.composeClasses("hidden"===o?"gp-cursor-default":"")}),f=r.createStyle({...l.getStyles(i),...p?.isValid||"hidden"===o?{}:s.makeStyle({bc:"#F44336"})}),{elementType:$,elementValue:k,minLength:v,maxLength:M}=a.getElementContent(n);return e.jsx(q,{id:`${d}-${c}`,type:$,value:k,placeholder:j,name:c,readOnly:x,className:C,style:f,required:h,minLength:v,maxLength:M,onChange:y})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),system=require("@gem-sdk/system"),React=require("react"),helpers=require("./common/helpers.js"),classes=require("./common/classes.js"),styles=require("./common/styles.js");const ProductPropertyInput=({setting:e,styles:s})=>{let t=core.useUniqProductID(),{name:r,type:a,placeholder:c,required:u,handleChange:l,label:n,validationData:o}=e??{},i=React.useMemo(()=>{switch(a){case"textarea":case"hidden":return"textarea";default:return"input"}},[a]),m=React.useMemo(()=>"hidden"===a,[a]),d=`${c}${c&&u&&!n?" *":""}`,y=system.createClass({...classes.getClasses(s),...core.composeClasses("hidden"===a?"gp-cursor-default":"")}),p=system.createStyle({...styles.getStyles(s),...o?.isValid||"hidden"===a?{}:core.makeStyle({bc:"#F44336"})}),{elementType:h,elementValue:g,minLength:q,maxLength:x}=helpers.getElementContent(e);return jsxRuntime.jsx(i,{id:`${t}-${r}`,type:h,value:g,placeholder:d,name:r,readOnly:m,className:y,style:p,required:u,minLength:q,maxLength:x,onChange:l})};exports.default=ProductPropertyInput;

package/dist/cjs/product/components/product-properties/property-input/ProductPropertyInput.liquid.js

@@ -1,15 +1,15 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../../../helpers.js"),r=require("@gem-sdk/system"),s=require("./common/classes.js"),a=require("./common/styles.js"),o=require("./common/helpers.js"),i=require("./common/attrs.js"),l=require("../../../settings/product-properties/configs/translate.js");exports.default=({setting:u,styles:n,builderProps:m,pageContext:c,attributes:p})=>{let{name:d,type:g,placeholder:$,required:h,minChar:q,maxChar:y,label:j}=u??{minChar:Number,maxChar:Number},x="textarea"===g?"textarea":"input",C=t.getDynamicSourceLocales({val:$,uid:m?.uid,settingId:t.createSettingId({id:l.ProductProperties?.placeholder?.id}),pageContext:c??{}}),f=`${C}${$&&h&&!j?" *":""}`,v=r.createClass({...s.getClasses(n),...e.composeClasses("gp-shadow-none group-data-[invalid=true]:gp-border-[#F44336]")}),b=r.createStyle({...a.getStyles(n)}),{elementValue:S}=o.getElementContent(u),_=r.createAttr({...i.getInputAttrs(p)});return e.template`
-    <${x}
-      ${{..._}}
-      type="${g}"
-      placeholder="${f}"
-      name="properties[${d}]"
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),helpers=require("../../../../helpers.js"),system=require("@gem-sdk/system"),classes=require("./common/classes.js"),styles=require("./common/styles.js"),helpers$1=require("./common/helpers.js"),attrs=require("./common/attrs.js"),translate=require("../../../settings/product-properties/configs/translate.js");const ProductPropertyInput=({setting:e,styles:r,builderProps:t,pageContext:s,attributes:a})=>{let{name:o,type:l,placeholder:u,required:m,minChar:n,maxChar:p,label:c}=e??{minChar:Number,maxChar:Number,minNumber:Number,maxNumber:Number},i="textarea"===l?"textarea":"input",d=helpers.getDynamicSourceLocales({val:u,uid:t?.uid,settingId:helpers.createSettingId({id:translate.ProductProperties?.placeholder?.id}),pageContext:s??{}}),g=`${d}${u&&m&&!c?" *":""}`,y=system.createClass({...classes.getClasses(r),...core.composeClasses("gp-shadow-none group-data-[invalid=true]:gp-border-[#F44336]")}),$=system.createStyle({...styles.getStyles(r)}),{elementValue:h}=helpers$1.getElementContent(e),q=system.createAttr({...attrs.getInputAttrs(a)});return core.template`
+    <${i}
+      ${{...q}}
+      type="${l}"
+      placeholder="${g}"
+      name="properties[${o}]"
       form="{{ product_form_id }}"
-      value="${S}"
-      class="${v}"
-      style="${b}"
-      ${h?`required="${h}"`:""}
-      minlength="${q}"
-      maxlength="${y}"
-    ></${x}>
-    `};
+      value="${h}"
+      class="${y}"
+      style="${$}"
+      ${m?`required="${m}"`:""}
+      minlength="${n}"
+      maxlength="${p}"
+    ></${i}>
+    `};exports.default=ProductPropertyInput;

package/dist/cjs/product/components/product-properties/property-input/common/attrs.js

@@ -1 +1 @@
-"use strict";exports.getInputAttrs=t=>({"data-id":t?.dataId??"","data-slot-type":"input"});
+"use strict";const getInputAttrs=t=>({"data-id":t?.dataId??"","data-slot-type":"input"});exports.getInputAttrs=getInputAttrs;

package/dist/cjs/product/components/product-properties/property-input/common/classes.js

@@ -1 +1 @@
-"use strict";var s=require("@gem-sdk/core");exports.getClasses=e=>{let{valueBgColor:o,valueTextColor:l,borderInput:a,valueTypography:t,valueTypo:p}=e??{},r=s.composeTypographyClassName(p,t);return{...s.composeClasses("gemx-border-focus gp-px-4 gp-py-2 gp-outline-none"),...s.composeClasses(s.getGlobalColorStateClass("text",l)),...s.composeClasses(s.getGlobalColorStateResponsiveClass("bg",o)),...s.composeClasses(r),...s.composeClasses(s.handleConvertClassColor(a))}};
+"use strict";var core=require("@gem-sdk/core");const getClasses=e=>{let{valueBgColor:s,valueTextColor:o,borderInput:r,valueTypography:l,valueTypo:a}=e??{},c=core.composeTypographyClassName(a,l);return{...core.composeClasses("gemx-border-focus gp-px-4 gp-py-2 gp-outline-none"),...core.composeClasses(core.getGlobalColorStateClass("text",o)),...core.composeClasses(core.getGlobalColorStateResponsiveClass("bg",s)),...core.composeClasses(c),...core.composeClasses(core.handleConvertClassColor(r))}};exports.getClasses=getClasses;

package/dist/cjs/product/components/product-properties/property-input/common/helpers.js

@@ -1 +1 @@
-"use strict";exports.getElementContent=e=>{let{type:t,valueHidden:n,minChar:d,maxChar:i}=e??{};return{elementType:"hidden"===t?"textarea":t,elementValue:"hidden"===t?n:void 0,minLength:["text","textarea"].includes(t)?d:void 0,maxLength:["text","textarea"].includes(t)?i:void 0}};
+"use strict";const getElementContent=e=>{let{type:t,valueHidden:n,minChar:d,maxChar:i}=e??{};return{elementType:"hidden"===t?"textarea":t,elementValue:"hidden"===t?n:void 0,minLength:["text","textarea"].includes(t)?d:void 0,maxLength:["text","textarea"].includes(t)?i:void 0}};exports.getElementContent=getElementContent;

package/dist/cjs/product/components/product-properties/property-input/common/styles.js

@@ -1 +1 @@
-"use strict";var e=require("@gem-sdk/core");exports.getStyles=o=>{let{valueBgColor:t,valueTextColor:r,valueTypo:l,valueTypography:s,fullWidth:a,width:c,height:d,borderInput:S,borderRadius:g,hasShadowInput:n,shadowInput:y}=o??{},h=e.composeTypographyStyle(l,s),i=e.makeStyleResponsive("w",e.makeWidth(c,a)),p=d?e.makeStyleResponsive("h",d):{},u=e.getGlobalColorStateResponsiveStyle("bg",t);u["--focus-bg"]||(u["--focus-bg"]=u["--bg"]);let b=e.getGlobalColorStateStyle("c",r);return b["--focus-c"]||(b["--focus-c"]=b["--c"]),{...i,...e.handleConvertBorderStyle(S),...e.handleConvertBorderWidth(S),...e.handleConvertBorderColor(S),...u,...b,...p,...e.composeRadius(g),...e.getStyleShadowState(y,"box-shadow",n),...h}};
+"use strict";var core=require("@gem-sdk/core");const getStyles=e=>{let{valueBgColor:o,valueTextColor:t,valueTypo:r,valueTypography:c,fullWidth:l,width:s,height:a,borderInput:S,borderRadius:d,hasShadowInput:g,shadowInput:y}=e??{},n=core.composeTypographyStyle(r,c),h=core.makeStyleResponsive("w",core.makeWidth(s,l)),i=a?core.makeStyleResponsive("h",a):{},p=core.getGlobalColorStateResponsiveStyle("bg",o);p["--focus-bg"]||(p["--focus-bg"]=p["--bg"]);let u=core.getGlobalColorStateStyle("c",t);return u["--focus-c"]||(u["--focus-c"]=u["--c"]),{...h,...core.handleConvertBorderStyle(S),...core.handleConvertBorderWidth(S),...core.handleConvertBorderColor(S),...p,...u,...i,...core.composeRadius(d),...core.getStyleShadowState(y,"box-shadow",g),...n}};exports.getStyles=getStyles;

package/dist/cjs/product/components/product-properties/property-select/ProductPropertySelect.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("@gem-sdk/core"),t=require("@gem-sdk/system"),r=require("./common/classes.js"),l=require("./common/styles.js");exports.default=({setting:c,styles:a})=>{let i=s.useUniqProductID(),{name:o,handleChangeOption:u,childItem:n}=c??{},m=t.createClass({...r.getSelectClasses(a)}),y=t.createStyle({...l.getSelectStyles(a)}),d=t.createStyle({...l.getOptionStyles(a)});return e.jsx("select",{name:o,id:`${i}-${o}`,className:m,style:y,onChange:u,children:n?.map((s,t)=>e.jsx("option",{value:s,style:d,children:s},t))})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),system=require("@gem-sdk/system"),classes=require("./common/classes.js"),styles=require("./common/styles.js");const ProductPropertySelect=({setting:e,styles:s})=>{let t=core.useUniqProductID(),{name:r,handleChangeOption:l,childItem:c}=e??{},o=system.createClass({...classes.getSelectClasses(s)}),u=system.createStyle({...styles.getSelectStyles(s)}),y=system.createStyle({...styles.getOptionStyles(s)});return jsxRuntime.jsx("select",{name:r,id:`${t}-${r}`,className:o,style:u,onChange:l,children:c?.map((e,s)=>jsxRuntime.jsx("option",{value:e,style:y,children:e},s))})};exports.default=ProductPropertySelect;

package/dist/cjs/product/components/product-properties/property-select/ProductPropertySelect.liquid.js

@@ -1,17 +1,17 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../../../helpers.js"),s=require("@gem-sdk/system"),r=require("./common/attrs.js"),o=require("./common/styles.js"),l=require("./common/classes.js"),i=require("../../../settings/product-properties/configs/translate.js");exports.default=({setting:c,styles:a,builderProps:n,pageContext:p,attributes:u})=>{let d=n?.uid,{name:m,childItem:g}=c??{},y=s.createAttr({...r.getSelectAttrs(c,u)}),$=s.createClass({...l.getSelectClasses(a),...e.composeClasses("gp-shadow-none")}),S=s.createStyle({...o.getSelectStyles(a)}),j=s.createStyle({...o.getOptionStyles(a)});return e.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),helpers=require("../../../../helpers.js"),system=require("@gem-sdk/system"),attrs=require("./common/attrs.js"),styles=require("./common/styles.js"),classes=require("./common/classes.js"),translate=require("../../../settings/product-properties/configs/translate.js");const ProductPropertySelect=({setting:e,styles:t,builderProps:s,pageContext:r,attributes:l})=>{let o=s?.uid,{name:c,childItem:a}=e??{},i=system.createAttr({...attrs.getSelectAttrs(e,l)}),p=system.createClass({...classes.getSelectClasses(t),...core.composeClasses("gp-shadow-none")}),m=system.createStyle({...styles.getSelectStyles(t)}),n=system.createStyle({...styles.getOptionStyles(t)});return core.template`
     <select
-      ${{...y}}
-      name="properties[${m}]"
-      id="${d}-${m}"
-      class="${$}"
+      ${{...i}}
+      name="properties[${c}]"
+      id="${o}-${c}"
+      class="${p}"
       form="{{ product_form_id }}"
-      style="${S}"
+      style="${m}"
     >
-      ${g?.map((s,r)=>{let o=t.getDynamicSourceLocales({val:s,uid:d,settingId:t.createSettingId({id:i.ProductProperties?.childItem?.id,index:r}),pageContext:p??{}});return e.template`
+      ${a?.map((e,t)=>{let s=helpers.getDynamicSourceLocales({val:e,uid:o,settingId:helpers.createSettingId({id:translate.ProductProperties?.childItem?.id,index:t}),pageContext:r??{}});return core.template`
             <option
-              value="${o}"
-              style="${j}"
+              value="${s}"
+              style="${n}"
             >
-              ${o}
+              ${s}
             </option>`}).join("")}
-    </select>`};
+    </select>`};exports.default=ProductPropertySelect;

package/dist/cjs/product/components/product-properties/property-select/common/attrs.js

@@ -1 +1 @@
-"use strict";exports.getSelectAttrs=(t,a)=>{let{name:e}=t??{};return{"aria-label":e??"","data-id":a?.dataId??"","data-slot-type":"input"}};
+"use strict";const getSelectAttrs=(t,e)=>{let{name:a}=t??{};return{"aria-label":a??"","data-id":e?.dataId??"","data-slot-type":"input"}};exports.getSelectAttrs=getSelectAttrs;

package/dist/cjs/product/components/product-properties/property-select/common/classes.js

@@ -1 +1 @@
-"use strict";var e=require("@gem-sdk/core");exports.getSelectClasses=s=>{let{valueBgColor:o,valueTextColor:t,valueTypography:l,valueTypo:a}=s??{},p=e.composeTypographyClassName(a,l);return{...e.composeClasses("gp-truncate gp-p-2 gp-outline-none"),...e.composeClasses(e.getGlobalColorStateClass("text",t)),...e.composeClasses(e.getGlobalColorStateResponsiveClass("bg",o)),...e.composeClasses(p)}};
+"use strict";var core=require("@gem-sdk/core");const getSelectClasses=e=>{let{valueBgColor:s,valueTextColor:o,valueTypography:t,valueTypo:l}=e??{},c=core.composeTypographyClassName(l,t);return{...core.composeClasses("gp-truncate gp-p-2 gp-outline-none"),...core.composeClasses(core.getGlobalColorStateClass("text",o)),...core.composeClasses(core.getGlobalColorStateResponsiveClass("bg",s)),...core.composeClasses(c)}};exports.getSelectClasses=getSelectClasses;

package/dist/cjs/product/components/product-properties/property-select/common/styles.js

@@ -1 +1 @@
-"use strict";var e=require("@gem-sdk/core"),t=require("../../../../../helpers.js");exports.getOptionStyles=o=>{let{valueBgColor:l,valueTextColor:r}=o??{},b=e.getGlobalColorStateResponsiveStyle("bg",l),s=e.getGlobalColorStateStyle("c",r),a={"--c":s["--focus-c"]?s["--focus-c"]:s["--c"],"--bg":b["--focus-bg"]?b["--focus-bg"]:b["--bg"],"--bg-tablet":b["--focus-bg-tablet"]?b["--focus-bg-tablet"]:b["--bg-tablet"],"--bg-mobile":b["--focus-bg-mobile"]?b["--focus-bg-mobile"]:b["--bg-mobile"]};return t.filterTruthyObject(a)},exports.getSelectStyles=t=>{let{fullWidth:o,width:l,height:r,borderInput:b,borderRadius:s,hasShadowInput:a,shadowInput:g,valueBgColor:c,valueTextColor:S}=t??{},i=e.makeStyleResponsive("w",e.makeWidth(l,o)),u=r?e.makeStyleResponsive("h",r):{};return{...i,...u,...e.handleConvertBorderStyle(b),...e.handleConvertBorderWidth(b),...e.handleConvertBorderColor(b),...e.composeRadius(s),...e.getStyleShadowState(g,"box-shadow",a),...e.getGlobalColorStateResponsiveStyle("bg",c),...e.getGlobalColorStateStyle("c",S)}};
+"use strict";var core=require("@gem-sdk/core"),helpers=require("../../../../../helpers.js");const getSelectStyles=e=>{let{fullWidth:t,width:o,height:l,borderInput:r,borderRadius:c,hasShadowInput:s,shadowInput:b,valueBgColor:g,valueTextColor:a}=e??{},S=core.makeStyleResponsive("w",core.makeWidth(o,t)),i=l?core.makeStyleResponsive("h",l):{};return{...S,...i,...core.handleConvertBorderStyle(r),...core.handleConvertBorderWidth(r),...core.handleConvertBorderColor(r),...core.composeRadius(c),...core.getStyleShadowState(b,"box-shadow",s),...core.getGlobalColorStateResponsiveStyle("bg",g),...core.getGlobalColorStateStyle("c",a)}},getOptionStyles=e=>{let{valueBgColor:t,valueTextColor:o}=e??{},l=core.getGlobalColorStateResponsiveStyle("bg",t),r=core.getGlobalColorStateStyle("c",o),c={"--c":r["--focus-c"]?r["--focus-c"]:r["--c"],"--bg":l["--focus-bg"]?l["--focus-bg"]:l["--bg"],"--bg-tablet":l["--focus-bg-tablet"]?l["--focus-bg-tablet"]:l["--bg-tablet"],"--bg-mobile":l["--focus-bg-mobile"]?l["--focus-bg-mobile"]:l["--bg-mobile"]};return helpers.filterTruthyObject(c)};exports.getOptionStyles=getOptionStyles,exports.getSelectStyles=getSelectStyles;

package/dist/cjs/product/components/product-quantity/ProductQuantity.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@gem-sdk/core"),s=require("@gem-sdk/system"),r=require("./hooks/useProductQuantity.js"),a=require("./common/attrs.js"),l=require("./common/classes.js"),n=require("./common/styles.js"),u=require("./common/helpers.js");exports.default=o=>{let{setting:c={},styles:i={},builderProps:y,advanced:d}=o,g=t.useCurrentVariant(),{quantity:m}=t.useQuantity(),{isInStock:C,ref:S,onClickIncrement:p,onClickDecrement:b,onChangeInput:h,onFocusInput:j}=r.useProductQuantity(o),{plusIcon:B,minusIcon:I}=c,x=c.defaultQtyValue||1,{inputHeight:f,buttonBackgroundColor:q,backgroundColor:v,iconColor:A,inputBackgroundColor:N,textColor:H,align:_,borderBtn:k,buttonWidth:D,iconSizeCustom:M,corner:P}=i,Q=c?.hasButton,W=s.createAttr({...a.getContainerAttrs({isDisabled:!C,uid:y?.uid||""})}),L=s.createClass({...l.getContainerClasses(d?.cssClass)}),T=s.createStyle({...n.getContainerStyles({align:_,inputHeight:f})}),V=s.createClass({...l.getWrapperClasses()}),F=s.createStyle({...n.getWrapperStyles({backgroundColor:v,styles:i})}),O=s.createAttr({...a.getInputAttr({hasButton:Q,quantity:m,currentVariant:g,defaultQty:x})}),w=s.createClass({...l.getInputClasses({styles:i,borderBtn:k,inputBackgroundColor:N,textColor:H,isDisabled:!C})}),z=s.createStyle({...n.getInputStyle(o)}),E=s.createClass({...l.getButtonClass({borderBtn:k,buttonBackgroundColor:q,iconColor:A,buttonSide:"left",isDisabled:!C})}),G=s.createStyle({...n.getButtonStyle({borderBtn:k,buttonWidth:D,buttonBackgroundColor:q,iconColor:A,corner:P,enableHoverButton:c?.enableHoverButton})}),J=s.createAttr({...a.getButtonAttrs({buttonSide:"left"})}),K=s.createClass({...l.getButtonClass({borderBtn:k,buttonBackgroundColor:q,iconColor:A,buttonSide:"right",isDisabled:!C})}),R=s.createStyle({...n.getButtonStyle({borderBtn:k,buttonWidth:D,buttonBackgroundColor:q,iconColor:A,corner:P,flipStyle:!0,enableHoverButton:c?.enableHoverButton})}),U=s.createAttr({...a.getButtonAttrs({buttonSide:"right"})}),X=s.createClass({...l.getIconWrapperClasses()}),Y=s.createStyle({...u.getIconWidth(M)});return e.jsx("div",{ref:S,...W,className:L,style:T,children:e.jsxs("div",{className:V,style:F,children:[s.If(Q,e.jsx("button",{...J,onClick:b,className:E,style:G,children:e.jsx("span",{className:X,style:Y,dangerouslySetInnerHTML:{__html:u.getMinusIcon(I)}})})),e.jsx("input",{...O,className:w,style:z,onChange:e=>h(e),onFocus:e=>j(e)}),s.If(Q,e.jsx("button",{...U,onClick:p,className:K,style:R,children:e.jsx("span",{className:X,style:Y,dangerouslySetInnerHTML:{__html:u.getPlusIcon(B)}})}))]})})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),system=require("@gem-sdk/system"),useProductQuantity=require("./hooks/useProductQuantity.js"),attrs=require("./common/attrs.js"),classes=require("./common/classes.js"),styles=require("./common/styles.js"),helpers=require("./common/helpers.js");const ProductQuantity=e=>{let{setting:s={},styles:t={},builderProps:r,advanced:a}=e,l=core.useCurrentVariant(),{quantity:n}=core.useQuantity(),{isInStock:u,ref:c,onClickIncrement:o,onClickDecrement:y,onChangeInput:i,onFocusInput:m}=useProductQuantity.useProductQuantity(e),{plusIcon:d,minusIcon:g}=s,j=s.defaultQtyValue||1,{inputHeight:p,buttonBackgroundColor:C,backgroundColor:h,iconColor:x,inputBackgroundColor:S,textColor:b,align:B,borderBtn:I,buttonWidth:f,iconSizeCustom:q,corner:v}=t,A=s?.hasButton,P=system.createAttr({...attrs.getContainerAttrs({isDisabled:!u,uid:r?.uid||""})}),Q=system.createClass({...classes.getContainerClasses(a?.cssClass)}),R=system.createStyle({...styles.getContainerStyles({align:B,inputHeight:p})}),N=system.createClass({...classes.getWrapperClasses()}),H=system.createStyle({...styles.getWrapperStyles({backgroundColor:h,styles:t})}),_=system.createAttr({...attrs.getInputAttr({hasButton:A,quantity:n,currentVariant:l,defaultQty:j})}),k=system.createClass({...classes.getInputClasses({styles:t,borderBtn:I,inputBackgroundColor:S,textColor:b,isDisabled:!u})}),D=system.createStyle({...styles.getInputStyle(e)}),M=system.createClass({...classes.getButtonClass({borderBtn:I,buttonBackgroundColor:C,iconColor:x,buttonSide:"left",isDisabled:!u})}),W=system.createStyle({...styles.getButtonStyle({borderBtn:I,buttonWidth:f,buttonBackgroundColor:C,iconColor:x,corner:v,enableHoverButton:s?.enableHoverButton})}),L=system.createAttr({...attrs.getButtonAttrs({buttonSide:"left"})}),T=system.createClass({...classes.getButtonClass({borderBtn:I,buttonBackgroundColor:C,iconColor:x,buttonSide:"right",isDisabled:!u})}),V=system.createStyle({...styles.getButtonStyle({borderBtn:I,buttonWidth:f,buttonBackgroundColor:C,iconColor:x,corner:v,flipStyle:!0,enableHoverButton:s?.enableHoverButton})}),F=system.createAttr({...attrs.getButtonAttrs({buttonSide:"right"})}),O=system.createClass({...classes.getIconWrapperClasses()}),w=system.createStyle({...helpers.getIconWidth(q)});return jsxRuntime.jsx("div",{ref:c,...P,className:Q,style:R,children:jsxRuntime.jsxs("div",{className:N,style:H,children:[system.If(A,jsxRuntime.jsx("button",{...L,onClick:y,className:M,style:W,children:jsxRuntime.jsx("span",{className:O,style:w,dangerouslySetInnerHTML:{__html:helpers.getMinusIcon(g)}})})),jsxRuntime.jsx("input",{..._,className:k,style:D,onChange:e=>i(e),onFocus:e=>m(e)}),system.If(A,jsxRuntime.jsx("button",{...F,onClick:o,className:T,style:V,children:jsxRuntime.jsx("span",{className:O,style:w,dangerouslySetInnerHTML:{__html:helpers.getPlusIcon(d)}})}))]})})};exports.default=ProductQuantity;

package/dist/cjs/product/components/product-quantity/ProductQuantity.liquid.js

@@ -1,48 +1,48 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../../helpers.js"),s=require("@gem-sdk/system"),a=require("./common/attrs.js"),l=require("./common/classes.js"),r=require("./common/styles.js"),i=require("./common/helpers.js");exports.default=({setting:n={},styles:u={},advanced:o,builderProps:c})=>{let{plusIcon:d,minusIcon:p,updatePrice:g}=n,y=n.defaultQtyValue??1,{inputHeight:$,buttonBackgroundColor:f,iconColor:b,inputBackgroundColor:v,textColor:S,align:m,borderBtn:C,buttonWidth:q,iconSizeCustom:B,corner:A,backgroundColor:I,dividerColor:_,dividerStroke:h}=u,j=n?.hasButton,E=s.createAttr({...a.getContainerAttrs({uid:c?.uid||"",isDisableByLiquid:!0})}),P=s.createClass({...l.getContainerClasses(o?.cssClass)}),R=s.createStyle({...r.getContainerStyles({align:m,inputHeight:$})}),k=s.createClass({...l.getWrapperClasses()}),H=s.createStyle({...r.getWrapperStyles({backgroundColor:I,styles:u})}),L=s.createAttr({...a.getInputAttr({isLiquid:!0,hasButton:j,defaultQty:y})}),M=s.createClass({...l.getInputClasses({styles:u,borderBtn:C,inputBackgroundColor:v,textColor:S})}),W=s.createStyle({...r.getInputStyle({setting:n,styles:{...u,borderBtn:C,inputBackgroundColor:v,textColor:S,dividerColor:_,dividerStroke:h}})}),D=s.createClass({...l.getButtonClass({borderBtn:C,buttonBackgroundColor:f,iconColor:b,buttonSide:"left"})}),x=s.createStyle({...r.getButtonStyle({borderBtn:C,buttonWidth:q,buttonBackgroundColor:f,iconColor:b,corner:A,enableHoverButton:n?.enableHoverButton})}),G=s.createAttr({...a.getButtonAttrs({buttonSide:"left"})}),O=s.createClass({...l.getButtonClass({borderBtn:C,buttonBackgroundColor:f,iconColor:b,buttonSide:"right"})}),V=s.createStyle({...r.getButtonStyle({borderBtn:C,buttonWidth:q,buttonBackgroundColor:f,iconColor:b,corner:A,flipStyle:!0,enableHoverButton:n?.enableHoverButton})}),N=s.createAttr({...a.getButtonAttrs({buttonSide:"right"})}),Q=s.createClass({...l.getIconWrapperClasses()}),T=i.getIconWidth(B);return e.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),helpers$1=require("../../../helpers.js"),system=require("@gem-sdk/system"),attrs=require("./common/attrs.js"),classes=require("./common/classes.js"),styles=require("./common/styles.js"),helpers=require("./common/helpers.js");const ProductQuantity=({setting:e={},styles:t={},advanced:s,builderProps:a})=>{let{plusIcon:r,minusIcon:l,updatePrice:n}=e,i=e.defaultQtyValue??1,{inputHeight:c,buttonBackgroundColor:o,iconColor:u,inputBackgroundColor:y,textColor:d,align:p,borderBtn:g,buttonWidth:m,iconSizeCustom:$,corner:f,backgroundColor:b,dividerColor:v,dividerStroke:S}=t,C=e?.hasButton,h=system.createAttr({...attrs.getContainerAttrs({uid:a?.uid||"",isDisableByLiquid:!0})}),q=system.createClass({...classes.getContainerClasses(s?.cssClass)}),B=system.createStyle({...styles.getContainerStyles({align:p,inputHeight:c})}),A=system.createClass({...classes.getWrapperClasses()}),I=system.createStyle({...styles.getWrapperStyles({backgroundColor:b,styles:t})}),_=system.createAttr({...attrs.getInputAttr({isLiquid:!0,hasButton:C,defaultQty:i})}),j=system.createClass({...classes.getInputClasses({styles:t,borderBtn:g,inputBackgroundColor:y,textColor:d})}),P=system.createStyle({...styles.getInputStyle({setting:e,styles:{...t,borderBtn:g,inputBackgroundColor:y,textColor:d,dividerColor:v,dividerStroke:S}})}),E=system.createClass({...classes.getButtonClass({borderBtn:g,buttonBackgroundColor:o,iconColor:u,buttonSide:"left"})}),R=system.createStyle({...styles.getButtonStyle({borderBtn:g,buttonWidth:m,buttonBackgroundColor:o,iconColor:u,corner:f,enableHoverButton:e?.enableHoverButton})}),k=system.createAttr({...attrs.getButtonAttrs({buttonSide:"left"})}),H=system.createClass({...classes.getButtonClass({borderBtn:g,buttonBackgroundColor:o,iconColor:u,buttonSide:"right"})}),L=system.createStyle({...styles.getButtonStyle({borderBtn:g,buttonWidth:m,buttonBackgroundColor:o,iconColor:u,corner:f,flipStyle:!0,enableHoverButton:e?.enableHoverButton})}),M=system.createAttr({...attrs.getButtonAttrs({buttonSide:"right"})}),W=system.createClass({...classes.getIconWrapperClasses()}),D=helpers.getIconWidth($);return core.template`
     {%- liquid
       assign current_variant = product.selected_or_first_available_variant
       assign available = current_variant.available | default: false
     -%}
       <gp-product-quantity
-        ${{...E}}
-        data-price="${g}"
-        class="${P}"
-        style="${R}"
+        ${{...h}}
+        data-price="${n}"
+        class="${q}"
+        style="${B}"
       >
-        <div class="${k}" style="${H}">
-          ${e.RenderIf(j,e.template`
+        <div class="${A}" style="${I}">
+          ${core.RenderIf(C,core.template`
               <button
               {% if available == false %} disabled {% endif %}
-               ${{...G}}
-                class="${D}"
-                style="${x}"
+               ${{...k}}
+                class="${E}"
+                style="${R}"
               >
-                <span class="${Q}" style="${T}"
+                <span class="${W}" style="${D}"
                 >
-                  ${i.getMinusIcon(p)}
+                  ${helpers.getMinusIcon(l)}
                 </span>
               </button>
             `)}
           <input
             {% if available == false %} disabled {% endif %}
-            ${{...L}}
-            class="${M}"
-            style="${W}"
+            ${{..._}}
+            class="${j}"
+            style="${P}"
             inputMode="numeric"
           />
 
-          ${e.RenderIf(j,e.template`
+          ${core.RenderIf(C,core.template`
             <button
               {% if available == false %} disabled {% endif %}
-              ${{...N}}
-              class="${O}"
-              style="${V}"
+              ${{...M}}
+              class="${H}"
+              style="${L}"
             >
-              <span class="${Q}" style="${T}">
-                ${i.getPlusIcon(d)}
+              <span class="${W}" style="${D}">
+                ${helpers.getPlusIcon(r)}
               </span>
             </button>
           `)}
           </div>
         </gp-product-quantity>
-      ${e.RenderIf(e.isLocalEnv,`<script ${t.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-product-quantity-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${t.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-product-quantity-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}`};
+      ${core.RenderIf(core.isLocalEnv,`<script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-product-quantity-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="${core.baseAssetURL}/assets-v2/gp-product-quantity-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}`};exports.default=ProductQuantity;

package/dist/cjs/product/components/product-quantity/common/attrs.js

@@ -1 +1 @@
-"use strict";exports.getButtonAttrs=({buttonSide:t})=>({title:"left"===t?"Decrement":"Increment","aria-label":"left"===t?"decrement":"increment",type:"button"}),exports.getContainerAttrs=({uid:t,isDisabled:e=!0,isDisableByLiquid:a})=>({"data-id":t,"data-disabled":a?"{%- if available -%} false {%- else -%} true {%- endif -%}":e}),exports.getInputAttr=({isLiquid:t,hasButton:e,quantity:a,currentVariant:n,defaultQty:r})=>{let i={};return n?.manageInventory&&(i.max=t?"{{ current_variant.quantity_rule.max }}":n?.inventoryQuantity??1),{type:e?"text":"number",name:"quantity",step:1,min:1,"aria-label":"quantity",inputMode:"numeric",quantity:t?"current_variant.quantity":a??0,autocomplete:"off",value:a??r??1,...i}};
+"use strict";const getContainerAttrs=({uid:t,isDisabled:e=!0,isDisableByLiquid:n})=>({"data-id":t,"data-disabled":n?"{%- if available -%} false {%- else -%} true {%- endif -%}":e}),getButtonAttrs=({buttonSide:t})=>({title:"left"===t?"Decrement":"Increment","aria-label":"left"===t?"decrement":"increment",type:"button"}),getInputAttr=({isLiquid:t,hasButton:e,quantity:n,currentVariant:r,defaultQty:a})=>{let i={};return r?.manageInventory&&(i.max=t?"{{ current_variant.quantity_rule.max }}":r?.inventoryQuantity??1),{type:e?"text":"number",name:"quantity",step:1,min:1,"aria-label":"quantity",inputMode:"numeric",quantity:t?"current_variant.quantity":n??0,autocomplete:"off",value:n??a??1,...i}};exports.getButtonAttrs=getButtonAttrs,exports.getContainerAttrs=getContainerAttrs,exports.getInputAttr=getInputAttr;

package/dist/cjs/product/components/product-quantity/common/classes.js

@@ -1 +1 @@
-"use strict";var e=require("@gem-sdk/core");exports.getButtonClass=({borderBtn:s,buttonBackgroundColor:l,iconColor:t,buttonSide:o,isDisabled:p})=>{let a=`gp-flex gp-aspect-square gp-h-full disabled:gp-cursor-not-allowed ${p?"gp-cursor-not-allowed":"gp-cursor-pointer"} gp-items-center gp-justify-center gp-outline-none ${"left"===o?"gp-minus":"gp-plus"} `,r=e.handleConvertClassColor(s),g=e.getGlobalColorStateClass("bg",l),n=e.getGlobalColorStateClass("text",t);return r&&(a+=` ${r} `),g&&(a+=` ${g} `),n&&(a+=` ${n} `),{...e.composeClasses(a)}},exports.getContainerClasses=s=>({...e.composeClasses(`quantityClass gp-relative gp-inline-flex gp-h-12 gp-w-full gp-bg-transparent gp-transition-all gp-duration-150 data-[disabled=true]:gp-opacity-60 ${s??""}`)}),exports.getIconWrapperClasses=()=>({...e.composeClasses("gp-inline-flex gp-items-center gp-justify-center [&>*]:gp-h-full [&>*]:gp-w-full")}),exports.getInputClasses=({styles:s,borderBtn:l,inputBackgroundColor:t,textColor:o,isDisabled:p})=>{let a="gp-flex gp-w-full gp-shrink-[99999] gp-appearance-none gp-items-center gp-text-center gp-outline-none focus-visible:gp-shadow-none focus-visible:gp-outline-none gp-transition-all gp-duration-150 hover:gp-text-black disabled:gp-cursor-not-allowed",r=e.composeTypographyClassName(s?.typo,s?.typography),g=e.handleConvertClassColor(l),n=e.getGlobalColorStateClass("bg",t),i=e.getGlobalColorStateClass("text",o);return g&&(a+=` ${g} `),r&&(a+=` ${r} `),n&&(a+=` ${n} `),i&&(a+=` ${i} `),p&&(a+="gp-cursor-not-allowed"),{...e.composeClasses(a)}},exports.getWrapperClasses=()=>({...e.composeClasses("gp-inline-flex gp-w-full gp-overflow-hidden")});
+"use strict";var core=require("@gem-sdk/core");const getInputClasses=({styles:e,borderBtn:s,inputBackgroundColor:t,textColor:o,isDisabled:l})=>{let r="gp-flex gp-w-full gp-shrink-[99999] gp-appearance-none gp-items-center gp-text-center gp-outline-none focus-visible:gp-shadow-none focus-visible:gp-outline-none gp-transition-all gp-duration-150 hover:gp-text-black disabled:gp-cursor-not-allowed",p=core.composeTypographyClassName(e?.typo,e?.typography),a=core.handleConvertClassColor(s),g=core.getGlobalColorStateClass("bg",t),n=core.getGlobalColorStateClass("text",o);return a&&(r+=` ${a} `),p&&(r+=` ${p} `),g&&(r+=` ${g} `),n&&(r+=` ${n} `),l&&(r+="gp-cursor-not-allowed"),{...core.composeClasses(r)}},getButtonClass=({borderBtn:e,buttonBackgroundColor:s,iconColor:t,buttonSide:o,isDisabled:l})=>{let r=`gp-flex gp-aspect-square gp-h-full disabled:gp-cursor-not-allowed ${l?"gp-cursor-not-allowed":"gp-cursor-pointer"} gp-items-center gp-justify-center gp-outline-none ${"left"===o?"gp-minus":"gp-plus"} `,p=core.handleConvertClassColor(e),a=core.getGlobalColorStateClass("bg",s),g=core.getGlobalColorStateClass("text",t);return p&&(r+=` ${p} `),a&&(r+=` ${a} `),g&&(r+=` ${g} `),{...core.composeClasses(r)}},getContainerClasses=e=>({...core.composeClasses(`quantityClass gp-relative gp-inline-flex gp-h-12 gp-w-full gp-bg-transparent gp-transition-all gp-duration-150 data-[disabled=true]:gp-opacity-60 ${e??""}`)}),getWrapperClasses=()=>({...core.composeClasses("gp-inline-flex gp-w-full gp-overflow-hidden")}),getIconWrapperClasses=()=>({...core.composeClasses("gp-inline-flex gp-items-center gp-justify-center [&>*]:gp-h-full [&>*]:gp-w-full")});exports.getButtonClass=getButtonClass,exports.getContainerClasses=getContainerClasses,exports.getIconWrapperClasses=getIconWrapperClasses,exports.getInputClasses=getInputClasses,exports.getWrapperClasses=getWrapperClasses;