@bonlineza/luxity-lib 2.34.6 → 2.34.8

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 (6) hide show
  1. package/LuxityDesktopHeader.js +99 -75
  2. package/LuxityMobileHeader.js +23 -13
  3. package/LuxitySideNav.js +20 -12
  4. package/build/bundle.css +1 -1
  5. package/build/bundle.js +122 -88
  6. package/package.json +1 -1
package/LuxityDesktopHeader.js CHANGED
@@ -282,10 +282,12 @@
282
282
  _ref$brandElements = _ref.brandElements,
283
283
  brandElements = _ref$brandElements === void 0 ? [] : _ref$brandElements,
284
284
  productsUrl = _ref.productsUrl,
285
+ LinkComponent = _ref.LinkComponent,
285
286
  categorySlug = _ref.categorySlug,
286
287
  categoryTitle = _ref.categoryTitle,
287
288
  isLoading = _ref.isLoading,
288
- hasError = _ref.hasError;
289
+ hasError = _ref.hasError,
290
+ onMenuItemClick = _ref.onMenuItemClick;
289
291
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, hasError ? /*#__PURE__*/React__default.createElement("div", {
290
292
  className: "dropdown__errors"
291
293
  }, "Failed to load data.") : /*#__PURE__*/React__default.createElement("div", {
@@ -299,14 +301,16 @@
299
301
  }, title), /*#__PURE__*/React__default.createElement("div", {
300
302
  className: "dropdown__elements dropdown__elements--column"
301
303
  }, !!categoryElements.length && categoryElements.map(function (categoryElement) {
302
- return categoryElement.category ? /*#__PURE__*/React__default.createElement("a", {
304
+ return categoryElement.category ? /*#__PURE__*/React__default.createElement(LinkComponent, {
303
305
  href: "".concat(productsUrl, "/").concat(categoryElement.category, "/").concat(categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.slug),
304
306
  className: "dropdown__element",
305
- key: categoryElement.name
306
- }, categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.name.toLowerCase()) : /*#__PURE__*/React__default.createElement("a", {
307
+ key: categoryElement.name,
308
+ onClick: onMenuItemClick
309
+ }, categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.name.toLowerCase()) : /*#__PURE__*/React__default.createElement(LinkComponent, {
307
310
  href: "".concat(productsUrl, "/").concat(categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.slug),
308
311
  className: "dropdown__element",
309
- key: categoryElement.name
312
+ key: categoryElement.name,
313
+ onClick: onMenuItemClick
310
314
  }, categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.name.toLowerCase());
311
315
  }))), /*#__PURE__*/React__default.createElement("div", {
312
316
  className: "dropdown__column"
@@ -316,16 +320,18 @@
316
320
  className: "dropdown__brand-elements"
317
321
  }, /*#__PURE__*/React__default.createElement("div", {
318
322
  className: "dropdown__brand-element"
319
- }, /*#__PURE__*/React__default.createElement("a", {
323
+ }, /*#__PURE__*/React__default.createElement(LinkComponent, {
320
324
  href: "".concat(productsUrl, "/").concat(categorySlug),
321
- className: "dropdown__element"
325
+ className: "dropdown__element",
326
+ onClick: onMenuItemClick
322
327
  }, "All ", categoryTitle)), !!brandElements.length && brandElements.map(function (brand) {
323
328
  return /*#__PURE__*/React__default.createElement("div", {
324
329
  className: "dropdown__brand-element"
325
- }, /*#__PURE__*/React__default.createElement("a", {
330
+ }, /*#__PURE__*/React__default.createElement(LinkComponent, {
326
331
  href: "".concat(productsUrl, "/").concat(categorySlug, "/").concat(brand === null || brand === void 0 ? void 0 : brand.slug),
327
332
  className: "dropdown__element",
328
- key: brand.name
333
+ key: brand.name,
334
+ onClick: onMenuItemClick
329
335
  }, brand === null || brand === void 0 ? void 0 : brand.name));
330
336
  }))), /*#__PURE__*/React__default.createElement("div", {
331
337
  className: "dropdown__column"
@@ -335,6 +341,56 @@
335
341
  })))));
336
342
  };
337
343
 
