@gem-sdk/components 7.0.1-dev.15 → 7.0.1-dev.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -33,9 +33,9 @@
33
33
  {% endfor %}
34
34
  {%- assign optionRendered = true -%}
35
35
 
36
- ${s(!0)}
36
+ ${s({showDropdown:!0})}
37
37
  {% endif %}
38
38
  {% endfor %}`)}
39
39
 
40
- ${system.LiquidIf("optionRendered == false",s(!1,!0))}
40
+ ${system.LiquidIf("optionRendered == false",s({showDropdown:!1,isRenderDefault:!0,typeOfOption:"optionType"}))}
41
41
  `};exports.renderOptionValuesNewFormatSwatches=renderOptionValuesNewFormatSwatches;
@@ -1,4 +1,4 @@
1
- "use strict";var system=require("@gem-sdk/system"),core=require("@gem-sdk/core");const renderOptionValuesOld=s=>{let{renderVariantItem:i,variantPresetsLiquid:e}=s;return core.template`
1
+ "use strict";var system=require("@gem-sdk/system"),core=require("@gem-sdk/core");const renderOptionValuesOld=s=>{let{renderVariantItem:e,variantPresetsLiquid:i}=s;return core.template`
2
2
  ${system.Liquid("{%- assign optionRendered = false -%}")}
3
3
  ${system.Liquid("{%- assign swatches = shop.metafields.GEMPAGES.swatches -%}")}
4
4
  ${system.Liquid("{%- assign swatchesItems = swatches | split: '($1)' -%}")}
@@ -48,7 +48,7 @@
48
48
  ${system.Liquid("{%- assign imageUrls = imageUrlsString | split: '($8)' -%}")}
49
49
 
50
50
  ${system.LiquidIf("optionTitle == option.name",`
51
- ${system.Liquid(`{%- assign variantPresetString = "${e}" -%}`)}
51
+ ${system.Liquid(`{%- assign variantPresetString = "${i}" -%}`)}
52
52
  ${system.Liquid('{%- assign optionName = option.name | replace: "\'", "'" | replace: \'"\', """ -%}')}
53
53
  ${system.Liquid("{%- assign items = variantPresetString | split:'($2)' -%}")}
54
54
  ${system.Liquid("{%- assign type = 'dropdown' -%}")}
@@ -58,9 +58,9 @@
58
58
  ${system.LiquidIf('itemPreset[0] == "base"',system.Liquid("{%- assign type = itemPreset[1] -%}"))}
59
59
  `)}
60
60
  ${system.Liquid("{%- assign optionRendered = true -%}")}
61
- ${i(!0)}
61
+ ${e({showDropdown:!0})}
62
62
  `)}
63
63
  `)}
64
64
 
