@gem-sdk/components 17.1.1 → 17.1.3

package/dist/cjs/article/components/ArticleReadMore.liquid.js

@@ -1,6 +1,7 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),Text_liquid=require("../../text/components/Text.liquid.js"),Button_liquid=require("../../button/components/Button.liquid.js"),translate=require("../settings/configs/translate.js");const ArticleReadMore=({setting:e,styles:t,builderAttrs:l,builderProps:r,advanced:o,style:a,pageContext:i})=>{let{readMoreType:n,label:s}=e??{},{typoBtn:u,typoText:c,globalSizeText:d,globalSizeBtn:p,textColorTextState:g,alignBtn:x,alignText:b,enableHoverEffectText:f}=t??{};return core.template`
-    ${core.RenderIf("text"===n,Text_liquid.default({builderAttrs:l,builderProps:r,advanced:o,styles:{...t,color:g,typo:c,spacing:"0px",align:b,textColor:void 0,enableHoverEffect:f},style:a??{},setting:{...e,text:s,globalSize:d,excludeFlex:!0},pageContext:i,translateSetting:translate.ArticleReadMore?.label?.id}))}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),Text_liquid=require("../../text/components/Text.liquid.js"),Button_liquid=require("../../button/components/Button.liquid.js"),translate=require("../settings/configs/translate.js");const ArticleReadMore=({setting:e,styles:t,builderAttrs:l,builderProps:r,advanced:a,style:o,pageContext:i})=>{let{readMoreType:n,label:s}=e??{},{typoBtn:u,typoText:c,globalSizeText:d,globalSizeBtn:p,textColorTextState:g,alignBtn:x,alignText:b,enableHoverEffectText:f}=t??{};return core.template`
+    ${core.RenderIf("text"===n,core.template`<a href="{{article.url}}" target="_blank">
+      ${Text_liquid.default({builderAttrs:l,builderProps:r,advanced:a,styles:{...t,color:g,typo:c,spacing:"0px",align:b,textColor:void 0,enableHoverEffect:f},style:o??{},setting:{...e,text:s,globalSize:d,excludeFlex:!0},pageContext:i,translateSetting:translate.ArticleReadMore?.label?.id})}</a>`)}
     ${core.RenderIf("text"!==n,core.template`<a href="{{article.url}}" target="_blank" class="gp-cursor-auto gp-pointer-events-none [&_button]:gp-pointer-events-auto">
-      ${Button_liquid.default({builderAttrs:l,builderProps:r,advanced:o,styles:{...t,typo:u,globalSize:p,align:x},style:a??{},setting:{...e,label:s,htmlType:"button"},translateSetting:translate.ArticleReadMore?.label?.id,pageContext:i})}</a>`)}
+      ${Button_liquid.default({builderAttrs:l,builderProps:r,advanced:a,styles:{...t,typo:u,globalSize:p,align:x},style:o??{},setting:{...e,label:s,htmlType:"button"},translateSetting:translate.ArticleReadMore?.label?.id,pageContext:i})}</a>`)}
   `};exports.default=ArticleReadMore;

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

