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

package/dist/cjs/product/components/product-variants/ProductVariants.liquid.js

@@ -1,10 +1,43 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),Text_liquid=require("../../../text/components/Text.liquid.js"),index_liquid=require("./components/variants/index.liquid.js"),Dropdown_liquid=require("./components/dropdown-swatches/Dropdown.liquid.js"),DropdownGroup_liquid=require("./components/dropdown-group/DropdownGroup.liquid.js"),helpers=require("../../../helpers.js"),mappingVariantStyles=require("./utils/mappingVariantStyles.js"),system=require("@gem-sdk/system"),getAttr=require("./common/main/getAttr.js"),styles=require("./common/main/styles.js"),classes=require("./common/main/classes.js"),getData=require("./common/main/getData.js"),classes$1=require("./common/variants/classes.js"),_function=require("../../helpers/function.js"),styles$1=require("./common/variants/styles.js"),OptionVariantsNewFormat_liquid=require("./OptionVariantsNewFormat.liquid.js"),OptionVariantsOldFormat_liquid=require("./OptionVariantsOldFormat.liquid.js");const DEFAULT_ADVANCED_DISPLAY_SETTING={desktop:!0,tablet:!0,mobile:!0},ProductVariants=e=>{let{builderProps:t,styles:s,setting:i,advanced:a}=e,{align:o,swatchItemWidth:n,dropdownItemWidth:r,swatchSpacing:l,optionTypo:p,marginBottom:d}=s??{},{label:u,optionType:m,showAsSwatches:c,layout:y,hasPreSelected:v}=i??{},g=a?.d??DEFAULT_ADVANCED_DISPLAY_SETTING,{uid:_}=t??{},f="groupOption"===m,q=()=>{let e={};return core.DEVICES.forEach(t=>{let s=core.getResponsiveValueByScreen(n,t);e[t]="auto"===s}),e},$=()=>{let e={};return core.DEVICES.forEach(t=>{e[t]=r?.[t]==="fill"}),e},h=i?.variantPresets?mappingVariantStyles.mappingVariantStyles(i?.variantPresets,s):[],S=h?.map(e=>({...e,presets:{[e.optionType]:e.presets[e.optionType]}})),j={...i,variantPresets:S},w=e=>{let t={"'":"'",'"':"""},s=e;for(let i in t)e.indexOf(i)>=0&&(s=s.replaceAll(i,t[i]));return s},L=()=>i?.variantPresets?.map(e=>`${w(e.optionName)}($2)${e.optionType}`).join("($1)"),O=()=>i?.variantPresets?.filter(e=>!!e?.hide)?.map(e=>e.optionName).join(","),V=({showDropdown:e,isRenderDefault:t,typeOfOption:i})=>core.template`
-    ${system.LiquidFor("value in values",index_liquid.default({id:"{{option.name | escape | handleize}}-{{value | escape | handleize}}",variantKey:"{{option.name | escape}}-{{option.position}}-{{ forloop.index }}",showAsSwatches:c,uid:_,name:"{{option.name | escape}}",value:{label:"{{value | escape}}"},checked:v?"{%- if option.selected_value == value -%}true{% else %}false{%- endif -%}":"false",optionPosition:"rootForloop",typeOfOption:i,activeClass:v?"{%- if option.selected_value == value -%}option-item-active{%- endif -%}":"",...s,...j,swatchAutoWidth:q(),optionTypo:p,isRenderDefault:t}))}
-      ${system.LiquidIf(e?'type == "dropdown"':"false",Dropdown_liquid.default({...s,...j,swatchAutoWidth:$(),optionTypo:p}))}`,D=i?.variantPresets?.map(e=>({name:w(e.optionName),type:e.optionType})).map(e=>`${e.name}($1)${e.type}`).join("($2)").toString(),A={renderVariantItem:V,variantPresetsLiquid:D??""},b=system.createClass(classes.getVariantOptionGroupClass(o)),P=system.createStyle(styles.getVariantOptionGroupStyle(l,l)),E=getData.getTextVariantTitleData(e,"Liquid"),x=system.createClass(classes$1.getWrapVariantOptionClass(y,o)),N=()=>core.template`
-      ${system.Liquid(`{%- assign presets = "${L()}" | split: '($1)' -%}`)}
-      ${system.Liquid(`{% assign hiddenPresetOptions = "${O()}" | split: ',' %}`)}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../../text/components/Text.liquid.js"),i=require("./components/variants/index.liquid.js"),s=require("./components/dropdown-swatches/Dropdown.liquid.js"),a=require("./components/dropdown-group/DropdownGroup.liquid.js"),o=require("../../../helpers.js"),n=require("./utils/mappingVariantStyles.js"),r=require("@gem-sdk/system"),l=require("./common/main/getAttr.js"),p=require("./common/main/styles.js"),d=require("./common/main/classes.js"),u=require("./common/main/getData.js"),c=require("./common/variants/classes.js"),m=require("../../helpers/function.js"),v=require("./common/variants/styles.js"),f=require("./OptionVariantsNewFormat.liquid.js"),g=require("./OptionVariantsOldFormat.liquid.js");const $={desktop:!0,tablet:!0,mobile:!0};exports.default=_=>{let{builderProps:q,styles:y,setting:h,advanced:j}=_,{align:S,swatchItemWidth:L,dropdownItemWidth:w,swatchSpacing:O,optionTypo:b,marginBottom:V}=y??{},{label:P,optionType:D,showAsSwatches:x,layout:C,hasPreSelected:E}=h??{},I=j?.d??$,{uid:A}=q??{},N=()=>{let t={};return e.DEVICES.forEach(i=>{let s=e.getResponsiveValueByScreen(L,i);t[i]="auto"===s}),t},F=()=>{let t={};return e.DEVICES.forEach(e=>{t[e]=w?.[e]==="fill"}),t},T=h?.variantPresets?n.mappingVariantStyles(h?.variantPresets,y):[],G=T?.map(e=>({...e,presets:{[e.optionType]:e.presets[e.optionType]}})),k={...h,variantPresets:G},z=e=>{let t={"'":"'",'"':"""},i=e;for(let s in t)e.indexOf(s)>=0&&(i=i.replaceAll(s,t[s]));return i},W=({showDropdown:t,isRenderDefault:a,typeOfOption:o})=>e.template`
+    ${r.LiquidFor("value in values",i.default({id:"{{option.name | escape | handleize}}-{{value | escape | handleize}}",variantKey:"{{option.name | escape}}-{{option.position}}-{{ forloop.index }}",showAsSwatches:x,uid:A,name:"{{option.name | escape}}",value:{label:"{{value | escape}}"},checked:E?"{%- if option.selected_value == value -%}true{% else %}false{%- endif -%}":"false",optionPosition:"rootForloop",typeOfOption:o,activeClass:E?"{%- if option.selected_value == value -%}option-item-active{%- endif -%}":"",...y,...k,swatchAutoWidth:N(),optionTypo:b,isRenderDefault:a}))}
+      ${r.LiquidIf(t?'type == "dropdown"':"false",s.default({...y,...k,swatchAutoWidth:F(),optionTypo:b}))}`,J=h?.variantPresets?.map(e=>({name:z(e.optionName),type:e.optionType})).map(e=>`${e.name}($1)${e.type}`).join("($2)").toString(),M={renderVariantItem:W,variantPresetsLiquid:J??""},R=r.createClass(d.getVariantOptionGroupClass(S)),B=r.createStyle(p.getVariantOptionGroupStyle(O,O)),U=u.getTextVariantTitleData(_,"Liquid"),H=r.createClass(c.getWrapVariantOptionClass(C,S)),K=r.createClass(d.getWrapDropdownClass(S)),Q=u.getDropdownGroupData(_),X=r.createAttr(l.getAttrs({uid:A,hasPreSelected:E,cssClass:j?.cssClass})),Y=r.createStyle(p.getWrapperStyle(_)),Z=r.createClass({"gp-flex gp-flex-col !gp-ml-0":!0});return e.template`
+    ${r.Liquid("{%- assign total_combinations = 1 -%}")}
+    ${r.LiquidFor("option in product.options_with_values","{%- assign total_combinations = total_combinations | times: option.values.size -%}")}
+    <gp-product-variants ${X}>
+      <script gp-data type="application/json">
+        {
+          "setting":${JSON.stringify(k)?.replaceAll("'","&#039;")},
+          "styles":${JSON.stringify(y)},
+          "variants":{{product.variants | json}},
+          "optionsWithValues": {{product.options_with_values | json}},
+          "variantSelected": {{ variant | json }},
+          "variantInventoryQuantity": {{product.variants | map: 'inventory_quantity' | json }},
+          "variantInventoryPolicy": {{product.variants | map: 'inventory_policy' | json }},
+          "moneyFormat": {{shop.money_format | json }},
+          "productId": {{product.id | json }},
+          "productUrl": {{product.url | json }},
+          "productHandle": {{product.handle | json }},
+          "displayState": ${JSON.stringify(I)},
+          "totalVariantCombinations": {{total_combinations}},
+          "firstAvailableVariant": {{product.selected_or_first_available_variant | json }}
+        }
+      </script>
+      <div class="gp-hidden" style="--hvr-shadow: none; --hvr-shadow-tablet: none; --hvr-shadow-mobile: none"></div>
+      ${r.Liquid("{%- assign options = product.options_with_values -%}")}
+      ${r.Liquid("{%- assign variants = product.variants -%}")}
+      ${r.LiquidIf("options.size == 0 or options.size == 1 and variants.size == 1 and variants[0].title == 'Default Title' and variants[0].option1 == 'Default Title'","<div></div>",e.template`<div
+            class="${Z}"
+            style="${Y}"
+          >
+          ${r.If("groupOption"===D,`
+      <div className="${K}">
+        ${a.default(Q)}
+      </div>
+    `,e.template`
+      ${r.Liquid(`{%- assign presets = "${h?.variantPresets?.map(e=>`${z(e.optionName)}($2)${e.optionType}`).join("($1)")}" | split: '($1)' -%}`)}
+      ${r.Liquid(`{% assign hiddenPresetOptions = "${h?.variantPresets?.filter(e=>!!e?.hide)?.map(e=>e.optionName).join(",")}" | split: ',' %}`)}
 
-      ${system.Liquid(`{% assign all_option_names = options | map: 'name' %}
+      ${r.Liquid(`{% assign all_option_names = options | map: 'name' %}
       {% assign filtered_options_string = '' %}
       {% assign delimiter = '||' %}
 
@@ -27,29 +60,29 @@
 
       {% assign filtered_options_array = filtered_options_string | split: delimiter %}`)}
 
-      ${system.Liquid("{% assign last_option_name = filtered_options_array | last %}")}
+      ${r.Liquid("{% assign last_option_name = filtered_options_array | last %}")}
 
-      ${system.LiquidFor("option in options",`
+      ${r.LiquidFor("option in options",`
         <div
         option-name="{{option.name | escape}}"
-        class="${x} ${system.LiquidIf("hiddenPresetOptions contains option.name","gp-hidden")}"
-        style="${_function.getStyleOfObject(styles$1.getMarginBottomStyle(d))}${system.Liquid("{% if forloop.last or option.name == last_option_name %}--mb:0;--mb-mobile:0;--mb-tablet:0;{% endif %}")}"
+        class="${H} ${r.LiquidIf("hiddenPresetOptions contains option.name","gp-hidden")}"
+        style="${m.getStyleOfObject(v.getMarginBottomStyle(V))}${r.Liquid("{% if forloop.last or option.name == last_option_name %}--mb:0;--mb-mobile:0;--mb-tablet:0;{% endif %}")}"
         >
-          ${system.Liquid("{%- assign showVariantClass = 'variant-display' -%}")}
-          ${system.Liquid("{%- assign optionName = option.name  -%}")}
-          ${system.LiquidFor("preset in presets",`
-            ${system.Liquid("{%- assign presetDetail = preset | split: '($2)' -%}")}
-            ${system.LiquidIf("presetDetail[1] == 'dropdown' and presetDetail[0] == optionName",`${system.Liquid("{%- assign showVariantClass = '' -%}")} ${system.Liquid("{%- break -%}")}`)}
+          ${r.Liquid("{%- assign showVariantClass = 'variant-display' -%}")}
+          ${r.Liquid("{%- assign optionName = option.name  -%}")}
+          ${r.LiquidFor("preset in presets",`
+            ${r.Liquid("{%- assign presetDetail = preset | split: '($2)' -%}")}
+            ${r.LiquidIf("presetDetail[1] == 'dropdown' and presetDetail[0] == optionName",`${r.Liquid("{%- assign showVariantClass = '' -%}")} ${r.Liquid("{%- break -%}")}`)}
           `)}
-          ${system.If(u,Text_liquid.default(E)," ")}
+          ${r.If(P,t.default(U)," ")}
           <div
               variant-option-name="{{option.name | escape}}"
-              class="${b}"
-              style="${_function.getStyleOfObject(P)}"
+              class="${R}"
+              style="${m.getStyleOfObject(B)}"
             >
-              ${system.Liquid("{%- assign values = option.values -%}")}
-              ${system.Liquid("{%- assign rootForloop = forloop.index0 -%}")}
-              ${system.Liquid(`
+              ${r.Liquid("{%- assign values = option.values -%}")}
+              ${r.Liquid("{%- assign rootForloop = forloop.index0 -%}")}
+              ${r.Liquid(`
                 {%- if option.position == 1 -%}
                   {%- assign selectedValue = variant.option1 -%}
                 {%- elsif option.position == 2 -%}
@@ -58,48 +91,15 @@
                   {%- assign selectedValue = variant.option3 -%}
                 {%- endif -%}
               `)}
-              ${system.If(!v,system.Liquid("{%- assign selectedValue = null -%}"),"")}
-              ${system.If(c,T(),V({showDropdown:!1,isRenderDefault:!0,typeOfOption:"optionType"}))}
+              ${r.If(!E,r.Liquid("{%- assign selectedValue = null -%}"),"")}
+              ${r.If(x,e.template`
+      ${r.LiquidIf("shop.metafields.GEMPAGES.swatchesJSONFormat and shop.metafields.GEMPAGES.swatchesJSONFormat != blank",f.renderOptionValuesNewFormatSwatches(M),g.renderOptionValuesOld(M))}
+      `,W({showDropdown:!1,isRenderDefault:!0,typeOfOption:"optionType"}))}
           </div>
       </div>`)}
-    `,T=()=>core.template`
-      ${system.LiquidIf("shop.metafields.GEMPAGES.swatchesJSONFormat and shop.metafields.GEMPAGES.swatchesJSONFormat != blank",OptionVariantsNewFormat_liquid.renderOptionValuesNewFormatSwatches(A),OptionVariantsOldFormat_liquid.renderOptionValuesOld(A))}
-      `,I=system.createClass(classes.getWrapDropdownClass(o)),F=getData.getDropdownGroupData(e),C=()=>`
-      <div className="${I}">
-        ${DropdownGroup_liquid.default(F)}
-      </div>
-    `,G=system.createAttr(getAttr.getAttrs({uid:_,hasPreSelected:v,cssClass:a?.cssClass})),k=system.createStyle(styles.getWrapperStyle(e)),z=system.createClass({"gp-flex gp-flex-col !gp-ml-0":!0}),W=()=>{let e=core.isLocalEnv?"{{ 'gp-product-variant-v7-5.js' | asset_url }}":`${core.baseAssetURL}/assets-v2/gp-product-variant-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}`;return`<script ${helpers.getSettingPreloadData('class="gps-link" delay',"src")}="${e}" defer="defer"></script>`};return core.template`
-    ${system.Liquid("{%- assign total_combinations = 1 -%}")}
-    ${system.LiquidFor("option in product.options_with_values","{%- assign total_combinations = total_combinations | times: option.values.size -%}")}
-    <gp-product-variants ${G}>
-      <script gp-data type="application/json">
-        {
-          "setting":${JSON.stringify(j)?.replaceAll("'","&#039;")},
-          "styles":${JSON.stringify(s)},
-          "variants":{{product.variants | json}},
-          "optionsWithValues": {{product.options_with_values | json}},
-          "variantSelected": {{ variant | json }},
-          "variantInventoryQuantity": {{product.variants | map: 'inventory_quantity' | json }},
-          "variantInventoryPolicy": {{product.variants | map: 'inventory_policy' | json }},
-          "moneyFormat": {{shop.money_format | json }},
-          "productId": {{product.id | json }},
-          "productUrl": {{product.url | json }},
-          "productHandle": {{product.handle | json }},
-          "displayState": ${JSON.stringify(g)},
-          "totalVariantCombinations": {{total_combinations}},
-          "firstAvailableVariant": {{product.selected_or_first_available_variant | json }}
-        }
-      </script>
-      <div class="gp-hidden" style="--hvr-shadow: none; --hvr-shadow-tablet: none; --hvr-shadow-mobile: none"></div>
-      ${system.Liquid("{%- assign options = product.options_with_values -%}")}
-      ${system.Liquid("{%- assign variants = product.variants -%}")}
-      ${system.LiquidIf("options.size == 0 or options.size == 1 and variants.size == 1 and variants[0].title == 'Default Title' and variants[0].option1 == 'Default Title'","<div></div>",core.template`<div
-            class="${z}"
-            style="${k}"
-          >
-          ${system.If(f,C(),N())}
+    `)}
         </div>`)}
     </gp-product-variants>
 
-    ${W()}
-  `};exports.default=ProductVariants;
+    ${(()=>{let t=e.isLocalEnv?"{{ 'gp-product-variant-v7-5.js' | asset_url }}":`${e.baseAssetURL}/assets-v2/gp-product-variant-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}`;return`<script ${o.getSettingPreloadData('class="gps-link" delay',"src")}="${t}" defer="defer"></script>`})()}
+  `};

package/dist/cjs/product/components/product-variants/common/base/attrs.js

@@ -1 +1 @@
-"use strict";const getWrapperAttr=(e,a)=>{let{typeOfOption:t,available:i,optionName:p,optionNameValue:o,isVariantOutStock:n}=e;return"Liquid"===a?{id:"value-wrapper-{{option.name | escape | strip | handleize}}-{{value | escape | strip | handleize}}","option-data":"{{option.name | escape}}","option-value":"{{value | escape}}","option-position":"{{option.position}}","data-gp-option-available":"{{value.available}}","option-type":`${t||"rectangle_list"}`,"data-disabled":"{%- if option_disabled == true -%} disabled  {%- endif -%}","data-hidden":"true"}:{id:`value-wrapper-${p}-${o}`,"option-data":p||"","option-value":o||"","option-position":1,"data-gp-option-available":!!i,"option-type":`${t||"rectangle_list"}`,"data-disabled":!!n,"data-hidden":"true"}};exports.getWrapperAttr=getWrapperAttr;
+"use strict";exports.getWrapperAttr=(a,e)=>{let{typeOfOption:t,available:i,optionName:o,optionNameValue:p,isVariantOutStock:n}=a;return"Liquid"===e?{id:"value-wrapper-{{option.name | escape | strip | handleize}}-{{value | escape | strip | handleize}}","option-data":"{{option.name | escape}}","option-value":"{{value | escape}}","option-position":"{{option.position}}","data-gp-option-available":"{{value.available}}","option-type":`${t||"rectangle_list"}`,"data-disabled":"{%- if option_disabled == true -%} disabled  {%- endif -%}","data-hidden":"true"}:{id:`value-wrapper-${o}-${p}`,"option-data":o||"","option-value":p||"","option-position":1,"data-gp-option-available":!!i,"option-type":`${t||"rectangle_list"}`,"data-disabled":!!n,"data-hidden":"true"}};

package/dist/cjs/product/components/product-variants/common/base/classes.js

@@ -1,2 +1,2 @@
-"use strict";var core=require("@gem-sdk/core");const getWrapperClass=e=>{let{typeOfOption:r,optionTypo:p,optionTypography:o,variantKey:l,soldOutMarkLine:t,available:s}=e,g="color"===r,a=`${core.composeTypographyClassName(p,o)}`,c=core.cls({...l&&{[l]:!0},[a]:!0,"gp-p-[4px]":g,"before:gp-absolute before:gp-top-[50%] before:gp-z-1 before:gp-block before:gp-w-full before:-gp-rotate-45 before:gp-border-t before:gp-border-[#A1A1A1] before:gp-bg-[#333]":t&&!s&&!g}),f=`gp-relative gp-flex gp-cursor-pointer gp-items-center gp-justify-center gp-text-center option-value-wrapper gp-overflow-hidden gp-w-full gp-h-full data-[disabled='disabled']:gp-pointer-events-none data-[disabled='disabled']:!gp-cursor-not-allowed
-         data-[hidden='false']:gp-flex`,i=`${f} ${c}`.trim();return core.composeClasses(i)},getWrapperTextClass=(e,r)=>{let p=core.cls({"color gp-line-clamp-2 gp-flex gp-h-full gp-w-full gp-items-center gp-justify-center":r,"gp-flex gp-flex-col gp-justify-center gp-items-center gp-gap-[6px":e}),o=`option-value gp-overflow-hidden gp-relative ${p}`.trim();return core.composeClasses(o)},getTextClass=({optionTypo:e,optionTypography:r,isColorType:p,isUploadImageType:o})=>{let l=`${core.composeTypographyClassName(e,r)}`,t=core.cls({"gp-text-center":!0,[l]:!0,"gp-overflow-hidden gp-text-ellipsis gp-px-1":p||o}),s=`${t}`.trim();return core.composeClasses(s)},getColorClass=({soldOutMarkLine:e,available:r})=>{let p=core.cls({"before:gp-absolute before:gp-top-[50%] before:gp-block before:gp-w-full before:gp--rotate-45 before:gp-border":e&&!r}),o=`color gp-relative gp-h-full gp-w-full gp-overflow-hidden gp-min-w-fit gp-flex gp-color-circle ${p}`.trim();return core.composeClasses(o)};exports.getColorClass=getColorClass,exports.getTextClass=getTextClass,exports.getWrapperClass=getWrapperClass,exports.getWrapperTextClass=getWrapperTextClass;
+"use strict";var e=require("@gem-sdk/core");exports.getColorClass=({soldOutMarkLine:p,available:r})=>{let o=e.cls({"before:gp-absolute before:gp-top-[50%] before:gp-block before:gp-w-full before:gp--rotate-45 before:gp-border":p&&!r}),l=`color gp-relative gp-h-full gp-w-full gp-overflow-hidden gp-min-w-fit gp-flex gp-color-circle ${o}`.trim();return e.composeClasses(l)},exports.getTextClass=({optionTypo:p,optionTypography:r,isColorType:o,isUploadImageType:l})=>{let t=`${e.composeTypographyClassName(p,r)}`,g=e.cls({"gp-text-center":!0,[t]:!0,"gp-overflow-hidden gp-text-ellipsis gp-px-1":o||l}),s=`${g}`.trim();return e.composeClasses(s)},exports.getWrapperClass=p=>{let{typeOfOption:r,optionTypo:o,optionTypography:l,variantKey:t,soldOutMarkLine:g,available:s}=p,a="color"===r,f=`${e.composeTypographyClassName(o,l)}`,i=e.cls({...t&&{[t]:!0},[f]:!0,"gp-p-[4px]":a,"before:gp-absolute before:gp-top-[50%] before:gp-z-1 before:gp-block before:gp-w-full before:-gp-rotate-45 before:gp-border-t before:gp-border-[#A1A1A1] before:gp-bg-[#333]":g&&!s&&!a}),c=`gp-relative gp-flex gp-cursor-pointer gp-items-center gp-justify-center gp-text-center option-value-wrapper gp-overflow-hidden gp-w-full gp-h-full data-[disabled='disabled']:gp-pointer-events-none data-[disabled='disabled']:!gp-cursor-not-allowed
+         data-[hidden='false']:gp-flex`,b=`${c} ${i}`.trim();return e.composeClasses(b)},exports.getWrapperTextClass=(p,r)=>{let o=e.cls({"color gp-line-clamp-2 gp-flex gp-h-full gp-w-full gp-items-center gp-justify-center":r,"gp-flex gp-flex-col gp-justify-center gp-items-center gp-gap-[6px":p}),l=`option-value gp-overflow-hidden gp-relative ${o}`.trim();return e.composeClasses(l)};

package/dist/cjs/product/components/product-variants/common/base/styles.js

@@ -1 +1 @@
-"use strict";var core=require("@gem-sdk/core"),helpers=require("../../../../../helpers.js");const getColorStyleWidth=e=>{let t=e?.height||"32px",o=e?.width||{desktop:t},r=Object.fromEntries(Object.entries(o).map(([e,o])=>{let r=o&&"undefined"!==o&&"auto"!==o&&"Auto"!==o?o:t;return[e,r]}));return core.makeStyleResponsive("minw",r)},getWrapperStyleActive=e=>{let{preset:t,optionTypography:o,optionTypo:r,typeOfOption:l}=e,a=t?.optionBgColor,p=t?.optionTextColor,i=t?.optionBorder,n=t?.optionHasShadow,c=t?.optionShadow,d=t?.optionRounded,h="color"===l,s="image"===l||"image_shopify"===l,y=core.composeTypographyStyle(r,o),S=e=>{let t=a?.active??a?.normal,o=i?.active??i?.normal;return core.makeStyle({bg:e&&core.getSingleColorVariable(t),bs:o?.border,bw:o?.width,bc:core.getSingleColorVariable(o?.color)})},g=c?.active??c?.normal,u=n?.active??n?.normal,b=p?.active??p?.normal;return helpers.filterTruthyObject({...S(!h),...core.getRadiusStyleActiveState(d),...core.getStyleShadow({value:g,state:"active",styleAppliedFor:"box-shadow",isEnableShadow:u},!0),...y,...!h&&!s&&core.makeStyle({c:core.getSingleColorVariable(b)}),...h&&getColorStyleWidth(t),...core.makeStyle({h:t?.height})})},getWrapperStyleNormalAndHover=e=>{let{preset:t,optionTransform:o,optionTypography:r,optionTypo:l,typeOfOption:a}=e,p=t?.optionBgColor,i=t?.optionTextColor,n=t?.optionBorder,c=t?.optionHasShadow,d=t?.optionShadow,h=t?.optionRounded,s="color"===a,y="image"===a||"image_shopify"===a,S=["normal","hover"].reduce((e,t)=>({...e,...core.getStyleShadow({value:d?.[t],state:t,styleAppliedFor:"box-shadow",isEnableShadow:c?.[t]})}),{});return helpers.filterTruthyObject({...core.composeRadius(h),...S,...!s&&core.getGlobalColorStateStyle("bg",p),...!s&&core.handleConvertBorderStyle(n),...!s&&core.handleConvertBorderWidth(n),...!s&&core.handleConvertBorderColor(n),...!s&&!y&&core.makeStyle({c:o}),...!s&&!y&&core.getGlobalColorStateStyle("c",i),...typoStyleNotIn(l,r,["--c"]),...s&&getColorStyleWidth(t),...core.makeStyle({h:t?.height})})};function typoStyleNotIn(e,t,o){let r=core.composeTypographyStyle(e,t);return o&&0!==o.length?Object.fromEntries(Object.entries(r).filter(([e])=>!o.includes(e))):r}const getWrapperTextStyle=e=>{let{preset:t,typeOfOption:o,checked:r}=e,l=t?.optionBorder,a=t?.optionRounded,p="color"===o,i=()=>{let e="16px",o={"--pl":"0px","--pr":"0px","--pl-tablet":"0px","--pr-tablet":"0px","--pl-mobile":"0px","--pr-mobile":"0px","--pt":"0px","--pb":"0px"};return t?.width?.desktop?.toLowerCase()!=="auto"&&t?.width?.desktop||(o["--pl"]=e,o["--pr"]=e),t?.width?.tablet?.toLowerCase()!=="auto"&&t?.width?.tablet||(o["--pl-tablet"]=e,o["--pr-tablet"]=e),t?.width?.mobile?.toLowerCase()!=="auto"&&t?.width?.mobile||(o["--pl-mobile"]=e,o["--pr-mobile"]=e),(t?.height?.toLowerCase()==="auto"||t?.height)&&(o["--pt"]="8px",o["--pb"]="8px"),o},n={...a,active:{...a?.active||{},radiusType:"custom"}},c=r?core.getRadiusStyleActiveState(n):core.composeRadius(a),d=!r&&p?{...core.handleConvertBorderStyle(l),...core.handleConvertBorderWidth(l),...core.handleConvertBorderColor(l)}:{};return helpers.filterTruthyObject({...!p&&i(),...p&&c,...d})},getColorStyle=({optionBorder:e,optionRounded:t,isActive:o,color:r})=>{let l=()=>r?r?.startsWith("linear-gradient")?{backgroundImage:r}:{backgroundColor:r}:{},a=t=>t?{"--bs":"none"}:core.handleConvertBorderStyle(e),p=o=>({"--d":"flex","--jc":"center","	--ai":"center","--w":"100%","--h":"100%","--of":"hidden","--hvr-c":"unset",...a(o),...core.handleConvertBorderWidth(e),...core.handleConvertBorderColor(e),...core.composeRadius(t),...l()});return p(!!o)},getTextStyle=({optionTypo:e,optionTypography:t})=>{let o=core.composeTypographyStyle(e,t);return delete o["--c"],helpers.filterTruthyObject({...o})};exports.getColorStyle=getColorStyle,exports.getTextStyle=getTextStyle,exports.getWrapperStyleActive=getWrapperStyleActive,exports.getWrapperStyleNormalAndHover=getWrapperStyleNormalAndHover,exports.getWrapperTextStyle=getWrapperTextStyle;
+"use strict";var e=require("@gem-sdk/core"),t=require("../../../../../helpers.js");const o=t=>{let o=t?.height||"32px",r=t?.width||{desktop:o},l=Object.fromEntries(Object.entries(r).map(([e,t])=>{let r=t&&"undefined"!==t&&"auto"!==t&&"Auto"!==t?t:o;return[e,r]}));return e.makeStyleResponsive("minw",l)};exports.getColorStyle=({optionBorder:t,optionRounded:o,isActive:r,color:l})=>({"--d":"flex","--jc":"center","	--ai":"center","--w":"100%","--h":"100%","--of":"hidden","--hvr-c":"unset",...r?{"--bs":"none"}:e.handleConvertBorderStyle(t),...e.handleConvertBorderWidth(t),...e.handleConvertBorderColor(t),...e.composeRadius(o),...l?l?.startsWith("linear-gradient")?{backgroundImage:l}:{backgroundColor:l}:{}}),exports.getTextStyle=({optionTypo:o,optionTypography:r})=>{let l=e.composeTypographyStyle(o,r);return delete l["--c"],t.filterTruthyObject({...l})},exports.getWrapperStyleActive=r=>{let{preset:l,optionTypography:a,optionTypo:i,typeOfOption:n}=r,p=l?.optionBgColor,d=l?.optionTextColor,h=l?.optionBorder,s=l?.optionHasShadow,c=l?.optionShadow,u=l?.optionRounded,b="color"===n,g=e.composeTypographyStyle(i,a),y=c?.active??c?.normal,S=s?.active??s?.normal,m=d?.active??d?.normal;return t.filterTruthyObject({...(t=>{let o=p?.active??p?.normal,r=h?.active??h?.normal;return e.makeStyle({bg:t&&e.getSingleColorVariable(o),bs:r?.border,bw:r?.width,bc:e.getSingleColorVariable(r?.color)})})(!b),...e.getRadiusStyleActiveState(u),...e.getStyleShadow({value:y,state:"active",styleAppliedFor:"box-shadow",isEnableShadow:S},!0),...g,...!b&&!("image"===n||"image_shopify"===n)&&e.makeStyle({c:e.getSingleColorVariable(m)}),...b&&o(l),...e.makeStyle({h:l?.height})})},exports.getWrapperStyleNormalAndHover=r=>{let{preset:l,optionTransform:a,optionTypography:i,optionTypo:n,typeOfOption:p}=r,d=l?.optionBgColor,h=l?.optionTextColor,s=l?.optionBorder,c=l?.optionHasShadow,u=l?.optionShadow,b=l?.optionRounded,g="color"===p,y="image"===p||"image_shopify"===p,S=["normal","hover"].reduce((t,o)=>({...t,...e.getStyleShadow({value:u?.[o],state:o,styleAppliedFor:"box-shadow",isEnableShadow:c?.[o]})}),{});return t.filterTruthyObject({...e.composeRadius(b),...S,...!g&&e.getGlobalColorStateStyle("bg",d),...!g&&e.handleConvertBorderStyle(s),...!g&&e.handleConvertBorderWidth(s),...!g&&e.handleConvertBorderColor(s),...!g&&!y&&e.makeStyle({c:a}),...!g&&!y&&e.getGlobalColorStateStyle("c",h),...function(t,o,r){let l=e.composeTypographyStyle(t,o);return r&&0!==r.length?Object.fromEntries(Object.entries(l).filter(([e])=>!r.includes(e))):l}(n,i,["--c"]),...g&&o(l),...e.makeStyle({h:l?.height})})},exports.getWrapperTextStyle=o=>{let{preset:r,typeOfOption:l,checked:a}=o,i=r?.optionBorder,n=r?.optionRounded,p="color"===l,d={...n,active:{...n?.active||{},radiusType:"custom"}},h=a?e.getRadiusStyleActiveState(d):e.composeRadius(n),s=!a&&p?{...e.handleConvertBorderStyle(i),...e.handleConvertBorderWidth(i),...e.handleConvertBorderColor(i)}:{};return t.filterTruthyObject({...!p&&(()=>{let e="16px",t={"--pl":"0px","--pr":"0px","--pl-tablet":"0px","--pr-tablet":"0px","--pl-mobile":"0px","--pr-mobile":"0px","--pt":"0px","--pb":"0px"};return r?.width?.desktop?.toLowerCase()!=="auto"&&r?.width?.desktop||(t["--pl"]=e,t["--pr"]=e),r?.width?.tablet?.toLowerCase()!=="auto"&&r?.width?.tablet||(t["--pl-tablet"]=e,t["--pr-tablet"]=e),r?.width?.mobile?.toLowerCase()!=="auto"&&r?.width?.mobile||(t["--pl-mobile"]=e,t["--pr-mobile"]=e),(r?.height?.toLowerCase()==="auto"||r?.height)&&(t["--pt"]="8px",t["--pb"]="8px"),t})(),...p&&h,...s})};

package/dist/cjs/product/components/product-variants/common/common.js

@@ -1 +1 @@
-"use strict";var core=require("@gem-sdk/core"),React=require("react");const getDeviceProperty=(e,r)=>`--${e}${"desktop"===r?"":`-${r}`}`,makeStyleGapForLabel=(e,r)=>{let t={};return core.DEVICES.forEach(c=>{let o=getDeviceProperty("mr",c),s=getDeviceProperty("mb",c),a=core.getResponsiveValueByScreen(e,c);t="vertical"===a?{...t,[s]:r,[o]:"0px"}:{...t,[o]:r,[s]:"0px"}}),t};function isColorDark(e){if(!e)return;e=e.replace(/^#/,"");let r=parseInt(e.slice(0,2),16),t=parseInt(e.slice(2,4),16),c=parseInt(e.slice(4,6),16);return .2126*r+.7152*t+.0722*c<128}const useTransition=(e,r)=>{let t=React.useRef(null),c=React.useRef([]);React.useEffect(()=>{t.current=e},[e]),React.useEffect(()=>{null!==c.current&&t.current&&"function"==typeof t.current&&t.current(...c.current),c.current=r},r)};exports.isColorDark=isColorDark,exports.makeStyleGapForLabel=makeStyleGapForLabel,exports.useTransition=useTransition;
+"use strict";var e=require("@gem-sdk/core"),r=require("react");const t=(e,r)=>`--${e}${"desktop"===r?"":`-${r}`}`;exports.isColorDark=function(e){if(!e)return;e=e.replace(/^#/,"");let r=parseInt(e.slice(0,2),16),t=parseInt(e.slice(2,4),16),n=parseInt(e.slice(4,6),16);return .2126*r+.7152*t+.0722*n<128},exports.makeStyleGapForLabel=(r,n)=>{let s={};return e.DEVICES.forEach(u=>{let c=t("mr",u),l=t("mb",u),o=e.getResponsiveValueByScreen(r,u);s="vertical"===o?{...s,[l]:n,[c]:"0px"}:{...s,[c]:n,[l]:"0px"}}),s},exports.useTransition=(e,t)=>{let n=r.useRef(null),s=r.useRef([]);r.useEffect(()=>{n.current=e},[e]),r.useEffect(()=>{null!==s.current&&n.current&&"function"==typeof n.current&&n.current(...s.current),s.current=t},t)};

package/dist/cjs/product/components/product-variants/common/const.js

@@ -1 +1 @@
-"use strict";const OPTION_VALUES_DELIMITER="|||";exports.OPTION_VALUES_DELIMITER="|||";
+"use strict";exports.OPTION_VALUES_DELIMITER="|||";

package/dist/cjs/product/components/product-variants/common/dropdown/attrs.js

@@ -1 +1 @@
-"use strict";const getSelectAttr=({variantGroup:e,optionName:t,value:o,type:n})=>"Liquid"===n?{"aria-label":"{{option.name | escape}}",autocomplete:"off",id:`${e?"p-variant-group-dropdown":"p-variant-dropdown-{{option.position}}"}`,name:"{%- if option -%}{{option.name | escape}}{% else %}Select Option{%- endif -%}","option-data":"{{option.name}}","option-type":"{{optionType}}","option-renderer":"{{optionRendered}}"}:{autoComplete:"off",name:t||"Select Option",value:o};exports.getSelectAttr=getSelectAttr;
+"use strict";exports.getSelectAttr=({variantGroup:o,optionName:e,value:t,type:n})=>"Liquid"===n?{"aria-label":"{{option.name | escape}}",autocomplete:"off",id:`${o?"p-variant-group-dropdown":"p-variant-dropdown-{{option.position}}"}`,name:"{%- if option -%}{{option.name | escape}}{% else %}Select Option{%- endif -%}","option-data":"{{option.name}}","option-type":"{{optionType}}","option-renderer":"{{optionRendered}}"}:{autoComplete:"off",name:e||"Select Option",value:t};

package/dist/cjs/product/components/product-variants/common/dropdown/classes.js

@@ -1 +1 @@
-"use strict";var core=require("@gem-sdk/core");const getSelectClass=({optionTypo:e,optionTypography:o,optionBgColor:t,optionTextColor:s,optionBorder:l})=>{let r=core.composeTypographyClassName(e,o),a=core.handleConvertClassColor(l),c=core.getGlobalColorStateClass("text",s),g=core.getGlobalColorStateClass("bg",t),p=core.cls({...r&&{[r]:!0},...a&&{[a]:!0},...c&&{[c]:!0},...g&&{[g]:!0}}),n=`dropdown-option-item gp-truncate gp-bg-auto gp-pl-4 gp-pr-6 gp-outline-none gp-outline-none gp-shadow-none ${p}`.trim();return core.composeClasses(n)};exports.getSelectClass=getSelectClass;
+"use strict";var e=require("@gem-sdk/core");exports.getSelectClass=({optionTypo:o,optionTypography:t,optionBgColor:s,optionTextColor:l,optionBorder:a})=>{let r=e.composeTypographyClassName(o,t),p=e.handleConvertClassColor(a),g=e.getGlobalColorStateClass("text",l),n=e.getGlobalColorStateClass("bg",s),C=e.cls({...r&&{[r]:!0},...p&&{[p]:!0},...g&&{[g]:!0},...n&&{[n]:!0}}),c=`dropdown-option-item gp-truncate gp-bg-auto gp-pl-4 gp-pr-6 gp-outline-none gp-outline-none gp-shadow-none ${C}`.trim();return e.composeClasses(c)};

package/dist/cjs/product/components/product-variants/common/dropdown/styles.js

@@ -1 +1 @@
-"use strict";var core=require("@gem-sdk/core"),helpers=require("../../../../../helpers.js");const getSelectStyle=({width:e,height:o,optionTypo:t,optionTypography:r,optionBgColor:a,optionTextColor:l,optionRounded:c,optionHasShadow:s,optionShadow:i,optionBorder:d,optionTransform:S,isCombine:h,textAlign:n})=>{let p=core.composeTypographyStyle(t,r),y=n?core.makeStyleResponsive("ta",n):{},g=core.makeStyle({bg:core.getSingleColorVariable(a?.active),bs:d?.active?.border,bw:d?.active?.width,bc:d?.active?.color}),b=[h?"active":"normal","hover"].reduce((e,o)=>({...e,...core.getStyleShadow({value:i?.[o],state:o,styleAppliedFor:"box-shadow",isEnableShadow:s?.[o]})}),{});return helpers.filterTruthyObject({...core.makeStyleResponsive("w",core.makeWidth(e)),...core.makeStyle({h:o}),...b,...g,...core.makeStyle({tt:S}),...p,...core.getGlobalColorStateStyle("c",l),...core.getGlobalColorStateStyle("bg",a),...core.handleConvertBorderStyle(d),...core.handleConvertBorderWidth(d),...core.handleConvertBorderColor(d),...core.composeRadius(c),...core.getStyleShadow({value:t?.custom?.textShadow,styleAppliedFor:"text-shadow",isEnableShadow:t?.custom?.hasShadowText}),...y,appearance:"none","background-image":"url(https://cdn.shopify.com/s/files/1/1827/4239/t/1/assets/ico-select.svg?v=155563818344741998551488860031)","background-repeat":"no-repeat","background-position":"right 16px center"})};exports.getSelectStyle=getSelectStyle;
+"use strict";var e=require("@gem-sdk/core"),t=require("../../../../../helpers.js");exports.getSelectStyle=({width:o,height:a,optionTypo:r,optionTypography:l,optionBgColor:s,optionTextColor:i,optionRounded:d,optionHasShadow:c,optionShadow:h,optionBorder:n,optionTransform:S,isCombine:p,textAlign:y})=>{let g=e.composeTypographyStyle(r,l),b=y?e.makeStyleResponsive("ta",y):{},v=e.makeStyle({bg:e.getSingleColorVariable(s?.active),bs:n?.active?.border,bw:n?.active?.width,bc:n?.active?.color}),u=[p?"active":"normal","hover"].reduce((t,o)=>({...t,...e.getStyleShadow({value:h?.[o],state:o,styleAppliedFor:"box-shadow",isEnableShadow:c?.[o]})}),{});return t.filterTruthyObject({...e.makeStyleResponsive("w",e.makeWidth(o)),...e.makeStyle({h:a}),...u,...v,...e.makeStyle({tt:S}),...g,...e.getGlobalColorStateStyle("c",i),...e.getGlobalColorStateStyle("bg",s),...e.handleConvertBorderStyle(n),...e.handleConvertBorderWidth(n),...e.handleConvertBorderColor(n),...e.composeRadius(d),...e.getStyleShadow({value:r?.custom?.textShadow,styleAppliedFor:"text-shadow",isEnableShadow:r?.custom?.hasShadowText}),...b,appearance:"none","background-image":"url(https://cdn.shopify.com/s/files/1/1827/4239/t/1/assets/ico-select.svg?v=155563818344741998551488860031)","background-repeat":"no-repeat","background-position":"right 16px center"})};

package/dist/cjs/product/components/product-variants/common/main/classes.js

@@ -1 +1 @@
-"use strict";var core=require("@gem-sdk/core"),_function=require("../../../../helpers/function.js");const getWrapDropdownClass=e=>{let t={desktop:"horizontal",mobile:"horizontal",tablet:"horizontal"},r=_function.getAlignClasses(t,e);return{"gp-flex":!0,...r}},getVariantOptionGroupClass=e=>{let t=core.getAlignmentClasses(e);return{"variant-option-group gp-flex gp-w-full gp-flex-wrap gp-items-center ":!0,...t}};exports.getVariantOptionGroupClass=getVariantOptionGroupClass,exports.getWrapDropdownClass=getWrapDropdownClass;
+"use strict";var e=require("@gem-sdk/core"),t=require("../../../../helpers/function.js");exports.getVariantOptionGroupClass=t=>{let r=e.getAlignmentClasses(t);return{"variant-option-group gp-flex gp-w-full gp-flex-wrap gp-items-center ":!0,...r}},exports.getWrapDropdownClass=e=>{let r=t.getAlignClasses({desktop:"horizontal",mobile:"horizontal",tablet:"horizontal"},e);return{"gp-flex":!0,...r}};

package/dist/cjs/product/components/product-variants/common/main/const.js

@@ -1 +1 @@
-"use strict";const VAR_WIDTH_BY_DEVICE={desktop:"--w",tablet:"--w-tablet",mobile:"--w-mobile"},HORIZONTAL_WIDTH="120px",DEFAULT_WIDTH_LABEL="fit-content";exports.DEFAULT_WIDTH_LABEL="fit-content",exports.HORIZONTAL_WIDTH="120px",exports.VAR_WIDTH_BY_DEVICE=VAR_WIDTH_BY_DEVICE;
+"use strict";exports.DEFAULT_WIDTH_LABEL="fit-content",exports.HORIZONTAL_WIDTH="120px",exports.VAR_WIDTH_BY_DEVICE={desktop:"--w",tablet:"--w-tablet",mobile:"--w-mobile"};

package/dist/cjs/product/components/product-variants/common/main/getAttr.js

@@ -1 +1 @@
-"use strict";const getAttrs=({uid:t,hasPreSelected:s,cssClass:e})=>({"data-id":t||"","has-pre-selected":s?"true":"false",class:e||""});exports.getAttrs=getAttrs;
+"use strict";exports.getAttrs=({uid:e,hasPreSelected:s,cssClass:t})=>({"data-id":e||"","has-pre-selected":s?"true":"false",class:t||""});

package/dist/cjs/product/components/product-variants/common/main/getData.js

@@ -1 +1 @@
-"use strict";var core=require("@gem-sdk/core"),mappingVariantStyles=require("../../utils/mappingVariantStyles.js"),common=require("../common.js"),_const=require("./const.js");const getDropdownGroupData=e=>{let{styles:t,setting:a}=e,{dropdownItemWidth:r}=t??{},o=mappingVariantStyles.mappingVariantStyles(a?.variantPresets,t),n={...a,variantPresets:o},s=()=>{let e={};return core.DEVICES.forEach(t=>{e[t]=r?.[t]==="fill"}),e};return{...t,...n,swatchAutoWidth:s()}},getTextVariantTitleData=(e,t,a)=>{let{styles:r,setting:o}=e,{layout:n}=o??{},{labelGap:s}=r??{},{optionName:i,hasPreSelected:l,isChangeVariant:p,selectedOptions:c,styleOptionSelected:m}=a??{},g=core.composeTypographyClassName(r?.labelTypo,r?.labelTypography),u=e=>{let t=Object.fromEntries(core.DEVICES.map(t=>[_const.VAR_WIDTH_BY_DEVICE[t],"horizontal"===core.getResponsiveValueByScreen(e,t)?_const.HORIZONTAL_WIDTH:_const.DEFAULT_WIDTH_LABEL]));return t},D=()=>"Liquid"===t?"{{option.name}}":`${i}${(!1!=l||p)&&"dropdown"!==m?`: ${c?.[i]}`:""}`;return{className:core.cls(g,"Liquid"===t?"{{showVariantClass}}":""),styles:{typo:r?.labelTypo},style:{...common.makeStyleGapForLabel(n,s)},setting:{htmlTag:"legend",text:D(),tagWidth:u(n),excludeFlex:!0}}};exports.getDropdownGroupData=getDropdownGroupData,exports.getTextVariantTitleData=getTextVariantTitleData;
+"use strict";var e=require("@gem-sdk/core"),t=require("../../utils/mappingVariantStyles.js"),a=require("../common.js"),r=require("./const.js");exports.getDropdownGroupData=a=>{let{styles:r,setting:s}=a,{dropdownItemWidth:l}=r??{},o=t.mappingVariantStyles(s?.variantPresets,r),i={...s,variantPresets:o};return{...r,...i,swatchAutoWidth:(()=>{let t={};return e.DEVICES.forEach(e=>{t[e]=l?.[e]==="fill"}),t})()}},exports.getTextVariantTitleData=(t,s,l)=>{let{styles:o,setting:i}=t,{layout:n}=i??{},{labelGap:p}=o??{},{optionName:u,hasPreSelected:m,isChangeVariant:y,selectedOptions:c,styleOptionSelected:g}=l??{},T=e.composeTypographyClassName(o?.labelTypo,o?.labelTypography);return{className:e.cls(T,"Liquid"===s?"{{showVariantClass}}":""),styles:{typo:o?.labelTypo},style:{...a.makeStyleGapForLabel(n,p)},setting:{htmlTag:"legend",text:"Liquid"===s?"{{option.name}}":`${u}${(!1!=m||y)&&"dropdown"!==g?`: ${c?.[u]}`:""}`,tagWidth:(t=>{let a=Object.fromEntries(e.DEVICES.map(a=>[r.VAR_WIDTH_BY_DEVICE[a],"horizontal"===e.getResponsiveValueByScreen(t,a)?r.HORIZONTAL_WIDTH:r.DEFAULT_WIDTH_LABEL]));return a})(n),excludeFlex:!0}}};

package/dist/cjs/product/components/product-variants/common/main/styles.js

@@ -1 +1 @@
-"use strict";var core=require("@gem-sdk/core"),helpers=require("../../../../../helpers.js");const getWrapperStyle=e=>{let{style:t,styles:r,setting:o}=e,{width:p,align:l}=r??{},{column:a}=o??{},i=core.makeStyleResponsive("w",core.makeWidth(p));return helpers.filterTruthyObject({...core.optionLayoutStyle(a),...core.makeStyleResponsive("ta",l),...i,...t})},getVariantOptionGroupStyle=(e,t)=>helpers.filterTruthyObject({...core.makeStyle({rg:e,cg:t})});exports.getVariantOptionGroupStyle=getVariantOptionGroupStyle,exports.getWrapperStyle=getWrapperStyle;
+"use strict";var e=require("@gem-sdk/core"),t=require("../../../../../helpers.js");exports.getVariantOptionGroupStyle=(r,i)=>t.filterTruthyObject({...e.makeStyle({rg:r,cg:i})}),exports.getWrapperStyle=r=>{let{style:i,styles:s,setting:a}=r,{width:l,align:o}=s??{},{column:p}=a??{},y=e.makeStyleResponsive("w",e.makeWidth(l));return t.filterTruthyObject({...e.optionLayoutStyle(p),...e.makeStyleResponsive("ta",o),...y,...i})};

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

@@ -1 +1 @@
-"use strict";const getVariantOptionAttr=(t,e)=>{let{optionName:a,optionValue:n}=t;return"Liquid"===e?{"option-name":"{{option.name | escape}}","option-name-value":"{{value | escape}}","data-gp-option-value-id":"{{value.id}}"}:{"option-name":a,"option-name-value":n}};exports.getVariantOptionAttr=getVariantOptionAttr;
+"use strict";exports.getVariantOptionAttr=(e,t)=>{let{optionName:a,optionValue:n}=e;return"Liquid"===t?{"option-name":"{{option.name | escape}}","option-name-value":"{{value | escape}}","data-gp-option-value-id":"{{value.id}}"}:{"option-name":a,"option-name-value":n}};

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

@@ -1 +1 @@
-"use strict";var core=require("@gem-sdk/core"),_function=require("../../../../helpers/function.js");const getVariantItemLabelClass=t=>{let{available:e}=t,p="disable"===t.soldOutStyle;return{[`option-item gp-group gp-relative !gp-block gp-child-item-${t.uid}`]:!0,"gp-pointer-events-none gp-opacity-20":p&&!e}},getTooltipClass=()=>({"gp-hidden !gp-max-w-[150px] gp-left-[50%] gp-translate-x-[-50%] gp-translate-y-0 gp-absolute gp-bottom-[calc(100%+20px)] gp-text-[12px] group-hover:gp-block gp-w-max gp-bg-[#333333] gp-text-[#F9F9F9] gp-px-[8px] gp-py-[4px] gp-rounded-[8px] gp-mb-[-10px] after:gp-content-[''] after:gp-absolute after:gp-p-[7px] after:gp-left-0 after:gp-w-full after:gp-bottom-[-10px]":!0}),getTooltipSvgClass=()=>({"gp-absolute gp-left-[50%] gp-translate-x-[-50%] gp-translate-y-0 gp-z-10 gp-bottom-[-4px]":!0}),getVariantOptionClass=()=>({"option-item-inner gp-w-auto gp-h-auto":!0}),getWrapVariantOptionClass=(t,e)=>{let p=core.getLayoutClasses(t),a=_function.getAlignClasses(t,e);return{"gp-flex variant-inside":!0,...p,...a}};exports.getTooltipClass=getTooltipClass,exports.getTooltipSvgClass=getTooltipSvgClass,exports.getVariantItemLabelClass=getVariantItemLabelClass,exports.getVariantOptionClass=getVariantOptionClass,exports.getWrapVariantOptionClass=getWrapVariantOptionClass;
+"use strict";var t=require("@gem-sdk/core"),p=require("../../../../helpers/function.js");exports.getTooltipClass=()=>({"gp-hidden !gp-max-w-[150px] gp-left-[50%] gp-translate-x-[-50%] gp-translate-y-0 gp-absolute gp-bottom-[calc(100%+20px)] gp-text-[12px] group-hover:gp-block gp-w-max gp-bg-[#333333] gp-text-[#F9F9F9] gp-px-[8px] gp-py-[4px] gp-rounded-[8px] gp-mb-[-10px] after:gp-content-[''] after:gp-absolute after:gp-p-[7px] after:gp-left-0 after:gp-w-full after:gp-bottom-[-10px]":!0}),exports.getTooltipSvgClass=()=>({"gp-absolute gp-left-[50%] gp-translate-x-[-50%] gp-translate-y-0 gp-z-10 gp-bottom-[-4px]":!0}),exports.getVariantItemLabelClass=t=>{let{available:p}=t,e="disable"===t.soldOutStyle;return{[`option-item gp-group gp-relative !gp-block gp-child-item-${t.uid}`]:!0,"gp-pointer-events-none gp-opacity-20":e&&!p}},exports.getVariantOptionClass=()=>({"option-item-inner gp-w-auto gp-h-auto":!0}),exports.getWrapVariantOptionClass=(e,g)=>{let a=t.getLayoutClasses(e),o=p.getAlignClasses(e,g);return{"gp-flex variant-inside":!0,...a,...o}};

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

@@ -1 +1 @@
-"use strict";var core=require("@gem-sdk/core"),helpers=require("../../../../../helpers.js");const getLabelVariantStyle=e=>e?helpers.filterTruthyObject(core.makeStyleResponsive("w",core.makeWidth(e))):{},getMarginBottomStyle=(e,t)=>!e||t?{}:helpers.filterTruthyObject(core.makeStyleResponsive("mb",e));exports.getLabelVariantStyle=getLabelVariantStyle,exports.getMarginBottomStyle=getMarginBottomStyle;
+"use strict";var e=require("@gem-sdk/core"),t=require("../../../../../helpers.js");exports.getLabelVariantStyle=r=>r?t.filterTruthyObject(e.makeStyleResponsive("w",e.makeWidth(r))):{},exports.getMarginBottomStyle=(r,s)=>!r||s?{}:t.filterTruthyObject(e.makeStyleResponsive("mb",r));

package/dist/cjs/product/components/product-variants/components/base/base.js

@@ -1,11 +1,11 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),React=require("react"),common=require("../../common/common.js"),system=require("@gem-sdk/system"),classes=require("../../common/base/classes.js"),attrs=require("../../common/base/attrs.js"),styles=require("../../common/base/styles.js");const BaseVariant=e=>{let{value:s,checked:t,optionTypography:r,optionTypo:a,swatchesImage:l,swatchesColor:m,preset:c,typeOfOption:i,available:o,variantKey:n,soldOutMarkLine:y}=e,x=React.useMemo(()=>"color"===i,[i]),u=c?.optionBgColor,j=c?.optionBorder,g=c?.optionRounded,p=React.useMemo(()=>"image"===i||"image_shopify"===i,[i]),d=React.useMemo(()=>t?common.isColorDark(u?.active)?"#fff":"#121212":common.isColorDark(u?.normal)?"#fff":"#121212",[u?.active,u?.normal,t]),C=e=>common.isColorDark(e)?"#fff":"#121212",f=()=>system.If(y,jsxRuntime.jsx("style",{children:`
-        .${n}:before {
-          width: ${x&&m?.length?`calc(${c?.height} - 12px) !important`:"200px !important"};
-          border-color: ${x?"#121212":d};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../../common/common.js"),s=require("@gem-sdk/system"),l=require("../../common/base/classes.js"),a=require("../../common/base/attrs.js"),o=require("../../common/base/styles.js");exports.default=c=>{let{value:i,checked:n,optionTypography:m,optionTypo:g,swatchesImage:p,swatchesColor:d,preset:C,typeOfOption:f,available:h,variantKey:x,soldOutMarkLine:u}=c,y=r.useMemo(()=>"color"===f,[f]),j=C?.optionBgColor,v=C?.optionBorder,b=C?.optionRounded,S=r.useMemo(()=>"image"===f||"image_shopify"===f,[f]),w=r.useMemo(()=>n?t.isColorDark(j?.active)?"#fff":"#121212":t.isColorDark(j?.normal)?"#fff":"#121212",[j?.active,j?.normal,n]),D=e=>t.isColorDark(e)?"#fff":"#121212",q=()=>s.If(u,e.jsx("style",{children:`
+        .${x}:before {
+          width: ${y&&d?.length?`calc(${C?.height} - 12px) !important`:"200px !important"};
+          border-color: ${y?"#121212":w};
         }
-        `})," "),h=system.createClass(classes.getColorClass({soldOutMarkLine:y,available:o})),R=()=>jsxRuntime.jsx(jsxRuntime.Fragment,{children:m?.map(e=>{let s=e,r=e.startsWith("linear-gradient");r&&(s=e.match(/#(([\da-fA-F]{2}){3,4}|([\da-fA-F]){3,4})/g)?.[0]);let a=system.createStyle(styles.getColorStyle({optionRounded:g,optionBorder:j,isActive:t,color:e}));return jsxRuntime.jsxs(React.Fragment,{children:[jsxRuntime.jsx("style",{children:`
-                .${n} .color:before {
-                  border-color: ${C(s)} !important;
+        `})," "),A=s.createClass(l.getColorClass({soldOutMarkLine:u,available:h})),W=()=>e.jsx(e.Fragment,{children:d?.map(t=>{let l=t,a=t.startsWith("linear-gradient");a&&(l=t.match(/#(([\da-fA-F]{2}){3,4}|([\da-fA-F]){3,4})/g)?.[0]);let c=s.createStyle(o.getColorStyle({optionRounded:b,optionBorder:v,isActive:n,color:t}));return e.jsxs(r.Fragment,{children:[e.jsx("style",{children:`
+                .${x} .color:before {
+                  border-color: ${D(l)} !important;
                 }
-                `}),jsxRuntime.jsx("div",{className:h,style:a},e)]},e)})}),v=system.createClass(classes.getWrapperTextClass(p,x)),b=system.createStyle(styles.getWrapperTextStyle(e)),S=system.createClass(classes.getTextClass({optionTypo:a,optionTypography:r,isColorType:x,isUploadImageType:p})),w=system.createStyle(styles.getTextStyle({optionTypo:a,optionTypography:r})),D=()=>jsxRuntime.jsx(jsxRuntime.Fragment,{children:jsxRuntime.jsxs("div",{className:v,style:b,children:[f(),system.If(p,jsxRuntime.jsxs("svg",{width:"15",height:"12",viewBox:"0 0 15 12",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[jsxRuntime.jsx("circle",{cx:"2",cy:"2",r:"2",fill:"#D6D6D6"}),jsxRuntime.jsx("path",{d:"M0.196854 10.6453L2.40968 8.05946C2.4846 7.97175 2.57719 7.9008 2.68141 7.85124C2.78562 7.80168 2.89913 7.77461 3.01452 7.77181C3.12991 7.76902 3.2446 7.79055 3.3511 7.835C3.45761 7.87945 3.55353 7.94583 3.63262 8.02981L4.66733 9.12714L8.71205 4.29464C8.79123 4.19995 8.89077 4.1243 9.00325 4.07333C9.11573 4.02236 9.23827 3.99737 9.36176 4.00022C9.48524 4.00307 9.6065 4.03369 9.71651 4.08979C9.82651 4.1459 9.92245 4.22605 9.99717 4.32429L14.8329 10.6772C14.9254 10.7989 14.982 10.9441 14.9964 11.0962C15.0107 11.2484 14.9823 11.4016 14.9144 11.5385C14.8464 11.6754 14.7415 11.7907 14.6115 11.8713C14.4815 11.952 14.3316 11.9948 14.1786 11.995L0.822048 12C0.664945 11.9999 0.511148 11.9549 0.378853 11.8703C0.246557 11.7857 0.141299 11.6649 0.0755311 11.5224C0.00976323 11.3799 -0.013762 11.2216 0.00773837 11.0661C0.0292388 10.9107 0.0948652 10.7646 0.196854 10.6453Z",fill:"#D6D6D6"})]})),jsxRuntime.jsx("span",{className:S,style:w,children:s?.label})]})}),q=()=>jsxRuntime.jsx("img",{className:"gp-h-full gp-w-full gp-object-cover",src:l,alt:""}),A=()=>{switch(i){case"color":return system.If(m&&m.length>0,R(),D());case"image":case"image_shopify":return system.If(!!l,q(),D());default:return D()}},W=system.createClass(classes.getWrapperClass(e)),N=system.createAttr(attrs.getWrapperAttr(e)),$=system.createStyle(styles.getWrapperStyleActive(e)),k=system.createStyle(styles.getWrapperStyleNormalAndHover(e)),B=t?$:k;return jsxRuntime.jsxs("div",{...N,className:W,style:B,children:[f(),A()]})};exports.default=BaseVariant;
+                `}),e.jsx("div",{className:A,style:c},t)]},t)})}),N=s.createClass(l.getWrapperTextClass(S,y)),$=s.createStyle(o.getWrapperTextStyle(c)),k=s.createClass(l.getTextClass({optionTypo:g,optionTypography:m,isColorType:y,isUploadImageType:S})),F=s.createStyle(o.getTextStyle({optionTypo:g,optionTypography:m})),L=()=>e.jsx(e.Fragment,{children:e.jsxs("div",{className:N,style:$,children:[q(),s.If(S,e.jsxs("svg",{width:"15",height:"12",viewBox:"0 0 15 12",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[e.jsx("circle",{cx:"2",cy:"2",r:"2",fill:"#D6D6D6"}),e.jsx("path",{d:"M0.196854 10.6453L2.40968 8.05946C2.4846 7.97175 2.57719 7.9008 2.68141 7.85124C2.78562 7.80168 2.89913 7.77461 3.01452 7.77181C3.12991 7.76902 3.2446 7.79055 3.3511 7.835C3.45761 7.87945 3.55353 7.94583 3.63262 8.02981L4.66733 9.12714L8.71205 4.29464C8.79123 4.19995 8.89077 4.1243 9.00325 4.07333C9.11573 4.02236 9.23827 3.99737 9.36176 4.00022C9.48524 4.00307 9.6065 4.03369 9.71651 4.08979C9.82651 4.1459 9.92245 4.22605 9.99717 4.32429L14.8329 10.6772C14.9254 10.7989 14.982 10.9441 14.9964 11.0962C15.0107 11.2484 14.9823 11.4016 14.9144 11.5385C14.8464 11.6754 14.7415 11.7907 14.6115 11.8713C14.4815 11.952 14.3316 11.9948 14.1786 11.995L0.822048 12C0.664945 11.9999 0.511148 11.9549 0.378853 11.8703C0.246557 11.7857 0.141299 11.6649 0.0755311 11.5224C0.00976323 11.3799 -0.013762 11.2216 0.00773837 11.0661C0.0292388 10.9107 0.0948652 10.7646 0.196854 10.6453Z",fill:"#D6D6D6"})]})),e.jsx("span",{className:k,style:F,children:i?.label})]})}),M=()=>e.jsx("img",{className:"gp-h-full gp-w-full gp-object-cover",src:p,alt:""}),I=s.createClass(l.getWrapperClass(c)),T=s.createAttr(a.getWrapperAttr(c)),_=s.createStyle(o.getWrapperStyleActive(c)),B=s.createStyle(o.getWrapperStyleNormalAndHover(c)),H=n?_:B;return e.jsxs("div",{...T,className:I,style:H,children:[q(),(()=>{switch(f){case"color":return s.If(d&&d.length>0,W(),L());case"image":case"image_shopify":return s.If(!!p,M(),L());default:return L()}})()]})};

package/dist/cjs/product/components/product-variants/components/base/base.liquid.js

@@ -1,25 +1,25 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),_function=require("../../../../helpers/function.js"),classes=require("../../common/base/classes.js"),system=require("@gem-sdk/system"),attrs=require("../../common/base/attrs.js"),styles=require("../../common/base/styles.js");const BaseVariant=e=>{let{optionTypography:s,optionBorder:t,optionRounded:l,optionTypo:r,typeOfOption:a}=e,c="color"===a,i="image"===a||"image_shopify"===a,o=system.createClass(classes.getColorClass({})),y=()=>core.template`
-      ${system.LiquidFor("color in colors",`
-          ${system.Liquid('{% assign backgroundType = "background-color" %}')}
-          ${system.LiquidIf('color contains "linear-gradient"',system.Liquid('{% assign backgroundType = "background-image" %}'))}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../../../helpers/function.js"),l=require("../../common/base/classes.js"),r=require("@gem-sdk/system"),a=require("../../common/base/attrs.js"),s=require("../../common/base/styles.js");exports.default=i=>{let{optionTypography:c,optionBorder:o,optionRounded:g,optionTypo:d,typeOfOption:u}=i,p="color"===u,n="image"===u||"image_shopify"===u,y=r.createClass(l.getColorClass({})),C=()=>e.template`
+      ${r.LiquidFor("color in colors",`
+          ${r.Liquid('{% assign backgroundType = "background-color" %}')}
+          ${r.LiquidIf('color contains "linear-gradient"',r.Liquid('{% assign backgroundType = "background-image" %}'))}
           <div
-            class="${o}"
+            class="${y}"
             data-test="{{ backgroundType }}: {{ color }}"
-            style="{{ backgroundType }}: {{ color }}; ${u()}"></div>
+            style="{{ backgroundType }}: {{ color }}; ${f()}"></div>
         `)}
-      `,n=system.createStyle(styles.getColorStyle({optionBorder:t,optionRounded:l,isActive:!0})),m=system.createStyle(styles.getColorStyle({optionBorder:t,optionRounded:l,isActive:!1})),u=()=>system.LiquidIf("selectedValue == value",_function.getStyleOfObject(n),_function.getStyleOfObject(m)),g=system.createClass(classes.getWrapperTextClass(i,c)),d=system.createStyle({...styles.getWrapperTextStyle(e)}),p=system.createClass(classes.getTextClass({optionTypo:r,optionTypography:s,isColorType:c,isUploadImageType:i})),C=system.createStyle(styles.getTextStyle({optionTypo:r,optionTypography:s})),f=()=>core.template`
+      `,m=r.createStyle(s.getColorStyle({optionBorder:o,optionRounded:g,isActive:!0})),v=r.createStyle(s.getColorStyle({optionBorder:o,optionRounded:g,isActive:!1})),f=()=>r.LiquidIf("selectedValue == value",t.getStyleOfObject(m),t.getStyleOfObject(v)),b=r.createClass(l.getWrapperTextClass(n,p)),S=r.createStyle({...s.getWrapperTextStyle(i)}),$=r.createClass(l.getTextClass({optionTypo:d,optionTypography:c,isColorType:p,isUploadImageType:n})),q=r.createStyle(s.getTextStyle({optionTypo:d,optionTypography:c})),L=()=>e.template`
       <div
-        class="${g}"
-        style="${c?u():""} ${_function.getStyleOfObject(d)}">
-        ${system.If(i,'<svg width="15" height="12" viewBox="0 0 15 12" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="2" cy="2" r="2" fill="#D6D6D6"></circle><path d="M0.196854 10.6453L2.40968 8.05946C2.4846 7.97175 2.57719 7.9008 2.68141 7.85124C2.78562 7.80168 2.89913 7.77461 3.01452 7.77181C3.12991 7.76902 3.2446 7.79055 3.3511 7.835C3.45761 7.87945 3.55353 7.94583 3.63262 8.02981L4.66733 9.12714L8.71205 4.29464C8.79123 4.19995 8.89077 4.1243 9.00325 4.07333C9.11573 4.02236 9.23827 3.99737 9.36176 4.00022C9.48524 4.00307 9.6065 4.03369 9.71651 4.08979C9.82651 4.1459 9.92245 4.22605 9.99717 4.32429L14.8329 10.6772C14.9254 10.7989 14.982 10.9441 14.9964 11.0962C15.0107 11.2484 14.9823 11.4016 14.9144 11.5385C14.8464 11.6754 14.7415 11.7907 14.6115 11.8713C14.4815 11.952 14.3316 11.9948 14.1786 11.995L0.822048 12C0.664945 11.9999 0.511148 11.9549 0.378853 11.8703C0.246557 11.7857 0.141299 11.6649 0.0755311 11.5224C0.00976323 11.3799 -0.013762 11.2216 0.00773837 11.0661C0.0292388 10.9107 0.0948652 10.7646 0.196854 10.6453Z" fill="#D6D6D6"></path></svg>'," ")}
-        <span class="${p}" style="${C}">{{value}}</span>
+        class="${b}"
+        style="${p?f():""} ${t.getStyleOfObject(S)}">
+        ${r.If(n,'<svg width="15" height="12" viewBox="0 0 15 12" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="2" cy="2" r="2" fill="#D6D6D6"></circle><path d="M0.196854 10.6453L2.40968 8.05946C2.4846 7.97175 2.57719 7.9008 2.68141 7.85124C2.78562 7.80168 2.89913 7.77461 3.01452 7.77181C3.12991 7.76902 3.2446 7.79055 3.3511 7.835C3.45761 7.87945 3.55353 7.94583 3.63262 8.02981L4.66733 9.12714L8.71205 4.29464C8.79123 4.19995 8.89077 4.1243 9.00325 4.07333C9.11573 4.02236 9.23827 3.99737 9.36176 4.00022C9.48524 4.00307 9.6065 4.03369 9.71651 4.08979C9.82651 4.1459 9.92245 4.22605 9.99717 4.32429L14.8329 10.6772C14.9254 10.7989 14.982 10.9441 14.9964 11.0962C15.0107 11.2484 14.9823 11.4016 14.9144 11.5385C14.8464 11.6754 14.7415 11.7907 14.6115 11.8713C14.4815 11.952 14.3316 11.9948 14.1786 11.995L0.822048 12C0.664945 11.9999 0.511148 11.9549 0.378853 11.8703C0.246557 11.7857 0.141299 11.6649 0.0755311 11.5224C0.00976323 11.3799 -0.013762 11.2216 0.00773837 11.0661C0.0292388 10.9107 0.0948652 10.7646 0.196854 10.6453Z" fill="#D6D6D6"></path></svg>'," ")}
+        <span class="${$}" style="${q}">{{value}}</span>
       </div>
-    `,v=()=>core.template`
+    `,h=()=>e.template`
       <img class="gp-object-cover gp-rounded-none" style="width: 64px; height: 64px" src="{{imageUrl}}" alt="" />
-    `,b=()=>{switch(a){case"color":return core.template`${system.LiquidIf("colors != null and colors.size > 0",y(),f())}`;case"image":case"image_shopify":return core.template`${system.LiquidIf('imageUrl != null and imageUrl != ""',v(),f())}`;default:return f()}},S=system.createClass(classes.getWrapperClass({...e,available:!0})),$=system.createAttr(attrs.getWrapperAttr(e,"Liquid")),q=system.createStyle(styles.getWrapperStyleActive(e)),L=system.createStyle(styles.getWrapperStyleNormalAndHover(e));return core.template`
+    `,j=r.createClass(l.getWrapperClass({...i,available:!0})),x=r.createAttr(a.getWrapperAttr(i,"Liquid")),O=r.createStyle(s.getWrapperStyleActive(i)),k=r.createStyle(s.getWrapperStyleNormalAndHover(i));return e.template`
     <div
-      ${$}
-      class="${S}"
-      style="${system.LiquidIf("selectedValue == value",_function.getStyleOfObject({...q,...n}),_function.getStyleOfObject({...L,...m}))}">
-      ${b()}
-    </div>`};exports.default=BaseVariant;
+      ${x}
+      class="${j}"
+      style="${r.LiquidIf("selectedValue == value",t.getStyleOfObject({...O,...m}),t.getStyleOfObject({...k,...v}))}">
+      ${(()=>{switch(u){case"color":return e.template`${r.LiquidIf("colors != null and colors.size > 0",C(),L())}`;case"image":case"image_shopify":return e.template`${r.LiquidIf('imageUrl != null and imageUrl != ""',h(),L())}`;default:return L()}})()}
+    </div>`};

