@bonlineza/luxity-lib 2.16.0 → 2.17.1

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.
Files changed (11) hide show
  1. package/AddInterest.js +12 -10
  2. package/BrandSelector.js +12 -10
  3. package/GraphQLDropdownSelector.js +12 -10
  4. package/Interests.js +12 -10
  5. package/LuxityGraphQLDropdownSelector.js +12 -10
  6. package/MaterialSelector.js +12 -10
  7. package/ModelSelector.js +12 -10
  8. package/RareStepFooter.js +6 -4
  9. package/RareStepHeader.js +75 -21
  10. package/build/bundle.js +76 -20
  11. package/package.json +1 -1
package/AddInterest.js CHANGED
@@ -11,7 +11,7 @@
11
11
  AnimateHeight = AnimateHeight && Object.prototype.hasOwnProperty.call(AnimateHeight, 'default') ? AnimateHeight['default'] : AnimateHeight;
12
12
  numeral = numeral && Object.prototype.hasOwnProperty.call(numeral, 'default') ? numeral['default'] : numeral;
13
13
  stylisRuleSheet = stylisRuleSheet && Object.prototype.hasOwnProperty.call(stylisRuleSheet, 'default') ? stylisRuleSheet['default'] : stylisRuleSheet;
14
- PropTypes = PropTypes && Object.prototype.hasOwnProperty.call(PropTypes, 'default') ? PropTypes['default'] : PropTypes;
14
+ var PropTypes__default = 'default' in PropTypes ? PropTypes['default'] : PropTypes;
15
15
  raf = raf && Object.prototype.hasOwnProperty.call(raf, 'default') ? raf['default'] : raf;
16
16
  AutosizeInput = AutosizeInput && Object.prototype.hasOwnProperty.call(AutosizeInput, 'default') ? AutosizeInput['default'] : AutosizeInput;
17
17
  var Notifications__default = 'default' in Notifications ? Notifications['default'] : Notifications;
@@ -3899,7 +3899,7 @@
3899
3899
  }(React.Component);
3900
3900
 
3901
3901
  _defineProperty$1(MenuPlacer, "contextTypes", {
3902
- getPortalPlacement: PropTypes.func
3902
+ getPortalPlacement: PropTypes__default.func
3903
3903
  });
3904
3904
 
3905
3905
  var Menu = function Menu(props) {
@@ -4105,7 +4105,7 @@
4105
4105
  }(React.Component);
4106
4106
 
4107
4107
  _defineProperty$1(MenuPortal, "childContextTypes", {
4108
- getPortalPlacement: PropTypes.func
4108
+ getPortalPlacement: PropTypes__default.func
4109
4109
  });
4110
4110
 
4111
4111
  var isArray = Array.isArray;
@@ -10166,14 +10166,14 @@
10166
10166
  return props.theme.rareStepPageSizes.container;
10167
10167
  });
10168
10168
  var HeaderContainer = styled__default.div(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n padding: ", " 5%;\n max-width: ", ";\n margin: 0 auto;\n width: 100%;\n }\n"])), function (props) {
10169
- return props.theme.marginPaddings[3];
10169
+ return props.theme.marginPaddings[1];
10170
10170
  }, function (props) {
10171
10171
  return props.theme.rareStepPageSizes.container;
10172
10172
  });
10173
10173
  var LogoFigure = styled__default.div(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
10174
- var LogoImage = styled__default.img(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteral(["\n {\n width: 200px;\n height: 70px;\n cursor: pointer;\n }\n"])));
10174
+ var LogoImage = styled__default.img(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteral(["\n {\n width: 160px;\n height: 60px;\n cursor: pointer;\n }\n"])));
10175
10175
  var CurrencyFlagIcon = styled__default.img(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 15px;\n margin-top: 9px;\n margin-right: 10px;\n }\n"])));
10176
- var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n padding-top: 10px;\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
10176
+ var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n font-style: italic;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
10177
10177
  return props.theme.rareStepColors.secondary;
10178
10178
  }, function (props) {
10179
10179
  return props.theme.rareStepFontWeights.bold;
@@ -10182,8 +10182,8 @@
10182
10182
  }, function (props) {
10183
10183
  return props.theme.rareStepColors.secondary;
10184
10184
  });
10185
- var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n }\n"])));
10186
- var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 30px;\n height: 30px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
10185
+ var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n\n .account-icon {\n &__wrapper {\n position: relative;\n }\n\n &__dropdown {\n position: absolute;\n width: 100%;\n top: 25px;\n left: 0;\n }\n }\n }\n"])));
10186
+ var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 22px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
10187
10187
  return props.theme.marginPaddings[3];
10188
10188
  });
10189
10189
  var NavigationContainer = styled__default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n background-color: ", ";\n padding-top: ", ";\n }\n"])), function (props) {
@@ -10254,7 +10254,7 @@
10254
10254
  var DropdownNavigatorIcon = styled__default.img(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n {\n width: 15px;\n height: 12px;\n margin-left: ", ";\n }\n"])), function (props) {
10255
10255
  return props.theme.marginPaddings[0];
10256
10256
  });
10257
- var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 20px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
10257
+ var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 10px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
10258
10258
  return props.theme.rareStepColors.secondary;
10259
10259
  }, function (props) {
10260
10260
  return props.theme.rareStepColors.secondary;
@@ -10311,7 +10311,7 @@
10311
10311
  return props.theme.rareStepColors.ntrlMin;
10312
10312
  });
10313
10313
  var CloseIconWrapper = styled__default.div(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteral(["\n {\n width: 100%;\n display: flex;\n justify-content: flex-end;\n margin: 30px 0;\n }\n"])));
10314
- var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n }\n"])), function (props) {
10314
+ var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n font-size: ", ";\n }\n"])), function (props) {
10315
10315
  return props.theme.rareStepColors.secondary;
10316
10316
  }, function (props) {
10317
10317
  return props.theme.rareStepColors.secondary;
@@ -10323,6 +10323,8 @@
10323
10323
  return props.theme.marginPaddings[1];
10324
10324
  }, function (props) {
10325
10325
  return props.theme.marginPaddings[1];
10326
+ }, function (props) {
10327
+ return props.theme.rareStepFontSize.h5;
10326
10328
  });
10327
10329
  var SubMenuLinkContainer = styled__default.div(_templateObject12$1 || (_templateObject12$1 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n"])));
10328
10330
  var SubMenuRightIcon = styled__default.img(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n }\n"])));
package/BrandSelector.js CHANGED
@@ -11,7 +11,7 @@
11
11
  AnimateHeight = AnimateHeight && Object.prototype.hasOwnProperty.call(AnimateHeight, 'default') ? AnimateHeight['default'] : AnimateHeight;
12
12
  numeral = numeral && Object.prototype.hasOwnProperty.call(numeral, 'default') ? numeral['default'] : numeral;
13
13
  stylisRuleSheet = stylisRuleSheet && Object.prototype.hasOwnProperty.call(stylisRuleSheet, 'default') ? stylisRuleSheet['default'] : stylisRuleSheet;
14
- PropTypes = PropTypes && Object.prototype.hasOwnProperty.call(PropTypes, 'default') ? PropTypes['default'] : PropTypes;
14
+ var PropTypes__default = 'default' in PropTypes ? PropTypes['default'] : PropTypes;
15
15
  raf = raf && Object.prototype.hasOwnProperty.call(raf, 'default') ? raf['default'] : raf;
16
16
  AutosizeInput = AutosizeInput && Object.prototype.hasOwnProperty.call(AutosizeInput, 'default') ? AutosizeInput['default'] : AutosizeInput;
17
17
  var Notifications__default = 'default' in Notifications ? Notifications['default'] : Notifications;
@@ -3664,7 +3664,7 @@
3664
3664
  }(React.Component);
3665
3665
 
3666
3666
  _defineProperty$1(MenuPlacer, "contextTypes", {
3667
- getPortalPlacement: PropTypes.func
3667
+ getPortalPlacement: PropTypes__default.func
3668
3668
  });
3669
3669
 
3670
3670
  var Menu = function Menu(props) {
@@ -3870,7 +3870,7 @@
3870
3870
  }(React.Component);
3871
3871
 
3872
3872
  _defineProperty$1(MenuPortal, "childContextTypes", {
3873
- getPortalPlacement: PropTypes.func
3873
+ getPortalPlacement: PropTypes__default.func
3874
3874
  });
3875
3875
 
3876
3876
  var isArray = Array.isArray;
@@ -11350,14 +11350,14 @@
11350
11350
  return props.theme.rareStepPageSizes.container;
11351
11351
  });
11352
11352
  var HeaderContainer = styled__default.div(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n padding: ", " 5%;\n max-width: ", ";\n margin: 0 auto;\n width: 100%;\n }\n"])), function (props) {
11353
- return props.theme.marginPaddings[3];
11353
+ return props.theme.marginPaddings[1];
11354
11354
  }, function (props) {
11355
11355
  return props.theme.rareStepPageSizes.container;
11356
11356
  });
11357
11357
  var LogoFigure = styled__default.div(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
11358
- var LogoImage = styled__default.img(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteral(["\n {\n width: 200px;\n height: 70px;\n cursor: pointer;\n }\n"])));
11358
+ var LogoImage = styled__default.img(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteral(["\n {\n width: 160px;\n height: 60px;\n cursor: pointer;\n }\n"])));
11359
11359
  var CurrencyFlagIcon = styled__default.img(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 15px;\n margin-top: 9px;\n margin-right: 10px;\n }\n"])));