@@ -1,8 +1,8 @@
-"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]}})),w={...i,variantPresets:S},L=e=>{let t={"'":"'",'"':"""},s=e;for(let i in t)e.indexOf(i)>=0&&(s=s.replaceAll(i,t[i]));return s},j=()=>i?.variantPresets?.map(e=>`${L(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,...w,swatchAutoWidth:q(),optionTypo:p,isRenderDefault:t}))}
-      ${system.LiquidIf(e?'type == "dropdown"':"false",Dropdown_liquid.default({...s,...w,swatchAutoWidth:$(),optionTypo:p}))}`,D=i?.variantPresets?.map(e=>({name:L(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`
+"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"),_const=require("./common/const.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:_}=i??{},v=a?.d??DEFAULT_ADVANCED_DISPLAY_SETTING,{uid:g}=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]}})),O={...i,variantPresets:S},L=e=>{let t={"'":"'",'"':"""},s=e;for(let i in t)e.indexOf(i)>=0&&(s=s.replaceAll(i,t[i]));return s},j=()=>i?.variantPresets?.map(e=>`${L(e.optionName)}($2)${e.optionType}`).join("($1)"),w=()=>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:g,name:"{{option.name | escape}}",value:{label:"{{value | escape}}"},checked:_?"{%- if option.selected_value == value -%}true{% else %}false{%- endif -%}":"false",optionPosition:"rootForloop",typeOfOption:i,activeClass:_?"{%- if option.selected_value == value -%}option-item-active{%- endif -%}":"",...s,...O,swatchAutoWidth:q(),optionTypo:p,isRenderDefault:t}))}
+      ${system.LiquidIf(e?'type == "dropdown"':"false",Dropdown_liquid.default({...s,...O,swatchAutoWidth:$(),optionTypo:p}))}`,D=i?.variantPresets?.map(e=>({name:L(e.optionName),type:e.optionType})).map(e=>`${e.name}($1)${e.type}`).join("($2)").toString(),A={renderVariantItem:V,variantPresetsLiquid:D??""},P=system.createClass(classes.getVariantOptionGroupClass(o)),T=system.createStyle(styles.getVariantOptionGroupStyle(l,l)),b=getData.getTextVariantTitleData(e,"Liquid"),N=system.createClass(classes$1.getWrapVariantOptionClass(y,o)),E=()=>core.template`
       ${system.Liquid(`{%- assign presets = "${j()}" | split: '($1)' -%}`)}
-      ${system.Liquid(`{% assign hiddenPresetOptions = "${O()}" | split: ',' %}`)}
+      ${system.Liquid(`{% assign hiddenPresetOptions = "${w()}" | split: ',' %}`)}
       
       ${system.Liquid(`{% assign all_option_names = options | map: 'name' %}
       {% assign filtered_options_string = '' %}
@@ -32,8 +32,8 @@
       ${system.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="${N} ${system.LiquidIf("hiddenPresetOptions contains option.name","gp-hidden")}"
+        style="${_function.getStyleOfObject(styles$1.getMarginBottomStyle(d))}${_const.PRODUCT_VARIANT_OPTION_MINW_STYLE}${system.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  -%}")}
@@ -41,11 +41,11 @@
             ${system.Liquid("{%- assign presetDetail = preset | split: '($2)' -%}")}
             ${system.LiquidIf("presetDetail[1] == 'dropdown' and presetDetail[0] == optionName",`${system.Liquid("{%- assign showVariantClass = '' -%}")} ${system.Liquid("{%- break -%}")}`)}
           `)}
-          ${system.If(u,Text_liquid.default(E)," ")}
+          ${system.If(u,Text_liquid.default(b)," ")}
           <div
               variant-option-name="{{option.name | escape}}"
-              class="${b}"
-              style="${_function.getStyleOfObject(P)}"
+              class="${P}"
+              style="${_function.getStyleOfObject(T)}"
             >
               ${system.Liquid("{%- assign values = option.values -%}")}
               ${system.Liquid("{%- assign rootForloop = forloop.index0 -%}")}
@@ -58,23 +58,23 @@
                   {%- assign selectedValue = variant.option3 -%}
                 {%- endif -%}
               `)}
-              ${system.If(!v,system.Liquid("{%- assign selectedValue = null -%}"),"")}
-              ${system.If(c,T(),V({showDropdown:!1,isRenderDefault:!0,typeOfOption:"optionType"}))}
+              ${system.If(!_,system.Liquid("{%- assign selectedValue = null -%}"),"")}
+              ${system.If(c,I(),V({showDropdown:!1,isRenderDefault:!0,typeOfOption:"optionType"}))}
           </div>
       </div>`)}
-    `,T=()=>core.template`
+    `,I=()=>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)}
+      `,x=system.createClass(classes.getWrapDropdownClass(o)),C=getData.getDropdownGroupData(e),F=()=>`
+      <div className="${x}">
+        ${DropdownGroup_liquid.default(C)}
       </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`