344
+ var DropdownLink = function DropdownLink(_ref) {
345
+ var title = _ref.title,
346
+ imageSrc = _ref.imageSrc,
347
+ categoryElements = _ref.categoryElements,
348
+ brandElements = _ref.brandElements,
349
+ productsUrl = _ref.productsUrl,
350
+ LinkComponent = _ref.LinkComponent,
351
+ categorySlug = _ref.categorySlug,
352
+ categoryTitle = _ref.categoryTitle,
353
+ isLoading = _ref.isLoading,
354
+ hasError = _ref.hasError;
355
+
356
+ var _useState = React.useState(false),
357
+ _useState2 = _slicedToArray(_useState, 2),
358
+ dropdownVisible = _useState2[0],
359
+ setDropdownVisible = _useState2[1];
360
+
361
+ var handleMenuItemClick = function handleMenuItemClick() {
362
+ setDropdownVisible(false);
363
+ };
364
+
365
+ return /*#__PURE__*/React__default.createElement("li", {
366
+ className: "navbar__link",
367
+ onMouseEnter: function onMouseEnter() {
368
+ return setDropdownVisible(true);
369
+ },
370
+ onMouseLeave: function onMouseLeave() {
371
+ return setDropdownVisible(false);
372
+ }
373
+ }, /*#__PURE__*/React__default.createElement(LinkComponent, {
374
+ href: "".concat(productsUrl, "/").concat(categorySlug),
375
+ className: "navbar__link-item navbar__link-item--desktop",
376
+ onClick: handleMenuItemClick
377
+ }, title), dropdownVisible && /*#__PURE__*/React__default.createElement("div", {
378
+ className: "navbar__dropdown"
379
+ }, /*#__PURE__*/React__default.createElement(Dropdown, {
380
+ title: "Department",
381
+ imageSrc: imageSrc,
382
+ categoryElements: categoryElements,
383
+ brandElements: brandElements,
384
+ productsUrl: productsUrl,
385
+ categorySlug: categorySlug,
386
+ categoryTitle: categoryTitle,
387
+ isLoading: isLoading,
388
+ hasError: hasError,
389
+ onMenuItemClick: handleMenuItemClick,
390
+ LinkComponent: LinkComponent
391
+ })));
392
+ };
393
+
338
394
  var StoresDropdown = function StoresDropdown(_ref) {
339
395
  var _ref$stores = _ref.stores,
340
396
  stores = _ref$stores === void 0 ? [] : _ref$stores,
@@ -681,6 +737,7 @@
681
737
  stores = _ref.stores,
682
738
  contactNumber = _ref.contactNumber,
683
739
  productsUrl = _ref.productsUrl,
740
+ LinkComponent = _ref.LinkComponent,
684
741
  onInterestClick = _ref.onInterestClick,
685
742
  onCartClick = _ref.onCartClick,
686
743
  onAccountClick = _ref.onAccountClick,
@@ -902,15 +959,8 @@
902
959
  setSearchValue: setSearchValue
903
960
  }), /*#__PURE__*/React__default.createElement("nav", {
904
961
  className: "navbar__nav-links navbar__nav-links--wrap"
905
- }, /*#__PURE__*/React__default.createElement("li", {
906
- className: "navbar__link"
907
- }, /*#__PURE__*/React__default.createElement("a", {
908
- href: "".concat(productsUrl, "/brands"),
909
- className: "navbar__link-item navbar__link-item--desktop"
910
- }, "New"), /*#__PURE__*/React__default.createElement("div", {
911
- className: "navbar__dropdown"
912
- }, /*#__PURE__*/React__default.createElement(Dropdown, {
913
- title: "Department",
962
+ }, /*#__PURE__*/React__default.createElement(DropdownLink, {
963
+ title: "New",
914
964
  imageSrc: newBrandsImage,
915
965
  categoryElements: categoryElements,
916
966
  brandElements: dropdownData.latestArrivals,
@@ -918,16 +968,10 @@
918
968
  categorySlug: "brands",
919
969
  categoryTitle: "Brands",
920
970
  isLoading: loading,
921
- hasError: hasError
922
- }))), /*#__PURE__*/React__default.createElement("li", {
923
- className: "navbar__link"
924
- }, /*#__PURE__*/React__default.createElement("a", {
925
- href: "".concat(productsUrl, "/bags"),
926
- className: "navbar__link-item navbar__link-item--desktop"
927
- }, "Bags"), /*#__PURE__*/React__default.createElement("div", {
928
- className: "navbar__dropdown"
929
- }, /*#__PURE__*/React__default.createElement(Dropdown, {
930
- title: "Department",
971
+ hasError: hasError,
972
+ LinkComponent: LinkComponent
973
+ }), /*#__PURE__*/React__default.createElement(DropdownLink, {
974
+ title: "Bags",
931
975
  imageSrc: bagsImage,
932
976
  categoryElements: addCategoryToElements(categoryElements, categories.bags.slug),
933
977
  brandElements: dropdownData.bags,
@@ -935,16 +979,10 @@
935
979
  categorySlug: categories.bags.slug,
936
980
  categoryTitle: categories.bags.name,
937
981
  isLoading: loading,
938
- hasError: hasError
939
- }))), /*#__PURE__*/React__default.createElement("li", {
940
- className: "navbar__link"
941
- }, /*#__PURE__*/React__default.createElement("a", {
942
- href: "".concat(productsUrl, "/shoes"),
943
- className: "navbar__link-item navbar__link-item--desktop"
944
- }, "Shoes"), /*#__PURE__*/React__default.createElement("div", {
945
- className: "navbar__dropdown"
946
- }, /*#__PURE__*/React__default.createElement(Dropdown, {
947
- title: "Department",
982
+ hasError: hasError,
983
+ LinkComponent: LinkComponent
984
+ }), /*#__PURE__*/React__default.createElement(DropdownLink, {
985
+ title: "Shoes",
948
986
  imageSrc: shoesImage,
949
987
  categoryElements: addCategoryToElements(categoryElements, categories.shoes.slug),
950
988
  brandElements: dropdownData.shoes,
@@ -952,16 +990,10 @@
952
990
  categorySlug: categories.shoes.slug,
953
991
  categoryTitle: categories.shoes.name,
954
992
  isLoading: loading,
955
- hasError: hasError
956
- }))), /*#__PURE__*/React__default.createElement("li", {
957
- className: "navbar__link"
958
- }, /*#__PURE__*/React__default.createElement("a", {
959
- href: "".concat(productsUrl, "/apparel"),
960
- className: "navbar__link-item navbar__link-item--desktop"
961
- }, "Clothing"), /*#__PURE__*/React__default.createElement("div", {
962
- className: "navbar__dropdown"
963
- }, /*#__PURE__*/React__default.createElement(Dropdown, {
964
- title: "Department",
993
+ hasError: hasError,
994
+ LinkComponent: LinkComponent
995
+ }), /*#__PURE__*/React__default.createElement(DropdownLink, {
996
+ title: "Clothing",
965
997
  imageSrc: clothingImage,
966
998
  categoryElements: addCategoryToElements(dropdownData.apparelStyles, categories.clothing.slug),
967
999
  brandElements: dropdownData.apparel,
@@ -969,16 +1001,10 @@
969
1001
  categorySlug: categories.clothing.slug,
970
1002
  categoryTitle: categories.clothing.name,
971
1003
  isLoading: loading,
972
- hasError: hasError
973
- }))), /*#__PURE__*/React__default.createElement("li", {
974
- className: "navbar__link"
975
- }, /*#__PURE__*/React__default.createElement("a", {
976
- href: "".concat(productsUrl, "/accessories"),
977
- className: "navbar__link-item navbar__link-item--desktop"
978
- }, "Accessories"), /*#__PURE__*/React__default.createElement("div", {
979
- className: "navbar__dropdown"
980
- }, /*#__PURE__*/React__default.createElement(Dropdown, {
981
- title: "Categories",
1004
+ hasError: hasError,
1005
+ LinkComponent: LinkComponent
1006
+ }), /*#__PURE__*/React__default.createElement(DropdownLink, {
1007
+ title: "Accessories",
982
1008
  imageSrc: accessoriesImage,
983
1009
  categoryElements: removeCategoryByName(dropdownData.accessoriesCategories, 'ACCESSORIES'),
984
1010
  brandElements: dropdownData.accessories,
@@ -986,16 +1012,10 @@
986
1012
  categorySlug: categories.accessories.slug,
987
1013
  categoryTitle: categories.accessories.name,
988
1014
  isLoading: loading,
989
- hasError: hasError
990
- }))), /*#__PURE__*/React__default.createElement("li", {
991
- className: "navbar__link"
992
- }, /*#__PURE__*/React__default.createElement("a", {
993
- href: "".concat(productsUrl, "/watches"),
994
- className: "navbar__link-item navbar__link-item--desktop"
995
- }, "Watches"), /*#__PURE__*/React__default.createElement("div", {
996
- className: "navbar__dropdown"
997
- }, /*#__PURE__*/React__default.createElement(Dropdown, {
998
- title: "Department",
1015
+ hasError: hasError,
1016
+ LinkComponent: LinkComponent
1017
+ }), /*#__PURE__*/React__default.createElement(DropdownLink, {
1018
+ title: "Watches",
999
1019
  imageSrc: watchesImage,
1000
1020
  categoryElements: addCategoryToElements(categoryElements, categories.watches.slug),
1001
1021
  brandElements: dropdownData.watches,
@@ -1003,10 +1023,11 @@
1003
1023
  categorySlug: categories.watches.slug,
1004
1024
  categoryTitle: categories.watches.name,
1005
1025
  isLoading: loading,
1006
- hasError: hasError
1007
- }))), /*#__PURE__*/React__default.createElement("li", {
1026
+ hasError: hasError,
1027
+ LinkComponent: LinkComponent
1028
+ }), /*#__PURE__*/React__default.createElement("li", {
1008
1029
  className: "navbar__link"
1009
- }, /*#__PURE__*/React__default.createElement("a", {
1030
+ }, /*#__PURE__*/React__default.createElement(LinkComponent, {
1010
1031
  href: contactUsLink,
1011
1032
  className: "navbar__link-item navbar__link-item--desktop"
1012
1033
  }, "Stores"), /*#__PURE__*/React__default.createElement("div", {
@@ -1027,7 +1048,10 @@
1027
1048
  }), shop && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("button", {
1028
1049
  type: "button",
1029
1050
  className: "navbar__icon relative flex",
1030
- onClick: onAccountClick
1051
+ onClick: onAccountClick,
1052
+ style: {
1053
+ marginRight: isVip ? '15px' : '5px'
1054
+ }
1031
1055
  }, /*#__PURE__*/React__default.createElement("img", {
1032
1056
  src: accountIcon,
1033
1057
  alt: "account-icon",
@@ -1039,7 +1063,7 @@
1039
1063
  className: "navbar__vip-icon",
1040
1064
  width: 16,
1041
1065
  height: 16
1042
- })), isVip && /*#__PURE__*/React__default.createElement("button", {
1066
+ })), name && /*#__PURE__*/React__default.createElement("button", {
1043
1067
  type: "button",
1044
1068
  className: "mr-3",
1045
1069
  onClick: onAccountClick
@@ -1069,12 +1093,12 @@
1069
1093
  className: "navbar__nav-links"
1070
1094
  }, /*#__PURE__*/React__default.createElement("li", {
1071
1095
  className: "navbar__company-link"
1072
- }, /*#__PURE__*/React__default.createElement("a", {
1096
+ }, /*#__PURE__*/React__default.createElement(LinkComponent, {
1073
1097
  href: ourStoryLink,
1074
1098
  className: "navbar__link-item"
1075
1099
  }, "Our Story")), /*#__PURE__*/React__default.createElement("li", {
1076
1100
  className: "navbar__company-link"
1077
- }, /*#__PURE__*/React__default.createElement("a", {
1101
+ }, /*#__PURE__*/React__default.createElement(LinkComponent, {
1078
1102
  href: contactUsLink,
1079
1103
  className: "navbar__link-item"
1080
1104
  }, "Contact Us")), /*#__PURE__*/React__default.createElement("li", {
package/LuxityMobileHeader.js CHANGED
@@ -503,7 +503,8 @@
503
503
  brandsList = _ref$brandsList === void 0 ? [] : _ref$brandsList,
504
504
  categorySlug = _ref.categorySlug,
505
505
  isLoading = _ref.isLoading,
506
- hasError = _ref.hasError;
506
+ hasError = _ref.hasError,
507
+ LinkComponent = _ref.LinkComponent;
507
508
 
508
509
  var handleLinkClick = function handleLinkClick(event) {
509
510
  event.preventDefault();
@@ -538,12 +539,12 @@
538
539
  }, subMenuCategoryTitle), /*#__PURE__*/React__default.createElement("div", {
539
540
  className: "side-nav__elements"
540
541
  }, categoryElements.map(function (categoryElement) {
541
- return categoryElement.category ? /*#__PURE__*/React__default.createElement("a", {
542
+ return categoryElement.category ? /*#__PURE__*/React__default.createElement(LinkComponent, {
542
543
  href: "".concat(productUrl, "/").concat(categoryElement.category, "/").concat(categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.slug),
543
544
  onClick: handleLinkClick,
544
545
  className: "dropdown__element",
545
546
  key: categoryElement.name
546
- }, categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.name.toLowerCase()) : /*#__PURE__*/React__default.createElement("a", {
547
+ }, categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.name.toLowerCase()) : /*#__PURE__*/React__default.createElement(LinkComponent, {
547
548
  href: "".concat(productUrl, "/").concat(categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.slug),
548
549
  onClick: handleLinkClick,
549
550
  className: "dropdown__element",
@@ -553,12 +554,12 @@
553
554
  className: "side-nav__elements"
554
555
  }, /*#__PURE__*/React__default.createElement("div", {
555
556
  className: "side-nav__sub-menu-title"
556
- }, subMenuBrandsTitle), /*#__PURE__*/React__default.createElement("a", {
557
+ }, subMenuBrandsTitle), /*#__PURE__*/React__default.createElement(LinkComponent, {
557
558
  href: "".concat(productUrl, "/").concat(categorySlug === 'new' ? 'brands' : categorySlug),
558
559
  onClick: handleLinkClick,
559
560
  className: "side-nav__element"
560
561
  }, "All Brands"), !!brandsList.length && brandsList.map(function (brand) {
561
- return /*#__PURE__*/React__default.createElement("a", {
562
+ return /*#__PURE__*/React__default.createElement(LinkComponent, {
562
563
  href: "".concat(productUrl, "/").concat(categorySlug === 'new' ? 'brands' : categorySlug, "/").concat(brand.slug),
563
564
  onClick: handleLinkClick,
564
565
  className: "side-nav__element"
@@ -820,7 +821,8 @@
820
821
  currencyOptions = _ref.currencyOptions,
821
822
  onCurrencyChange = _ref.onCurrencyChange,
822
823
  isCurrencySelectionDisabled = _ref.isCurrencySelectionDisabled,
823
- tooltipContent = _ref.tooltipContent;
824
+ tooltipContent = _ref.tooltipContent,
825
+ LinkComponent = _ref.LinkComponent;
824
826
 
825
827
  var _useState = React.useState(false),
826
828
  _useState2 = _slicedToArray(_useState, 2),
@@ -1082,7 +1084,8 @@
1082
1084
  categorySlug: displayedSubMenu,
1083
1085
  isLoading: loading,
1084
1086
  hasError: hasError,
1085
- onCloseSideNav: onCloseSideNav
1087
+ onCloseSideNav: onCloseSideNav,
1088
+ LinkComponent: LinkComponent
1086
1089
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
1087
1090
  subMenuOpen: subMenuOpen && displayedSubMenu === 'bags',
1088
1091
  onBackClick: onBackClick,
@@ -1095,7 +1098,8 @@
1095
1098
  categorySlug: displayedSubMenu,
1096
1099
  isLoading: loading,
1097
1100
  hasError: hasError,
1098
- onCloseSideNav: onCloseSideNav
1101
+ onCloseSideNav: onCloseSideNav,
1102
+ LinkComponent: LinkComponent
1099
1103
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
1100
1104
  subMenuOpen: subMenuOpen && displayedSubMenu === 'shoes',
1101
1105
  onBackClick: onBackClick,
@@ -1108,7 +1112,8 @@
1108
1112
  categorySlug: displayedSubMenu,
1109
1113
  isLoading: loading,
1110
1114
  hasError: hasError,
1111
- onCloseSideNav: onCloseSideNav
1115
+ onCloseSideNav: onCloseSideNav,
1116
+ LinkComponent: LinkComponent
1112
1117
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
1113
1118
  subMenuOpen: subMenuOpen && displayedSubMenu === 'apparel',
1114
1119
  onBackClick: onBackClick,
@@ -1121,7 +1126,8 @@
1121
1126
  categorySlug: displayedSubMenu,
1122
1127
  isLoading: loading,
1123
1128
  hasError: hasError,
1124
- onCloseSideNav: onCloseSideNav
1129
+ onCloseSideNav: onCloseSideNav,
1130
+ LinkComponent: LinkComponent
1125
1131
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
1126
1132
  subMenuOpen: subMenuOpen && displayedSubMenu === 'accessories',
1127
1133
  onBackClick: onBackClick,
@@ -1134,7 +1140,8 @@
1134
1140
  categorySlug: displayedSubMenu,
1135
1141
  isLoading: loading,
1136
1142
  hasError: hasError,
1137
- onCloseSideNav: onCloseSideNav
1143
+ onCloseSideNav: onCloseSideNav,
1144
+ LinkComponent: LinkComponent
1138
1145
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
1139
1146
  subMenuOpen: subMenuOpen && displayedSubMenu === 'watches',
1140
1147
  onBackClick: onBackClick,
@@ -1147,7 +1154,8 @@
1147
1154
  categorySlug: displayedSubMenu,
1148
1155
  isLoading: loading,
1149
1156
  hasError: hasError,
1150
- onCloseSideNav: onCloseSideNav
1157
+ onCloseSideNav: onCloseSideNav,
1158
+ LinkComponent: LinkComponent
1151
1159
  }), displayedSubMenu === 'stores' && /*#__PURE__*/React__default.createElement("div", {
1152
1160
  className: "side-nav__content"
1153
1161
  }, /*#__PURE__*/React__default.createElement(StoresDropdown, {
@@ -1265,6 +1273,7 @@
1265
1273
  onCurrencyChange = _ref.onCurrencyChange,
1266
1274
  isCurrencySelectionDisabled = _ref.isCurrencySelectionDisabled,
1267
1275
  tooltipContent = _ref.tooltipContent,
1276
+ LinkComponent = _ref.LinkComponent,
1268
1277
  shop = _ref.shop,
1269
1278
  app = _ref.app;
1270
1279
 
@@ -1550,7 +1559,8 @@
1550
1559
  currencyOptions: currencyOptions,
1551
1560
  onCurrencyChange: onCurrencyChange,
1552
1561
  isCurrencySelectionDisabled: isCurrencySelectionDisabled,
1553
- tooltipContent: tooltipContent
1562
+ tooltipContent: tooltipContent,
1563
+ LinkComponent: LinkComponent
1554
1564
  }), app && /*#__PURE__*/React__default.createElement(LuxityAppSideNav, {
1555
1565
  accordionIcon: accordionIcon,
1556
1566
  closeIcon: closeIcon,
package/LuxitySideNav.js CHANGED
@@ -192,7 +192,8 @@
192
192
  brandsList = _ref$brandsList === void 0 ? [] : _ref$brandsList,
193
193
  categorySlug = _ref.categorySlug,
194
194
  isLoading = _ref.isLoading,
195
- hasError = _ref.hasError;
195
+ hasError = _ref.hasError,
196
+ LinkComponent = _ref.LinkComponent;
196
197
 
197
198
  var handleLinkClick = function handleLinkClick(event) {
198
199
  event.preventDefault();
@@ -227,12 +228,12 @@
227
228
  }, subMenuCategoryTitle), /*#__PURE__*/React__default.createElement("div", {
228
229
  className: "side-nav__elements"
229
230
  }, categoryElements.map(function (categoryElement) {
230
- return categoryElement.category ? /*#__PURE__*/React__default.createElement("a", {
231
+ return categoryElement.category ? /*#__PURE__*/React__default.createElement(LinkComponent, {
231
232
  href: "".concat(productUrl, "/").concat(categoryElement.category, "/").concat(categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.slug),
232
233
  onClick: handleLinkClick,
233
234
  className: "dropdown__element",
234
235
  key: categoryElement.name
235
- }, categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.name.toLowerCase()) : /*#__PURE__*/React__default.createElement("a", {
236
+ }, categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.name.toLowerCase()) : /*#__PURE__*/React__default.createElement(LinkComponent, {
236
237
  href: "".concat(productUrl, "/").concat(categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.slug),
237
238
  onClick: handleLinkClick,
238
239
  className: "dropdown__element",
@@ -242,12 +243,12 @@
242
243
  className: "side-nav__elements"
243
244
  }, /*#__PURE__*/React__default.createElement("div", {
244
245
  className: "side-nav__sub-menu-title"
245
- }, subMenuBrandsTitle), /*#__PURE__*/React__default.createElement("a", {
246
+ }, subMenuBrandsTitle), /*#__PURE__*/React__default.createElement(LinkComponent, {
246
247
  href: "".concat(productUrl, "/").concat(categorySlug === 'new' ? 'brands' : categorySlug),
247
248
  onClick: handleLinkClick,
248
249
  className: "side-nav__element"
249
250
  }, "All Brands"), !!brandsList.length && brandsList.map(function (brand) {
250
- return /*#__PURE__*/React__default.createElement("a", {
251
+ return /*#__PURE__*/React__default.createElement(LinkComponent, {
251
252
  href: "".concat(productUrl, "/").concat(categorySlug === 'new' ? 'brands' : categorySlug, "/").concat(brand.slug),
252
253
  onClick: handleLinkClick,
253
254
  className: "side-nav__element"
@@ -509,7 +510,8 @@
509
510
  currencyOptions = _ref.currencyOptions,
510
511
  onCurrencyChange = _ref.onCurrencyChange,
511
512
  isCurrencySelectionDisabled = _ref.isCurrencySelectionDisabled,
512
- tooltipContent = _ref.tooltipContent;
513
+ tooltipContent = _ref.tooltipContent,
514
+ LinkComponent = _ref.LinkComponent;
513
515
 
514
516
  var _useState = React.useState(false),
515
517
  _useState2 = _slicedToArray(_useState, 2),
@@ -771,7 +773,8 @@
771
773
  categorySlug: displayedSubMenu,
772
774
  isLoading: loading,
773
775
  hasError: hasError,
774
- onCloseSideNav: onCloseSideNav
776
+ onCloseSideNav: onCloseSideNav,
777
+ LinkComponent: LinkComponent
775
778
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
776
779
  subMenuOpen: subMenuOpen && displayedSubMenu === 'bags',
777
780
  onBackClick: onBackClick,
@@ -784,7 +787,8 @@
784
787
  categorySlug: displayedSubMenu,
785
788
  isLoading: loading,
786
789
  hasError: hasError,
787
- onCloseSideNav: onCloseSideNav
790
+ onCloseSideNav: onCloseSideNav,
791
+ LinkComponent: LinkComponent
788
792
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
789
793
  subMenuOpen: subMenuOpen && displayedSubMenu === 'shoes',
790
794
  onBackClick: onBackClick,
@@ -797,7 +801,8 @@
797
801
  categorySlug: displayedSubMenu,
798
802
  isLoading: loading,
799
803
  hasError: hasError,
800
- onCloseSideNav: onCloseSideNav
804
+ onCloseSideNav: onCloseSideNav,
805
+ LinkComponent: LinkComponent
801
806
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
802
807
  subMenuOpen: subMenuOpen && displayedSubMenu === 'apparel',
803
808
  onBackClick: onBackClick,
@@ -810,7 +815,8 @@
810
815
  categorySlug: displayedSubMenu,
811
816
  isLoading: loading,
812
817
  hasError: hasError,
813
- onCloseSideNav: onCloseSideNav
818
+ onCloseSideNav: onCloseSideNav,
819
+ LinkComponent: LinkComponent
814
820
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
815
821
  subMenuOpen: subMenuOpen && displayedSubMenu === 'accessories',
816
822
  onBackClick: onBackClick,
@@ -823,7 +829,8 @@
823
829
  categorySlug: displayedSubMenu,
824
830
  isLoading: loading,
825
831
  hasError: hasError,
826
- onCloseSideNav: onCloseSideNav
832
+ onCloseSideNav: onCloseSideNav,
833
+ LinkComponent: LinkComponent
827
834
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
828
835
  subMenuOpen: subMenuOpen && displayedSubMenu === 'watches',
829
836
  onBackClick: onBackClick,
@@ -836,7 +843,8 @@
836
843
  categorySlug: displayedSubMenu,
837
844
  isLoading: loading,
838
845
  hasError: hasError,
839
- onCloseSideNav: onCloseSideNav
846
+ onCloseSideNav: onCloseSideNav,
847
+ LinkComponent: LinkComponent
840
848
  }), displayedSubMenu === 'stores' && /*#__PURE__*/React__default.createElement("div", {
841
849
  className: "side-nav__content"
842
850
  }, /*#__PURE__*/React__default.createElement(StoresDropdown, {
package/build/bundle.css CHANGED
@@ -1 +1 @@
1
- .footer__newsletter-section{align-items:center;background-color:#000;color:#fff;display:flex;justify-content:space-between;padding:2.265rem 0}@media only screen and (max-width:879px){.footer__newsletter-section{flex-direction:column}}.footer__newsletter-wrapper{align-items:center;display:flex;justify-content:space-between;margin:0 auto;max-width:1280px;padding-left:32px;padding-right:32px;width:100%}@media only screen and (max-width:879px){.footer__newsletter-wrapper{flex-direction:column}.footer__link-container{flex-basis:50%}}.footer__newsletter-icon{height:30px;position:absolute;right:0;top:0;width:32px}.footer__newsletter-form{flex-basis:50%;max-width:250px;position:relative}@media only screen and (max-width:879px){.footer__newsletter-form{display:block;margin-top:20px;max-width:100%;width:100%}}.footer__newsletter-title{font-family:Martel Sans,sans-serif;font-size:14px;font-weight:700;letter-spacing:3px;margin-bottom:1.125rem;text-transform:uppercase}.footer__newsletter-text{font-size:14px}.footer__form-input{background-color:#000;border:none;border-bottom:1px solid #fff;color:#fff;height:30px;outline:none;width:100%}.footer__form-input::-moz-placeholder{color:#fff;font-weight:400}.footer__form-input::placeholder{color:#fff;font-weight:400}.footer__form-errors{color:#fff;margin-top:5px}.footer__main-section{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:50px;margin-top:80px}.footer__link-title{font-family:El Messiri;font-size:16px;font-weight:700;margin-bottom:20px;text-transform:uppercase}@media only screen and (max-width:879px){.footer__link-title{margin-bottom:10px}}.footer__link-child{margin-top:25px}.footer__links{display:flex;flex-direction:column}.footer__link{color:#939393;cursor:pointer;font-family:Martel Sans;font-size:14px;line-height:20px;margin-bottom:7px;text-align:left;text-decoration:none}.footer__link:hover{color:#000;text-decoration:underline}@media only screen and (max-width:879px){.footer__link{margin-bottom:10px}}.footer__link-wrapper{align-items:center;display:flex;gap:5px}.footer__link-icon{height:30px;margin-bottom:18px}.footer__text{color:#939393;font-family:Martel Sans;font-size:14px;line-height:20px;margin-bottom:15px;text-align:left;text-decoration:none}.footer__store-hours{margin-top:35px}.footer__copyrights-section{border-top:1px solid;display:flex;justify-content:space-between;padding-bottom:20px;padding-top:20px}.footer__logo{height:30px;width:135px}.footer__payment-icons{align-items:center;display:flex;gap:8px}.footer__wrapper{margin:0 auto;max-width:1280px;padding-left:32px;padding-right:32px;width:100%}@media only screen and (max-width:879px){.footer__wrapper{padding:32px 0 0 24px}}.footer__wrapper--desktop{display:block}@media only screen and (max-width:879px){.footer__wrapper--desktop{display:none}}.footer__wrapper--mobile{display:none}@media only screen and (max-width:879px){.footer__wrapper--mobile{display:block;padding-top:30px}}.footer__copyright{font-size:10px;line-height:22px}.footer__copyright--mobile{display:none}@media only screen and (max-width:879px){.footer__copyright--mobile{display:block;padding:30px 10px 30px 0;text-align:center}}.footer__section-row{display:flex;gap:50%}@media only screen and (max-width:879px){.footer__section-row{gap:unset}}.side-nav{font-family:Martel Sans}.side-nav__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center}.side-nav__overlay{background-color:rgba(78,73,73,.51);height:100%;opacity:0;position:fixed;top:0;transition:opacity .5s ease-out 0s,visibility .5s ease-out 0s;width:100%;z-index:99999}.side-nav__overlay--visible{opacity:1;visibility:visible}.side-nav__overlay--hidden{opacity:1;visibility:hidden}.side-nav__content{background-color:#fff;bottom:0;overflow-y:scroll;padding:1.5rem;position:fixed;top:0;transition:left .5s ease-in-out;width:80%;z-index:99999}.side-nav__content--hidden{display:none}.side-nav__content--open{left:0}.side-nav__content--closed{left:-100%}.side-nav__menu-title-wrapper{align-items:center;background-color:transparent;border:none;display:flex;justify-content:space-between;outline:none;width:100%}.side-nav__icon-container{float:right;margin-bottom:10px}.side-nav__menu-title{font-size:14px;font-weight:700;line-height:20px;text-transform:uppercase}.side-nav__accordion-icon{height:auto;width:15px}.side-nav__menu-item{margin-bottom:25px}.side-nav__close-icon{height:20px;margin-left:auto;width:20px}.side-nav__back-button-wrapper{align-items:center;display:flex;margin-bottom:25px}.side-nav__back-icon{height:20px;width:20px}.side-nav__back-button,.side-nav__sub-menu-title{font-weight:700;text-transform:uppercase}.side-nav__sub-menu-title{font-size:14px;margin-bottom:10px}.side-nav__elements{display:flex;flex-direction:column}.side-nav__element{color:#555;cursor:pointer;line-height:20px;margin-bottom:10px}.side-nav__element,.side-nav__sub-link{font-size:14px;font-weight:400;text-transform:capitalize}.side-nav__block-button{background-color:#000;color:#fff;font-weight:700;padding:10px 0;width:100%}@charset "UTF-8";.currency-select-container{align-items:center;display:flex;margin-right:18px;position:relative}.currency-select-container .currency-flag{margin-right:5px}.currency-select-container .currency-flag img{height:15px;-o-object-fit:cover;object-fit:cover;width:20px}.currency-select-container .currency-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-color:transparent;border:none;color:#000;cursor:pointer;font-family:inherit;font-size:14px;margin:0;outline:none;padding:5px 15px 5px 5px}.currency-select-container .currency-select::-ms-expand{display:none}.currency-select-container .currency-select:focus{box-shadow:none;outline:none}.currency-select-container .currency-select:-moz-focusring{color:transparent;text-shadow:0 0 0 #000}.currency-select-container:after{color:#000;content:"▼";font-size:10px;pointer-events:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}@media only screen and (max-width:879px){.currency-select-container .currency-select{appearance:menulist;-webkit-appearance:menulist;-moz-appearance:menulist;padding-right:0}.currency-select-container:after{display:none}}.currency-select-container.disabled{cursor:not-allowed;opacity:.7}.currency-select-container.disabled .currency-select{pointer-events:none}.navbar{box-shadow:2px 2px 10px #dfdede;display:flex;padding-bottom:10px;padding-top:20px;position:relative}.navbar__link-item--desktop{align-items:center;display:flex;height:35px;margin:auto 0;padding-top:5px}.navbar__mobile-wrapper{align-items:center;display:flex;flex-direction:column;padding-bottom:20px;padding-left:32px;padding-right:32px}.navbar__container{display:flex;margin:0 auto;max-width:1280px;padding-left:12px;padding-right:12px;width:100%}.navbar__body{flex-basis:60%}.navbar__wrapper{align-items:center;display:flex;justify-content:space-between;width:100%}.navbar__product-search-wrapper{align-items:center;display:flex;justify-content:center;padding:0 20%;width:100%}@media only screen and (max-width:879px){.navbar__product-search-wrapper{padding:0}}.navbar__input-close-icon{height:auto;margin-bottom:10px;margin-left:10px;width:20px}@media only screen and (max-width:879px){.navbar__input-close-icon{margin-bottom:0;margin-left:0;width:15px}}.navbar__menu-icon{width:30px}.navbar__product-search{align-items:center;display:flex;max-width:545px;width:100%}.navbar__logo-wrapper{margin-right:18px;width:200px}.navbar__logo{width:200px}@media only screen and (max-width:879px){.navbar__logo{margin-left:10px;margin-top:5px;width:125px}}.navbar__form-input{align-items:center;background:transparent;border:none;display:flex;font-size:13px;outline:none;padding:8px;width:100%}.navbar__product-search{border:1px solid #dfdede;margin-bottom:10px}@media only screen and (max-width:879px){.navbar__product-search{border:none;border-bottom:1px solid #dfdede;margin-bottom:0;margin-right:10px;margin-top:10px}}.navbar__section{align-items:flex-start;display:flex;flex-direction:row;justify-content:space-between;width:100%}.navbar__link{display:inline-block;font-family:Martel Sans;font-size:14px;font-weight:700;margin-right:10px;overflow:hidden;text-transform:uppercase;transition:.3s ease-in-out}.navbar__link:after{background-color:#000;content:"";display:block;height:2px;transition:width .25s ease-out;width:0}.navbar__link:hover:after{width:100%}.navbar__link:hover .navbar__dropdown{animation:fadeInDropdown .3s ease-in-out;display:block}.navbar__dropdown{background-color:#fff;box-shadow:5px 5px 5px #dfdede;display:none;left:0;position:absolute;width:100%;z-index:999}@keyframes fadeInDropdown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.navbar__company-link{font-size:13px;font-weight:400;list-style:none;margin-left:18px;text-decoration:none}.navbar__company-block{align-items:center;background-color:#000;color:#fff;display:flex;font-weight:700;height:33px;justify-content:center;margin-right:0;padding:0 18px;text-transform:uppercase}.navbar__input-search-icon{height:auto;margin-left:1.125rem;margin-right:.375rem;width:15px}.navbar__nav-links{align-items:center;display:flex}.navbar__nav-links--wrap{flex-wrap:wrap}.navbar__icons{align-items:center;display:flex;height:40px;justify-content:flex-end;margin-bottom:10px}@media only screen and (max-width:879px){.navbar__icons{display:block;height:20px;margin-bottom:0}}.navbar__icon{cursor:pointer;height:auto;margin-right:18px;width:20px}@media only screen and (max-width:879px){.navbar__icon{margin-right:0}}.navbar__icon--app{cursor:pointer;height:auto;margin-left:12px;width:20px}@media only screen and (max-width:879px){.navbar__icon--app{margin-right:0}}.navbar__vip-icon{height:16px;position:absolute;right:-12px;top:-4px;width:16px}.navbar__cart-icon{position:relative}.navbar__cart-count{align-items:center;background-color:#000;border-radius:50%;bottom:50%;color:#fff;display:flex;font-size:13px;height:20px;justify-content:center;left:100%;position:absolute;width:20px}.side-nav{font-family:Martel Sans}.side-nav__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center}.side-nav__overlay{background-color:rgba(78,73,73,.51);height:100%;opacity:0;position:fixed;top:0;transition:opacity .5s ease-out 0s,visibility .5s ease-out 0s;width:100%;z-index:99999}.side-nav__overlay--visible{opacity:1;visibility:visible}.side-nav__overlay--hidden{opacity:1;visibility:hidden}.side-nav__content{background-color:#fff;bottom:0;overflow-y:scroll;padding:1.5rem;position:fixed;top:0;transition:left .5s ease-in-out;width:80%;z-index:99999}.side-nav__content--hidden{display:none}.side-nav__content--open{left:0}.side-nav__content--closed{left:-100%}.side-nav__menu-title-wrapper{align-items:center;background-color:transparent;border:none;display:flex;outline:none;width:100%}.side-nav__icon-container{float:right;margin-bottom:10px}.side-nav__menu-title{align-items:center;display:flex;font-size:14px;font-weight:700;justify-content:center;line-height:20px;text-transform:uppercase}.side-nav__menu-icon{display:flex;height:25px;margin-right:10px;width:25px}.side-nav__menu-divider{margin-bottom:40px}.side-nav__accordion-icon{height:auto;width:15px}.side-nav__menu-item{margin-bottom:25px}.side-nav__close-icon{height:20px;margin-left:auto;width:20px}.side-nav__back-button-wrapper{align-items:center;display:flex;margin-bottom:25px}.side-nav__back-icon{height:20px;width:20px}.side-nav__back-button,.side-nav__sub-menu-title{font-weight:700;text-transform:uppercase}.side-nav__sub-menu-title{font-size:14px;margin-bottom:10px}.side-nav__elements{display:flex;flex-direction:column}.side-nav__element{color:#555;cursor:pointer;line-height:20px;margin-bottom:10px}.side-nav__element,.side-nav__sub-link{font-size:14px;font-weight:400;text-transform:capitalize}.side-nav__block-button{background-color:#000;color:#fff;font-weight:700;padding:10px 0;width:100%}.dropdown{display:flex;justify-content:space-between;margin-left:auto;margin-right:auto;max-width:1280px;min-height:500px;overflow-x:auto;padding:20px 0}.dropdown__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center;min-height:300px}.dropdown__column{flex:1;padding-left:12px}.dropdown__column:nth-child(2){flex:2}.dropdown__title{font-family:El Messiri;font-size:16px;font-weight:700;letter-spacing:3px;line-height:1;margin-bottom:20px;text-transform:uppercase}.dropdown__elements{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));max-height:800px;overflow-y:auto}.dropdown__brand-elements{-moz-column-count:3;column-count:3;max-height:800px}.dropdown__brand-element{cursor:pointer;margin-bottom:10px}.dropdown__element{flex-basis:33.33%;font-family:Martel Sans;font-size:14px;font-weight:400;margin-bottom:10px;text-transform:capitalize}.cover-spinner{align-items:center;background-color:hsla(0,0%,100%,.7);display:flex;height:100%;justify-content:center;min-height:400px;position:relative;top:50%;width:100%;z-index:9999}.cover-spinner:after{animation:spin 1.5s linear infinite;border:4px dotted #000;border-radius:50%;border-top-color:transparent;content:"";display:block;height:40px;position:absolute;width:40px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.stores-dropdown{align-items:flex-start;display:flex;font-family:Martel Sans;gap:20px;margin-left:auto;margin-right:auto;max-width:1280px;overflow-x:auto;padding:20px 15px}.stores-dropdown__image{height:200px;-o-object-fit:cover;object-fit:cover;width:100%}.stores-dropdown__store-details{flex-basis:20%}.stores-dropdown__title{font-family:El Messiri}.stores-dropdown__main-title,.stores-dropdown__title{font-size:16px;font-weight:400;letter-spacing:3px;margin-top:20px}.stores-dropdown__main-title{font-weight:700;margin-bottom:10px}.stores-dropdown__open-days{font-size:12px;font-weight:700;line-height:20px}.stores-dropdown__open-hours{font-size:12px;font-weight:400;line-height:20px}.stores-dropdown__queries-title{font-family:El Messiri;font-size:16px;font-weight:400;letter-spacing:3px}.stores-dropdown__contact-details{font-size:16px;font-weight:700}.stores-dropdown__view-more{cursor:pointer;font-size:14px;font-weight:400;margin-top:10px;text-transform:capitalize}
1
+ .footer__newsletter-section{align-items:center;background-color:#000;color:#fff;display:flex;justify-content:space-between;padding:2.265rem 0}@media only screen and (max-width:879px){.footer__newsletter-section{flex-direction:column}}.footer__newsletter-wrapper{align-items:center;display:flex;justify-content:space-between;margin:0 auto;max-width:1280px;padding-left:32px;padding-right:32px;width:100%}@media only screen and (max-width:879px){.footer__newsletter-wrapper{flex-direction:column}.footer__link-container{flex-basis:50%}}.footer__newsletter-icon{height:30px;position:absolute;right:0;top:0;width:32px}.footer__newsletter-form{flex-basis:50%;max-width:250px;position:relative}@media only screen and (max-width:879px){.footer__newsletter-form{display:block;margin-top:20px;max-width:100%;width:100%}}.footer__newsletter-title{font-family:Martel Sans,sans-serif;font-size:14px;font-weight:700;letter-spacing:3px;margin-bottom:1.125rem;text-transform:uppercase}.footer__newsletter-text{font-size:14px}.footer__form-input{background-color:#000;border:none;border-bottom:1px solid #fff;color:#fff;height:30px;outline:none;width:100%}.footer__form-input::-moz-placeholder{color:#fff;font-weight:400}.footer__form-input::placeholder{color:#fff;font-weight:400}.footer__form-errors{color:#fff;margin-top:5px}.footer__main-section{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:50px;margin-top:80px}.footer__link-title{font-family:El Messiri;font-size:16px;font-weight:700;margin-bottom:20px;text-transform:uppercase}@media only screen and (max-width:879px){.footer__link-title{margin-bottom:10px}}.footer__link-child{margin-top:25px}.footer__links{display:flex;flex-direction:column}.footer__link{color:#939393;cursor:pointer;font-family:Martel Sans;font-size:14px;line-height:20px;margin-bottom:7px;text-align:left;text-decoration:none}.footer__link:hover{color:#000;text-decoration:underline}@media only screen and (max-width:879px){.footer__link{margin-bottom:10px}}.footer__link-wrapper{align-items:center;display:flex;gap:5px}.footer__link-icon{height:30px;margin-bottom:18px}.footer__text{color:#939393;font-family:Martel Sans;font-size:14px;line-height:20px;margin-bottom:15px;text-align:left;text-decoration:none}.footer__store-hours{margin-top:35px}.footer__copyrights-section{border-top:1px solid;display:flex;justify-content:space-between;padding-bottom:20px;padding-top:20px}.footer__logo{height:30px;width:135px}.footer__payment-icons{align-items:center;display:flex;gap:8px}.footer__wrapper{margin:0 auto;max-width:1280px;padding-left:32px;padding-right:32px;width:100%}@media only screen and (max-width:879px){.footer__wrapper{padding:32px 0 0 24px}}.footer__wrapper--desktop{display:block}@media only screen and (max-width:879px){.footer__wrapper--desktop{display:none}}.footer__wrapper--mobile{display:none}@media only screen and (max-width:879px){.footer__wrapper--mobile{display:block;padding-top:30px}}.footer__copyright{font-size:10px;line-height:22px}.footer__copyright--mobile{display:none}@media only screen and (max-width:879px){.footer__copyright--mobile{display:block;padding:30px 10px 30px 0;text-align:center}}.footer__section-row{display:flex;gap:50%}@media only screen and (max-width:879px){.footer__section-row{gap:unset}}.side-nav{font-family:Martel Sans}.side-nav__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center}.side-nav__overlay{background-color:rgba(78,73,73,.51);height:100%;opacity:0;position:fixed;top:0;transition:opacity .5s ease-out 0s,visibility .5s ease-out 0s;width:100%;z-index:99999}.side-nav__overlay--visible{opacity:1;visibility:visible}.side-nav__overlay--hidden{opacity:1;visibility:hidden}.side-nav__content{background-color:#fff;bottom:0;overflow-y:scroll;padding:1.5rem;position:fixed;top:0;transition:left .5s ease-in-out;width:80%;z-index:99999}.side-nav__content--hidden{display:none}.side-nav__content--open{left:0}.side-nav__content--closed{left:-100%}.side-nav__menu-title-wrapper{align-items:center;background-color:transparent;border:none;display:flex;outline:none;width:100%}.side-nav__icon-container{float:right;margin-bottom:10px}.side-nav__menu-title{align-items:center;display:flex;font-size:14px;font-weight:700;justify-content:center;line-height:20px;text-transform:uppercase}.side-nav__menu-icon{display:flex;height:25px;margin-right:10px;width:25px}.side-nav__menu-divider{margin-bottom:40px}.side-nav__accordion-icon{height:auto;width:15px}.side-nav__menu-item{margin-bottom:25px}.side-nav__close-icon{height:20px;margin-left:auto;width:20px}.side-nav__back-button-wrapper{align-items:center;display:flex;margin-bottom:25px}.side-nav__back-icon{height:20px;width:20px}.side-nav__back-button,.side-nav__sub-menu-title{font-weight:700;text-transform:uppercase}.side-nav__sub-menu-title{font-size:14px;margin-bottom:10px}.side-nav__elements{display:flex;flex-direction:column}.side-nav__element{color:#555;cursor:pointer;line-height:20px;margin-bottom:10px}.side-nav__element,.side-nav__sub-link{font-size:14px;font-weight:400;text-transform:capitalize}.side-nav__block-button{background-color:#000;color:#fff;font-weight:700;padding:10px 0;width:100%}.navbar{box-shadow:2px 2px 10px #dfdede;display:flex;padding-bottom:10px;padding-top:20px;position:relative}.navbar__link-item--desktop{align-items:center;display:flex;height:35px;margin:auto 0;padding-top:5px}.navbar__mobile-wrapper{align-items:center;display:flex;flex-direction:column;padding-bottom:20px;padding-left:32px;padding-right:32px}.navbar__container{display:flex;margin:0 auto;max-width:1280px;padding-left:12px;padding-right:12px;width:100%}.navbar__body{flex-basis:60%}.navbar__wrapper{align-items:center;display:flex;justify-content:space-between;width:100%}.navbar__product-search-wrapper{align-items:center;display:flex;justify-content:center;padding:0 20%;width:100%}@media only screen and (max-width:879px){.navbar__product-search-wrapper{padding:0}}.navbar__input-close-icon{height:auto;margin-bottom:10px;margin-left:10px;width:20px}@media only screen and (max-width:879px){.navbar__input-close-icon{margin-bottom:0;margin-left:0;width:15px}}.navbar__menu-icon{width:30px}.navbar__product-search{align-items:center;display:flex;max-width:545px;width:100%}.navbar__logo-wrapper{margin-right:18px;width:200px}.navbar__logo{width:200px}@media only screen and (max-width:879px){.navbar__logo{margin-left:10px;margin-top:5px;width:125px}}.navbar__form-input{align-items:center;background:transparent;border:none;display:flex;font-size:13px;outline:none;padding:8px;width:100%}.navbar__product-search{border:1px solid #dfdede;margin-bottom:10px}@media only screen and (max-width:879px){.navbar__product-search{border:none;border-bottom:1px solid #dfdede;margin-bottom:0;margin-right:10px;margin-top:10px}}.navbar__section{align-items:flex-start;display:flex;flex-direction:row;justify-content:space-between;width:100%}.navbar__link{display:inline-block;font-family:Martel Sans;font-size:14px;font-weight:700;margin-right:10px;overflow:hidden;text-transform:uppercase;transition:.3s ease-in-out}.navbar__link:after{background-color:#000;content:"";display:block;height:2px;transition:width .25s ease-out;width:0}.navbar__link:hover:after{width:100%}.navbar__link:hover .navbar__dropdown{animation:fadeInDropdown .3s ease-in-out;display:block}.navbar__dropdown{background-color:#fff;box-shadow:5px 5px 5px #dfdede;display:none;left:0;position:absolute;width:100%;z-index:999}@keyframes fadeInDropdown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.navbar__company-link{font-size:13px;font-weight:400;list-style:none;margin-left:18px;text-decoration:none}.navbar__company-block{align-items:center;background-color:#000;color:#fff;display:flex;font-weight:700;height:33px;justify-content:center;margin-right:0;padding:0 18px;text-transform:uppercase}.navbar__input-search-icon{height:auto;margin-left:1.125rem;margin-right:.375rem;width:15px}.navbar__nav-links{align-items:center;display:flex}.navbar__nav-links--wrap{flex-wrap:wrap}.navbar__icons{align-items:center;display:flex;height:40px;justify-content:flex-end;margin-bottom:10px}@media only screen and (max-width:879px){.navbar__icons{display:block;height:20px;margin-bottom:0}}.navbar__icon{cursor:pointer;height:auto;margin-right:18px;width:20px}@media only screen and (max-width:879px){.navbar__icon{margin-right:0}}.navbar__icon--app{cursor:pointer;height:auto;margin-left:12px;width:20px}@media only screen and (max-width:879px){.navbar__icon--app{margin-right:0}}.navbar__vip-icon{height:16px;position:absolute;right:-12px;top:-4px;width:16px}.navbar__cart-icon{position:relative}.navbar__cart-count{align-items:center;background-color:#000;border-radius:50%;bottom:50%;color:#fff;display:flex;font-size:13px;height:20px;justify-content:center;left:100%;position:absolute;width:20px}.side-nav{font-family:Martel Sans}.side-nav__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center}.side-nav__overlay{background-color:rgba(78,73,73,.51);height:100%;opacity:0;position:fixed;top:0;transition:opacity .5s ease-out 0s,visibility .5s ease-out 0s;width:100%;z-index:99999}.side-nav__overlay--visible{opacity:1;visibility:visible}.side-nav__overlay--hidden{opacity:1;visibility:hidden}.side-nav__content{background-color:#fff;bottom:0;overflow-y:scroll;padding:1.5rem;position:fixed;top:0;transition:left .5s ease-in-out;width:80%;z-index:99999}.side-nav__content--hidden{display:none}.side-nav__content--open{left:0}.side-nav__content--closed{left:-100%}.side-nav__menu-title-wrapper{align-items:center;background-color:transparent;border:none;display:flex;justify-content:space-between;outline:none;width:100%}.side-nav__icon-container{float:right;margin-bottom:10px}.side-nav__menu-title{font-size:14px;font-weight:700;line-height:20px;text-transform:uppercase}.side-nav__accordion-icon{height:auto;width:15px}.side-nav__menu-item{margin-bottom:25px}.side-nav__close-icon{height:20px;margin-left:auto;width:20px}.side-nav__back-button-wrapper{align-items:center;display:flex;margin-bottom:25px}.side-nav__back-icon{height:20px;width:20px}.side-nav__back-button,.side-nav__sub-menu-title{font-weight:700;text-transform:uppercase}.side-nav__sub-menu-title{font-size:14px;margin-bottom:10px}.side-nav__elements{display:flex;flex-direction:column}.side-nav__element{color:#555;cursor:pointer;line-height:20px;margin-bottom:10px}.side-nav__element,.side-nav__sub-link{font-size:14px;font-weight:400;text-transform:capitalize}.side-nav__block-button{background-color:#000;color:#fff;font-weight:700;padding:10px 0;width:100%}@charset "UTF-8";.currency-select-container{align-items:center;display:flex;margin-right:18px;position:relative}.currency-select-container .currency-flag{margin-right:5px}.currency-select-container .currency-flag img{height:15px;-o-object-fit:cover;object-fit:cover;width:20px}.currency-select-container .currency-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-color:transparent;border:none;color:#000;cursor:pointer;font-family:inherit;font-size:14px;margin:0;outline:none;padding:5px 15px 5px 5px}.currency-select-container .currency-select::-ms-expand{display:none}.currency-select-container .currency-select:focus{box-shadow:none;outline:none}.currency-select-container .currency-select:-moz-focusring{color:transparent;text-shadow:0 0 0 #000}.currency-select-container:after{color:#000;content:"▼";font-size:10px;pointer-events:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}@media only screen and (max-width:879px){.currency-select-container .currency-select{appearance:menulist;-webkit-appearance:menulist;-moz-appearance:menulist;padding-right:0}.currency-select-container:after{display:none}}.currency-select-container.disabled{cursor:not-allowed;opacity:.7}.currency-select-container.disabled .currency-select{pointer-events:none}.stores-dropdown{align-items:flex-start;display:flex;font-family:Martel Sans;gap:20px;margin-left:auto;margin-right:auto;max-width:1280px;overflow-x:auto;padding:20px 15px}.stores-dropdown__image{height:200px;-o-object-fit:cover;object-fit:cover;width:100%}.stores-dropdown__store-details{flex-basis:20%}.stores-dropdown__title{font-family:El Messiri}.stores-dropdown__main-title,.stores-dropdown__title{font-size:16px;font-weight:400;letter-spacing:3px;margin-top:20px}.stores-dropdown__main-title{font-weight:700;margin-bottom:10px}.stores-dropdown__open-days{font-size:12px;font-weight:700;line-height:20px}.stores-dropdown__open-hours{font-size:12px;font-weight:400;line-height:20px}.stores-dropdown__queries-title{font-family:El Messiri;font-size:16px;font-weight:400;letter-spacing:3px}.stores-dropdown__contact-details{font-size:16px;font-weight:700}.stores-dropdown__view-more{cursor:pointer;font-size:14px;font-weight:400;margin-top:10px;text-transform:capitalize}.dropdown{display:flex;justify-content:space-between;margin-left:auto;margin-right:auto;max-width:1280px;min-height:500px;overflow-x:auto;padding:20px 0}.dropdown__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center;min-height:300px}.dropdown__column{flex:1;padding-left:12px}.dropdown__column:nth-child(2){flex:2}.dropdown__title{font-family:El Messiri;font-size:16px;font-weight:700;letter-spacing:3px;line-height:1;margin-bottom:20px;text-transform:uppercase}.dropdown__elements{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));max-height:800px;overflow-y:auto}.dropdown__brand-elements{-moz-column-count:3;column-count:3;max-height:800px}.dropdown__brand-element{cursor:pointer;margin-bottom:10px}.dropdown__element{flex-basis:33.33%;font-family:Martel Sans;font-size:14px;font-weight:400;margin-bottom:10px;text-transform:capitalize}.cover-spinner{align-items:center;background-color:hsla(0,0%,100%,.7);display:flex;height:100%;justify-content:center;min-height:400px;position:relative;top:50%;width:100%;z-index:9999}.cover-spinner:after{animation:spin 1.5s linear infinite;border:4px dotted #000;border-radius:50%;border-top-color:transparent;content:"";display:block;height:40px;position:absolute;width:40px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
package/build/bundle.js CHANGED
@@ -14657,10 +14657,12 @@
14657
14657
  _ref$brandElements = _ref.brandElements,
14658
14658
  brandElements = _ref$brandElements === void 0 ? [] : _ref$brandElements,
14659
14659
  productsUrl = _ref.productsUrl,
14660
+ LinkComponent = _ref.LinkComponent,
14660
14661
  categorySlug = _ref.categorySlug,
14661
14662
  categoryTitle = _ref.categoryTitle,
14662
14663
  isLoading = _ref.isLoading,
14663
- hasError = _ref.hasError;
14664
+ hasError = _ref.hasError,
14665
+ onMenuItemClick = _ref.onMenuItemClick;
14664
14666
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, hasError ? /*#__PURE__*/React__default.createElement("div", {
14665
14667
  className: "dropdown__errors"
14666
14668
  }, "Failed to load data.") : /*#__PURE__*/React__default.createElement("div", {
@@ -14674,14 +14676,16 @@
14674
14676
  }, title), /*#__PURE__*/React__default.createElement("div", {
14675
14677
  className: "dropdown__elements dropdown__elements--column"
14676
14678
  }, !!categoryElements.length && categoryElements.map(function (categoryElement) {
14677
- return categoryElement.category ? /*#__PURE__*/React__default.createElement("a", {
14679
+ return categoryElement.category ? /*#__PURE__*/React__default.createElement(LinkComponent, {
14678
14680
  href: "".concat(productsUrl, "/").concat(categoryElement.category, "/").concat(categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.slug),
14679
14681
  className: "dropdown__element",
14680
- key: categoryElement.name
14681
- }, categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.name.toLowerCase()) : /*#__PURE__*/React__default.createElement("a", {
14682
+ key: categoryElement.name,
14683
+ onClick: onMenuItemClick
14684
+ }, categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.name.toLowerCase()) : /*#__PURE__*/React__default.createElement(LinkComponent, {
14682
14685
  href: "".concat(productsUrl, "/").concat(categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.slug),
14683
14686
  className: "dropdown__element",
14684
- key: categoryElement.name
14687
+ key: categoryElement.name,
14688
+ onClick: onMenuItemClick
14685
14689
  }, categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.name.toLowerCase());
14686
14690
  }))), /*#__PURE__*/React__default.createElement("div", {
14687
14691
  className: "dropdown__column"
@@ -14691,16 +14695,18 @@
14691
14695
  className: "dropdown__brand-elements"
14692
14696
  }, /*#__PURE__*/React__default.createElement("div", {
14693
14697
  className: "dropdown__brand-element"
14694
- }, /*#__PURE__*/React__default.createElement("a", {
14698
+ }, /*#__PURE__*/React__default.createElement(LinkComponent, {
14695
14699
  href: "".concat(productsUrl, "/").concat(categorySlug),
14696
- className: "dropdown__element"
14700
+ className: "dropdown__element",
14701
+ onClick: onMenuItemClick
14697
14702
  }, "All ", categoryTitle)), !!brandElements.length && brandElements.map(function (brand) {
14698
14703
  return /*#__PURE__*/React__default.createElement("div", {
14699
14704
  className: "dropdown__brand-element"
14700
- }, /*#__PURE__*/React__default.createElement("a", {
14705
+ }, /*#__PURE__*/React__default.createElement(LinkComponent, {
14701
14706
  href: "".concat(productsUrl, "/").concat(categorySlug, "/").concat(brand === null || brand === void 0 ? void 0 : brand.slug),
14702
14707
  className: "dropdown__element",
14703
- key: brand.name
14708
+ key: brand.name,
14709
+ onClick: onMenuItemClick
14704
14710
  }, brand === null || brand === void 0 ? void 0 : brand.name));
14705
14711
  }))), /*#__PURE__*/React__default.createElement("div", {
14706
14712
  className: "dropdown__column"
@@ -14710,6 +14716,56 @@
14710
14716
  })))));
14711
14717
  };
14712
14718
 
14719
+ var DropdownLink$1 = function DropdownLink(_ref) {
14720
+ var title = _ref.title,
14721
+ imageSrc = _ref.imageSrc,
14722
+ categoryElements = _ref.categoryElements,
14723
+ brandElements = _ref.brandElements,
14724
+ productsUrl = _ref.productsUrl,
14725
+ LinkComponent = _ref.LinkComponent,
14726
+ categorySlug = _ref.categorySlug,
14727
+ categoryTitle = _ref.categoryTitle,
14728
+ isLoading = _ref.isLoading,
14729
+ hasError = _ref.hasError;
14730
+
14731
+ var _useState = React.useState(false),
14732
+ _useState2 = _slicedToArray(_useState, 2),
14733
+ dropdownVisible = _useState2[0],
14734
+ setDropdownVisible = _useState2[1];
14735
+
14736
+ var handleMenuItemClick = function handleMenuItemClick() {
14737
+ setDropdownVisible(false);
14738
+ };
14739
+
14740
+ return /*#__PURE__*/React__default.createElement("li", {
14741
+ className: "navbar__link",
14742
+ onMouseEnter: function onMouseEnter() {
14743
+ return setDropdownVisible(true);
14744
+ },
14745
+ onMouseLeave: function onMouseLeave() {
14746
+ return setDropdownVisible(false);
14747
+ }
14748
+ }, /*#__PURE__*/React__default.createElement(LinkComponent, {
14749
+ href: "".concat(productsUrl, "/").concat(categorySlug),
14750
+ className: "navbar__link-item navbar__link-item--desktop",
14751
+ onClick: handleMenuItemClick
14752
+ }, title), dropdownVisible && /*#__PURE__*/React__default.createElement("div", {
14753
+ className: "navbar__dropdown"
14754
+ }, /*#__PURE__*/React__default.createElement(Dropdown$1, {
14755
+ title: "Department",
14756
+ imageSrc: imageSrc,
14757
+ categoryElements: categoryElements,
14758
+ brandElements: brandElements,
14759
+ productsUrl: productsUrl,
14760
+ categorySlug: categorySlug,
14761
+ categoryTitle: categoryTitle,
14762
+ isLoading: isLoading,
14763
+ hasError: hasError,
14764
+ onMenuItemClick: handleMenuItemClick,
14765
+ LinkComponent: LinkComponent
14766
+ })));
14767
+ };
14768
+
14713
14769
  var StoresDropdown = function StoresDropdown(_ref) {
14714
14770
  var _ref$stores = _ref.stores,
14715
14771
  stores = _ref$stores === void 0 ? [] : _ref$stores,
@@ -14853,6 +14909,7 @@
14853
14909
  stores = _ref.stores,
14854
14910
  contactNumber = _ref.contactNumber,
14855
14911
  productsUrl = _ref.productsUrl,
14912
+ LinkComponent = _ref.LinkComponent,
14856
14913
  onInterestClick = _ref.onInterestClick,
14857
14914
  onCartClick = _ref.onCartClick,
14858
14915
  onAccountClick = _ref.onAccountClick,
@@ -15074,15 +15131,8 @@
15074
15131
  setSearchValue: setSearchValue
15075
15132
  }), /*#__PURE__*/React__default.createElement("nav", {
15076
15133
  className: "navbar__nav-links navbar__nav-links--wrap"
15077
- }, /*#__PURE__*/React__default.createElement("li", {
15078
- className: "navbar__link"
15079
- }, /*#__PURE__*/React__default.createElement("a", {
15080
- href: "".concat(productsUrl, "/brands"),
15081
- className: "navbar__link-item navbar__link-item--desktop"
15082
- }, "New"), /*#__PURE__*/React__default.createElement("div", {
15083
- className: "navbar__dropdown"
15084
- }, /*#__PURE__*/React__default.createElement(Dropdown$1, {
15085
- title: "Department",
15134
+ }, /*#__PURE__*/React__default.createElement(DropdownLink$1, {
15135
+ title: "New",
15086
15136
  imageSrc: newBrandsImage,
15087
15137
  categoryElements: categoryElements,
15088
15138
  brandElements: dropdownData.latestArrivals,
@@ -15090,16 +15140,10 @@
15090
15140
  categorySlug: "brands",
15091
15141
  categoryTitle: "Brands",
15092
15142
  isLoading: loading,
15093
- hasError: hasError
15094
- }))), /*#__PURE__*/React__default.createElement("li", {
15095
- className: "navbar__link"
15096
- }, /*#__PURE__*/React__default.createElement("a", {
15097
- href: "".concat(productsUrl, "/bags"),
15098
- className: "navbar__link-item navbar__link-item--desktop"
15099
- }, "Bags"), /*#__PURE__*/React__default.createElement("div", {
15100
- className: "navbar__dropdown"
15101
- }, /*#__PURE__*/React__default.createElement(Dropdown$1, {
15102
- title: "Department",
15143
+ hasError: hasError,
15144
+ LinkComponent: LinkComponent
15145
+ }), /*#__PURE__*/React__default.createElement(DropdownLink$1, {
15146
+ title: "Bags",
15103
15147
  imageSrc: bagsImage,
15104
15148
  categoryElements: addCategoryToElements(categoryElements, categories$1.bags.slug),
15105
15149
  brandElements: dropdownData.bags,
@@ -15107,16 +15151,10 @@
15107
15151
  categorySlug: categories$1.bags.slug,
15108
15152
  categoryTitle: categories$1.bags.name,
15109
15153
  isLoading: loading,
15110
- hasError: hasError
15111
- }))), /*#__PURE__*/React__default.createElement("li", {
15112
- className: "navbar__link"
15113
- }, /*#__PURE__*/React__default.createElement("a", {
15114
- href: "".concat(productsUrl, "/shoes"),
15115
- className: "navbar__link-item navbar__link-item--desktop"
15116
- }, "Shoes"), /*#__PURE__*/React__default.createElement("div", {
15117
- className: "navbar__dropdown"
15118
- }, /*#__PURE__*/React__default.createElement(Dropdown$1, {
15119
- title: "Department",
15154
+ hasError: hasError,
15155
+ LinkComponent: LinkComponent
15156
+ }), /*#__PURE__*/React__default.createElement(DropdownLink$1, {
15157
+ title: "Shoes",
15120
15158
  imageSrc: shoesImage,
15121
15159
  categoryElements: addCategoryToElements(categoryElements, categories$1.shoes.slug),
15122
15160
  brandElements: dropdownData.shoes,
@@ -15124,16 +15162,10 @@
15124
15162
  categorySlug: categories$1.shoes.slug,
15125
15163
  categoryTitle: categories$1.shoes.name,
15126
15164
  isLoading: loading,
15127
- hasError: hasError
15128
- }))), /*#__PURE__*/React__default.createElement("li", {
15129
- className: "navbar__link"
15130
- }, /*#__PURE__*/React__default.createElement("a", {
15131
- href: "".concat(productsUrl, "/apparel"),
15132
- className: "navbar__link-item navbar__link-item--desktop"
15133
- }, "Clothing"), /*#__PURE__*/React__default.createElement("div", {
15134
- className: "navbar__dropdown"
15135
- }, /*#__PURE__*/React__default.createElement(Dropdown$1, {
15136
- title: "Department",
15165
+ hasError: hasError,
15166
+ LinkComponent: LinkComponent
15167
+ }), /*#__PURE__*/React__default.createElement(DropdownLink$1, {
15168
+ title: "Clothing",
15137
15169
  imageSrc: clothingImage,
15138
15170
  categoryElements: addCategoryToElements(dropdownData.apparelStyles, categories$1.clothing.slug),
15139
15171
  brandElements: dropdownData.apparel,
@@ -15141,16 +15173,10 @@
15141
15173
  categorySlug: categories$1.clothing.slug,
15142
15174
  categoryTitle: categories$1.clothing.name,
15143
15175
  isLoading: loading,
15144
- hasError: hasError
15145
- }))), /*#__PURE__*/React__default.createElement("li", {
15146
- className: "navbar__link"
15147
- }, /*#__PURE__*/React__default.createElement("a", {
15148
- href: "".concat(productsUrl, "/accessories"),
15149
- className: "navbar__link-item navbar__link-item--desktop"
15150
- }, "Accessories"), /*#__PURE__*/React__default.createElement("div", {
15151
- className: "navbar__dropdown"
15152
- }, /*#__PURE__*/React__default.createElement(Dropdown$1, {
15153
- title: "Categories",
15176
+ hasError: hasError,
15177
+ LinkComponent: LinkComponent
15178
+ }), /*#__PURE__*/React__default.createElement(DropdownLink$1, {
15179
+ title: "Accessories",
15154
15180
  imageSrc: accessoriesImage,
15155
15181
  categoryElements: removeCategoryByName(dropdownData.accessoriesCategories, 'ACCESSORIES'),
15156
15182
  brandElements: dropdownData.accessories,
@@ -15158,16 +15184,10 @@
15158
15184
  categorySlug: categories$1.accessories.slug,
15159
15185
  categoryTitle: categories$1.accessories.name,
15160
15186
  isLoading: loading,
15161
- hasError: hasError
15162
- }))), /*#__PURE__*/React__default.createElement("li", {
15163
- className: "navbar__link"
15164
- }, /*#__PURE__*/React__default.createElement("a", {
15165
- href: "".concat(productsUrl, "/watches"),
15166
- className: "navbar__link-item navbar__link-item--desktop"
15167
- }, "Watches"), /*#__PURE__*/React__default.createElement("div", {
15168
- className: "navbar__dropdown"
15169
- }, /*#__PURE__*/React__default.createElement(Dropdown$1, {
15170
- title: "Department",
15187
+ hasError: hasError,
15188
+ LinkComponent: LinkComponent
15189
+ }), /*#__PURE__*/React__default.createElement(DropdownLink$1, {
15190
+ title: "Watches",
15171
15191
  imageSrc: watchesImage,
15172
15192
  categoryElements: addCategoryToElements(categoryElements, categories$1.watches.slug),
15173
15193
  brandElements: dropdownData.watches,
@@ -15175,10 +15195,11 @@
15175
15195
  categorySlug: categories$1.watches.slug,
15176
15196
  categoryTitle: categories$1.watches.name,
15177
15197
  isLoading: loading,
15178
- hasError: hasError
15179
- }))), /*#__PURE__*/React__default.createElement("li", {
15198
+ hasError: hasError,
15199
+ LinkComponent: LinkComponent
15200
+ }), /*#__PURE__*/React__default.createElement("li", {
15180
15201
  className: "navbar__link"
15181
- }, /*#__PURE__*/React__default.createElement("a", {
15202
+ }, /*#__PURE__*/React__default.createElement(LinkComponent, {
15182
15203
  href: contactUsLink,
15183
15204
  className: "navbar__link-item navbar__link-item--desktop"
15184
15205
  }, "Stores"), /*#__PURE__*/React__default.createElement("div", {
@@ -15199,7 +15220,10 @@
15199
15220
  }), shop && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("button", {
15200
15221
  type: "button",
15201
15222
  className: "navbar__icon relative flex",
15202
- onClick: onAccountClick
15223
+ onClick: onAccountClick,
15224
+ style: {
15225
+ marginRight: isVip ? '15px' : '5px'
15226
+ }
15203
15227
  }, /*#__PURE__*/React__default.createElement("img", {
15204
15228
  src: accountIcon,
15205
15229
  alt: "account-icon",
@@ -15211,7 +15235,7 @@
15211
15235
  className: "navbar__vip-icon",
15212
15236
  width: 16,
15213
15237
  height: 16
15214
- })), isVip && /*#__PURE__*/React__default.createElement("button", {
15238
+ })), name && /*#__PURE__*/React__default.createElement("button", {
15215
15239
  type: "button",
15216
15240
  className: "mr-3",
15217
15241
  onClick: onAccountClick
@@ -15241,12 +15265,12 @@
15241
15265
  className: "navbar__nav-links"
15242
15266
  }, /*#__PURE__*/React__default.createElement("li", {
15243
15267
  className: "navbar__company-link"
15244
- }, /*#__PURE__*/React__default.createElement("a", {
15268
+ }, /*#__PURE__*/React__default.createElement(LinkComponent, {
15245
15269
  href: ourStoryLink,
15246
15270
  className: "navbar__link-item"
15247
15271
  }, "Our Story")), /*#__PURE__*/React__default.createElement("li", {
15248
15272
  className: "navbar__company-link"
15249
- }, /*#__PURE__*/React__default.createElement("a", {
15273
+ }, /*#__PURE__*/React__default.createElement(LinkComponent, {
15250
15274
  href: contactUsLink,
15251
15275
  className: "navbar__link-item"
15252
15276
  }, "Contact Us")), /*#__PURE__*/React__default.createElement("li", {
@@ -15313,7 +15337,8 @@
15313
15337
  brandsList = _ref$brandsList === void 0 ? [] : _ref$brandsList,
15314
15338
  categorySlug = _ref.categorySlug,
15315
15339
  isLoading = _ref.isLoading,
15316
- hasError = _ref.hasError;
15340
+ hasError = _ref.hasError,
15341
+ LinkComponent = _ref.LinkComponent;
15317
15342
 
15318
15343
  var handleLinkClick = function handleLinkClick(event) {
15319
15344
  event.preventDefault();
@@ -15348,12 +15373,12 @@
15348
15373
  }, subMenuCategoryTitle), /*#__PURE__*/React__default.createElement("div", {
15349
15374
  className: "side-nav__elements"
15350
15375
  }, categoryElements.map(function (categoryElement) {
15351
- return categoryElement.category ? /*#__PURE__*/React__default.createElement("a", {
15376
+ return categoryElement.category ? /*#__PURE__*/React__default.createElement(LinkComponent, {
15352
15377
  href: "".concat(productUrl, "/").concat(categoryElement.category, "/").concat(categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.slug),
15353
15378
  onClick: handleLinkClick,
15354
15379
  className: "dropdown__element",
15355
15380
  key: categoryElement.name
15356
- }, categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.name.toLowerCase()) : /*#__PURE__*/React__default.createElement("a", {
15381
+ }, categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.name.toLowerCase()) : /*#__PURE__*/React__default.createElement(LinkComponent, {
15357
15382
  href: "".concat(productUrl, "/").concat(categoryElement === null || categoryElement === void 0 ? void 0 : categoryElement.slug),
15358
15383
  onClick: handleLinkClick,
15359
15384
  className: "dropdown__element",
@@ -15363,12 +15388,12 @@
15363
15388
  className: "side-nav__elements"
15364
15389
  }, /*#__PURE__*/React__default.createElement("div", {
15365
15390
  className: "side-nav__sub-menu-title"
15366
- }, subMenuBrandsTitle), /*#__PURE__*/React__default.createElement("a", {
15391
+ }, subMenuBrandsTitle), /*#__PURE__*/React__default.createElement(LinkComponent, {
15367
15392
  href: "".concat(productUrl, "/").concat(categorySlug === 'new' ? 'brands' : categorySlug),
15368
15393
  onClick: handleLinkClick,
15369
15394
  className: "side-nav__element"
15370
15395
  }, "All Brands"), !!brandsList.length && brandsList.map(function (brand) {
15371
- return /*#__PURE__*/React__default.createElement("a", {
15396
+ return /*#__PURE__*/React__default.createElement(LinkComponent, {
15372
15397
  href: "".concat(productUrl, "/").concat(categorySlug === 'new' ? 'brands' : categorySlug, "/").concat(brand.slug),
15373
15398
  onClick: handleLinkClick,
15374
15399
  className: "side-nav__element"
@@ -15396,7 +15421,8 @@
15396
15421
  currencyOptions = _ref.currencyOptions,
15397
15422
  onCurrencyChange = _ref.onCurrencyChange,
15398
15423
  isCurrencySelectionDisabled = _ref.isCurrencySelectionDisabled,
15399
- tooltipContent = _ref.tooltipContent;
15424
+ tooltipContent = _ref.tooltipContent,
15425
+ LinkComponent = _ref.LinkComponent;
15400
15426
 
15401
15427
  var _useState = React.useState(false),
15402
15428
  _useState2 = _slicedToArray(_useState, 2),
@@ -15658,7 +15684,8 @@
15658
15684
  categorySlug: displayedSubMenu,
15659
15685
  isLoading: loading,
15660
15686
  hasError: hasError,
15661
- onCloseSideNav: onCloseSideNav
15687
+ onCloseSideNav: onCloseSideNav,
15688
+ LinkComponent: LinkComponent
15662
15689
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
15663
15690
  subMenuOpen: subMenuOpen && displayedSubMenu === 'bags',
15664
15691
  onBackClick: onBackClick,
@@ -15671,7 +15698,8 @@
15671
15698
  categorySlug: displayedSubMenu,
15672
15699
  isLoading: loading,
15673
15700
  hasError: hasError,
15674
- onCloseSideNav: onCloseSideNav
15701
+ onCloseSideNav: onCloseSideNav,
15702
+ LinkComponent: LinkComponent
15675
15703
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
15676
15704
  subMenuOpen: subMenuOpen && displayedSubMenu === 'shoes',
15677
15705
  onBackClick: onBackClick,
@@ -15684,7 +15712,8 @@
15684
15712
  categorySlug: displayedSubMenu,
15685
15713
  isLoading: loading,
15686
15714
  hasError: hasError,
15687
- onCloseSideNav: onCloseSideNav
15715
+ onCloseSideNav: onCloseSideNav,
15716
+ LinkComponent: LinkComponent
15688
15717
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
15689
15718
  subMenuOpen: subMenuOpen && displayedSubMenu === 'apparel',
15690
15719
  onBackClick: onBackClick,
@@ -15697,7 +15726,8 @@
15697
15726
  categorySlug: displayedSubMenu,
15698
15727
  isLoading: loading,
15699
15728
  hasError: hasError,
15700
- onCloseSideNav: onCloseSideNav
15729
+ onCloseSideNav: onCloseSideNav,
15730
+ LinkComponent: LinkComponent
15701
15731
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
15702
15732
  subMenuOpen: subMenuOpen && displayedSubMenu === 'accessories',
15703
15733
  onBackClick: onBackClick,
@@ -15710,7 +15740,8 @@
15710
15740
  categorySlug: displayedSubMenu,
15711
15741
  isLoading: loading,
15712
15742
  hasError: hasError,
15713
- onCloseSideNav: onCloseSideNav
15743
+ onCloseSideNav: onCloseSideNav,
15744
+ LinkComponent: LinkComponent
15714
15745
  }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
15715
15746
  subMenuOpen: subMenuOpen && displayedSubMenu === 'watches',
15716
15747
  onBackClick: onBackClick,
@@ -15723,7 +15754,8 @@
15723
15754
  categorySlug: displayedSubMenu,
15724
15755
  isLoading: loading,
15725
15756
  hasError: hasError,
15726
- onCloseSideNav: onCloseSideNav
15757
+ onCloseSideNav: onCloseSideNav,
15758
+ LinkComponent: LinkComponent
15727
15759
  }), displayedSubMenu === 'stores' && /*#__PURE__*/React__default.createElement("div", {
15728
15760
  className: "side-nav__content"
15729
15761
  }, /*#__PURE__*/React__default.createElement(StoresDropdown$1, {
@@ -15962,6 +15994,7 @@
15962
15994
  onCurrencyChange = _ref.onCurrencyChange,
15963
15995
  isCurrencySelectionDisabled = _ref.isCurrencySelectionDisabled,
15964
15996
  tooltipContent = _ref.tooltipContent,
15997
+ LinkComponent = _ref.LinkComponent,
15965
15998
  shop = _ref.shop,
15966
15999
  app = _ref.app;
15967
16000
 
@@ -16247,7 +16280,8 @@
16247
16280
  currencyOptions: currencyOptions,
16248
16281
  onCurrencyChange: onCurrencyChange,
16249
16282
  isCurrencySelectionDisabled: isCurrencySelectionDisabled,
16250
- tooltipContent: tooltipContent
16283
+ tooltipContent: tooltipContent,
16284
+ LinkComponent: LinkComponent
16251
16285
  }), app && /*#__PURE__*/React__default.createElement(LuxityAppSideNav, {
16252
16286
  accordionIcon: accordionIcon,
16253
16287
  closeIcon: closeIcon,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bonlineza/luxity-lib",
3
- "version": "2.34.6",
3
+ "version": "2.34.8",
4
4
  "scripts": {
5
5
  "start": "start-storybook -p 9001 -c .storybook -s ./public",
6
6
  "clean": "rimraf ./build/*.*",