11360
- var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n padding-top: 10px;\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
11360
+ var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n font-style: italic;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
11361
11361
  return props.theme.rareStepColors.secondary;
11362
11362
  }, function (props) {
11363
11363
  return props.theme.rareStepFontWeights.bold;
@@ -11366,8 +11366,8 @@
11366
11366
  }, function (props) {
11367
11367
  return props.theme.rareStepColors.secondary;
11368
11368
  });
11369
- var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n }\n"])));
11370
- var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 30px;\n height: 30px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
11369
+ var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n\n .account-icon {\n &__wrapper {\n position: relative;\n }\n\n &__dropdown {\n position: absolute;\n width: 100%;\n top: 25px;\n left: 0;\n }\n }\n }\n"])));
11370
+ var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 22px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
11371
11371
  return props.theme.marginPaddings[3];
11372
11372
  });
11373
11373
  var NavigationContainer = styled__default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n background-color: ", ";\n padding-top: ", ";\n }\n"])), function (props) {
@@ -11438,7 +11438,7 @@
11438
11438
  var DropdownNavigatorIcon = styled__default.img(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n {\n width: 15px;\n height: 12px;\n margin-left: ", ";\n }\n"])), function (props) {
11439
11439
  return props.theme.marginPaddings[0];
11440
11440
  });
11441
- var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 20px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
11441
+ var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 10px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
11442
11442
  return props.theme.rareStepColors.secondary;
11443
11443
  }, function (props) {
11444
11444
  return props.theme.rareStepColors.secondary;
@@ -11495,7 +11495,7 @@
11495
11495
  return props.theme.rareStepColors.ntrlMin;
11496
11496
  });
11497
11497
  var CloseIconWrapper = styled__default.div(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteral(["\n {\n width: 100%;\n display: flex;\n justify-content: flex-end;\n margin: 30px 0;\n }\n"])));
11498
- var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n }\n"])), function (props) {
11498
+ var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n font-size: ", ";\n }\n"])), function (props) {
11499
11499
  return props.theme.rareStepColors.secondary;
11500
11500
  }, function (props) {
11501
11501
  return props.theme.rareStepColors.secondary;
@@ -11507,6 +11507,8 @@
11507
11507
  return props.theme.marginPaddings[1];
11508
11508
  }, function (props) {
11509
11509
  return props.theme.marginPaddings[1];
11510
+ }, function (props) {
11511
+ return props.theme.rareStepFontSize.h5;
11510
11512
  });
11511
11513
  var SubMenuLinkContainer = styled__default.div(_templateObject12$1 || (_templateObject12$1 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n"])));
11512
11514
  var SubMenuRightIcon = styled__default.img(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n }\n"])));
package/GraphQLDropdownSelector.js CHANGED
@@ -11,7 +11,7 @@
11
11
  AnimateHeight = AnimateHeight && Object.prototype.hasOwnProperty.call(AnimateHeight, 'default') ? AnimateHeight['default'] : AnimateHeight;
12
12
  numeral = numeral && Object.prototype.hasOwnProperty.call(numeral, 'default') ? numeral['default'] : numeral;
13
13
  stylisRuleSheet = stylisRuleSheet && Object.prototype.hasOwnProperty.call(stylisRuleSheet, 'default') ? stylisRuleSheet['default'] : stylisRuleSheet;
14
- PropTypes = PropTypes && Object.prototype.hasOwnProperty.call(PropTypes, 'default') ? PropTypes['default'] : PropTypes;
14
+ var PropTypes__default = 'default' in PropTypes ? PropTypes['default'] : PropTypes;
15
15
  raf = raf && Object.prototype.hasOwnProperty.call(raf, 'default') ? raf['default'] : raf;
16
16
  AutosizeInput = AutosizeInput && Object.prototype.hasOwnProperty.call(AutosizeInput, 'default') ? AutosizeInput['default'] : AutosizeInput;
17
17
  var Notifications__default = 'default' in Notifications ? Notifications['default'] : Notifications;
@@ -3664,7 +3664,7 @@
3664
3664
  }(React.Component);
3665
3665
 
3666
3666
  _defineProperty$1(MenuPlacer, "contextTypes", {
3667
- getPortalPlacement: PropTypes.func
3667
+ getPortalPlacement: PropTypes__default.func
3668
3668
  });
3669
3669
 
3670
3670
  var Menu = function Menu(props) {
@@ -3870,7 +3870,7 @@
3870
3870
  }(React.Component);
3871
3871
 
3872
3872
  _defineProperty$1(MenuPortal, "childContextTypes", {
3873
- getPortalPlacement: PropTypes.func
3873
+ getPortalPlacement: PropTypes__default.func
3874
3874
  });
3875
3875
 
3876
3876
  var isArray = Array.isArray;
@@ -11485,14 +11485,14 @@
11485
11485
  return props.theme.rareStepPageSizes.container;
11486
11486
  });
11487
11487
  var HeaderContainer = styled__default.div(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n padding: ", " 5%;\n max-width: ", ";\n margin: 0 auto;\n width: 100%;\n }\n"])), function (props) {
11488
- return props.theme.marginPaddings[3];
11488
+ return props.theme.marginPaddings[1];
11489
11489
  }, function (props) {
11490
11490
  return props.theme.rareStepPageSizes.container;
11491
11491
  });
11492
11492
  var LogoFigure = styled__default.div(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
11493
- var LogoImage = styled__default.img(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteral(["\n {\n width: 200px;\n height: 70px;\n cursor: pointer;\n }\n"])));
11493
+ var LogoImage = styled__default.img(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteral(["\n {\n width: 160px;\n height: 60px;\n cursor: pointer;\n }\n"])));
11494
11494
  var CurrencyFlagIcon = styled__default.img(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 15px;\n margin-top: 9px;\n margin-right: 10px;\n }\n"])));
11495
- var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n padding-top: 10px;\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
11495
+ var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n font-style: italic;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
11496
11496
  return props.theme.rareStepColors.secondary;
11497
11497
  }, function (props) {
11498
11498
  return props.theme.rareStepFontWeights.bold;
@@ -11501,8 +11501,8 @@
11501
11501
  }, function (props) {
11502
11502
  return props.theme.rareStepColors.secondary;
11503
11503
  });
11504
- var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n }\n"])));
11505
- var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 30px;\n height: 30px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
11504
+ var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n\n .account-icon {\n &__wrapper {\n position: relative;\n }\n\n &__dropdown {\n position: absolute;\n width: 100%;\n top: 25px;\n left: 0;\n }\n }\n }\n"])));
11505
+ var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 22px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
11506
11506
  return props.theme.marginPaddings[3];
11507
11507
  });
11508
11508
  var NavigationContainer = styled__default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n background-color: ", ";\n padding-top: ", ";\n }\n"])), function (props) {
@@ -11573,7 +11573,7 @@
11573
11573
  var DropdownNavigatorIcon = styled__default.img(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n {\n width: 15px;\n height: 12px;\n margin-left: ", ";\n }\n"])), function (props) {
11574
11574
  return props.theme.marginPaddings[0];
11575
11575
  });
11576
- var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 20px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
11576
+ var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 10px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
11577
11577
  return props.theme.rareStepColors.secondary;
11578
11578
  }, function (props) {
11579
11579
  return props.theme.rareStepColors.secondary;
@@ -11630,7 +11630,7 @@
11630
11630
  return props.theme.rareStepColors.ntrlMin;
11631
11631
  });
11632
11632
  var CloseIconWrapper = styled__default.div(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteral(["\n {\n width: 100%;\n display: flex;\n justify-content: flex-end;\n margin: 30px 0;\n }\n"])));
11633
- var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n }\n"])), function (props) {
11633
+ var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n font-size: ", ";\n }\n"])), function (props) {
11634
11634
  return props.theme.rareStepColors.secondary;
11635
11635
  }, function (props) {
11636
11636
  return props.theme.rareStepColors.secondary;
@@ -11642,6 +11642,8 @@
11642
11642
  return props.theme.marginPaddings[1];
11643
11643
  }, function (props) {
11644
11644
  return props.theme.marginPaddings[1];
11645
+ }, function (props) {
11646
+ return props.theme.rareStepFontSize.h5;
11645
11647
  });