+    `,G=system.createAttr(getAttr.getAttrs({uid:g,hasPreSelected:_,cssClass:a?.cssClass})),k=system.createStyle(styles.getWrapperStyle(e)),W=system.createClass({"gp-flex gp-flex-col !gp-ml-0":!0}),z=()=>{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}
       gp-data='{
-        "setting":${JSON.stringify(w)?.replaceAll("'","&#039;")},
+        "setting":${JSON.stringify(O)?.replaceAll("'","&#039;")},
         "styles":${JSON.stringify(s)},
         "variants":{{product.variants | json | escape}},
         "optionsWithValues": {{product.options_with_values | json | escape}},
@@ -85,7 +85,7 @@
         "productId": {{product.id | json | escape}},
         "productUrl": {{product.url | json | escape}},
         "productHandle": {{product.handle | json | escape}},
-        "displayState": ${JSON.stringify(g)},
+        "displayState": ${JSON.stringify(v)},
         "totalVariantCombinations": {{total_combinations}},
         "firstAvailableVariant": {{product.selected_or_first_available_variant | json | escape}}
       }
@@ -94,12 +94,12 @@
       ${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}"
+            class="${W}"
             style="${k}"
           >
-          ${system.If(f,C(),N())}
+          ${system.If(f,F(),E())}
         </div>`)}
     </gp-product-variants>
 