65
- ${system.LiquidIf("optionRendered == false",i(!1,!0))}
65
+ ${system.LiquidIf("optionRendered == false",e({showDropdown:!1,isRenderDefault:!0,typeOfOption:"optionType"}))}
66
66
  `};exports.renderOptionValuesOld=renderOptionValuesOld;
@@ -1,8 +1,8 @@
1
- "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=core.composeMemo(()=>{let e=mappingVariantStyles.mappingVariantStyles(i?.variantPresets,s);return{...i,variantPresets:e}},[i?.variantPresets,s]),S=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=>`${S(e.optionName)}($2)${e.optionType}`).join("($1)"),j=()=>i?.variantPresets?.filter(e=>!!e?.hide)?.map(e=>e.optionName).join(","),V=(e,t)=>core.template`
2
- ${system.LiquidFor("value in values",index_liquid.default({id:"{{option.name | escape}}-{{value | escape}}",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:"optionType",activeClass:v?"{%- if option.selected_value == value -%}option-item-active{%- endif -%}":"",...s,...h,swatchAutoWidth:q(),optionTypo:p,isRenderDefault:t}))}
3
- ${system.LiquidIf(e?'type == "dropdown"':"false",Dropdown_liquid.default({...s,...h,swatchAutoWidth:$(),optionTypo:p}))}`,w=i?.variantPresets?.map(e=>({name:S(e.optionName),type:e.optionType})).map(e=>`${e.name}($1)${e.type}`).join("($2)").toString(),O={renderVariantItem:V,variantPresetsLiquid:w??""},D=system.createClass(classes.getVariantOptionGroupClass(o)),A=system.createStyle(styles.getVariantOptionGroupStyle(l,l)),b=getData.getTextVariantTitleData(e,"Liquid"),E=system.createClass(classes$1.getWrapVariantOptionClass(y,o)),P=()=>core.template`
4
- ${system.Liquid(`{%- assign presets = "${L()}" | split: '($1)' -%}`)}
5
- ${system.Liquid(`{% assign hiddenPresetOptions = "${j()}" | split: ',' %}`)}
1
+ "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??{},f=a?.d??DEFAULT_ADVANCED_DISPLAY_SETTING,{uid:g}=t??{},_="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,variantPresetsOptionType:S},w=e=>{let t={"'":"'",'"':"""},s=e;for(let i in t)e.indexOf(i)>=0&&(s=s.replaceAll(i,t[i]));return s},V=()=>i?.variantPresets?.map(e=>`${w(e.optionName)}($2)${e.optionType}`).join("($1)"),D=()=>i?.variantPresets?.filter(e=>!!e?.hide)?.map(e=>e.optionName).join(","),L=({showDropdown:e,isRenderDefault:t,typeOfOption:i})=>core.template`
2
+ ${system.LiquidFor("value in values",index_liquid.default({id:"{{option.name | escape}}-{{value | escape}}",variantKey:"{{option.name | escape}}-{{option.position}}-{{ forloop.index }}",showAsSwatches:c,uid:g,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}))}
3
+ ${system.LiquidIf(e?'type == "dropdown"':"false",Dropdown_liquid.default({...s,...j,swatchAutoWidth:$(),optionTypo:p}))}`,O=i?.variantPresets?.map(e=>({name:w(e.optionName),type:e.optionType})).map(e=>`${e.name}($1)${e.type}`).join("($2)").toString(),A={renderVariantItem:L,variantPresetsLiquid:O??""},E=system.createClass(classes.getVariantOptionGroupClass(o)),P=system.createStyle(styles.getVariantOptionGroupStyle(l,l)),b=getData.getTextVariantTitleData(e,"Liquid"),x=system.createClass(classes$1.getWrapVariantOptionClass(y,o)),T=()=>core.template`
4
+ ${system.Liquid(`{%- assign presets = "${V()}" | split: '($1)' -%}`)}
5
+ ${system.Liquid(`{% assign hiddenPresetOptions = "${D()}" | split: ',' %}`)}
6
6
 
7
7
  ${system.Liquid(`{% assign all_option_names = options | map: 'name' %}
8
8
  {% assign filtered_options_string = '' %}
@@ -32,7 +32,7 @@
32
32
  ${system.LiquidFor("option in options",`
33
33
  <div
34
34
  option-name="{{option.name | escape}}"
35
- class="${E} ${system.LiquidIf("hiddenPresetOptions contains option.name","gp-hidden")}"
35
+ class="${x} ${system.LiquidIf("hiddenPresetOptions contains option.name","gp-hidden")}"
36
36
  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 %}")}"
37
37
  >
38
38
  ${system.Liquid("{%- assign showVariantClass = 'variant-display' -%}")}
@@ -44,8 +44,8 @@
44
44
  ${system.If(u,Text_liquid.default(b)," ")}
45
45
  <div
46
46
  variant-option-name="{{option.name | escape}}"
47
- class="${D}"
48
- style="${_function.getStyleOfObject(A)}"
47
+ class="${E}"
48
+ style="${_function.getStyleOfObject(P)}"
49
49
  >
50
50
  ${system.Liquid("{%- assign values = option.values -%}")}
51
51
  ${system.Liquid("{%- assign rootForloop = forloop.index0 -%}")}
@@ -59,22 +59,20 @@
59
59
  {%- endif -%}
60
60
  `)}
61
61
  ${system.If(!v,system.Liquid("{%- assign selectedValue = null -%}"),"")}
62
- ${system.If(c,x(),V(!1,!0))}
62
+ ${system.If(c,I(),L({showDropdown:!1,isRenderDefault:!0,typeOfOption:"optionType"}))}
63
63
  </div>
64
64
  </div>`)}
65
- `,x=()=>core.template`
66
- ${system.LiquidIf(" shop.metafields.GEMPAGES.swatches and shop.metafields.GEMPAGES.swatchesJSONFormat != blank",OptionVariantsNewFormat_liquid.renderOptionValuesNewFormatSwatches(O),OptionVariantsOldFormat_liquid.renderOptionValuesOld(O))}
67
- `,I=system.createClass(classes.getWrapDropdownClass(o)),N=getData.getDropdownGroupData(e),T=()=>`
68
- <div className="${I}">
69
- ${DropdownGroup_liquid.default(N)}
65
+ `,I=()=>core.template`
66
+ ${system.LiquidIf("shop.metafields.GEMPAGES.swatches and shop.metafields.GEMPAGES.swatchesJSONFormat != blank",OptionVariantsNewFormat_liquid.renderOptionValuesNewFormatSwatches(A),OptionVariantsOldFormat_liquid.renderOptionValuesOld(A))}
67
+ `,N=system.createClass(classes.getWrapDropdownClass(o)),C=getData.getDropdownGroupData(e),F=()=>`
68
+ <div className="${N}">
69
+ ${DropdownGroup_liquid.default(C)}
70
70
  </div>
71
- `,C=system.createAttr(getAttr.getAttrs({uid:_,hasPreSelected:v,cssClass:a?.cssClass})),F=system.createStyle(styles.getWrapperStyle(e)),G=system.createClass({"gp-flex gp-flex-col !gp-ml-0":!0}),k=()=>{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`
72
- ${system.Liquid("{%- assign total_combinations = 1 -%}")}
73
- ${system.LiquidFor("option in product.options_with_values","{%- assign total_combinations = total_combinations | times: option.values.size -%}")}
71
+ `,G=system.createAttr(getAttr.getAttrs({uid:g,hasPreSelected:v,cssClass:a?.cssClass})),k=system.createStyle(styles.getWrapperStyle(e)),W=system.createClass({"gp-flex gp-flex-col !gp-ml-0":!0}),M=()=>{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`
74
72
  <gp-product-variants
75
- ${C}
73
+ ${G}
76
74
  gp-data='{
77
- "setting":${JSON.stringify(h)?.replaceAll("'","&#039;")},
75
+ "setting":${JSON.stringify(j)?.replaceAll("'","&#039;")},
78
76
  "styles":${JSON.stringify(s)},
79
77
  "variants":{{product.variants | json | escape}},
80
78
  "optionsWithValues": {{product.options_with_values | json | escape}},
@@ -85,7 +83,7 @@
85
83
  "productId": {{product.id | json | escape}},
86
84
  "productUrl": {{product.url | json | escape}},
87
85
  "productHandle": {{product.handle | json | escape}},
88
- "displayState": ${JSON.stringify(g)},
86
+ "displayState": ${JSON.stringify(f)},
89
87
  "totalVariantCombinations": {{total_combinations}},
90
88
  "firstAvailableVariant": {{product.selected_or_first_available_variant | json | escape}}
91
89
  }
@@ -94,12 +92,12 @@
94
92
  ${system.Liquid("{%- assign options = product.options_with_values -%}")}
95
93
  ${system.Liquid("{%- assign variants = product.variants -%}")}
96
94
  ${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
97
- class="${G}"
98
- style="${F}"
95
+ class="${W}"
96
+ style="${k}"
99
97
  >
100
- ${system.If(f,T(),P())}
98
+ ${system.If(_,F(),T())}
101
99
  </div>`)}
102
100
  </gp-product-variants>
103
101
 
104
- ${k()}
102
+ ${M()}
105
103
  `};exports.default=ProductVariants;
@@ -1 +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?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,b=n?.active??n?.normal,u=p?.active??p?.normal;return helpers.filterTruthyObject({...S(!h),...core.getRadiusStyleActiveState(d),...core.getStyleShadow({value:g,state:"active",styleAppliedFor:"box-shadow",isEnableShadow:b},!0),...y,...!h&&!s&&core.makeStyle({c:core.getSingleColorVariable(u)}),...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",...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;
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?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;
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),Row_liquid=require("../../../grid/components/row/Row.liquid.js"),system=require("@gem-sdk/system"),helpers$1=require("../../../helpers.js"),helpers=require("./common/helpers.js");const Product=e=>{let{children:t,setting:r,style:i,builderProps:a,rawChildren:o,advanced:d}=e,{isSyncProduct:s}=r??{},{rowSetting:n,rowStyles:c,formatVariantId:l,formatProductId:p,productStatus:u,preSelectedOptionIds:f,productHandle:g,advancedStyle:m}=helpers.getData(e),_=()=>core.template`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),Row_liquid=require("../../../grid/components/row/Row.liquid.js"),system=require("@gem-sdk/system"),helpers$1=require("../../../helpers.js"),helpers=require("./common/helpers.js");const Product=e=>{let{children:t,setting:i,style:r,builderProps:a,rawChildren:o,advanced:s}=e,{isSyncProduct:d}=i??{},{rowSetting:n,rowStyles:c,formatVariantId:l,formatProductId:p,productStatus:u,preSelectedOptionIds:f,productHandle:m,advancedStyle:g}=helpers.getData(e),_=()=>core.template`
2
2
  {%- liquid
3
3
  if request.page_type == 'product'
4
4
  if '${u}' == '${helpers.STATIC_PRODUCT_STATUS}'
@@ -7,7 +7,7 @@
7
7
  assign product = collections.all.products | sort: 'created_at' | reverse | first
8
8
  endpaginate
9
9
  else
10
- assign product = all_products['${g}']
10
+ assign product = all_products['${m}']
11
11
  assign productId = '${p}' | times: 1
12
12
  if product == empty or product == null
13
13
  paginate collections.all.products by 100000
@@ -26,7 +26,7 @@
26
26
  assign product = collections.all.products | sort: 'created_at'| reverse | first
27
27
  endpaginate
28
28
  else
29
- assign product = all_products['${g}']
29
+ assign product = all_products['${m}']
30
30
  assign productId = '${p}' | times: 1
31
31
  if product == empty or product == null
32
32
  paginate collections.all.products by 100000
@@ -43,7 +43,7 @@
43
43
  `,y=()=>core.template`
44
44
  {%- liquid
45
45
  if request.page_type != 'product'
46
- assign product = all_products['${g}']
46
+ assign product = all_products['${m}']
47
47
  assign productId = '${p}' | times: 1
48
48
  if product == empty or product == null
49
49
  paginate collections.all.products by 100000
@@ -60,6 +60,8 @@
60
60
  {%- assign gpBkProduct = product -%}
61
61
  ${system.If(u==helpers.DYNAMIC_PRODUCT_STATUS,y(),_())}
62
62
  `,$=()=>core.template`
63
+ ${system.Liquid("{%- assign total_combinations = 1 -%}")}
64
+ ${system.LiquidFor("option in product.options_with_values","{%- assign total_combinations = total_combinations | times: option.values.size -%}")}
63
65
  {%- assign initVariantId = ${l} -%}
64
66
  {%- assign product_form_id = 'product-form-' | append: "${a?.uid}" -%}
65
67
  ${l?"{%- assign variant = product.variants | where: 'id', initVariantId | first -%}":"{%- assign variant = product.selected_or_first_available_variant -%}"}
@@ -72,14 +74,14 @@
72
74
  {%- endif -%}
73
75
  `,S=()=>core.template`
74
76
  <div class="gp-text-center">${helpers$1.getStaticLocale("Product","product_not_found")}</div>
75
- `,I=()=>core.template`
77
+ `,h=()=>core.template`
76
78
  ${$()}
77
79
  <gp-product
78
80
  data-uid="${a?.uid}"
79
81
  data-id="${a?.uid}"
80
- style="${m}"
81
- class="${d?.cssClass}"
82
- gp-context='{"productId": {{ product.id }}, "preSelectedOptionIds": [${f}], "isSyncProduct": "${s}", "variantSelected": {{ variant | json | escape }}, "inventory_management": {{ variant.inventory_management | json | escape }}, "inventory_policy": {{ variant.inventory_policy | json | escape }}, "inventoryQuantity": {{ variant.inventory_quantity }}, "quantity": 1, "formId": "{{ product_form_id }}" }'
82
+ style="${g}"
83
+ class="${s?.cssClass}"
84
+ gp-context='{"productId": {{ product.id }}, "preSelectedOptionIds": [${f}], "isSyncProduct": "${d}", "variantSelected": {{ variant | json | escape }}, "inventory_management": {{ variant.inventory_management | json | escape }}, "inventory_policy": {{ variant.inventory_policy | json | escape }}, "inventoryQuantity": {{ variant.inventory_quantity }}, "quantity": 1, "formId": "{{ product_form_id }}" }'
83
85
  gp-data='{"variantSelected": {{ variant | json | escape }}, "quantity": 1, "productUrl":{{ product.url | json | escape }}, "productHandle":{{ product.handle | json | escape }}, "collectionUrl": {{ collection.url | json | escape }}, "collectionHandle": {{ collection.handle | json | escape }}}'
84
86
  >
85
87
  <product-form class="product-form">
@@ -87,13 +89,13 @@
87
89
  <input type="hidden" name="id" value="{{ variant.id }}" />
88
90
  <input type="hidden" name="quantity" value="{{ quantity }}" />
89
91
  <button type="submit" onclick="return false;" style="display:none;"></button>
90
- ${Row_liquid.default({builderProps:{...a,uid:a?.uid,uidInteraction:`${a?.uid}-row`},style:i,styles:c,setting:n,children:t,rawChildren:o})}
92
+ ${Row_liquid.default({builderProps:{...a,uid:a?.uid,uidInteraction:`${a?.uid}-row`},style:r,styles:c,setting:n,children:t,rawChildren:o})}
91
93
  {%- endform -%}
92
94
  </product-form>
93
95
  </gp-product>
94
96
  {%- assign product = gpBkProduct -%}
95
97
  `;return core.template`
96
98
  ${v()}
97
- ${system.LiquidIf("product != empty and product != null",I(),S())}
99
+ ${system.LiquidIf("product != empty and product != null",h(),S())}
98
100
  ${core.RenderIf(core.isLocalEnv,`<script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-product-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="${core.baseAssetURL}/assets-v2/gp-product-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
99
101
  `};exports.default=Product;
@@ -1,4 +1,4 @@
1
- import{template as e}from"@gem-sdk/core";import{Liquid as s,LiquidIf as i}from"@gem-sdk/system";import{OPTION_VALUES_DELIMITER as n}from"./common/const.js";let renderOptionValuesNewFormatSwatches=t=>{let{renderVariantItem:r,variantPresetsLiquid:a}=t;return e`
1
+ import{template as e}from"@gem-sdk/core";import{Liquid as s,LiquidIf as i}from"@gem-sdk/system";import{OPTION_VALUES_DELIMITER as n}from"./common/const.js";let renderOptionValuesNewFormatSwatches=t=>{let{renderVariantItem:o,variantPresetsLiquid:r}=t;return e`
2
2
  ${s("{%- assign optionRendered = false -%}")}
3
3
  ${s("{%- assign swatches = shop.metafields.GEMPAGES.swatchesJSONFormat.value -%}")}
4
4
 
@@ -21,7 +21,7 @@ import{template as e}from"@gem-sdk/core";import{Liquid as s,LiquidIf as i}from"@
21
21
  {%- assign imageUrls = imageUrlsString | split: '${n}' | slice: 0, imageUrlsString.size -%}
22
22
 
23
23
  {% if optionTitle == option.name %}
24
- {%- assign variantPresetString = "${a}" -%}
24
+ {%- assign variantPresetString = "${r}" -%}
25
25
  {%- assign optionName = option.name | replace: "'", "'" | replace: '"', '"' -%}
26
26
  {%- assign items = variantPresetString | split: '($2)' -%}
27
27
  {%- assign type = 'dropdown' -%}
@@ -33,9 +33,9 @@ import{template as e}from"@gem-sdk/core";import{Liquid as s,LiquidIf as i}from"@
33
33
  {% endfor %}
34
34
  {%- assign optionRendered = true -%}
35
35
 
36
- ${r(!0)}
36
+ ${o({showDropdown:!0})}
37
37
  {% endif %}
38
38
  {% endfor %}`)}
39
39
 
40
- ${i("optionRendered == false",r(!1,!0))}
40
+ ${i("optionRendered == false",o({showDropdown:!1,isRenderDefault:!0,typeOfOption:"optionType"}))}
41
41
  `};export{renderOptionValuesNewFormatSwatches};
@@ -1,4 +1,4 @@
1
- import{Liquid as e,LiquidFor as s,LiquidIf as t}from"@gem-sdk/system";import{template as i}from"@gem-sdk/core";let renderOptionValuesOld=a=>{let{renderVariantItem:n,variantPresetsLiquid:r}=a;return i`
1
+ import{Liquid as e,LiquidFor as s,LiquidIf as t}from"@gem-sdk/system";import{template as i}from"@gem-sdk/core";let renderOptionValuesOld=a=>{let{renderVariantItem:n,variantPresetsLiquid:o}=a;return i`
2
2
  ${e("{%- assign optionRendered = false -%}")}
3
3
  ${e("{%- assign swatches = shop.metafields.GEMPAGES.swatches -%}")}
4
4
  ${e("{%- assign swatchesItems = swatches | split: '($1)' -%}")}
@@ -48,7 +48,7 @@ import{Liquid as e,LiquidFor as s,LiquidIf as t}from"@gem-sdk/system";import{tem
48
48
  ${e("{%- assign imageUrls = imageUrlsString | split: '($8)' -%}")}
49
49
 
50
50
  ${t("optionTitle == option.name",`
51
- ${e(`{%- assign variantPresetString = "${r}" -%}`)}
51
+ ${e(`{%- assign variantPresetString = "${o}" -%}`)}
52
52
  ${e('{%- assign optionName = option.name | replace: "\'", "&apos;" | replace: \'"\', "&quot;" -%}')}
53
53
  ${e("{%- assign items = variantPresetString | split:'($2)' -%}")}
54
54
  ${e("{%- assign type = 'dropdown' -%}")}
@@ -58,9 +58,9 @@ import{Liquid as e,LiquidFor as s,LiquidIf as t}from"@gem-sdk/system";import{tem
58
58
  ${t('itemPreset[0] == "base"',e("{%- assign type = itemPreset[1] -%}"))}
59
59
  `)}
60
60
  ${e("{%- assign optionRendered = true -%}")}
61
- ${n(!0)}
61
+ ${n({showDropdown:!0})}
62
62
  `)}
63
63
  `)}
64
64
 
65
- ${t("optionRendered == false",n(!1,!0))}
65
+ ${t("optionRendered == false",n({showDropdown:!1,isRenderDefault:!0,typeOfOption:"optionType"}))}
66
66
  `};export{renderOptionValuesOld};
@@ -1,8 +1,8 @@
1
- import{composeMemo as e,template as t,isLocalEnv as i,baseAssetURL as s,DEVICES as o,getResponsiveValueByScreen as a}from"@gem-sdk/core";import n from"../../../text/components/Text.liquid.js";import r from"./components/variants/index.liquid.js";import p from"./components/dropdown-swatches/Dropdown.liquid.js";import l from"./components/dropdown-group/DropdownGroup.liquid.js";import{getSettingPreloadData as d}from"../../../helpers.js";import{mappingVariantStyles as m}from"./utils/mappingVariantStyles.js";import{createClass as c,createStyle as u,createAttr as v,Liquid as f,LiquidFor as _,LiquidIf as $,If as g}from"@gem-sdk/system";import{getAttrs as h}from"./common/main/getAttr.js";import{getVariantOptionGroupStyle as y,getWrapperStyle as j}from"./common/main/styles.js";import{getVariantOptionGroupClass as w,getWrapDropdownClass as S}from"./common/main/classes.js";import{getTextVariantTitleData as b,getDropdownGroupData as A}from"./common/main/getData.js";import{getWrapVariantOptionClass as P}from"./common/variants/classes.js";import{getStyleOfObject as V}from"../../helpers/function.js";import{getMarginBottomStyle as D}from"./common/variants/styles.js";import{renderOptionValuesNewFormatSwatches as E}from"./OptionVariantsNewFormat.liquid.js";import{renderOptionValuesOld as N}from"./OptionVariantsOldFormat.liquid.js";let DEFAULT_ADVANCED_DISPLAY_SETTING={desktop:!0,tablet:!0,mobile:!0},ProductVariants=O=>{let{builderProps:x,styles:T,setting:q,advanced:G}=O,{align:C,swatchItemWidth:F,dropdownItemWidth:I,swatchSpacing:k,optionTypo:L,marginBottom:z}=T??{},{label:J,optionType:M,showAsSwatches:U,layout:W,hasPreSelected:Y}=q??{},H=G?.d??DEFAULT_ADVANCED_DISPLAY_SETTING,{uid:K}=x??{},Q="groupOption"===M,R=()=>{let e={};return o.forEach(t=>{let i=a(F,t);e[t]="auto"===i}),e},B=()=>{let e={};return o.forEach(t=>{e[t]=I?.[t]==="fill"}),e},X=e(()=>{let e=m(q?.variantPresets,T);return{...q,variantPresets:e}},[q?.variantPresets,T]),Z=e=>{let t={"'":"&apos;",'"':"&quot;"},i=e;for(let s in t)e.indexOf(s)>=0&&(i=i.replaceAll(s,t[s]));return i},ee=()=>q?.variantPresets?.map(e=>`${Z(e.optionName)}($2)${e.optionType}`).join("($1)"),et=()=>q?.variantPresets?.filter(e=>!!e?.hide)?.map(e=>e.optionName).join(","),ei=(e,i)=>t`
2
- ${_("value in values",r({id:"{{option.name | escape}}-{{value | escape}}",variantKey:"{{option.name | escape}}-{{option.position}}-{{ forloop.index }}",showAsSwatches:U,uid:K,name:"{{option.name | escape}}",value:{label:"{{value | escape}}"},checked:Y?"{%- if option.selected_value == value -%}true{% else %}false{%- endif -%}":"false",optionPosition:"rootForloop",typeOfOption:"optionType",activeClass:Y?"{%- if option.selected_value == value -%}option-item-active{%- endif -%}":"",...T,...X,swatchAutoWidth:R(),optionTypo:L,isRenderDefault:i}))}
3
- ${$(e?'type == "dropdown"':"false",p({...T,...X,swatchAutoWidth:B(),optionTypo:L}))}`,es=q?.variantPresets?.map(e=>({name:Z(e.optionName),type:e.optionType})).map(e=>`${e.name}($1)${e.type}`).join("($2)").toString(),eo={renderVariantItem:ei,variantPresetsLiquid:es??""},ea=c(w(C)),en=u(y(k,k)),er=b(O,"Liquid"),ep=c(P(W,C)),el=()=>t`
4
- ${f(`{%- assign presets = "${ee()}" | split: '($1)' -%}`)}
5
- ${f(`{% assign hiddenPresetOptions = "${et()}" | split: ',' %}`)}
1
+ import{template as e,isLocalEnv as t,baseAssetURL as s,DEVICES as i,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 f,LiquidIf as v,If as $,LiquidFor 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 A}from"./common/main/getData.js";import{getWrapVariantOptionClass as P}from"./common/variants/classes.js";import{getStyleOfObject as D}from"../../helpers/function.js";import{getMarginBottomStyle as V}from"./common/variants/styles.js";import{renderOptionValuesNewFormatSwatches as b}from"./OptionVariantsNewFormat.liquid.js";import{renderOptionValuesOld as E}from"./OptionVariantsOldFormat.liquid.js";let DEFAULT_ADVANCED_DISPLAY_SETTING={desktop:!0,tablet:!0,mobile:!0},ProductVariants=N=>{let{builderProps:T,styles:O,setting:x,advanced:q}=N,{align:G,swatchItemWidth:C,dropdownItemWidth:F,swatchSpacing:I,optionTypo:k,marginBottom:L}=O??{},{label:J,optionType:z,showAsSwatches:M,layout:U,hasPreSelected:W}=x??{},R=q?.d??DEFAULT_ADVANCED_DISPLAY_SETTING,{uid:Y}=T??{},H="groupOption"===z,K=()=>{let e={};return i.forEach(t=>{let s=o(C,t);e[t]="auto"===s}),e},Q=()=>{let e={};return i.forEach(t=>{e[t]=F?.[t]==="fill"}),e},B=x?.variantPresets?d(x?.variantPresets,O):[],X=B?.map(e=>({...e,presets:{[e.optionType]:e.presets[e.optionType]}})),Z={...x,variantPresetsOptionType:X},ee=e=>{let t={"'":"&apos;",'"':"&quot;"},s=e;for(let i in t)e.indexOf(i)>=0&&(s=s.replaceAll(i,t[i]));return s},et=()=>x?.variantPresets?.map(e=>`${ee(e.optionName)}($2)${e.optionType}`).join("($1)"),es=()=>x?.variantPresets?.filter(e=>!!e?.hide)?.map(e=>e.optionName).join(","),ei=({showDropdown:t,isRenderDefault:s,typeOfOption:i})=>e`
2
+ ${_("value in values",n({id:"{{option.name | escape}}-{{value | escape}}",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:i,activeClass:W?"{%- if option.selected_value == value -%}option-item-active{%- endif -%}":"",...O,...Z,swatchAutoWidth:K(),optionTypo:k,isRenderDefault:s}))}
3
+ ${v(t?'type == "dropdown"':"false",r({...O,...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:ei,variantPresetsLiquid:eo??""},en=m(j(G)),er=c(h(I,I)),ep=S(N,"Liquid"),el=m(P(U,G)),ed=()=>e`
4
+ ${f(`{%- assign presets = "${et()}" | split: '($1)' -%}`)}
5
+ ${f(`{% assign hiddenPresetOptions = "${es()}" | split: ',' %}`)}
6
6
 
7
7
  ${f(`{% assign all_option_names = options | map: 'name' %}
8
8
  {% assign filtered_options_string = '' %}
@@ -32,20 +32,20 @@ import{composeMemo as e,template as t,isLocalEnv as i,baseAssetURL as s,DEVICES
32
32
  ${_("option in options",`
33
33
  <div
34
34
  option-name="{{option.name | escape}}"
35
- class="${ep} ${$("hiddenPresetOptions contains option.name","gp-hidden")}"
36
- style="${V(D(z))}${f("{% if forloop.last or option.name == last_option_name %}--mb:0;--mb-mobile:0;--mb-tablet:0;{% endif %}")}"
35
+ class="${el} ${v("hiddenPresetOptions contains option.name","gp-hidden")}"
36
+ style="${D(V(L))}${f("{% if forloop.last or option.name == last_option_name %}--mb:0;--mb-mobile:0;--mb-tablet:0;{% endif %}")}"
37
37
  >
38
38
  ${f("{%- assign showVariantClass = 'variant-display' -%}")}
39
39
  ${f("{%- assign optionName = option.name -%}")}
40
40
  ${_("preset in presets",`
41
41
  ${f("{%- assign presetDetail = preset | split: '($2)' -%}")}
42
- ${$("presetDetail[1] == 'dropdown' and presetDetail[0] == optionName",`${f("{%- assign showVariantClass = '' -%}")} ${f("{%- break -%}")}`)}
42
+ ${v("presetDetail[1] == 'dropdown' and presetDetail[0] == optionName",`${f("{%- assign showVariantClass = '' -%}")} ${f("{%- break -%}")}`)}
43
43
  `)}
44
- ${g(J,n(er)," ")}
44
+ ${$(J,a(ep)," ")}
45
45
  <div
46
46
  variant-option-name="{{option.name | escape}}"
47
- class="${ea}"
48
- style="${V(en)}"
47
+ class="${en}"
48
+ style="${D(er)}"
49
49
  >
50
50
  ${f("{%- assign values = option.values -%}")}
51
51
  ${f("{%- assign rootForloop = forloop.index0 -%}")}
@@ -58,24 +58,22 @@ import{composeMemo as e,template as t,isLocalEnv as i,baseAssetURL as s,DEVICES
58
58
  {%- assign selectedValue = variant.option3 -%}
59
59
  {%- endif -%}
60
60
  `)}
61
- ${g(!Y,f("{%- assign selectedValue = null -%}"),"")}
62
- ${g(U,ed(),ei(!1,!0))}
61
+ ${$(!W,f("{%- assign selectedValue = null -%}"),"")}
62
+ ${$(M,em(),ei({showDropdown:!1,isRenderDefault:!0,typeOfOption:"optionType"}))}
63
63
  </div>
64
64
  </div>`)}
65
- `,ed=()=>t`
66
- ${$(" shop.metafields.GEMPAGES.swatches and shop.metafields.GEMPAGES.swatchesJSONFormat != blank",E(eo),N(eo))}
67
- `,em=c(S(C)),ec=A(O),eu=()=>`
68
- <div className="${em}">
69
- ${l(ec)}
65
+ `,em=()=>e`
66
+ ${v("shop.metafields.GEMPAGES.swatches and shop.metafields.GEMPAGES.swatchesJSONFormat != blank",b(ea),E(ea))}
67
+ `,ec=m(w(G)),eu=A(N),ef=()=>`
68
+ <div className="${ec}">
69
+ ${p(eu)}
70
70
  </div>
71
- `,ev=v(h({uid:K,hasPreSelected:Y,cssClass:G?.cssClass})),ef=u(j(O)),e_=c({"gp-flex gp-flex-col !gp-ml-0":!0}),e$=()=>{let e=i?"{{ 'gp-product-variant-v7-5.js' | asset_url }}":`${s}/assets-v2/gp-product-variant-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}`;return`<script ${d('class="gps-link" delay',"src")}="${e}" defer="defer"></script>`};return t`
72
- ${f("{%- assign total_combinations = 1 -%}")}
73
- ${_("option in product.options_with_values","{%- assign total_combinations = total_combinations | times: option.values.size -%}")}
71
+ `,ev=u(g({uid:Y,hasPreSelected:W,cssClass:q?.cssClass})),e$=c(y(N)),e_=m({"gp-flex gp-flex-col !gp-ml-0":!0}),eg=()=>{let e=t?"{{ 'gp-product-variant-v7-5.js' | asset_url }}":`${s}/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`
74
72
  <gp-product-variants
75
73
  ${ev}
76
74
  gp-data='{
77
- "setting":${JSON.stringify(X)?.replaceAll("'","&#039;")},
78
- "styles":${JSON.stringify(T)},
75
+ "setting":${JSON.stringify(Z)?.replaceAll("'","&#039;")},
76
+ "styles":${JSON.stringify(O)},
79
77
  "variants":{{product.variants | json | escape}},
80
78
  "optionsWithValues": {{product.options_with_values | json | escape}},
81
79
  "variantSelected": {{ variant | json | escape }},
@@ -85,7 +83,7 @@ import{composeMemo as e,template as t,isLocalEnv as i,baseAssetURL as s,DEVICES
85
83
  "productId": {{product.id | json | escape}},
86
84
  "productUrl": {{product.url | json | escape}},
87
85
  "productHandle": {{product.handle | json | escape}},
88
- "displayState": ${JSON.stringify(H)},
86
+ "displayState": ${JSON.stringify(R)},
89
87
  "totalVariantCombinations": {{total_combinations}},
90
88
  "firstAvailableVariant": {{product.selected_or_first_available_variant | json | escape}}
91
89
  }
@@ -93,13 +91,13 @@ import{composeMemo as e,template as t,isLocalEnv as i,baseAssetURL as s,DEVICES
93
91
  <div class="gp-hidden" style="--hvr-shadow: none; --hvr-shadow-tablet: none; --hvr-shadow-mobile: none"></div>
94
92
  ${f("{%- assign options = product.options_with_values -%}")}
95
93
  ${f("{%- assign variants = product.variants -%}")}
96
- ${$("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>",t`<div
94
+ ${v("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
97
95
  class="${e_}"
98
- style="${ef}"
96
+ style="${e$}"
99
97
  >
100
- ${g(Q,eu(),el())}
98
+ ${$(H,ef(),ed())}
101
99
  </div>`)}
102
100
  </gp-product-variants>
103
101
 
104
- ${e$()}
102
+ ${eg()}
105
103
  `};export{ProductVariants as default};
@@ -1 +1 @@
1
- import{composeTypographyStyle as e,getRadiusStyleActiveState as t,getStyleShadow as o,makeStyle as r,getSingleColorVariable as l,composeRadius as i,getGlobalColorStateStyle as p,handleConvertBorderStyle as a,handleConvertBorderWidth as n,handleConvertBorderColor as d,makeStyleResponsive as h}from"@gem-sdk/core";import{filterTruthyObject as c}from"../../../../../helpers.js";let 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?o:t;return[e,r]}));return h("minw",r)},getWrapperStyleActive=i=>{let{preset:p,optionTypography:a,optionTypo:n,typeOfOption:d}=i,h=p?.optionBgColor,g=p?.optionTextColor,s=p?.optionBorder,b=p?.optionHasShadow,m=p?.optionShadow,u=p?.optionRounded,w="color"===d,x="image"===d||"image_shopify"===d,y=e(n,a),S=e=>{let t=h?.active??h?.normal,o=s?.active??s?.normal;return r({bg:e&&l(t),bs:o?.border,bw:o?.width,bc:l(o?.color)})},v=m?.active??m?.normal,C=b?.active??b?.normal,f=g?.active??g?.normal;return c({...S(!w),...t(u),...o({value:v,state:"active",styleAppliedFor:"box-shadow",isEnableShadow:C},!0),...y,...!w&&!x&&r({c:l(f)}),...w&&getColorStyleWidth(p),...r({h:p?.height})})},getWrapperStyleNormalAndHover=e=>{let{preset:t,optionTransform:l,optionTypography:h,optionTypo:g,typeOfOption:s}=e,b=t?.optionBgColor,m=t?.optionTextColor,u=t?.optionBorder,w=t?.optionHasShadow,x=t?.optionShadow,y=t?.optionRounded,S="color"===s,v="image"===s||"image_shopify"===s,C=["normal","hover"].reduce((e,t)=>({...e,...o({value:x?.[t],state:t,styleAppliedFor:"box-shadow",isEnableShadow:w?.[t]})}),{});return c({...i(y),...C,...!S&&p("bg",b),...!S&&a(u),...!S&&n(u),...!S&&d(u),...!S&&!v&&r({c:l}),...!S&&!v&&p("c",m),...typoStyleNotIn(g,h,["--c"]),...S&&getColorStyleWidth(t),...r({h:t?.height})})};function typoStyleNotIn(t,o,r){let l=e(t,o);return r&&0!==r.length?Object.fromEntries(Object.entries(l).filter(([e])=>!r.includes(e))):l}let getWrapperTextStyle=e=>{let{preset:o,typeOfOption:r,checked:l}=e,p=o?.optionBorder,h=o?.optionRounded,g="color"===r,s=()=>{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 o?.width?.desktop?.toLowerCase()!=="auto"&&o?.width?.desktop||(t["--pl"]=e,t["--pr"]=e),o?.width?.tablet?.toLowerCase()!=="auto"&&o?.width?.tablet||(t["--pl-tablet"]=e,t["--pr-tablet"]=e),o?.width?.mobile?.toLowerCase()!=="auto"&&o?.width?.mobile||(t["--pl-mobile"]=e,t["--pr-mobile"]=e),(o?.height?.toLowerCase()==="auto"||o?.height)&&(t["--pt"]="8px",t["--pb"]="8px"),t},b={...h,active:{...h?.active||{},radiusType:"custom"}},m=l?t(b):i(h),u=!l&&g?{...a(p),...n(p),...d(p)}:{};return c({...!g&&s(),...g&&m,...u})},getColorStyle=({optionBorder:e,optionRounded:t,isActive:o,color:r})=>{let l=()=>r?r?.startsWith("linear-gradient")?{backgroundImage:r}:{backgroundColor:r}:{},p=t=>t?{"--bs":"none"}:a(e),h=o=>({"--d":"flex","--jc":"center"," --ai":"center","--w":"100%","--h":"100%","--of":"hidden",...p(o),...n(e),...d(e),...i(t),...l()});return h(!!o)},getTextStyle=({optionTypo:t,optionTypography:o})=>{let r=e(t,o);return delete r["--c"],c({...r})};export{getColorStyle,getTextStyle,getWrapperStyleActive,getWrapperStyleNormalAndHover,getWrapperTextStyle};
1
+ import{composeTypographyStyle as e,getRadiusStyleActiveState as t,getStyleShadow as o,makeStyle as r,getSingleColorVariable as l,composeRadius as i,getGlobalColorStateStyle as p,handleConvertBorderStyle as a,handleConvertBorderWidth as n,handleConvertBorderColor as d,makeStyleResponsive as h}from"@gem-sdk/core";import{filterTruthyObject as c}from"../../../../../helpers.js";let 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?o:t;return[e,r]}));return h("minw",r)},getWrapperStyleActive=i=>{let{preset:p,optionTypography:a,optionTypo:n,typeOfOption:d}=i,h=p?.optionBgColor,s=p?.optionTextColor,g=p?.optionBorder,b=p?.optionHasShadow,m=p?.optionShadow,u=p?.optionRounded,w="color"===d,x="image"===d||"image_shopify"===d,y=e(n,a),S=e=>{let t=h?.active??h?.normal,o=g?.active??g?.normal;return r({bg:e&&l(t),bs:o?.border,bw:o?.width,bc:l(o?.color)})},v=m?.active??m?.normal,C=b?.active??b?.normal,f=s?.active??s?.normal;return c({...S(!w),...t(u),...o({value:v,state:"active",styleAppliedFor:"box-shadow",isEnableShadow:C},!0),...y,...!w&&!x&&r({c:l(f)}),...w&&getColorStyleWidth(p),...r({h:p?.height})})},getWrapperStyleNormalAndHover=e=>{let{preset:t,optionTransform:l,optionTypography:h,optionTypo:s,typeOfOption:g}=e,b=t?.optionBgColor,m=t?.optionTextColor,u=t?.optionBorder,w=t?.optionHasShadow,x=t?.optionShadow,y=t?.optionRounded,S="color"===g,v="image"===g||"image_shopify"===g,C=["normal","hover"].reduce((e,t)=>({...e,...o({value:x?.[t],state:t,styleAppliedFor:"box-shadow",isEnableShadow:w?.[t]})}),{});return c({...i(y),...C,...!S&&p("bg",b),...!S&&a(u),...!S&&n(u),...!S&&d(u),...!S&&!v&&r({c:l}),...!S&&!v&&p("c",m),...typoStyleNotIn(s,h,["--c"]),...S&&getColorStyleWidth(t),...r({h:t?.height})})};function typoStyleNotIn(t,o,r){let l=e(t,o);return r&&0!==r.length?Object.fromEntries(Object.entries(l).filter(([e])=>!r.includes(e))):l}let getWrapperTextStyle=e=>{let{preset:o,typeOfOption:r,checked:l}=e,p=o?.optionBorder,h=o?.optionRounded,s="color"===r,g=()=>{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 o?.width?.desktop?.toLowerCase()!=="auto"&&o?.width?.desktop||(t["--pl"]=e,t["--pr"]=e),o?.width?.tablet?.toLowerCase()!=="auto"&&o?.width?.tablet||(t["--pl-tablet"]=e,t["--pr-tablet"]=e),o?.width?.mobile?.toLowerCase()!=="auto"&&o?.width?.mobile||(t["--pl-mobile"]=e,t["--pr-mobile"]=e),(o?.height?.toLowerCase()==="auto"||o?.height)&&(t["--pt"]="8px",t["--pb"]="8px"),t},b={...h,active:{...h?.active||{},radiusType:"custom"}},m=l?t(b):i(h),u=!l&&s?{...a(p),...n(p),...d(p)}:{};return c({...!s&&g(),...s&&m,...u})},getColorStyle=({optionBorder:e,optionRounded:t,isActive:o,color:r})=>{let l=()=>r?r?.startsWith("linear-gradient")?{backgroundImage:r}:{backgroundColor:r}:{},p=t=>t?{"--bs":"none"}:a(e),h=o=>({"--d":"flex","--jc":"center"," --ai":"center","--w":"100%","--h":"100%","--of":"hidden","--hvr-c":"unset",...p(o),...n(e),...d(e),...i(t),...l()});return h(!!o)},getTextStyle=({optionTypo:t,optionTypography:o})=>{let r=e(t,o);return delete r["--c"],c({...r})};export{getColorStyle,getTextStyle,getWrapperStyleActive,getWrapperStyleNormalAndHover,getWrapperTextStyle};
@@ -1,14 +1,14 @@
1
- import{template as t,RenderIf as e,isLocalEnv as i,baseAssetURL as r}from"@gem-sdk/core";import o from"../../../grid/components/row/Row.liquid.js";import{LiquidIf as a,If as d}from"@gem-sdk/system";import{getSettingPreloadData as n,getStaticLocale as s}from"../../../helpers.js";import{getData as c,DYNAMIC_PRODUCT_STATUS as p,STATIC_PRODUCT_STATUS as l,PRODUCT_ID_LATEST as u}from"./common/helpers.js";let Product=f=>{let{children:m,setting:g,style:y,builderProps:v,rawChildren:_,advanced:$}=f,{isSyncProduct:I}=g??{},{rowSetting:S,rowStyles:b,formatVariantId:j,formatProductId:h,productStatus:q,preSelectedOptionIds:V,productHandle:P,advancedStyle:k}=c(f),w=()=>t`
1
+ import{template as t,RenderIf as e,isLocalEnv as i,baseAssetURL as o}from"@gem-sdk/core";import r from"../../../grid/components/row/Row.liquid.js";import{LiquidIf as a,If as n,Liquid as d,LiquidFor as s}from"@gem-sdk/system";import{getSettingPreloadData as c,getStaticLocale as p}from"../../../helpers.js";import{getData as l,DYNAMIC_PRODUCT_STATUS as u,STATIC_PRODUCT_STATUS as f,PRODUCT_ID_LATEST as m}from"./common/helpers.js";let Product=g=>{let{children:_,setting:v,style:y,builderProps:$,rawChildren:b,advanced:I}=g,{isSyncProduct:S}=v??{},{rowSetting:j,rowStyles:h,formatVariantId:q,formatProductId:V,productStatus:P,preSelectedOptionIds:k,productHandle:w,advancedStyle:E}=l(g),x=()=>t`
2
2
  {%- liquid
3
3
  if request.page_type == 'product'
4
- if '${q}' == '${l}'
5
- if '${h}' == '${u}'
4
+ if '${P}' == '${f}'
5
+ if '${V}' == '${m}'
6
6
  paginate collections.all.products by 100000
7
7
  assign product = collections.all.products | sort: 'created_at' | reverse | first
8
8
  endpaginate
9
9
  else
10
- assign product = all_products['${P}']
11
- assign productId = '${h}' | times: 1
10
+ assign product = all_products['${w}']
11
+ assign productId = '${V}' | times: 1
12
12
  if product == empty or product == null
13
13
  paginate collections.all.products by 100000
14
14
  for item in collections.all.products
@@ -21,13 +21,13 @@ import{template as t,RenderIf as e,isLocalEnv as i,baseAssetURL as r}from"@gem-s
21
21
  endif
22
22
  endif
23
23
  else
24
- if '${h}' == '${u}'
24
+ if '${V}' == '${m}'
25
25
  paginate collections.all.products by 100000
26
26
  assign product = collections.all.products | sort: 'created_at'| reverse | first
27
27
  endpaginate
28
28
  else
29
- assign product = all_products['${P}']
30
- assign productId = '${h}' | times: 1
29
+ assign product = all_products['${w}']
30
+ assign productId = '${V}' | times: 1
31
31
  if product == empty or product == null
32
32
  paginate collections.all.products by 100000
33
33
  for item in collections.all.products
@@ -40,11 +40,11 @@ import{template as t,RenderIf as e,isLocalEnv as i,baseAssetURL as r}from"@gem-s
40
40
  endif
41
41
  endif
42
42
  -%}
43
- `,E=()=>t`
43
+ `,A=()=>t`
44
44
  {%- liquid
45
45
  if request.page_type != 'product'
46
- assign product = all_products['${P}']
47
- assign productId = '${h}' | times: 1
46
+ assign product = all_products['${w}']
47
+ assign productId = '${V}' | times: 1
48
48
  if product == empty or product == null
49
49
  paginate collections.all.products by 100000
50
50
  for item in collections.all.products
@@ -56,30 +56,32 @@ import{template as t,RenderIf as e,isLocalEnv as i,baseAssetURL as r}from"@gem-s
56
56
  endif
57
57
  endif
58
58
  -%}
59
- `,x=()=>t`
59
+ `,B=()=>t`
60
60
  {%- assign gpBkProduct = product -%}
61
- ${d(q==p,E(),w())}
62
- `,A=()=>t`
63
- {%- assign initVariantId = ${j} -%}
64
- {%- assign product_form_id = 'product-form-' | append: "${v?.uid}" -%}
65
- ${j?"{%- assign variant = product.variants | where: 'id', initVariantId | first -%}":"{%- assign variant = product.selected_or_first_available_variant -%}"}
66
- ${j?"{%- assign productSelectedVariant = product.variants | where: 'id', initVariantId | first -%}":"{%- assign productSelectedVariant = product.selected_or_first_available_variant -%}"}
61
+ ${n(P==u,A(),x())}
62
+ `,G=()=>t`
63
+ ${d("{%- assign total_combinations = 1 -%}")}
64
+ ${s("option in product.options_with_values","{%- assign total_combinations = total_combinations | times: option.values.size -%}")}
65
+ {%- assign initVariantId = ${q} -%}
66
+ {%- assign product_form_id = 'product-form-' | append: "${$?.uid}" -%}
67
+ ${q?"{%- assign variant = product.variants | where: 'id', initVariantId | first -%}":"{%- assign variant = product.selected_or_first_available_variant -%}"}
68
+ ${q?"{%- assign productSelectedVariant = product.variants | where: 'id', initVariantId | first -%}":"{%- assign productSelectedVariant = product.selected_or_first_available_variant -%}"}
67
69
  {%-if productSelectedVariant == empty or productSelectedVariant == null -%}
68
70
  {%- assign productSelectedVariant = product.selected_or_first_available_variant -%}
69
71
  {%- endif -%}
70
72
  {%-if variant == empty or variant == null -%}
71
73
  {%- assign variant = product.selected_or_first_available_variant -%}
72
74
  {%- endif -%}
73
- `,B=()=>t`
74
- <div class="gp-text-center">${s("Product","product_not_found")}</div>
75
- `,G=()=>t`
76
- ${A()}
75
+ `,H=()=>t`
76
+ <div class="gp-text-center">${p("Product","product_not_found")}</div>
77
+ `,O=()=>t`
78
+ ${G()}
77
79
  <gp-product
78
- data-uid="${v?.uid}"
79
- data-id="${v?.uid}"
80
- style="${k}"
81
- class="${$?.cssClass}"
82
- gp-context='{"productId": {{ product.id }}, "preSelectedOptionIds": [${V}], "isSyncProduct": "${I}", "variantSelected": {{ variant | json | escape }}, "inventory_management": {{ variant.inventory_management | json | escape }}, "inventory_policy": {{ variant.inventory_policy | json | escape }}, "inventoryQuantity": {{ variant.inventory_quantity }}, "quantity": 1, "formId": "{{ product_form_id }}" }'
80
+ data-uid="${$?.uid}"
81
+ data-id="${$?.uid}"
82
+ style="${E}"
83
+ class="${I?.cssClass}"
84
+ gp-context='{"productId": {{ product.id }}, "preSelectedOptionIds": [${k}], "isSyncProduct": "${S}", "variantSelected": {{ variant | json | escape }}, "inventory_management": {{ variant.inventory_management | json | escape }}, "inventory_policy": {{ variant.inventory_policy | json | escape }}, "inventoryQuantity": {{ variant.inventory_quantity }}, "quantity": 1, "formId": "{{ product_form_id }}" }'
83
85
  gp-data='{"variantSelected": {{ variant | json | escape }}, "quantity": 1, "productUrl":{{ product.url | json | escape }}, "productHandle":{{ product.handle | json | escape }}, "collectionUrl": {{ collection.url | json | escape }}, "collectionHandle": {{ collection.handle | json | escape }}}'
84
86
  >
85
87
  <product-form class="product-form">
@@ -87,13 +89,13 @@ import{template as t,RenderIf as e,isLocalEnv as i,baseAssetURL as r}from"@gem-s
87
89
  <input type="hidden" name="id" value="{{ variant.id }}" />
88
90
  <input type="hidden" name="quantity" value="{{ quantity }}" />
89
91
  <button type="submit" onclick="return false;" style="display:none;"></button>
90
- ${o({builderProps:{...v,uid:v?.uid,uidInteraction:`${v?.uid}-row`},style:y,styles:b,setting:S,children:m,rawChildren:_})}
92
+ ${r({builderProps:{...$,uid:$?.uid,uidInteraction:`${$?.uid}-row`},style:y,styles:h,setting:j,children:_,rawChildren:b})}
91
93
  {%- endform -%}
92
94
  </product-form>
93
95
  </gp-product>
94
96
  {%- assign product = gpBkProduct -%}
95
97
  `;return t`
96
- ${x()}
97
- ${a("product != empty and product != null",G(),B())}
98
- ${e(i,`<script ${n('class="gps-link" delay',"src")}="{{ 'gp-product-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${n('class="gps-link" delay',"src")}="${r}/assets-v2/gp-product-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
98
+ ${B()}
99
+ ${a("product != empty and product != null",O(),H())}
100
+ ${e(i,`<script ${c('class="gps-link" delay',"src")}="{{ 'gp-product-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${c('class="gps-link" delay',"src")}="${o}/assets-v2/gp-product-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
99
101
  `};export{Product as default};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/components",
3
- "version": "7.0.1-dev.15",
3
+ "version": "7.0.1-dev.17",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "main": "dist/cjs/index.js",