11646
11648
  var SubMenuLinkContainer = styled__default.div(_templateObject12$1 || (_templateObject12$1 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n"])));
11647
11649
  var SubMenuRightIcon = styled__default.img(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n }\n"])));
package/Interests.js CHANGED
@@ -10,7 +10,7 @@
10
10
  EllipsisLoader = EllipsisLoader && Object.prototype.hasOwnProperty.call(EllipsisLoader, 'default') ? EllipsisLoader['default'] : EllipsisLoader;
11
11
  PageReady = PageReady && Object.prototype.hasOwnProperty.call(PageReady, 'default') ? PageReady['default'] : PageReady;
12
12
  stylisRuleSheet = stylisRuleSheet && Object.prototype.hasOwnProperty.call(stylisRuleSheet, 'default') ? stylisRuleSheet['default'] : stylisRuleSheet;
13
- PropTypes = PropTypes && Object.prototype.hasOwnProperty.call(PropTypes, 'default') ? PropTypes['default'] : PropTypes;
13
+ var PropTypes__default = 'default' in PropTypes ? PropTypes['default'] : PropTypes;
14
14
  raf = raf && Object.prototype.hasOwnProperty.call(raf, 'default') ? raf['default'] : raf;
15
15
  AutosizeInput = AutosizeInput && Object.prototype.hasOwnProperty.call(AutosizeInput, 'default') ? AutosizeInput['default'] : AutosizeInput;
16
16
  AnimateHeight = AnimateHeight && Object.prototype.hasOwnProperty.call(AnimateHeight, 'default') ? AnimateHeight['default'] : AnimateHeight;
@@ -2526,7 +2526,7 @@
2526
2526
  }(React.Component);
2527
2527
 
2528
2528
  _defineProperty$1(MenuPlacer, "contextTypes", {
2529
- getPortalPlacement: PropTypes.func
2529
+ getPortalPlacement: PropTypes__default.func
2530
2530
  });
2531
2531
 
2532
2532
  var Menu = function Menu(props) {
@@ -2732,7 +2732,7 @@
2732
2732
  }(React.Component);
2733
2733
 
2734
2734
  _defineProperty$1(MenuPortal, "childContextTypes", {
2735
- getPortalPlacement: PropTypes.func
2735
+ getPortalPlacement: PropTypes__default.func
2736
2736
  });
2737
2737
 
2738
2738
  var isArray = Array.isArray;
@@ -9969,14 +9969,14 @@
9969
9969
  return props.theme.rareStepPageSizes.container;
9970
9970
  });
9971
9971
  var HeaderContainer = styled__default.div(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n padding: ", " 5%;\n max-width: ", ";\n margin: 0 auto;\n width: 100%;\n }\n"])), function (props) {
9972
- return props.theme.marginPaddings[3];
9972
+ return props.theme.marginPaddings[1];
9973
9973
  }, function (props) {
9974
9974
  return props.theme.rareStepPageSizes.container;
9975
9975
  });
9976
9976
  var LogoFigure = styled__default.div(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
9977
- var LogoImage = styled__default.img(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteral(["\n {\n width: 200px;\n height: 70px;\n cursor: pointer;\n }\n"])));
9977
+ var LogoImage = styled__default.img(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteral(["\n {\n width: 160px;\n height: 60px;\n cursor: pointer;\n }\n"])));
9978
9978
  var CurrencyFlagIcon = styled__default.img(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 15px;\n margin-top: 9px;\n margin-right: 10px;\n }\n"])));
9979
- var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n padding-top: 10px;\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
9979
+ var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n font-style: italic;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
9980
9980
  return props.theme.rareStepColors.secondary;
9981
9981
  }, function (props) {
9982
9982
  return props.theme.rareStepFontWeights.bold;
@@ -9985,8 +9985,8 @@
9985
9985
  }, function (props) {
9986
9986
  return props.theme.rareStepColors.secondary;
9987
9987
  });
9988
- var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n }\n"])));
9989
- var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 30px;\n height: 30px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
9988
+ var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n\n .account-icon {\n &__wrapper {\n position: relative;\n }\n\n &__dropdown {\n position: absolute;\n width: 100%;\n top: 25px;\n left: 0;\n }\n }\n }\n"])));
9989
+ var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 22px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
9990
9990
  return props.theme.marginPaddings[3];
9991
9991
  });
9992
9992
  var NavigationContainer = styled__default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n background-color: ", ";\n padding-top: ", ";\n }\n"])), function (props) {
@@ -10057,7 +10057,7 @@
10057
10057
  var DropdownNavigatorIcon = styled__default.img(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n {\n width: 15px;\n height: 12px;\n margin-left: ", ";\n }\n"])), function (props) {
10058
10058
  return props.theme.marginPaddings[0];
10059
10059
  });
10060
- var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 20px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
10060
+ var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 10px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
10061
10061
  return props.theme.rareStepColors.secondary;
10062
10062
  }, function (props) {
10063
10063
  return props.theme.rareStepColors.secondary;
@@ -10114,7 +10114,7 @@
10114
10114
  return props.theme.rareStepColors.ntrlMin;
10115
10115
  });
10116
10116
  var CloseIconWrapper = styled__default.div(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteral(["\n {\n width: 100%;\n display: flex;\n justify-content: flex-end;\n margin: 30px 0;\n }\n"])));
10117
- var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n }\n"])), function (props) {
10117
+ var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n font-size: ", ";\n }\n"])), function (props) {
10118
10118
  return props.theme.rareStepColors.secondary;
10119
10119
  }, function (props) {
10120
10120
  return props.theme.rareStepColors.secondary;
@@ -10126,6 +10126,8 @@
10126
10126
  return props.theme.marginPaddings[1];
10127
10127
  }, function (props) {
10128
10128
  return props.theme.marginPaddings[1];
10129
+ }, function (props) {
10130
+ return props.theme.rareStepFontSize.h5;
10129
10131
  });
10130
10132
  var SubMenuLinkContainer = styled__default.div(_templateObject12$1 || (_templateObject12$1 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n"])));
10131
10133
  var SubMenuRightIcon = styled__default.img(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n }\n"])));
package/LuxityGraphQLDropdownSelector.js CHANGED
@@ -11,7 +11,7 @@
11
11
  AnimateHeight = AnimateHeight && Object.prototype.hasOwnProperty.call(AnimateHeight, 'default') ? AnimateHeight['default'] : AnimateHeight;
12
12
  numeral = numeral && Object.prototype.hasOwnProperty.call(numeral, 'default') ? numeral['default'] : numeral;
13
13
  stylisRuleSheet = stylisRuleSheet && Object.prototype.hasOwnProperty.call(stylisRuleSheet, 'default') ? stylisRuleSheet['default'] : stylisRuleSheet;
14
- PropTypes = PropTypes && Object.prototype.hasOwnProperty.call(PropTypes, 'default') ? PropTypes['default'] : PropTypes;
14
+ var PropTypes__default = 'default' in PropTypes ? PropTypes['default'] : PropTypes;
15
15
  raf = raf && Object.prototype.hasOwnProperty.call(raf, 'default') ? raf['default'] : raf;
16
16
  AutosizeInput = AutosizeInput && Object.prototype.hasOwnProperty.call(AutosizeInput, 'default') ? AutosizeInput['default'] : AutosizeInput;
17
17
  var Notifications__default = 'default' in Notifications ? Notifications['default'] : Notifications;
@@ -3664,7 +3664,7 @@
3664
3664
  }(React.Component);
3665
3665
 
3666
3666
  _defineProperty$1(MenuPlacer, "contextTypes", {
3667
- getPortalPlacement: PropTypes.func
3667
+ getPortalPlacement: PropTypes__default.func
3668
3668
  });
3669
3669
 
3670
3670
  var Menu = function Menu(props) {
@@ -3870,7 +3870,7 @@
3870
3870
  }(React.Component);
3871
3871
 
3872
3872
  _defineProperty$1(MenuPortal, "childContextTypes", {
3873
- getPortalPlacement: PropTypes.func
3873
+ getPortalPlacement: PropTypes__default.func
3874
3874
  });
3875
3875
 
3876
3876
  var isArray = Array.isArray;
@@ -11386,14 +11386,14 @@
11386
11386
  return props.theme.rareStepPageSizes.container;
11387
11387
  });
11388
11388
  var HeaderContainer = styled__default.div(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n padding: ", " 5%;\n max-width: ", ";\n margin: 0 auto;\n width: 100%;\n }\n"])), function (props) {
11389
- return props.theme.marginPaddings[3];
11389
+ return props.theme.marginPaddings[1];
11390
11390
  }, function (props) {
11391
11391
  return props.theme.rareStepPageSizes.container;
11392
11392
  });
11393
11393
  var LogoFigure = styled__default.div(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
11394
- var LogoImage = styled__default.img(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteral(["\n {\n width: 200px;\n height: 70px;\n cursor: pointer;\n }\n"])));
11394
+ var LogoImage = styled__default.img(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteral(["\n {\n width: 160px;\n height: 60px;\n cursor: pointer;\n }\n"])));
11395
11395
  var CurrencyFlagIcon = styled__default.img(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 15px;\n margin-top: 9px;\n margin-right: 10px;\n }\n"])));
11396
- var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n padding-top: 10px;\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
11396
+ var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n font-style: italic;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
11397
11397
  return props.theme.rareStepColors.secondary;
11398
11398
  }, function (props) {
11399
11399
  return props.theme.rareStepFontWeights.bold;
@@ -11402,8 +11402,8 @@
11402
11402
  }, function (props) {
11403
11403
  return props.theme.rareStepColors.secondary;
11404
11404
  });
11405
- var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n }\n"])));
11406
- var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 30px;\n height: 30px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
11405
+ var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n\n .account-icon {\n &__wrapper {\n position: relative;\n }\n\n &__dropdown {\n position: absolute;\n width: 100%;\n top: 25px;\n left: 0;\n }\n }\n }\n"])));
11406
+ var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 22px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
11407
11407
  return props.theme.marginPaddings[3];
11408
11408
  });
11409
11409
  var NavigationContainer = styled__default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n background-color: ", ";\n padding-top: ", ";\n }\n"])), function (props) {
@@ -11474,7 +11474,7 @@
11474
11474
  var DropdownNavigatorIcon = styled__default.img(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n {\n width: 15px;\n height: 12px;\n margin-left: ", ";\n }\n"])), function (props) {
11475
11475
  return props.theme.marginPaddings[0];
11476
11476
  });
11477
- var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 20px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
11477
+ var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 10px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
11478
11478
  return props.theme.rareStepColors.secondary;