package/dist/cjs/product/components/product-variants/components/color/color.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),base=require("../base/base.js"),React=require("react");const ImageVariant=({swatchValue:e,isVariantOutStock:t,...r})=>{let a=React.useMemo(()=>e?.colors?.length?e?.colors:[],[e]);return jsxRuntime.jsx(base.default,{...r,swatchesColor:a,isVariantOutStock:t})};exports.default=ImageVariant;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../base/base.js"),t=require("react");exports.default=({swatchValue:s,isVariantOutStock:o,...u})=>{let a=t.useMemo(()=>s?.colors?.length?s?.colors:[],[s]);return e.jsx(r.default,{...u,swatchesColor:a,isVariantOutStock:o})};

package/dist/cjs/product/components/product-variants/components/color/color.liquid.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),base_liquid=require("../base/base.liquid.js"),mappingVariantStyles=require("../../utils/mappingVariantStyles.js"),_const=require("../../common/const.js");const ColorVariant=({isVariantOutStock:o,swatchValue:e,...r})=>core.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),o=require("../base/base.liquid.js"),l=require("../../utils/mappingVariantStyles.js"),r=require("../../common/const.js");exports.default=({isVariantOutStock:s,swatchValue:i,...n})=>e.template`
     {% assign colorsString = null %}
     {% assign colors = null %}
     {% for label in labels %}
@@ -7,7 +7,7 @@
       {% endif %}
     {% endfor %}
     {% if colorsString != null %}
-      {% assign colors = colorsString | split: '${_const.OPTION_VALUES_DELIMITER}' %}
+      {% assign colors = colorsString | split: '${r.OPTION_VALUES_DELIMITER}' %}
     {% endif %}
-    ${base_liquid.default({...r,typeOfOption:"color",optionRounded:mappingVariantStyles.optionRoundedColorDefault})}
-  `;exports.default=ColorVariant;
+    ${o.default({...n,typeOfOption:"color",optionRounded:l.optionRoundedColorDefault})}
+  `;

package/dist/cjs/product/components/product-variants/components/dropdown-group/DropdownGroup.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),Dropdown=require("../dropdown-swatches/Dropdown.js"),React=require("react");const DropdownGroup=({...e})=>{let r=core.useVariants(),{selectedOptions:t}=core.useSelectedOption(),o=React.useMemo(()=>{let e=Object.keys(t||{}),o=r.find(r=>{let o=0;return e.forEach(e=>{let n=r?.selectedOptions.find(r=>r.name===e);n?.value===t?.[e]&&o++}),o===e.length});return o},[r,t]);return jsxRuntime.jsx(Dropdown.default,{variants:r,initValue:o?.id,variantGroup:!0,...e})};exports.default=DropdownGroup;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@gem-sdk/core"),t=require("../dropdown-swatches/Dropdown.js"),s=require("react");exports.default=({...u})=>{let a=r.useVariants(),{selectedOptions:i}=r.useSelectedOption(),n=s.useMemo(()=>{let e=Object.keys(i||{}),r=a.find(r=>{let t=0;return e.forEach(e=>{let s=r?.selectedOptions.find(r=>r.name===e);s?.value===i?.[e]&&t++}),t===e.length});return r},[a,i]);return e.jsx(t.default,{variants:a,initValue:n?.id,variantGroup:!0,...u})};

package/dist/cjs/product/components/product-variants/components/dropdown-group/DropdownGroup.liquid.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var index=require("../dropdown-option/render-liquid/index.js"),Dropdown_liquid=require("../dropdown-swatches/Dropdown.liquid.js");const DropdownGroupVariant=r=>{let{price:e,hasPreSelected:o,soldOutStyle:d}=r,i="disable"===d;return Dropdown_liquid.default({...r,variantGroup:!0,children:index.renderCombineVariants(i,o,e)})};exports.default=DropdownGroupVariant;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../dropdown-option/render-liquid/index.js"),r=require("../dropdown-swatches/Dropdown.liquid.js");exports.default=d=>{let{price:i,hasPreSelected:o,soldOutStyle:t}=d;return r.default({...d,variantGroup:!0,children:e.renderCombineVariants("disable"===t,o,i)})};

package/dist/cjs/product/components/product-variants/components/dropdown-option/DropdownOption.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core");require("react");const DropdownVariantOption=({optionPosition:e,optionNumber:r,value:t,optionName:o,isSoldOutMark:i})=>{let n=core.useVariantOutStock(o??"",t?.label??"",{position:e||0,optionNumber:r||0});return jsxRuntime.jsx("option",{disabled:!n&&i,value:t?.label,children:t?.label},t?.id)};exports.default=DropdownVariantOption;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@gem-sdk/core");require("react"),exports.default=({optionPosition:t,optionNumber:i,value:l,optionName:u,isSoldOutMark:a})=>{let o=r.useVariantOutStock(u??"",l?.label??"",{position:t||0,optionNumber:i||0});return e.jsx("option",{disabled:!o&&a,value:l?.label,children:l?.label},l?.id)};

package/dist/cjs/product/components/product-variants/components/dropdown-option/VariantOption.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core");require("react");const VariantOption=({variant:e,value:r,includePrice:t,disabled:i})=>{let o=core.useFormatMoney(parseFloat(`${e?.price}`),!1);return jsxRuntime.jsx("option",{disabled:i,value:r,dangerouslySetInnerHTML:{__html:`${e?.title}${t?` - ${o}`:""} `}})};exports.default=VariantOption;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@gem-sdk/core");require("react"),exports.default=({variant:t,value:s,includePrice:u,disabled:a})=>{let o=r.useFormatMoney(parseFloat(`${t?.price}`),!1);return e.jsx("option",{disabled:a,value:s,dangerouslySetInnerHTML:{__html:`${t?.title}${u?` - ${o}`:""} `}})};

package/dist/cjs/product/components/product-variants/components/dropdown-option/render-liquid/index.js

@@ -1,27 +1,27 @@
-"use strict";var system=require("@gem-sdk/system"),helpers=require("../../../../../../helpers.js");const renderCombineVariants=(e,i,t)=>{let o=t?"- {{variantItem.price | money}}":"",a='origin-price="{{variantItem.price}}" value="{{variantItem.id}}" key="{{variantItem.id}}"',n=`{{variantItem.title}} ${o}`;return`{%- for variantItem in variants -%}
-    ${system.If(e,system.LiquidIf("variantItem.available == false",system.LiquidIf("variantItem.id == variant.id",`<option origin-price="{{variantItem.price}}" disabled ${i?"selected":""} value="{{variantItem.id}}" key="{{variantItem.id}}">            
+"use strict";var i=require("@gem-sdk/system"),e=require("../../../../../../helpers.js");const a=`
+  option-data="{{option.name | escape}}"
+  option-value="{{value | escape}}"
+  data-gp-option-value-id="{{value.id}}"
+  data-gp-option-available="{{value.available}}"
+  value="{{value | escape}}"
+  class="option-value-wrapper"
+  key="{{value | escape}}"
+`;exports.renderBlankOption=i=>`<option value="blank" selected>${i??e.getStaticLocale("ProductVariants","please_select")}</option>`,exports.renderCombineVariants=(e,a,t)=>{let o='origin-price="{{variantItem.price}}" value="{{variantItem.id}}" key="{{variantItem.id}}"',n=`{{variantItem.title}} ${t?"- {{variantItem.price | money}}":""}`;return`{%- for variantItem in variants -%}
+    ${i.If(e,i.LiquidIf("variantItem.available == false",i.LiquidIf("variantItem.id == variant.id",`<option origin-price="{{variantItem.price}}" disabled ${a?"selected":""} value="{{variantItem.id}}" key="{{variantItem.id}}">            
             ${n}
-          </option>`,`<option ${a} disabled>
+          </option>`,`<option ${o} disabled>
             ${n}
-          </option>`),system.LiquidIf("variantItem.id == variant.id",`<option origin-price="{{variantItem.price}}" ${i?"selected":""} value="{{variantItem.id}}" key="{{variantItem.id}}">
+          </option>`),i.LiquidIf("variantItem.id == variant.id",`<option origin-price="{{variantItem.price}}" ${a?"selected":""} value="{{variantItem.id}}" key="{{variantItem.id}}">
             ${n}
-          </option>`,`<option ${a}>
+          </option>`,`<option ${o}>
             ${n}
-          </option>`)),system.LiquidIf("variantItem.id == variant.id",`<option origin-price="{{variantItem.price}}" ${i?"selected":""} value="{{variantItem.id}}" key="{{variantItem.id}}">
+          </option>`)),i.LiquidIf("variantItem.id == variant.id",`<option origin-price="{{variantItem.price}}" ${a?"selected":""} value="{{variantItem.id}}" key="{{variantItem.id}}">
           ${n}
-        </option>`,`<option ${a}>
+        </option>`,`<option ${o}>
           ${n}
         </option>`))}     
     {%- endfor -%}
-  `},composeSelectOptionAttrs=`
-  option-data="{{option.name | escape}}"
-  option-value="{{value | escape}}"
-  data-gp-option-value-id="{{value.id}}"
-  data-gp-option-available="{{value.available}}"
-  value="{{value | escape}}"
-  class="option-value-wrapper"
-  key="{{value | escape}}"
-`,renderDropdownOptions=(e,i)=>system.LiquidFor("value in values",`${system.Liquid(`{%- liquid
+  `},exports.renderDropdownOptions=(e,t)=>i.LiquidFor("value in values",`${i.Liquid(`{%- liquid
       assign option_disabled = true
       for variantItem in product.variants
         case option.position
@@ -40,4 +40,4 @@
         endcase
       endfor
     -%}`)}
-    ${system.If(e,system.LiquidIf("option_disabled == true",system.LiquidIf("value == selectedValue",`<option disabled ${i?"selected":""} option-position="{{option.position}}"${composeSelectOptionAttrs}>{{value}}</option>`,`<option disabled ${composeSelectOptionAttrs}>{{value}}</option>`),system.LiquidIf("value == selectedValue",`<option ${i?"selected":""} option-position="{{option.position}}" ${composeSelectOptionAttrs}>{{value}}</option>`,`<option ${composeSelectOptionAttrs} option-position="{{option.position}}">{{value}}</option>`)),system.LiquidIf("value == selectedValue",`<option ${i?"selected":""} ${composeSelectOptionAttrs} option-position="{{option.position}}">{{value}}</option>`,`<option ${composeSelectOptionAttrs} option-position="{{option.position}}">{{value}}</option>`))}`),renderBlankOption=e=>`<option value="blank" selected>${e??helpers.getStaticLocale("ProductVariants","please_select")}</option>`;exports.renderBlankOption=renderBlankOption,exports.renderCombineVariants=renderCombineVariants,exports.renderDropdownOptions=renderDropdownOptions;
+    ${i.If(e,i.LiquidIf("option_disabled == true",i.LiquidIf("value == selectedValue",`<option disabled ${t?"selected":""} option-position="{{option.position}}"${a}>{{value}}</option>`,`<option disabled ${a}>{{value}}</option>`),i.LiquidIf("value == selectedValue",`<option ${t?"selected":""} option-position="{{option.position}}" ${a}>{{value}}</option>`,`<option ${a} option-position="{{option.position}}">{{value}}</option>`)),i.LiquidIf("value == selectedValue",`<option ${t?"selected":""} ${a} option-position="{{option.position}}">{{value}}</option>`,`<option ${a} option-position="{{option.position}}">{{value}}</option>`))}`);

package/dist/cjs/product/components/product-variants/components/dropdown-swatches/Dropdown.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),VariantOption=require("../dropdown-option/VariantOption.js"),DropdownOption=require("../dropdown-option/DropdownOption.js"),classes=require("../../common/dropdown/classes.js"),system=require("@gem-sdk/system"),styles=require("../../common/dropdown/styles.js"),attrs=require("../../common/dropdown/attrs.js"),useDropdownSwatches=require("./hooks/useDropdownSwatches.js");const DropdownVariant=e=>{let{option:t,optionPosition:o,optionNumber:s,variantGroup:n,variants:r,price:i,blankText:a,swatchHeight:d,optionTypography:l,optionTransform:p,initValue:u,hasPreSelected:m,optionTypo:c,combineHeight:w,combineWidth:j,soldOutStyle:h}=e,{optionBgColor:x,optionTextColor:y,optionRounded:S,optionShadow:g,optionHasShadow:D,optionBorder:q}=e,{value:v,preset:O,handleOnChangeSelect:R,checkVariantInStock:b}=useDropdownSwatches.useDropdownSwatches(e),f="disable"===h;n||(x=O?.optionBgColor,y=O?.optionTextColor,q=O?.optionBorder,D=O?.optionHasShadow,g=O?.optionShadow,S=O?.optionRounded);let C=system.createClass(classes.getSelectClass({optionTypo:c,optionTypography:l,optionBgColor:x,optionBorder:q,optionTextColor:y})),V=system.createStyle(styles.getSelectStyle({width:n?j:O?.width,height:n?w:O?.height,optionTypo:c,optionTypography:l,optionBgColor:x,optionTextColor:y,optionRounded:S,optionShadow:g,optionHasShadow:D,optionBorder:q,optionTransform:p,swatchHeight:d,isCombine:n,textAlign:c?.attrs?.textAlign})),k=system.createAttr(attrs.getSelectAttr({optionName:t?.name,value:v??u,type:"React"})),A=()=>r?.map(e=>jsxRuntime.jsx(VariantOption.default,{disabled:!b(e)&&f,value:e?.id,variant:e,includePrice:i},e?.id)),N=()=>t?.values?.map(e=>jsxRuntime.jsx(DropdownOption.default,{value:e,optionName:t.name,optionPosition:o,optionNumber:s,isSoldOutMark:f},e?.id));return jsxRuntime.jsxs("select",{...k,className:C,style:V,onChange:e=>R(e),children:[system.If(!m,jsxRuntime.jsx("option",{value:"blank",children:a??"Please select an option"})," "),system.If(n,A(),N())]})};exports.default=DropdownVariant;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),o=require("../dropdown-option/VariantOption.js"),t=require("../dropdown-option/DropdownOption.js"),r=require("../../common/dropdown/classes.js"),i=require("@gem-sdk/system"),s=require("../../common/dropdown/styles.js"),n=require("../../common/dropdown/attrs.js"),a=require("./hooks/useDropdownSwatches.js");exports.default=l=>{let{option:d,optionPosition:p,optionNumber:u,variantGroup:c,variants:m,price:h,blankText:w,optionTypography:j,optionTransform:g,initValue:x,hasPreSelected:S,optionTypo:q,combineHeight:v,combineWidth:y,soldOutStyle:b}=l,{optionBgColor:f,optionTextColor:C,optionRounded:k,optionShadow:A,optionHasShadow:N,optionBorder:O}=l,{value:P,preset:D,handleOnChangeSelect:B,checkVariantInStock:I}=a.useDropdownSwatches(l),M="disable"===b;c||(f=D?.optionBgColor,C=D?.optionTextColor,O=D?.optionBorder,N=D?.optionHasShadow,A=D?.optionShadow,k=D?.optionRounded);let R=i.createClass(r.getSelectClass({optionTypo:q,optionTypography:j,optionBgColor:f,optionBorder:O,optionTextColor:C})),_=i.createStyle(s.getSelectStyle({width:c?y:D?.width,height:c?v:D?.height,optionTypo:q,optionTypography:j,optionBgColor:f,optionTextColor:C,optionRounded:k,optionShadow:A,optionHasShadow:N,optionBorder:O,optionTransform:g,isCombine:c,textAlign:q?.attrs?.textAlign})),H=i.createAttr(n.getSelectAttr({optionName:d?.name,value:P??x,type:"React"}));return e.jsxs("select",{...H,className:R,style:_,onChange:e=>B(e),children:[i.If(!S,e.jsx("option",{value:"blank",children:w??"Please select an option"})," "),i.If(c,m?.map(t=>e.jsx(o.default,{disabled:!I(t)&&M,value:t?.id,variant:t,includePrice:h},t?.id)),d?.values?.map(o=>e.jsx(t.default,{value:o,optionName:d.name,optionPosition:p,optionNumber:u,isSoldOutMark:M},o?.id)))]})};