-    ${W()}
+    ${z()}
   `};exports.default=ProductVariants;

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

@@ -1 +1 @@
-"use strict";const OPTION_VALUES_DELIMITER="|||";exports.OPTION_VALUES_DELIMITER="|||";
+"use strict";const OPTION_VALUES_DELIMITER="|||",PRODUCT_VARIANT_OPTION_MINW_STYLE="--minw-tablet:unset;--minw-mobile:unset;";exports.OPTION_VALUES_DELIMITER="|||",exports.PRODUCT_VARIANT_OPTION_MINW_STYLE="--minw-tablet:unset;--minw-mobile:unset;";

package/dist/esm/article/components/ArticleReadMore.liquid.js

@@ -1,6 +1,7 @@
 'use client';
-import{template as t,RenderIf as e}from"@gem-sdk/core";import o from"../../text/components/Text.liquid.js";import l from"../../button/components/Button.liquid.js";import{ArticleReadMore as r}from"../settings/configs/translate.js";let ArticleReadMore=({setting:a,styles:n,builderAttrs:i,builderProps:s,advanced:p,style:g,pageContext:c})=>{let{readMoreType:u,label:m}=a??{},{typoBtn:d,typoText:b,globalSizeText:x,globalSizeBtn:f,textColorTextState:y,alignBtn:v,alignText:S,enableHoverEffectText:j}=n??{};return t`
-    ${e("text"===u,o({builderAttrs:i,builderProps:s,advanced:p,styles:{...n,color:y,typo:b,spacing:"0px",align:S,textColor:void 0,enableHoverEffect:j},style:g??{},setting:{...a,text:m,globalSize:x,excludeFlex:!0},pageContext:c,translateSetting:r?.label?.id}))}
+import{template as t,RenderIf as e}from"@gem-sdk/core";import l from"../../text/components/Text.liquid.js";import o from"../../button/components/Button.liquid.js";import{ArticleReadMore as r}from"../settings/configs/translate.js";let ArticleReadMore=({setting:a,styles:n,builderAttrs:i,builderProps:s,advanced:g,style:p,pageContext:c})=>{let{readMoreType:u,label:m}=a??{},{typoBtn:b,typoText:d,globalSizeText:f,globalSizeBtn:x,textColorTextState:y,alignBtn:v,alignText:S,enableHoverEffectText:$}=n??{};return t`
+    ${e("text"===u,t`<a href="{{article.url}}" target="_blank">
+      ${l({builderAttrs:i,builderProps:s,advanced:g,styles:{...n,color:y,typo:d,spacing:"0px",align:S,textColor:void 0,enableHoverEffect:$},style:p??{},setting:{...a,text:m,globalSize:f,excludeFlex:!0},pageContext:c,translateSetting:r?.label?.id})}</a>`)}
     ${e("text"!==u,t`<a href="{{article.url}}" target="_blank" class="gp-cursor-auto gp-pointer-events-none [&_button]:gp-pointer-events-auto">
-      ${l({builderAttrs:i,builderProps:s,advanced:p,styles:{...n,typo:d,globalSize:f,align:v},style:g??{},setting:{...a,label:m,htmlType:"button"},translateSetting:r?.label?.id,pageContext:c})}</a>`)}
+      ${o({builderAttrs:i,builderProps:s,advanced:g,styles:{...n,typo:b,globalSize:x,align:v},style:p??{},setting:{...a,label:m,htmlType:"button"},translateSetting:r?.label?.id,pageContext:c})}</a>`)}
   `};export{ArticleReadMore as default};

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

@@ -1,7 +1,7 @@
-import{template as e,isLocalEnv as t,baseAssetURL as i,DEVICES as s,getResponsiveValueByScreen as o}from"@gem-sdk/core";import a from"../../../text/components/Text.liquid.js";import n from"./components/variants/index.liquid.js";import r from"./components/dropdown-swatches/Dropdown.liquid.js";import p from"./components/dropdown-group/DropdownGroup.liquid.js";import{getSettingPreloadData as l}from"../../../helpers.js";import{mappingVariantStyles as d}from"./utils/mappingVariantStyles.js";import{createClass as m,createStyle as c,createAttr as u,Liquid as v,LiquidFor as f,LiquidIf as _,If as $}from"@gem-sdk/system";import{getAttrs as g}from"./common/main/getAttr.js";import{getVariantOptionGroupStyle as h,getWrapperStyle as y}from"./common/main/styles.js";import{getVariantOptionGroupClass as j,getWrapDropdownClass as w}from"./common/main/classes.js";import{getTextVariantTitleData as S,getDropdownGroupData as P}from"./common/main/getData.js";import{getWrapVariantOptionClass as b}from"./common/variants/classes.js";import{getStyleOfObject as A}from"../../helpers/function.js";import{getMarginBottomStyle as D}from"./common/variants/styles.js";import{renderOptionValuesNewFormatSwatches as N}from"./OptionVariantsNewFormat.liquid.js";import{renderOptionValuesOld as V}from"./OptionVariantsOldFormat.liquid.js";let DEFAULT_ADVANCED_DISPLAY_SETTING={desktop:!0,tablet:!0,mobile:!0},ProductVariants=E=>{let{builderProps:O,styles:T,setting:x,advanced:q}=E,{align:F,swatchItemWidth:G,dropdownItemWidth:C,swatchSpacing:I,optionTypo:k,marginBottom:z}=T??{},{label:L,optionType:J,showAsSwatches:M,layout:U,hasPreSelected:W}=x??{},R=q?.d??DEFAULT_ADVANCED_DISPLAY_SETTING,{uid:Y}=O??{},H="groupOption"===J,K=()=>{let e={};return s.forEach(t=>{let i=o(G,t);e[t]="auto"===i}),e},Q=()=>{let e={};return s.forEach(t=>{e[t]=C?.[t]==="fill"}),e},B=x?.variantPresets?d(x?.variantPresets,T):[],X=B?.map(e=>({...e,presets:{[e.optionType]:e.presets[e.optionType]}})),Z={...x,variantPresets:X},ee=e=>{let t={"'":"'",'"':"""},i=e;for(let s in t)e.indexOf(s)>=0&&(i=i.replaceAll(s,t[s]));return i},et=()=>x?.variantPresets?.map(e=>`${ee(e.optionName)}($2)${e.optionType}`).join("($1)"),ei=()=>x?.variantPresets?.filter(e=>!!e?.hide)?.map(e=>e.optionName).join(","),es=({showDropdown:t,isRenderDefault:i,typeOfOption:s})=>e`
-    ${f("value in values",n({id:"{{option.name | escape | handleize}}-{{value | escape | handleize}}",variantKey:"{{option.name | escape}}-{{option.position}}-{{ forloop.index }}",showAsSwatches:M,uid:Y,name:"{{option.name | escape}}",value:{label:"{{value | escape}}"},checked:W?"{%- if option.selected_value == value -%}true{% else %}false{%- endif -%}":"false",optionPosition:"rootForloop",typeOfOption:s,activeClass:W?"{%- if option.selected_value == value -%}option-item-active{%- endif -%}":"",...T,...Z,swatchAutoWidth:K(),optionTypo:k,isRenderDefault:i}))}
-      ${_(t?'type == "dropdown"':"false",r({...T,...Z,swatchAutoWidth:Q(),optionTypo:k}))}`,eo=x?.variantPresets?.map(e=>({name:ee(e.optionName),type:e.optionType})).map(e=>`${e.name}($1)${e.type}`).join("($2)").toString(),ea={renderVariantItem:es,variantPresetsLiquid:eo??""},en=m(j(F)),er=c(h(I,I)),ep=S(E,"Liquid"),el=m(b(U,F)),ed=()=>e`
-      ${v(`{%- assign presets = "${et()}" | split: '($1)' -%}`)}
+import{template as e,isLocalEnv as t,baseAssetURL as o,DEVICES as i,getResponsiveValueByScreen as s}from"@gem-sdk/core";import a from"../../../text/components/Text.liquid.js";import n from"./components/variants/index.liquid.js";import r from"./components/dropdown-swatches/Dropdown.liquid.js";import p from"./components/dropdown-group/DropdownGroup.liquid.js";import{getSettingPreloadData as l}from"../../../helpers.js";import{mappingVariantStyles as d}from"./utils/mappingVariantStyles.js";import{createClass as m,createStyle as c,createAttr as u,Liquid as v,LiquidFor as f,LiquidIf as _,If as $}from"@gem-sdk/system";import{getAttrs as g}from"./common/main/getAttr.js";import{getVariantOptionGroupStyle as h,getWrapperStyle as y}from"./common/main/styles.js";import{getVariantOptionGroupClass as j,getWrapDropdownClass as w}from"./common/main/classes.js";import{getTextVariantTitleData as S,getDropdownGroupData as P}from"./common/main/getData.js";import{getWrapVariantOptionClass as b}from"./common/variants/classes.js";import{getStyleOfObject as A}from"../../helpers/function.js";import{getMarginBottomStyle as D}from"./common/variants/styles.js";import{PRODUCT_VARIANT_OPTION_MINW_STYLE as N}from"./common/const.js";import{renderOptionValuesNewFormatSwatches as V}from"./OptionVariantsNewFormat.liquid.js";import{renderOptionValuesOld as E}from"./OptionVariantsOldFormat.liquid.js";let DEFAULT_ADVANCED_DISPLAY_SETTING={desktop:!0,tablet:!0,mobile:!0},ProductVariants=O=>{let{builderProps:T,styles:x,setting:q,advanced:F}=O,{align:G,swatchItemWidth:C,dropdownItemWidth:I,swatchSpacing:k,optionTypo:z,marginBottom:L}=x??{},{label:J,optionType:M,showAsSwatches:U,layout:W,hasPreSelected:R}=q??{},Y=F?.d??DEFAULT_ADVANCED_DISPLAY_SETTING,{uid:H}=T??{},K="groupOption"===M,Q=()=>{let e={};return i.forEach(t=>{let o=s(C,t);e[t]="auto"===o}),e},B=()=>{let e={};return i.forEach(t=>{e[t]=I?.[t]==="fill"}),e},X=q?.variantPresets?d(q?.variantPresets,x):[],Z=X?.map(e=>({...e,presets:{[e.optionType]:e.presets[e.optionType]}})),ee={...q,variantPresets:Z},et=e=>{let t={"'":"'",'"':"""},o=e;for(let i in t)e.indexOf(i)>=0&&(o=o.replaceAll(i,t[i]));return o},eo=()=>q?.variantPresets?.map(e=>`${et(e.optionName)}($2)${e.optionType}`).join("($1)"),ei=()=>q?.variantPresets?.filter(e=>!!e?.hide)?.map(e=>e.optionName).join(","),es=({showDropdown:t,isRenderDefault:o,typeOfOption:i})=>e`
+    ${f("value in values",n({id:"{{option.name | escape | handleize}}-{{value | escape | handleize}}",variantKey:"{{option.name | escape}}-{{option.position}}-{{ forloop.index }}",showAsSwatches:U,uid:H,name:"{{option.name | escape}}",value:{label:"{{value | escape}}"},checked:R?"{%- if option.selected_value == value -%}true{% else %}false{%- endif -%}":"false",optionPosition:"rootForloop",typeOfOption:i,activeClass:R?"{%- if option.selected_value == value -%}option-item-active{%- endif -%}":"",...x,...ee,swatchAutoWidth:Q(),optionTypo:z,isRenderDefault:o}))}
+      ${_(t?'type == "dropdown"':"false",r({...x,...ee,swatchAutoWidth:B(),optionTypo:z}))}`,ea=q?.variantPresets?.map(e=>({name:et(e.optionName),type:e.optionType})).map(e=>`${e.name}($1)${e.type}`).join("($2)").toString(),en={renderVariantItem:es,variantPresetsLiquid:ea??""},er=m(j(G)),ep=c(h(k,k)),el=S(O,"Liquid"),ed=m(b(W,G)),em=()=>e`
+      ${v(`{%- assign presets = "${eo()}" | split: '($1)' -%}`)}
       ${v(`{% assign hiddenPresetOptions = "${ei()}" | split: ',' %}`)}
       
       ${v(`{% assign all_option_names = options | map: 'name' %}
@@ -32,8 +32,8 @@ import{template as e,isLocalEnv as t,baseAssetURL as i,DEVICES as s,getResponsiv
       ${f("option in options",`
         <div
         option-name="{{option.name | escape}}"
-        class="${el} ${_("hiddenPresetOptions contains option.name","gp-hidden")}"
-        style="${A(D(z))}${v("{% if forloop.last or option.name == last_option_name %}--mb:0;--mb-mobile:0;--mb-tablet:0;{% endif %}")}"
+        class="${ed} ${_("hiddenPresetOptions contains option.name","gp-hidden")}"
+        style="${A(D(L))}${N}${v("{% if forloop.last or option.name == last_option_name %}--mb:0;--mb-mobile:0;--mb-tablet:0;{% endif %}")}"
         >
           ${v("{%- assign showVariantClass = 'variant-display' -%}")}
           ${v("{%- assign optionName = option.name  -%}")}
@@ -41,11 +41,11 @@ import{template as e,isLocalEnv as t,baseAssetURL as i,DEVICES as s,getResponsiv
             ${v("{%- assign presetDetail = preset | split: '($2)' -%}")}
             ${_("presetDetail[1] == 'dropdown' and presetDetail[0] == optionName",`${v("{%- assign showVariantClass = '' -%}")} ${v("{%- break -%}")}`)}
           `)}
-          ${$(L,a(ep)," ")}
+          ${$(J,a(el)," ")}
           <div
               variant-option-name="{{option.name | escape}}"
-              class="${en}"
-              style="${A(er)}"
+              class="${er}"
+              style="${A(ep)}"
             >
               ${v("{%- assign values = option.values -%}")}
               ${v("{%- assign rootForloop = forloop.index0 -%}")}
@@ -58,24 +58,24 @@ import{template as e,isLocalEnv as t,baseAssetURL as i,DEVICES as s,getResponsiv
                   {%- assign selectedValue = variant.option3 -%}
                 {%- endif -%}
               `)}
-              ${$(!W,v("{%- assign selectedValue = null -%}"),"")}
-              ${$(M,em(),es({showDropdown:!1,isRenderDefault:!0,typeOfOption:"optionType"}))}
+              ${$(!R,v("{%- assign selectedValue = null -%}"),"")}
+              ${$(U,ec(),es({showDropdown:!1,isRenderDefault:!0,typeOfOption:"optionType"}))}
           </div>
       </div>`)}
-    `,em=()=>e`
-      ${_("shop.metafields.GEMPAGES.swatchesJSONFormat and shop.metafields.GEMPAGES.swatchesJSONFormat != blank",N(ea),V(ea))}
-      `,ec=m(w(F)),eu=P(E),ev=()=>`
-      <div className="${ec}">
-        ${p(eu)}
+    `,ec=()=>e`
+      ${_("shop.metafields.GEMPAGES.swatchesJSONFormat and shop.metafields.GEMPAGES.swatchesJSONFormat != blank",V(en),E(en))}
+      `,eu=m(w(G)),ev=P(O),ef=()=>`
+      <div className="${eu}">
+        ${p(ev)}
       </div>
-    `,ef=u(g({uid:Y,hasPreSelected:W,cssClass:q?.cssClass})),e_=c(y(E)),e$=m({"gp-flex gp-flex-col !gp-ml-0":!0}),eg=()=>{let e=t?"{{ 'gp-product-variant-v7-5.js' | asset_url }}":`${i}/assets-v2/gp-product-variant-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}`;return`<script ${l('class="gps-link" delay',"src")}="${e}" defer="defer"></script>`};return e`
+    `,e_=u(g({uid:H,hasPreSelected:R,cssClass:F?.cssClass})),e$=c(y(O)),eg=m({"gp-flex gp-flex-col !gp-ml-0":!0}),eh=()=>{let e=t?"{{ 'gp-product-variant-v7-5.js' | asset_url }}":`${o}/assets-v2/gp-product-variant-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}`;return`<script ${l('class="gps-link" delay',"src")}="${e}" defer="defer"></script>`};return e`
     ${v("{%- assign total_combinations = 1 -%}")}
     ${f("option in product.options_with_values","{%- assign total_combinations = total_combinations | times: option.values.size -%}")}
     <gp-product-variants
-      ${ef}
+      ${e_}
       gp-data='{
-        "setting":${JSON.stringify(Z)?.replaceAll("'","&#039;")},
-        "styles":${JSON.stringify(T)},
+        "setting":${JSON.stringify(ee)?.replaceAll("'","&#039;")},
+        "styles":${JSON.stringify(x)},
         "variants":{{product.variants | json | escape}},
         "optionsWithValues": {{product.options_with_values | json | escape}},
         "variantSelected": {{ variant | json | escape }},
@@ -85,7 +85,7 @@ import{template as e,isLocalEnv as t,baseAssetURL as i,DEVICES as s,getResponsiv
         "productId": {{product.id | json | escape}},
         "productUrl": {{product.url | json | escape}},
         "productHandle": {{product.handle | json | escape}},
-        "displayState": ${JSON.stringify(R)},
+        "displayState": ${JSON.stringify(Y)},
         "totalVariantCombinations": {{total_combinations}},
         "firstAvailableVariant": {{product.selected_or_first_available_variant | json | escape}}
       }
@@ -94,12 +94,12 @@ import{template as e,isLocalEnv as t,baseAssetURL as i,DEVICES as s,getResponsiv
       ${v("{%- assign options = product.options_with_values -%}")}
       ${v("{%- assign variants = product.variants -%}")}
       ${_("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`<div
-            class="${e$}"
-            style="${e_}"
+            class="${eg}"
+            style="${e$}"
           >
-          ${$(H,ev(),ed())}
+          ${$(K,ef(),em())}
         </div>`)}
     </gp-product-variants>
 
-    ${eg()}
+    ${eh()}
   `};export{ProductVariants as default};

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

@@ -1 +1 @@
-let OPTION_VALUES_DELIMITER="|||";export{OPTION_VALUES_DELIMITER};
+let OPTION_VALUES_DELIMITER="|||",PRODUCT_VARIANT_OPTION_MINW_STYLE="--minw-tablet:unset;--minw-mobile:unset;";export{OPTION_VALUES_DELIMITER,PRODUCT_VARIANT_OPTION_MINW_STYLE};

package/package.json

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