11479
11479
  }, function (props) {
11480
11480
  return props.theme.rareStepColors.secondary;
@@ -11531,7 +11531,7 @@
11531
11531
  return props.theme.rareStepColors.ntrlMin;
11532
11532
  });
11533
11533
  var CloseIconWrapper = styled__default.div(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteral(["\n {\n width: 100%;\n display: flex;\n justify-content: flex-end;\n margin: 30px 0;\n }\n"])));
11534
- var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n }\n"])), function (props) {
11534
+ var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n font-size: ", ";\n }\n"])), function (props) {
11535
11535
  return props.theme.rareStepColors.secondary;
11536
11536
  }, function (props) {
11537
11537
  return props.theme.rareStepColors.secondary;
@@ -11543,6 +11543,8 @@
11543
11543
  return props.theme.marginPaddings[1];
11544
11544
  }, function (props) {
11545
11545
  return props.theme.marginPaddings[1];
11546
+ }, function (props) {
11547
+ return props.theme.rareStepFontSize.h5;
11546
11548
  });
11547
11549
  var SubMenuLinkContainer = styled__default.div(_templateObject12$1 || (_templateObject12$1 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n"])));
11548
11550
  var SubMenuRightIcon = styled__default.img(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n }\n"])));
package/MaterialSelector.js CHANGED
@@ -11,7 +11,7 @@
11
11
  AnimateHeight = AnimateHeight && Object.prototype.hasOwnProperty.call(AnimateHeight, 'default') ? AnimateHeight['default'] : AnimateHeight;
12
12
  numeral = numeral && Object.prototype.hasOwnProperty.call(numeral, 'default') ? numeral['default'] : numeral;
13
13
  stylisRuleSheet = stylisRuleSheet && Object.prototype.hasOwnProperty.call(stylisRuleSheet, 'default') ? stylisRuleSheet['default'] : stylisRuleSheet;
14
- PropTypes = PropTypes && Object.prototype.hasOwnProperty.call(PropTypes, 'default') ? PropTypes['default'] : PropTypes;
14
+ var PropTypes__default = 'default' in PropTypes ? PropTypes['default'] : PropTypes;
15
15
  raf = raf && Object.prototype.hasOwnProperty.call(raf, 'default') ? raf['default'] : raf;
16
16
  AutosizeInput = AutosizeInput && Object.prototype.hasOwnProperty.call(AutosizeInput, 'default') ? AutosizeInput['default'] : AutosizeInput;
17
17
  var Notifications__default = 'default' in Notifications ? Notifications['default'] : Notifications;
@@ -3664,7 +3664,7 @@
3664
3664
  }(React.Component);
3665
3665
 
3666
3666
  _defineProperty$1(MenuPlacer, "contextTypes", {
3667
- getPortalPlacement: PropTypes.func
3667
+ getPortalPlacement: PropTypes__default.func
3668
3668
  });
3669
3669
 
3670
3670
  var Menu = function Menu(props) {
@@ -3870,7 +3870,7 @@
3870
3870
  }(React.Component);
3871
3871
 
3872
3872
  _defineProperty$1(MenuPortal, "childContextTypes", {
3873
- getPortalPlacement: PropTypes.func
3873
+ getPortalPlacement: PropTypes__default.func
3874
3874
  });
3875
3875
 
3876
3876
  var isArray = Array.isArray;
@@ -11351,14 +11351,14 @@
11351
11351
  return props.theme.rareStepPageSizes.container;
11352
11352
  });
11353
11353
  var HeaderContainer = styled__default.div(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n padding: ", " 5%;\n max-width: ", ";\n margin: 0 auto;\n width: 100%;\n }\n"])), function (props) {
11354
- return props.theme.marginPaddings[3];
11354
+ return props.theme.marginPaddings[1];
11355
11355
  }, function (props) {
11356
11356
  return props.theme.rareStepPageSizes.container;
11357
11357
  });
11358
11358
  var LogoFigure = styled__default.div(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
11359
- var LogoImage = styled__default.img(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteral(["\n {\n width: 200px;\n height: 70px;\n cursor: pointer;\n }\n"])));
11359
+ var LogoImage = styled__default.img(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteral(["\n {\n width: 160px;\n height: 60px;\n cursor: pointer;\n }\n"])));
11360
11360
  var CurrencyFlagIcon = styled__default.img(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 15px;\n margin-top: 9px;\n margin-right: 10px;\n }\n"])));
11361
- var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n padding-top: 10px;\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
11361
+ var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n font-style: italic;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
11362
11362
  return props.theme.rareStepColors.secondary;
11363
11363
  }, function (props) {
11364
11364
  return props.theme.rareStepFontWeights.bold;
@@ -11367,8 +11367,8 @@
11367
11367
  }, function (props) {
11368
11368
  return props.theme.rareStepColors.secondary;
11369
11369
  });
11370
- var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n }\n"])));
11371
- var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 30px;\n height: 30px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
11370
+ var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n\n .account-icon {\n &__wrapper {\n position: relative;\n }\n\n &__dropdown {\n position: absolute;\n width: 100%;\n top: 25px;\n left: 0;\n }\n }\n }\n"])));
11371
+ var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 22px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
11372
11372
  return props.theme.marginPaddings[3];
11373
11373
  });
11374
11374
  var NavigationContainer = styled__default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n background-color: ", ";\n padding-top: ", ";\n }\n"])), function (props) {
@@ -11439,7 +11439,7 @@
11439
11439
  var DropdownNavigatorIcon = styled__default.img(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n {\n width: 15px;\n height: 12px;\n margin-left: ", ";\n }\n"])), function (props) {
11440
11440
  return props.theme.marginPaddings[0];
11441
11441
  });
11442
- var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 20px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
11442
+ var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 10px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
11443
11443
  return props.theme.rareStepColors.secondary;
11444
11444
  }, function (props) {
11445
11445
  return props.theme.rareStepColors.secondary;
@@ -11496,7 +11496,7 @@
11496
11496
  return props.theme.rareStepColors.ntrlMin;
11497
11497
  });
11498
11498
  var CloseIconWrapper = styled__default.div(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteral(["\n {\n width: 100%;\n display: flex;\n justify-content: flex-end;\n margin: 30px 0;\n }\n"])));
11499
- var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n }\n"])), function (props) {
11499
+ var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n font-size: ", ";\n }\n"])), function (props) {
11500
11500
  return props.theme.rareStepColors.secondary;
11501
11501
  }, function (props) {
11502
11502
  return props.theme.rareStepColors.secondary;
@@ -11508,6 +11508,8 @@
11508
11508
  return props.theme.marginPaddings[1];
11509
11509
  }, function (props) {
11510
11510
  return props.theme.marginPaddings[1];
11511
+ }, function (props) {
11512
+ return props.theme.rareStepFontSize.h5;
11511
11513
  });
11512
11514
  var SubMenuLinkContainer = styled__default.div(_templateObject12$1 || (_templateObject12$1 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n"])));
11513
11515
  var SubMenuRightIcon = styled__default.img(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n }\n"])));
package/ModelSelector.js CHANGED
@@ -11,7 +11,7 @@
11
11
  AnimateHeight = AnimateHeight && Object.prototype.hasOwnProperty.call(AnimateHeight, 'default') ? AnimateHeight['default'] : AnimateHeight;
12
12
  numeral = numeral && Object.prototype.hasOwnProperty.call(numeral, 'default') ? numeral['default'] : numeral;
13
13
  stylisRuleSheet = stylisRuleSheet && Object.prototype.hasOwnProperty.call(stylisRuleSheet, 'default') ? stylisRuleSheet['default'] : stylisRuleSheet;
14
- PropTypes = PropTypes && Object.prototype.hasOwnProperty.call(PropTypes, 'default') ? PropTypes['default'] : PropTypes;
14
+ var PropTypes__default = 'default' in PropTypes ? PropTypes['default'] : PropTypes;
15
15
  raf = raf && Object.prototype.hasOwnProperty.call(raf, 'default') ? raf['default'] : raf;
16
16
  AutosizeInput = AutosizeInput && Object.prototype.hasOwnProperty.call(AutosizeInput, 'default') ? AutosizeInput['default'] : AutosizeInput;
17
17
  var Notifications__default = 'default' in Notifications ? Notifications['default'] : Notifications;
@@ -3664,7 +3664,7 @@
3664
3664
  }(React.Component);
3665
3665
 
3666
3666
  _defineProperty$1(MenuPlacer, "contextTypes", {
3667
- getPortalPlacement: PropTypes.func
3667
+ getPortalPlacement: PropTypes__default.func
3668
3668
  });
3669
3669
 
3670
3670
  var Menu = function Menu(props) {
@@ -3870,7 +3870,7 @@
3870
3870
  }(React.Component);
3871
3871
 
3872
3872
  _defineProperty$1(MenuPortal, "childContextTypes", {
3873
- getPortalPlacement: PropTypes.func
3873
+ getPortalPlacement: PropTypes__default.func
3874
3874
  });
3875
3875
 
3876
3876
  var isArray = Array.isArray;
@@ -11351,14 +11351,14 @@
11351
11351
  return props.theme.rareStepPageSizes.container;
11352
11352
  });
11353
11353
  var HeaderContainer = styled__default.div(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n padding: ", " 5%;\n max-width: ", ";\n margin: 0 auto;\n width: 100%;\n }\n"])), function (props) {
11354
- return props.theme.marginPaddings[3];
11354
+ return props.theme.marginPaddings[1];
11355
11355
  }, function (props) {
11356
11356
  return props.theme.rareStepPageSizes.container;
11357
11357
  });
11358
11358
  var LogoFigure = styled__default.div(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
11359
- var LogoImage = styled__default.img(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteral(["\n {\n width: 200px;\n height: 70px;\n cursor: pointer;\n }\n"])));
11359
+ var LogoImage = styled__default.img(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteral(["\n {\n width: 160px;\n height: 60px;\n cursor: pointer;\n }\n"])));
11360
11360
  var CurrencyFlagIcon = styled__default.img(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 15px;\n margin-top: 9px;\n margin-right: 10px;\n }\n"])));
11361
- var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n padding-top: 10px;\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
11361
+ var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n font-style: italic;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
11362
11362
  return props.theme.rareStepColors.secondary;
11363
11363
  }, function (props) {
11364
11364
  return props.theme.rareStepFontWeights.bold;
@@ -11367,8 +11367,8 @@
11367
11367
  }, function (props) {
11368
11368
  return props.theme.rareStepColors.secondary;
11369
11369
  });
11370
- var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n }\n"])));
11371
- var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 30px;\n height: 30px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
11370
+ var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n\n .account-icon {\n &__wrapper {\n position: relative;\n }\n\n &__dropdown {\n position: absolute;\n width: 100%;\n top: 25px;\n left: 0;\n }\n }\n }\n"])));
11371
+ var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 22px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
11372
11372
  return props.theme.marginPaddings[3];
11373
11373
  });
11374
11374
  var NavigationContainer = styled__default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n background-color: ", ";\n padding-top: ", ";\n }\n"])), function (props) {
@@ -11439,7 +11439,7 @@
11439
11439
  var DropdownNavigatorIcon = styled__default.img(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n {\n width: 15px;\n height: 12px;\n margin-left: ", ";\n }\n"])), function (props) {
11440
11440
  return props.theme.marginPaddings[0];
11441
11441
  });
11442
- var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 20px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
11442
+ var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 10px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
11443
11443
  return props.theme.rareStepColors.secondary;
11444
11444
  }, function (props) {
11445
11445
  return props.theme.rareStepColors.secondary;
@@ -11496,7 +11496,7 @@
11496
11496
  return props.theme.rareStepColors.ntrlMin;
11497
11497
  });
11498
11498
  var CloseIconWrapper = styled__default.div(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteral(["\n {\n width: 100%;\n display: flex;\n justify-content: flex-end;\n margin: 30px 0;\n }\n"])));
11499
- var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n }\n"])), function (props) {
11499
+ var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n font-size: ", ";\n }\n"])), function (props) {
11500
11500
  return props.theme.rareStepColors.secondary;
11501
11501
  }, function (props) {
11502
11502
  return props.theme.rareStepColors.secondary;
@@ -11508,6 +11508,8 @@
11508
11508
  return props.theme.marginPaddings[1];
11509
11509
  }, function (props) {
11510
11510
  return props.theme.marginPaddings[1];
11511
+ }, function (props) {
11512
+ return props.theme.rareStepFontSize.h5;
11511
11513
  });
11512
11514
  var SubMenuLinkContainer = styled__default.div(_templateObject12$1 || (_templateObject12$1 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n"])));
11513
11515
  var SubMenuRightIcon = styled__default.img(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n }\n"])));
package/RareStepFooter.js CHANGED
@@ -1,8 +1,8 @@
1
1
  (function (global, factory) {
2
- typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components')) :
3
- typeof define === 'function' && define.amd ? define(['react', 'styled-components'], factory) :
4
- (global = global || self, global.RareStepFooter = factory(global.React, global.styled));
5
- }(this, (function (React, styled) { 'use strict';
2
+ typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('prop-types'), require('styled-components')) :
3
+ typeof define === 'function' && define.amd ? define(['react', 'prop-types', 'styled-components'], factory) :
4
+ (global = global || self, global.RareStepFooter = factory(global.React, global.PropTypes, global.styled));
5
+ }(this, (function (React, propTypes, styled) { 'use strict';
6
6
 
7
7
  var React__default = 'default' in React ? React['default'] : React;
8
8
  var styled__default = 'default' in styled ? styled['default'] : styled;
@@ -213,6 +213,8 @@
213
213
  }))));
214
214
  }
215
215
 
216
+ /** RareStep footer component */
217
+
216
218
  var RareStepFooter = function RareStepFooter(_ref) {
217
219
  var footerImageUrl = _ref.footerImageUrl,
218
220
  footerLogoImageUrl = _ref.footerLogoImageUrl,
package/RareStepHeader.js CHANGED
@@ -1,8 +1,8 @@
1
1
  (function (global, factory) {
2
- typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components')) :
3
- typeof define === 'function' && define.amd ? define(['react', 'styled-components'], factory) :
4
- (global = global || self, global.RareStepHeader = factory(global.React, global.styled));
5
- }(this, (function (React, styled) { 'use strict';
2
+ typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('prop-types'), require('styled-components')) :
3
+ typeof define === 'function' && define.amd ? define(['react', 'prop-types', 'styled-components'], factory) :
4
+ (global = global || self, global.RareStepHeader = factory(global.React, global.PropTypes, global.styled));
5
+ }(this, (function (React, propTypes, styled) { 'use strict';
6
6
 
7
7
  var React__default = 'default' in React ? React['default'] : React;
8
8
  var styled__default = 'default' in styled ? styled['default'] : styled;
@@ -173,14 +173,14 @@
173
173
  return props.theme.rareStepPageSizes.container;
174
174
  });
175
175
  var HeaderContainer = styled__default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n padding: ", " 5%;\n max-width: ", ";\n margin: 0 auto;\n width: 100%;\n }\n"])), function (props) {
176
- return props.theme.marginPaddings[3];
176
+ return props.theme.marginPaddings[1];
177
177
  }, function (props) {
178
178
  return props.theme.rareStepPageSizes.container;
179
179
  });
180
180
  var LogoFigure = styled__default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
181
- var LogoImage = styled__default.img(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n {\n width: 200px;\n height: 70px;\n cursor: pointer;\n }\n"])));
181
+ var LogoImage = styled__default.img(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n {\n width: 160px;\n height: 60px;\n cursor: pointer;\n }\n"])));
182
182
  var CurrencyFlagIcon = styled__default.img(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 15px;\n margin-top: 9px;\n margin-right: 10px;\n }\n"])));
183
- var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n padding-top: 10px;\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
183
+ var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n font-style: italic;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
184
184
  return props.theme.rareStepColors.secondary;
185
185
  }, function (props) {
186
186
  return props.theme.rareStepFontWeights.bold;
@@ -189,8 +189,8 @@
189
189
  }, function (props) {
190
190
  return props.theme.rareStepColors.secondary;
191
191
  });
192
- var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n }\n"])));
193
- var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 30px;\n height: 30px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
192
+ var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n\n .account-icon {\n &__wrapper {\n position: relative;\n }\n\n &__dropdown {\n position: absolute;\n width: 100%;\n top: 25px;\n left: 0;\n }\n }\n }\n"])));
193
+ var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 22px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
194
194
  return props.theme.marginPaddings[3];
195
195
  });
196
196
  var NavigationContainer = styled__default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n background-color: ", ";\n padding-top: ", ";\n }\n"])), function (props) {
@@ -261,7 +261,7 @@
261
261
  var DropdownNavigatorIcon = styled__default.img(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n {\n width: 15px;\n height: 12px;\n margin-left: ", ";\n }\n"])), function (props) {
262
262
  return props.theme.marginPaddings[0];
263
263
  });
264
- var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 20px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
264
+ var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 10px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
265
265
  return props.theme.rareStepColors.secondary;
266
266
  }, function (props) {
267
267
  return props.theme.rareStepColors.secondary;
@@ -357,9 +357,9 @@
357
357
  }
358
358
  }, /*#__PURE__*/React__default.createElement(DropdownBrandLinkHR, null), /*#__PURE__*/React__default.createElement(DropdownBrandLink, null, brand.brandName));
359
359
  })), /*#__PURE__*/React__default.createElement(DropdownModels, null, currentModels === null || currentModels === void 0 ? void 0 : currentModels.map(function (model, index) {
360
- return /*#__PURE__*/React__default.createElement(DropdownModelsList, null, /*#__PURE__*/React__default.createElement(DropdownLink, {
360
+ return /*#__PURE__*/React__default.createElement(DropdownModelsList, {
361
361
  key: index
362
- }, model.modelName));
362
+ }, /*#__PURE__*/React__default.createElement(DropdownLink, null, model.modelName));
363
363
  })), /*#__PURE__*/React__default.createElement(DropdownFigure, null, (currentBrand === null || currentBrand === void 0 ? void 0 : currentBrand.brandImageUrl) && /*#__PURE__*/React__default.createElement(DropdownImage, {
364
364
  src: currentBrand === null || currentBrand === void 0 ? void 0 : currentBrand.brandImageUrl
365
365
  }))));
@@ -407,7 +407,8 @@
407
407
  wordpressSiteUrl = _ref.wordpressSiteUrl,
408
408
  desktopHeaderLinks = _ref.desktopHeaderLinks,
409
409
  handleOnAccountClick = _ref.handleOnAccountClick,
410
- handleOnCartClick = _ref.handleOnCartClick;
410
+ handleOnCartClick = _ref.handleOnCartClick,
411
+ userIconDropdownContent = _ref.userIconDropdownContent;
411
412
 
412
413
  var _useState = React.useState(false),
413
414
  _useState2 = _slicedToArray(_useState, 2),
@@ -421,6 +422,13 @@
421
422
  showSearch = _useState4[0],
422
423
  setShowSearch = _useState4[1];
423
424
 
425
+ var _useState5 = React.useState(false),
426
+ _useState6 = _slicedToArray(_useState5, 2),
427
+ isUserIconDropdownContent = _useState6[0],
428
+ setIsUserIconDropdownContent = _useState6[1];
429
+
430
+ var userDropdownTimeoutIdRef = React.useRef(null);
431
+
424
432
  var toggleSearch = function toggleSearch() {
425
433
  setShowSearch(!showSearch);
426
434
  };
@@ -436,6 +444,17 @@
436
444
  }, 500);
437
445
  };
438
446
 
447
+ var handleShowUserDropdown = function handleShowUserDropdown() {
448
+ clearTimeout(userDropdownTimeoutIdRef.current);
449
+ setIsUserIconDropdownContent(true);
450
+ };
451
+
452
+ var handleHideUserDropdown = function handleHideUserDropdown() {
453
+ userDropdownTimeoutIdRef.current = setTimeout(function () {
454
+ setIsUserIconDropdownContent(false);
455
+ }, 500);
456
+ };
457
+
439
458
  return /*#__PURE__*/React__default.createElement(HeaderWrapper, null, /*#__PURE__*/React__default.createElement(HeaderContainer, null, /*#__PURE__*/React__default.createElement(LogoFigure, null, /*#__PURE__*/React__default.createElement(LogoImage, {
440
459
  src: headerLogoImgUrl,
441
460
  onClick: function onClick() {
@@ -443,18 +462,29 @@
443
462
  }
444
463
  })), /*#__PURE__*/React__default.createElement(HeaderIconsContainer, null, /*#__PURE__*/React__default.createElement(SellToUsHR, null), /*#__PURE__*/React__default.createElement(SellToUsLink, {
445
464
  href: desktopHeaderLinks.button.url
446
- }, desktopHeaderLinks.button.name), /*#__PURE__*/React__default.createElement(HeaderIcon, {
465
+ }, desktopHeaderLinks.button.name), /*#__PURE__*/React__default.createElement("div", {
466
+ className: "account-icon__wrapper"
467
+ }, /*#__PURE__*/React__default.createElement(HeaderIcon, {
447
468
  src: searchIconUrl,
448
469
  onClick: toggleSearch
449
470
  }), interestIconUrl && /*#__PURE__*/React__default.createElement(HeaderIcon, {
450
471
  src: interestIconUrl
451
472
  }), /*#__PURE__*/React__default.createElement(HeaderIcon, {
473
+ onMouseOver: handleShowUserDropdown,
474
+ onMouseOut: handleHideUserDropdown,
475
+ className: "account-icon",
452
476
  src: userIconUrl,
453
477
  onClick: handleOnAccountClick
454
478
  }), /*#__PURE__*/React__default.createElement(HeaderIcon, {
455
479
  src: cartIconUrl,
456
480
  onClick: handleOnCartClick
457
- }))), /*#__PURE__*/React__default.createElement(Navigation, {
481
+ }), isUserIconDropdownContent && userIconDropdownContent && /*#__PURE__*/React__default.createElement("div", {
482
+ onFocus: handleShowUserDropdown,
483
+ onBlur: handleHideUserDropdown,
484
+ onMouseOver: handleShowUserDropdown,
485
+ onMouseOut: handleHideUserDropdown,
486
+ className: "account-icon__dropdown"
487
+ }, userIconDropdownContent)))), /*#__PURE__*/React__default.createElement(Navigation, {
458
488
  dropdownClosedIconUrl: dropdownClosedIconUrl,
459
489
  dropdownOpenIconUrl: dropdownOpenIconUrl,
460
490
  currencyFlagIconUrl: currencyFlagIconUrl,
@@ -505,7 +535,7 @@
505
535
  return props.theme.rareStepColors.ntrlMin;
506
536
  });
507
537
  var CloseIconWrapper = styled__default.div(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteral(["\n {\n width: 100%;\n display: flex;\n justify-content: flex-end;\n margin: 30px 0;\n }\n"])));
508
- var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n }\n"])), function (props) {
538
+ var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n font-size: ", ";\n }\n"])), function (props) {
509
539
  return props.theme.rareStepColors.secondary;
510
540
  }, function (props) {
511
541
  return props.theme.rareStepColors.secondary;
@@ -517,6 +547,8 @@
517
547
  return props.theme.marginPaddings[1];
518
548
  }, function (props) {
519
549
  return props.theme.marginPaddings[1];
550
+ }, function (props) {
551
+ return props.theme.rareStepFontSize.h5;
520
552
  });
521
553
  var SubMenuLinkContainer = styled__default.div(_templateObject12$1 || (_templateObject12$1 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n"])));
522
554
  var SubMenuRightIcon = styled__default.img(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n }\n"])));
@@ -597,7 +629,14 @@
597
629
  function SideNavLinks(_ref) {
598
630
  var rightArrowIconUrl = _ref.rightArrowIconUrl,
599
631
  links = _ref.links,
600
- setShowSideNavSubMenu = _ref.setShowSideNavSubMenu;
632
+ setShowSideNavSubMenu = _ref.setShowSideNavSubMenu,
633
+ closeSubMenu = _ref.closeSubMenu;
634
+
635
+ var handleOnLinkClick = function handleOnLinkClick(link) {
636
+ link.onClick();
637
+ closeSubMenu();
638
+ };
639
+
601
640
  return /*#__PURE__*/React__default.createElement(React.Fragment, null, links.top.map(function (link, index) {
602
641
  return link !== null && link !== void 0 && link.isSubMenu ? /*#__PURE__*/React__default.createElement(SubMenuLinkContainer, {
603
642
  key: index
@@ -619,7 +658,9 @@
619
658
  key: index,
620
659
  href: link.url,
621
660
  className: "side-nav-link--bottom",
622
- onClick: link !== null && link !== void 0 && link.isButton ? link.onClick : null
661
+ onClick: link !== null && link !== void 0 && link.isButton ? function () {
662
+ return handleOnLinkClick(link);
663
+ } : null
623
664
  }, link.name);
624
665
  }));
625
666
  }
@@ -667,6 +708,11 @@
667
708
  setShowSearch(!showSearch);
668
709
  };
669
710
 
711
+ var closeSubMenu = function closeSubMenu() {
712
+ setShowSideNav(false);
713
+ enableBodyScroll();
714
+ };
715
+
670
716
  return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement(HeaderWrapper$1, null, /*#__PURE__*/React__default.createElement(Icon, {
671
717
  onClick: function onClick() {
672
718
  disableBodyScroll();
@@ -702,7 +748,8 @@
702
748
  rightArrowIconUrl: rightArrowIconUrl,
703
749
  links: mobileHeaderLinks,
704
750
  setShowSideNavSubMenu: setShowSideNavSubMenu,
705
- currencyFlagIconUrl: currencyFlagIconUrl
751
+ currencyFlagIconUrl: currencyFlagIconUrl,
752
+ closeSubMenu: closeSubMenu
706
753
  }))), /*#__PURE__*/React__default.createElement(MenuSideNavWrapper, null, /*#__PURE__*/React__default.createElement(MenuSideNav, {
707
754
  sideNavClassName: "side-nav side-nav--".concat(showSideNavSubMenu ? 'open' : 'close'),
708
755
  overlayClassName: "overlay overlay--".concat(showSideNavSubMenu ? 'open' : 'close'),
@@ -715,6 +762,8 @@
715
762
  }))));
716
763
  }
717
764
 
765
+ /** RareStep header component */
766
+
718
767
  var RareStepHeader = function RareStepHeader(_ref) {
719
768
  var headerLogoImgUrl = _ref.headerLogoImgUrl,
720
769
  searchIconUrl = _ref.searchIconUrl,
@@ -736,7 +785,8 @@
736
785
  mobileCloseIconUrl = _ref.mobileCloseIconUrl,
737
786
  handleOnAccountClick = _ref.handleOnAccountClick,
738
787
  backIconUrl = _ref.backIconUrl,
739
- handleOnCartClick = _ref.handleOnCartClick;
788
+ handleOnCartClick = _ref.handleOnCartClick,
789
+ userIconDropdownContent = _ref.userIconDropdownContent;
740
790
  return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
741
791
  className: desktopHeaderWrapperClass
742
792
  }, /*#__PURE__*/React__default.createElement(RareStepDesktopHeader$1, {
@@ -753,7 +803,8 @@
753
803
  wordpressSiteUrl: wordpressSiteUrl,
754
804
  desktopHeaderLinks: desktopHeaderLinks,
755
805
  handleOnAccountClick: handleOnAccountClick,
756
- handleOnCartClick: handleOnCartClick
806
+ handleOnCartClick: handleOnCartClick,
807
+ userIconDropdownContent: userIconDropdownContent
757
808
  })), /*#__PURE__*/React__default.createElement("div", {
758
809
  className: mobileHeaderWrapperClass
759
810
  }, /*#__PURE__*/React__default.createElement(RareStepMobileHeader, {
@@ -773,6 +824,9 @@
773
824
  })));
774
825
  };
775
826
 
827
+ RareStepHeader.defaultProps = {
828
+ userIconDropdownContent: null
829
+ };
776
830
  var index = themed(RareStepHeader);
777
831
 
778
832
  return index;
package/build/bundle.js CHANGED
@@ -11,7 +11,7 @@
11
11
  EllipsisLoader = EllipsisLoader && Object.prototype.hasOwnProperty.call(EllipsisLoader, 'default') ? EllipsisLoader['default'] : EllipsisLoader;
12
12
  PageReady = PageReady && Object.prototype.hasOwnProperty.call(PageReady, 'default') ? PageReady['default'] : PageReady;
13
13
  stylisRuleSheet = stylisRuleSheet && Object.prototype.hasOwnProperty.call(stylisRuleSheet, 'default') ? stylisRuleSheet['default'] : stylisRuleSheet;
14
- PropTypes = PropTypes && Object.prototype.hasOwnProperty.call(PropTypes, 'default') ? PropTypes['default'] : PropTypes;
14
+ var PropTypes__default = 'default' in PropTypes ? PropTypes['default'] : PropTypes;
15
15
  raf = raf && Object.prototype.hasOwnProperty.call(raf, 'default') ? raf['default'] : raf;
16
16
  AutosizeInput = AutosizeInput && Object.prototype.hasOwnProperty.call(AutosizeInput, 'default') ? AutosizeInput['default'] : AutosizeInput;
17
17
  var Notifications__default = 'default' in Notifications ? Notifications['default'] : Notifications;
@@ -3945,7 +3945,7 @@
3945
3945
  }(React.Component);
3946
3946
 
3947
3947
  _defineProperty$1(MenuPlacer, "contextTypes", {
3948
- getPortalPlacement: PropTypes.func
3948
+ getPortalPlacement: PropTypes__default.func
3949
3949
  });
3950
3950
 
3951
3951
  var Menu = function Menu(props) {
@@ -4151,7 +4151,7 @@
4151
4151
  }(React.Component);
4152
4152
 
4153
4153
  _defineProperty$1(MenuPortal, "childContextTypes", {
4154
- getPortalPlacement: PropTypes.func
4154
+ getPortalPlacement: PropTypes__default.func
4155
4155
  });
4156
4156
 
4157
4157
  var isArray = Array.isArray;
@@ -11960,14 +11960,14 @@
11960
11960
  return props.theme.rareStepPageSizes.container;
11961
11961
  });
11962
11962
  var HeaderContainer = styled__default.div(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n padding: ", " 5%;\n max-width: ", ";\n margin: 0 auto;\n width: 100%;\n }\n"])), function (props) {
11963
- return props.theme.marginPaddings[3];
11963
+ return props.theme.marginPaddings[1];
11964
11964
  }, function (props) {
11965
11965
  return props.theme.rareStepPageSizes.container;
11966
11966
  });
11967
11967
  var LogoFigure = styled__default.div(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
11968
- var LogoImage = styled__default.img(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteral(["\n {\n width: 200px;\n height: 70px;\n cursor: pointer;\n }\n"])));
11968
+ var LogoImage = styled__default.img(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteral(["\n {\n width: 160px;\n height: 60px;\n cursor: pointer;\n }\n"])));
11969
11969
  var CurrencyFlagIcon = styled__default.img(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 15px;\n margin-top: 9px;\n margin-right: 10px;\n }\n"])));
11970
- var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n padding-top: 10px;\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
11970
+ var SellToUsLink = styled__default.a(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n {\n color: ", ";\n font-weight: ", ";\n font-size: ", ";\n text-transform: uppercase;\n letter-spacing: 1px;\n cursor: pointer;\n text-decoration: none;\n font-style: italic;\n\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
11971
11971
  return props.theme.rareStepColors.secondary;
11972
11972
  }, function (props) {
11973
11973
  return props.theme.rareStepFontWeights.bold;
@@ -11976,8 +11976,8 @@
11976
11976
  }, function (props) {
11977
11977
  return props.theme.rareStepColors.secondary;
11978
11978
  });
11979
- var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n }\n"])));
11980
- var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 30px;\n height: 30px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
11979
+ var HeaderIconsContainer = styled__default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n {\n display: flex;\n align-items: center;\n\n .account-icon {\n &__wrapper {\n position: relative;\n }\n\n &__dropdown {\n position: absolute;\n width: 100%;\n top: 25px;\n left: 0;\n }\n }\n }\n"])));
11980
+ var HeaderIcon = styled__default.img(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n {\n width: 25px;\n height: 22px;\n margin-left: ", ";\n cursor: pointer;\n }\n"])), function (props) {
11981
11981
  return props.theme.marginPaddings[3];
11982
11982
  });
11983
11983
  var NavigationContainer = styled__default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n background-color: ", ";\n padding-top: ", ";\n }\n"])), function (props) {
@@ -12048,7 +12048,7 @@
12048
12048
  var DropdownNavigatorIcon = styled__default.img(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n {\n width: 15px;\n height: 12px;\n margin-left: ", ";\n }\n"])), function (props) {
12049
12049
  return props.theme.marginPaddings[0];
12050
12050
  });
12051
- var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 20px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
12051
+ var SellToUsHR = styled__default.hr(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n {\n width: 80px;\n margin-top: 10px;\n color: ", ";\n border: 1px solid ", ";\n margin-right: 10px;\n }\n"])), function (props) {
12052
12052
  return props.theme.rareStepColors.secondary;
12053
12053
  }, function (props) {
12054
12054
  return props.theme.rareStepColors.secondary;
@@ -12144,9 +12144,9 @@
12144
12144
  }
12145
12145
  }, /*#__PURE__*/React__default.createElement(DropdownBrandLinkHR, null), /*#__PURE__*/React__default.createElement(DropdownBrandLink, null, brand.brandName));
12146
12146
  })), /*#__PURE__*/React__default.createElement(DropdownModels, null, currentModels === null || currentModels === void 0 ? void 0 : currentModels.map(function (model, index) {
12147
- return /*#__PURE__*/React__default.createElement(DropdownModelsList, null, /*#__PURE__*/React__default.createElement(DropdownLink, {
12147
+ return /*#__PURE__*/React__default.createElement(DropdownModelsList, {
12148
12148
  key: index
12149
- }, model.modelName));
12149
+ }, /*#__PURE__*/React__default.createElement(DropdownLink, null, model.modelName));
12150
12150
  })), /*#__PURE__*/React__default.createElement(DropdownFigure, null, (currentBrand === null || currentBrand === void 0 ? void 0 : currentBrand.brandImageUrl) && /*#__PURE__*/React__default.createElement(DropdownImage, {
12151
12151
  src: currentBrand === null || currentBrand === void 0 ? void 0 : currentBrand.brandImageUrl
12152
12152
  }))));
@@ -12194,7 +12194,8 @@
12194
12194
  wordpressSiteUrl = _ref.wordpressSiteUrl,
12195
12195
  desktopHeaderLinks = _ref.desktopHeaderLinks,
12196
12196
  handleOnAccountClick = _ref.handleOnAccountClick,
12197
- handleOnCartClick = _ref.handleOnCartClick;
12197
+ handleOnCartClick = _ref.handleOnCartClick,
12198
+ userIconDropdownContent = _ref.userIconDropdownContent;
12198
12199
 
12199
12200
  var _useState = React.useState(false),
12200
12201
  _useState2 = _slicedToArray(_useState, 2),
@@ -12208,6 +12209,13 @@
12208
12209
  showSearch = _useState4[0],
12209
12210
  setShowSearch = _useState4[1];
12210
12211
 
12212
+ var _useState5 = React.useState(false),
12213
+ _useState6 = _slicedToArray(_useState5, 2),
12214
+ isUserIconDropdownContent = _useState6[0],
12215
+ setIsUserIconDropdownContent = _useState6[1];
12216
+
12217
+ var userDropdownTimeoutIdRef = React.useRef(null);
12218
+
12211
12219
  var toggleSearch = function toggleSearch() {
12212
12220
  setShowSearch(!showSearch);
12213
12221
  };
@@ -12223,6 +12231,17 @@
12223
12231
  }, 500);
12224
12232
  };
12225
12233
 
12234
+ var handleShowUserDropdown = function handleShowUserDropdown() {
12235
+ clearTimeout(userDropdownTimeoutIdRef.current);
12236
+ setIsUserIconDropdownContent(true);
12237
+ };
12238
+
12239
+ var handleHideUserDropdown = function handleHideUserDropdown() {
12240
+ userDropdownTimeoutIdRef.current = setTimeout(function () {
12241
+ setIsUserIconDropdownContent(false);
12242
+ }, 500);
12243
+ };
12244
+
12226
12245
  return /*#__PURE__*/React__default.createElement(HeaderWrapper, null, /*#__PURE__*/React__default.createElement(HeaderContainer, null, /*#__PURE__*/React__default.createElement(LogoFigure, null, /*#__PURE__*/React__default.createElement(LogoImage, {
12227
12246
  src: headerLogoImgUrl,
12228
12247
  onClick: function onClick() {
@@ -12230,18 +12249,29 @@
12230
12249
  }
12231
12250
  })), /*#__PURE__*/React__default.createElement(HeaderIconsContainer, null, /*#__PURE__*/React__default.createElement(SellToUsHR, null), /*#__PURE__*/React__default.createElement(SellToUsLink, {
12232
12251
  href: desktopHeaderLinks.button.url
12233
- }, desktopHeaderLinks.button.name), /*#__PURE__*/React__default.createElement(HeaderIcon, {
12252
+ }, desktopHeaderLinks.button.name), /*#__PURE__*/React__default.createElement("div", {
12253
+ className: "account-icon__wrapper"
12254
+ }, /*#__PURE__*/React__default.createElement(HeaderIcon, {
12234
12255
  src: searchIconUrl,
12235
12256
  onClick: toggleSearch
12236
12257
  }), interestIconUrl && /*#__PURE__*/React__default.createElement(HeaderIcon, {
12237
12258
  src: interestIconUrl
12238
12259
  }), /*#__PURE__*/React__default.createElement(HeaderIcon, {
12260
+ onMouseOver: handleShowUserDropdown,
12261
+ onMouseOut: handleHideUserDropdown,
12262
+ className: "account-icon",
12239
12263
  src: userIconUrl,
12240
12264
  onClick: handleOnAccountClick
12241
12265
  }), /*#__PURE__*/React__default.createElement(HeaderIcon, {
12242
12266
  src: cartIconUrl,
12243
12267
  onClick: handleOnCartClick
12244
- }))), /*#__PURE__*/React__default.createElement(Navigation, {
12268
+ }), isUserIconDropdownContent && userIconDropdownContent && /*#__PURE__*/React__default.createElement("div", {
12269
+ onFocus: handleShowUserDropdown,
12270
+ onBlur: handleHideUserDropdown,
12271
+ onMouseOver: handleShowUserDropdown,
12272
+ onMouseOut: handleHideUserDropdown,
12273
+ className: "account-icon__dropdown"
12274
+ }, userIconDropdownContent)))), /*#__PURE__*/React__default.createElement(Navigation, {
12245
12275
  dropdownClosedIconUrl: dropdownClosedIconUrl,
12246
12276
  dropdownOpenIconUrl: dropdownOpenIconUrl,
12247
12277
  currencyFlagIconUrl: currencyFlagIconUrl,
@@ -12292,7 +12322,7 @@
12292
12322
  return props.theme.rareStepColors.ntrlMin;
12293
12323
  });
12294
12324
  var CloseIconWrapper = styled__default.div(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteral(["\n {\n width: 100%;\n display: flex;\n justify-content: flex-end;\n margin: 30px 0;\n }\n"])));
12295
- var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n }\n"])), function (props) {
12325
+ var SellToUsLink$1 = styled__default.a(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n {\n color: ", ";\n border: 1px solid ", ";\n background-color: transparent;\n text-transform: uppercase;\n font-weight: ", ";\n display: block;\n width: calc(100% - ", ");\n padding: ", ";\n margin: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n letter-spacing: 1px;\n font-style: italic;\n font-size: ", ";\n }\n"])), function (props) {
12296
12326
  return props.theme.rareStepColors.secondary;
12297
12327
  }, function (props) {
12298
12328
  return props.theme.rareStepColors.secondary;
@@ -12304,6 +12334,8 @@
12304
12334
  return props.theme.marginPaddings[1];
12305
12335
  }, function (props) {
12306
12336
  return props.theme.marginPaddings[1];
12337
+ }, function (props) {
12338
+ return props.theme.rareStepFontSize.h5;
12307
12339
  });
12308
12340
  var SubMenuLinkContainer = styled__default.div(_templateObject12$1 || (_templateObject12$1 = _taggedTemplateLiteral(["\n {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n"])));
12309
12341
  var SubMenuRightIcon = styled__default.img(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n }\n"])));
@@ -12384,7 +12416,14 @@
12384
12416
  function SideNavLinks(_ref) {
12385
12417
  var rightArrowIconUrl = _ref.rightArrowIconUrl,
12386
12418
  links = _ref.links,
12387
- setShowSideNavSubMenu = _ref.setShowSideNavSubMenu;
12419
+ setShowSideNavSubMenu = _ref.setShowSideNavSubMenu,
12420
+ closeSubMenu = _ref.closeSubMenu;
12421
+
12422
+ var handleOnLinkClick = function handleOnLinkClick(link) {
12423
+ link.onClick();
12424
+ closeSubMenu();
12425
+ };
12426
+
12388
12427
  return /*#__PURE__*/React__default.createElement(React.Fragment, null, links.top.map(function (link, index) {
12389
12428
  return link !== null && link !== void 0 && link.isSubMenu ? /*#__PURE__*/React__default.createElement(SubMenuLinkContainer, {
12390
12429
  key: index
@@ -12406,7 +12445,9 @@
12406
12445
  key: index,
12407
12446
  href: link.url,
12408
12447
  className: "side-nav-link--bottom",
12409
- onClick: link !== null && link !== void 0 && link.isButton ? link.onClick : null
12448
+ onClick: link !== null && link !== void 0 && link.isButton ? function () {
12449
+ return handleOnLinkClick(link);
12450
+ } : null
12410
12451
  }, link.name);
12411
12452
  }));
12412
12453
  }
@@ -12454,6 +12495,11 @@
12454
12495
  setShowSearch(!showSearch);
12455
12496
  };
12456
12497
 
12498
+ var closeSubMenu = function closeSubMenu() {
12499
+ setShowSideNav(false);
12500
+ enableBodyScroll();
12501
+ };
12502
+
12457
12503
  return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement(HeaderWrapper$1, null, /*#__PURE__*/React__default.createElement(Icon, {
12458
12504
  onClick: function onClick() {
12459
12505
  disableBodyScroll();
@@ -12489,7 +12535,8 @@
12489
12535
  rightArrowIconUrl: rightArrowIconUrl,
12490
12536
  links: mobileHeaderLinks,
12491
12537
  setShowSideNavSubMenu: setShowSideNavSubMenu,
12492
- currencyFlagIconUrl: currencyFlagIconUrl
12538
+ currencyFlagIconUrl: currencyFlagIconUrl,
12539
+ closeSubMenu: closeSubMenu
12493
12540
  }))), /*#__PURE__*/React__default.createElement(MenuSideNavWrapper, null, /*#__PURE__*/React__default.createElement(MenuSideNav, {
12494
12541
  sideNavClassName: "side-nav side-nav--".concat(showSideNavSubMenu ? 'open' : 'close'),
12495
12542
  overlayClassName: "overlay overlay--".concat(showSideNavSubMenu ? 'open' : 'close'),
@@ -12502,6 +12549,8 @@
12502
12549
  }))));
12503
12550
  }
12504
12551
 
12552
+ /** RareStep header component */
12553
+
12505
12554
  var RareStepHeader = function RareStepHeader(_ref) {
12506
12555
  var headerLogoImgUrl = _ref.headerLogoImgUrl,
12507
12556
  searchIconUrl = _ref.searchIconUrl,
@@ -12523,7 +12572,8 @@
12523
12572
  mobileCloseIconUrl = _ref.mobileCloseIconUrl,
12524
12573
  handleOnAccountClick = _ref.handleOnAccountClick,
12525
12574
  backIconUrl = _ref.backIconUrl,
12526
- handleOnCartClick = _ref.handleOnCartClick;
12575
+ handleOnCartClick = _ref.handleOnCartClick,
12576
+ userIconDropdownContent = _ref.userIconDropdownContent;
12527
12577
  return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
12528
12578
  className: desktopHeaderWrapperClass
12529
12579
  }, /*#__PURE__*/React__default.createElement(RareStepDesktopHeader$1, {
@@ -12540,7 +12590,8 @@
12540
12590
  wordpressSiteUrl: wordpressSiteUrl,
12541
12591
  desktopHeaderLinks: desktopHeaderLinks,
12542
12592
  handleOnAccountClick: handleOnAccountClick,
12543
- handleOnCartClick: handleOnCartClick
12593
+ handleOnCartClick: handleOnCartClick,
12594
+ userIconDropdownContent: userIconDropdownContent
12544
12595
  })), /*#__PURE__*/React__default.createElement("div", {
12545
12596
  className: mobileHeaderWrapperClass
12546
12597
  }, /*#__PURE__*/React__default.createElement(RareStepMobileHeader, {
@@ -12560,6 +12611,9 @@
12560
12611
  })));
12561
12612
  };
12562
12613
 
12614
+ RareStepHeader.defaultProps = {
12615
+ userIconDropdownContent: null
12616
+ };
12563
12617
  var index$3 = themed(RareStepHeader);
12564
12618
 
12565
12619
  var _templateObject$Q, _templateObject2$c, _templateObject3$7, _templateObject4$6, _templateObject5$4, _templateObject6$2, _templateObject7$2, _templateObject8$2, _templateObject9$2, _templateObject10$2, _templateObject11$2, _templateObject12$2, _templateObject13$2, _templateObject14$2, _templateObject15$2, _templateObject16$2;
@@ -12675,6 +12729,8 @@
12675
12729
  }))));
12676
12730
  }
12677
12731
 
12732
+ /** RareStep footer component */
12733
+
12678
12734
  var RareStepFooter = function RareStepFooter(_ref) {
12679
12735
  var footerImageUrl = _ref.footerImageUrl,
12680
12736
  footerLogoImageUrl = _ref.footerLogoImageUrl,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bonlineza/luxity-lib",
3
- "version": "2.16.0",
3
+ "version": "2.17.1",
4
4
  "scripts": {
5
5
  "start": "start-storybook -p 9001 -c .storybook -s ./public",
6
6
  "clean": "rimraf ./build/*.*",