@bonlineza/luxity-lib 2.14.0 → 2.15.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.
package/RareStepHeader.js CHANGED
@@ -159,7 +159,7 @@
159
159
  });
160
160
  });
161
161
 
162
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28;
162
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30;
163
163
  var HeaderWrapper = styled__default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n {\n display: inline-block;\n background-color: ", ";\n position: relative;\n width: 100%;\n\n .header__search-container,\n .header__search-input {\n background-color: ", ";\n }\n\n .header__search-container {\n max-width: ", ";\n margin: 0 auto;\n padding: ", " 5%;\n }\n }\n"])), function (props) {
164
164
  return props.theme.rareStepColors.ntrlMin;
165
165
  }, function (props) {
@@ -178,7 +178,7 @@
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 }\n"])));
181
+ var LogoImage = styled__default.img(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n {\n width: 200px;\n height: 70px;\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
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\n &:hover,\n &:active {\n color: ", ";\n text-decoration: none;\n }\n }\n"])), function (props) {
184
184
  return props.theme.rareStepColors.secondary;
@@ -266,10 +266,8 @@
266
266
  }, function (props) {
267
267
  return props.theme.rareStepColors.secondary;
268
268
  });
269
- var SearchContainer = styled__default.div(_templateObject25 || (_templateObject25 = _taggedTemplateLiteral(["\n {\n display: flex;\n padding: ", " 0;\n align-items: center;\n border-top: 1px solid ", ";\n }\n"])), function (props) {
269
+ var SearchContainer = styled__default.div(_templateObject25 || (_templateObject25 = _taggedTemplateLiteral(["\n {\n display: flex;\n padding: ", " 0;\n align-items: center;\n }\n"])), function (props) {
270
270
  return props.theme.marginPaddings[1];
271
- }, function (props) {
272
- return props.theme.rareStepColors.ntrl40;
273
271
  });
274
272
  var SearchInput = styled__default.input(_templateObject26 || (_templateObject26 = _taggedTemplateLiteral(["\n {\n width: 50%;\n font-size: ", ";\n padding-bottom: ", ";\n color: ", ";\n border: none;\n margin-left: ", ";\n\n &:active,\n &:focus,\n &:focus-visible {\n outline: none;\n border: none;\n }\n\n &::placeholder {\n color: ", ";\n }\n }\n"])), function (props) {
275
273
  return props.theme.rareStepFontSize.footerTitle;
@@ -284,16 +282,22 @@
284
282
  });
285
283
  var SearchIcon = styled__default.img(_templateObject27 || (_templateObject27 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n cursor: pointer;\n margin-bottom: 7px;\n }\n"])));
286
284
  var CloseIcon = styled__default.img(_templateObject28 || (_templateObject28 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n margin-left: auto;\n cursor: pointer;\n }\n"])));
285
+ var CurrencyContainer = styled__default.div(_templateObject29 || (_templateObject29 = _taggedTemplateLiteral(["\n {\n display: flex;\n }\n"])));
286
+ var DropdownSearchContainer = styled__default.div(_templateObject30 || (_templateObject30 = _taggedTemplateLiteral(["\n {\n background-color: ", ";\n border-top: 1px solid ", ";\n }\n"])), function (props) {
287
+ return props.theme.rareStepColors.primary;
288
+ }, function (props) {
289
+ return props.theme.rareStepColors.ntrl40;
290
+ });
287
291
 
288
292
  var Search = function Search(_ref) {
289
- var close_icon_url = _ref.close_icon_url,
290
- navigation_search_icon_url = _ref.navigation_search_icon_url,
291
- wordpress_site_url = _ref.wordpress_site_url,
293
+ var closeIconUrl = _ref.closeIconUrl,
294
+ navigationSearchIconUrl = _ref.navigationSearchIconUrl,
295
+ wordpressSiteUrl = _ref.wordpressSiteUrl,
292
296
  toggleSearch = _ref.toggleSearch;
293
297
  var searchInputRef = React.useRef(null);
294
298
 
295
299
  var handleOnSearch = function handleOnSearch() {
296
- window.location.replace("".concat(wordpress_site_url, "/?post_type=product&s=").concat(searchInputRef.current.value));
300
+ window.location.replace("".concat(wordpressSiteUrl, "/?post_type=product&s=").concat(searchInputRef.current.value));
297
301
  };
298
302
 
299
303
  var handleKeyDown = function handleKeyDown(e) {
@@ -306,7 +310,7 @@
306
310
  className: "header__search-container"
307
311
  }, /*#__PURE__*/React__default.createElement(SearchIcon, {
308
312
  className: "header__icon",
309
- src: navigation_search_icon_url,
313
+ src: navigationSearchIconUrl,
310
314
  onClick: handleOnSearch
311
315
  }), /*#__PURE__*/React__default.createElement(SearchInput, {
312
316
  className: "header__search-input",
@@ -315,15 +319,15 @@
315
319
  onKeyDown: handleKeyDown
316
320
  }), /*#__PURE__*/React__default.createElement(CloseIcon, {
317
321
  className: "header__icon",
318
- src: close_icon_url,
322
+ src: closeIconUrl,
319
323
  onClick: toggleSearch
320
324
  }));
321
325
  };
322
326
 
323
327
  var HeaderDropdown = function HeaderDropdown(_ref) {
324
- var _header_dropdown_prod;
328
+ var _headerDropdownProduc;
325
329
 
326
- var header_dropdown_product_object = _ref.header_dropdown_product_object,
330
+ var headerDropdownProductObject = _ref.headerDropdownProductObject,
327
331
  handleShowDropdown = _ref.handleShowDropdown,
328
332
  handleHideDropdown = _ref.handleHideDropdown;
329
333
 
@@ -345,65 +349,76 @@
345
349
  return /*#__PURE__*/React__default.createElement(Dropdown, {
346
350
  onMouseOver: handleShowDropdown,
347
351
  onMouseOut: handleHideDropdown
348
- }, /*#__PURE__*/React__default.createElement(PageContainer, null, /*#__PURE__*/React__default.createElement(DropdownBrands, null, header_dropdown_product_object === null || header_dropdown_product_object === void 0 ? void 0 : (_header_dropdown_prod = header_dropdown_product_object.brands) === null || _header_dropdown_prod === void 0 ? void 0 : _header_dropdown_prod.map(function (brand, index) {
352
+ }, /*#__PURE__*/React__default.createElement(PageContainer, null, /*#__PURE__*/React__default.createElement(DropdownBrands, null, headerDropdownProductObject === null || headerDropdownProductObject === void 0 ? void 0 : (_headerDropdownProduc = headerDropdownProductObject.brands) === null || _headerDropdownProduc === void 0 ? void 0 : _headerDropdownProduc.map(function (brand, index) {
349
353
  return /*#__PURE__*/React__default.createElement(DropdownBrandLinkContainer, {
350
354
  key: index,
351
355
  onMouseOver: function onMouseOver() {
352
356
  return handleBrandHover(brand);
353
357
  }
354
- }, /*#__PURE__*/React__default.createElement(DropdownBrandLinkHR, null), /*#__PURE__*/React__default.createElement(DropdownBrandLink, null, brand.brand_name));
358
+ }, /*#__PURE__*/React__default.createElement(DropdownBrandLinkHR, null), /*#__PURE__*/React__default.createElement(DropdownBrandLink, null, brand.brandName));
355
359
  })), /*#__PURE__*/React__default.createElement(DropdownModels, null, currentModels === null || currentModels === void 0 ? void 0 : currentModels.map(function (model, index) {
356
360
  return /*#__PURE__*/React__default.createElement(DropdownModelsList, null, /*#__PURE__*/React__default.createElement(DropdownLink, {
357
361
  key: index
358
- }, model.model_name));
359
- })), /*#__PURE__*/React__default.createElement(DropdownFigure, null, (currentBrand === null || currentBrand === void 0 ? void 0 : currentBrand.brand_image_url) && /*#__PURE__*/React__default.createElement(DropdownImage, {
360
- src: currentBrand === null || currentBrand === void 0 ? void 0 : currentBrand.brand_image_url
362
+ }, model.modelName));
363
+ })), /*#__PURE__*/React__default.createElement(DropdownFigure, null, (currentBrand === null || currentBrand === void 0 ? void 0 : currentBrand.brandImageUrl) && /*#__PURE__*/React__default.createElement(DropdownImage, {
364
+ src: currentBrand === null || currentBrand === void 0 ? void 0 : currentBrand.brandImageUrl
361
365
  }))));
362
366
  };
363
367
 
368
+ function Currency(_ref) {
369
+ var currencyFlagIconUrl = _ref.currencyFlagIconUrl,
370
+ className = _ref.className;
371
+ return /*#__PURE__*/React__default.createElement(CurrencyContainer, {
372
+ className: className
373
+ }, /*#__PURE__*/React__default.createElement(CurrencyFlagIcon, {
374
+ src: currencyFlagIconUrl
375
+ }), /*#__PURE__*/React__default.createElement(NavigationLink, null, "South African (ZAR, R)"));
376
+ }
377
+
364
378
  function Navigation(_ref) {
365
- var dropdown_closed_icon_url = _ref.dropdown_closed_icon_url,
366
- dropdown_open_icon_url = _ref.dropdown_open_icon_url,
367
- currency_flag_icon_url = _ref.currency_flag_icon_url,
379
+ var dropdownClosedIconUrl = _ref.dropdownClosedIconUrl,
380
+ dropdownOpenIconUrl = _ref.dropdownOpenIconUrl,
381
+ currencyFlagIconUrl = _ref.currencyFlagIconUrl,
368
382
  handleShowDropdown = _ref.handleShowDropdown,
369
383
  handleHideDropdown = _ref.handleHideDropdown,
370
384
  showDropdown = _ref.showDropdown,
371
- desktop_header_links = _ref.desktop_header_links;
372
- return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement(NavigationContainer, null, /*#__PURE__*/React__default.createElement(PageContainer, null, /*#__PURE__*/React__default.createElement(NavigationLinks, null, desktop_header_links.left.map(function (link, index) {
373
- return link !== null && link !== void 0 && link.is_dropdown ? /*#__PURE__*/React__default.createElement(NavigationLink, {
385
+ desktopHeaderLinks = _ref.desktopHeaderLinks;
386
+ return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement(NavigationContainer, null, /*#__PURE__*/React__default.createElement(PageContainer, null, /*#__PURE__*/React__default.createElement(NavigationLinks, null, desktopHeaderLinks.left.map(function (link, index) {
387
+ return link !== null && link !== void 0 && link.isDropdown ? /*#__PURE__*/React__default.createElement(NavigationLink, {
388
+ key: index,
374
389
  onMouseOver: handleShowDropdown,
375
390
  onMouseOut: handleHideDropdown
376
391
  }, link.name, showDropdown ? /*#__PURE__*/React__default.createElement(DropdownNavigatorIcon, {
377
- src: dropdown_closed_icon_url
392
+ src: dropdownClosedIconUrl
378
393
  }) : /*#__PURE__*/React__default.createElement(DropdownNavigatorIcon, {
379
- src: dropdown_open_icon_url
394
+ src: dropdownOpenIconUrl
380
395
  })) : /*#__PURE__*/React__default.createElement(NavigationLink, {
381
396
  href: link.url,
382
397
  key: index
383
398
  }, link.name);
384
- })), /*#__PURE__*/React__default.createElement(NavigationLinks, null, desktop_header_links.right.map(function (link, index) {
399
+ })), /*#__PURE__*/React__default.createElement(NavigationLinks, null, desktopHeaderLinks.right.map(function (link, index) {
385
400
  return /*#__PURE__*/React__default.createElement(NavigationLink, {
386
401
  href: link.url,
387
402
  key: index
388
403
  }, link.name);
389
- }), /*#__PURE__*/React__default.createElement(CurrencyFlagIcon, {
390
- src: currency_flag_icon_url
391
- }), /*#__PURE__*/React__default.createElement(NavigationLink, null, "South African (ZAR, R)")))));
404
+ }), /*#__PURE__*/React__default.createElement(Currency, {
405
+ currencyFlagIconUrl: currencyFlagIconUrl
406
+ })))));
392
407
  }
393
408
 
394
409
  var RareStepDesktopHeader = function RareStepDesktopHeader(_ref) {
395
- var header_logo_img_url = _ref.header_logo_img_url,
396
- search_icon_url = _ref.search_icon_url,
397
- cart_icon_url = _ref.cart_icon_url,
398
- user_icon_url = _ref.user_icon_url,
399
- interest_icon_url = _ref.interest_icon_url,
400
- dropdown_closed_icon_url = _ref.dropdown_closed_icon_url,
401
- dropdown_open_icon_url = _ref.dropdown_open_icon_url,
402
- currency_flag_icon_url = _ref.currency_flag_icon_url,
403
- close_icon_url = _ref.close_icon_url,
404
- navigation_search_icon_url = _ref.navigation_search_icon_url,
405
- wordpress_site_url = _ref.wordpress_site_url,
406
- desktop_header_links = _ref.desktop_header_links,
410
+ var headerLogoImgUrl = _ref.headerLogoImgUrl,
411
+ searchIconUrl = _ref.searchIconUrl,
412
+ cartIconUrl = _ref.cartIconUrl,
413
+ userIconUrl = _ref.userIconUrl,
414
+ interestIconUrl = _ref.interestIconUrl,
415
+ dropdownClosedIconUrl = _ref.dropdownClosedIconUrl,
416
+ dropdownOpenIconUrl = _ref.dropdownOpenIconUrl,
417
+ currencyFlagIconUrl = _ref.currencyFlagIconUrl,
418
+ closeIconUrl = _ref.closeIconUrl,
419
+ navigationSearchIconUrl = _ref.navigationSearchIconUrl,
420
+ wordpressSiteUrl = _ref.wordpressSiteUrl,
421
+ desktopHeaderLinks = _ref.desktopHeaderLinks,
407
422
  handleOnAccountClick = _ref.handleOnAccountClick;
408
423
 
409
424
  var _useState = React.useState(false),
@@ -434,32 +449,35 @@
434
449
  };
435
450
 
436
451
  return /*#__PURE__*/React__default.createElement(HeaderWrapper, null, /*#__PURE__*/React__default.createElement(HeaderContainer, null, /*#__PURE__*/React__default.createElement(LogoFigure, null, /*#__PURE__*/React__default.createElement(LogoImage, {
437
- src: header_logo_img_url
452
+ src: headerLogoImgUrl,
453
+ onClick: function onClick() {
454
+ window.location.href = wordpressSiteUrl;
455
+ }
438
456
  })), /*#__PURE__*/React__default.createElement(HeaderIconsContainer, null, /*#__PURE__*/React__default.createElement(SellToUsHR, null), /*#__PURE__*/React__default.createElement(SellToUsLink, null, "Sell to us"), /*#__PURE__*/React__default.createElement(HeaderIcon, {
439
- src: search_icon_url,
457
+ src: searchIconUrl,
440
458
  onClick: toggleSearch
441
459
  }), /*#__PURE__*/React__default.createElement(HeaderIcon, {
442
- src: interest_icon_url
460
+ src: interestIconUrl
443
461
  }), /*#__PURE__*/React__default.createElement(HeaderIcon, {
444
- src: user_icon_url,
462
+ src: userIconUrl,
445
463
  onClick: handleOnAccountClick
446
464
  }), /*#__PURE__*/React__default.createElement(HeaderIcon, {
447
- src: cart_icon_url
465
+ src: cartIconUrl
448
466
  }))), /*#__PURE__*/React__default.createElement(Navigation, {
449
- dropdown_closed_icon_url: dropdown_closed_icon_url,
450
- dropdown_open_icon_url: dropdown_open_icon_url,
451
- currency_flag_icon_url: currency_flag_icon_url,
467
+ dropdownClosedIconUrl: dropdownClosedIconUrl,
468
+ dropdownOpenIconUrl: dropdownOpenIconUrl,
469
+ currencyFlagIconUrl: currencyFlagIconUrl,
452
470
  handleShowDropdown: handleShowDropdown,
453
471
  handleHideDropdown: handleHideDropdown,
454
472
  showDropdown: showDropdown,
455
- desktop_header_links: desktop_header_links
456
- }), showSearch && /*#__PURE__*/React__default.createElement(Search, {
457
- close_icon_url: close_icon_url,
458
- navigation_search_icon_url: navigation_search_icon_url,
459
- wordpress_site_url: wordpress_site_url,
473
+ desktopHeaderLinks: desktopHeaderLinks
474
+ }), showSearch && /*#__PURE__*/React__default.createElement(DropdownSearchContainer, null, /*#__PURE__*/React__default.createElement(Search, {
475
+ closeIconUrl: closeIconUrl,
476
+ navigationSearchIconUrl: navigationSearchIconUrl,
477
+ wordpressSiteUrl: wordpressSiteUrl,
460
478
  toggleSearch: toggleSearch
461
- }), showDropdown && /*#__PURE__*/React__default.createElement(HeaderDropdown, {
462
- header_dropdown_product_object: desktop_header_links.header_dropdown_product_object,
479
+ })), showDropdown && /*#__PURE__*/React__default.createElement(HeaderDropdown, {
480
+ headerDropdownProductObject: desktopHeaderLinks.headerDropdownProductObject,
463
481
  handleShowDropdown: handleShowDropdown,
464
482
  handleHideDropdown: handleHideDropdown
465
483
  }));
@@ -467,34 +485,36 @@
467
485
 
468
486
  var RareStepDesktopHeader$1 = themed(RareStepDesktopHeader);
469
487
 
470
- var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4$1, _templateObject5$1, _templateObject6$1, _templateObject7$1, _templateObject8$1, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1;
488
+ var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4$1, _templateObject5$1, _templateObject6$1, _templateObject7$1, _templateObject8$1, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1, _templateObject20$1;
471
489
  var HeaderWrapper$1 = styled__default.div(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral(["\n {\n display: flex;\n background-color: ", ";\n position: relative;\n width: 100%;\n justify-content: space-between;\n align-items: center;\n padding: ", " 0;\n }\n"])), function (props) {
472
490
  return props.theme.rareStepColors.ntrlMin;
473
491
  }, function (props) {
474
492
  return props.theme.marginPaddings[3];
475
493
  });
476
- var Icon = styled__default.img(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n {\n width: 40px;\n height: 40px;\n cursor: pointer;\n }\n"])));
477
- var Logo = styled__default.img(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteral(["\n {\n width: 200px;\n height: 70px;\n margin-left: 20px;\n }\n"])));
494
+ var Icon = styled__default.img(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n {\n width: 30px;\n height: 30px;\n cursor: pointer;\n }\n"])));
495
+ var Logo = styled__default.img(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteral(["\n {\n width: 200px;\n height: 70px;\n margin-left: 20px;\n cursor: pointer;\n }\n"])));
478
496
  var IconWrapper = styled__default.div(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteral(["\n {\n display: flex;\n\n & > img {\n margin-left: 10px;\n }\n }\n"])));
479
- var SidenavWrapper = styled__default.div(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteral(["\n {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n z-index: 9;\n overflow-x: hidden;\n }\n"])));
480
- var Sidenav = styled__default.div(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteral(["\n {\n width: 80%;\n height: 100%;\n background-color: ", ";\n color: ", ";\n padding: ", ";\n }\n"])), function (props) {
497
+ var SideNavWrapper = styled__default.div(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteral(["\n {\n position: relative;\n overflow: hidden;\n\n .side-nav-link--bottom {\n font-size: ", ";\n }\n }\n"])), function (props) {
498
+ return props.theme.rareStepFontSize.h6;
499
+ });
500
+ var SideNav = styled__default.div(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteral(["\n {\n position: fixed;\n top: 0;\n left: -100%;\n width: 80%;\n height: 100%;\n background-color: ", ";\n color: ", ";\n padding: ", ";\n z-index: 9;\n }\n"])), function (props) {
481
501
  return props.theme.rareStepColors.primary;
482
502
  }, function (props) {
483
503
  return props.theme.rareStepColors.ntrlMin;
484
504
  }, function (props) {
485
505
  return props.theme.marginPaddings[1];
486
506
  });
487
- var Overlay = styled__default.div(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteral(["\n {\n width: 20%;\n height: 100%;\n background-color: ", ";\n opacity: 0.5;\n }\n"])), function (props) {
507
+ var Overlay = styled__default.div(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteral(["\n {\n position: fixed;\n top: 0;\n right: 200%;\n width: 20%;\n height: 100%;\n background-color: ", ";\n opacity: 0.5;\n }\n"])), function (props) {
488
508
  return props.theme.rareStepColors.ntrl40;
489
509
  });
490
510
  var CloseIcon$1 = styled__default.img(_templateObject8$1 || (_templateObject8$1 = _taggedTemplateLiteral(["\n {\n width: 30px;\n height: 30px;\n cursor: pointer;\n }\n"])));
491
- var SidenavLink = styled__default.a(_templateObject9$1 || (_templateObject9$1 = _taggedTemplateLiteral(["\n {\n padding: ", ";\n color: ", ";\n text-decoration: none;\n text-align: left;\n display: block;\n width: 100%;\n cursor: pointer;\n }\n"])), function (props) {
511
+ var SideNavLink = styled__default.a(_templateObject9$1 || (_templateObject9$1 = _taggedTemplateLiteral(["\n {\n padding: ", ";\n color: ", ";\n text-decoration: none;\n text-align: left;\n display: block;\n width: 100%;\n cursor: pointer;\n }\n"])), function (props) {
492
512
  return props.theme.marginPaddings[1];
493
513
  }, function (props) {
494
514
  return props.theme.rareStepColors.ntrlMin;
495
515
  });
496
516
  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"])));
497
- 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-left: ", ";\n text-align: center;\n text-decoration: none;\n border-radius: 5px;\n }\n"])), function (props) {
517
+ 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) {
498
518
  return props.theme.rareStepColors.secondary;
499
519
  }, function (props) {
500
520
  return props.theme.rareStepColors.secondary;
@@ -507,8 +527,8 @@
507
527
  }, function (props) {
508
528
  return props.theme.marginPaddings[1];
509
529
  });
510
- 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"])));
511
- var SubmenuRightIcon = styled__default.img(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n }\n"])));
530
+ 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"])));
531
+ var SubMenuRightIcon = styled__default.img(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n }\n"])));
512
532
  var Hr = styled__default.hr(_templateObject14$1 || (_templateObject14$1 = _taggedTemplateLiteral(["\n {\n width: 100%;\n color: ", ";\n margin: 0;\n }\n"])), function (props) {
513
533
  return props.theme.rareStepColors.ntrlMax;
514
534
  });
@@ -523,56 +543,104 @@
523
543
  }, function (props) {
524
544
  return props.theme.rareStepColors.ntrlMax;
525
545
  });
546
+ var BackButton = styled__default.button(_templateObject16$1 || (_templateObject16$1 = _taggedTemplateLiteral(["\n {\n background-color: transparent;\n border: none;\n color: ", ";\n margin: 30px 0;\n position: relative;\n\n &:hover {\n cursor: pointer;\n background-color: transparent;\n color: ", ";\n text-decoration: underline;\n }\n }\n"])), function (props) {
547
+ return props.theme.rareStepColors.ntrlMin;
548
+ }, function (props) {
549
+ return props.theme.rareStepColors.ntrlMin;
550
+ });
551
+ var BackIcon = styled__default.img(_templateObject17$1 || (_templateObject17$1 = _taggedTemplateLiteral(["\n {\n width: 20px;\n height: 20px;\n margin-right: 10px;\n position: absolute;\n top: 0;\n left: 10px;\n }\n"])));
552
+ var BackButtonContent = styled__default.div(_templateObject18$1 || (_templateObject18$1 = _taggedTemplateLiteral(["\n {\n font-size: ", ";\n text-transform: uppercase;\n color: ", ";\n margin-left: 35px;\n display: inline-block;\n }\n"])), function (props) {
553
+ return props.theme.rareStepFontSize.h5;
554
+ }, function (props) {
555
+ return props.theme.rareStepColors.ntrlMin;
556
+ });
557
+ var SideNavLinksContainer = styled__default.div(_templateObject19$1 || (_templateObject19$1 = _taggedTemplateLiteral(["\n {\n overflow-y: scroll;\n overflow-x: hidden;\n height: 90%;\n padding-bottom: 50px;\n }\n"])));
558
+ var MenuSideNavWrapper = styled__default.div(_templateObject20$1 || (_templateObject20$1 = _taggedTemplateLiteral(["\n {\n .side-nav {\n transition: left 1s ease-in-out;\n\n &--open {\n left: 0;\n }\n\n &--close {\n left: -100%;\n }\n\n &__currency {\n margin: ", " 0 0\n ", ";\n }\n }\n\n .overlay {\n transition: right 1s ease-in-out;\n\n &--open {\n right: 0;\n }\n\n &--close {\n right: 200%;\n }\n }\n }\n"])), function (props) {
559
+ return props.theme.marginPaddings[4];
560
+ }, function (props) {
561
+ return props.theme.marginPaddings[1];
562
+ });
526
563
 
527
- function MenuSidenav(_ref) {
528
- var close_icon_url = _ref.close_icon_url,
564
+ var enableBodyScroll = function enableBodyScroll() {
565
+ var _document = document,
566
+ body = _document.body;
567
+ body.style.overflow = '';
568
+ };
569
+ var disableBodyScroll = function disableBodyScroll() {
570
+ var _document2 = document,
571
+ body = _document2.body;
572
+ body.style.overflow = 'hidden';
573
+ };
574
+
575
+ function MenuSideNav(_ref) {
576
+ var closeIconUrl = _ref.closeIconUrl,
529
577
  children = _ref.children,
530
- setshowSidenav = _ref.setshowSidenav;
531
- return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement(SidenavWrapper, null, /*#__PURE__*/React__default.createElement(Sidenav, null, /*#__PURE__*/React__default.createElement(CloseIconWrapper, null, /*#__PURE__*/React__default.createElement(CloseIcon$1, {
532
- onClick: function onClick() {
533
- return setshowSidenav(false);
534
- },
535
- src: close_icon_url
536
- })), children), /*#__PURE__*/React__default.createElement(Overlay, {
578
+ setShowSideNav = _ref.setShowSideNav,
579
+ isSubMenu = _ref.isSubMenu,
580
+ backIconUrl = _ref.backIconUrl,
581
+ sideNavClassName = _ref.sideNavClassName,
582
+ overlayClassName = _ref.overlayClassName;
583
+
584
+ var handleSideNavClose = function handleSideNavClose() {
585
+ setShowSideNav(false);
586
+ enableBodyScroll();
587
+ };
588
+
589
+ return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement(SideNavWrapper, null, /*#__PURE__*/React__default.createElement(SideNav, {
590
+ className: sideNavClassName
591
+ }, isSubMenu ? /*#__PURE__*/React__default.createElement(BackButton, {
537
592
  onClick: function onClick() {
538
- return setshowSidenav(false);
593
+ return setShowSideNav(false);
539
594
  }
595
+ }, /*#__PURE__*/React__default.createElement(BackIcon, {
596
+ src: backIconUrl
597
+ }), /*#__PURE__*/React__default.createElement(BackButtonContent, null, "Back to menu")) : /*#__PURE__*/React__default.createElement(CloseIconWrapper, null, /*#__PURE__*/React__default.createElement(CloseIcon$1, {
598
+ onClick: handleSideNavClose,
599
+ src: closeIconUrl
600
+ })), /*#__PURE__*/React__default.createElement(SideNavLinksContainer, null, children)), /*#__PURE__*/React__default.createElement(Overlay, {
601
+ onClick: handleSideNavClose,
602
+ className: overlayClassName
540
603
  })));
541
604
  }
542
605
 
543
- function SidenavLinks(_ref) {
544
- var right_arrow_icon_url = _ref.right_arrow_icon_url,
606
+ function SideNavLinks(_ref) {
607
+ var rightArrowIconUrl = _ref.rightArrowIconUrl,
545
608
  links = _ref.links,
546
- setshowSidenavSubmenu = _ref.setshowSidenavSubmenu;
609
+ setShowSideNavSubMenu = _ref.setShowSideNavSubMenu,
610
+ currencyFlagIconUrl = _ref.currencyFlagIconUrl;
547
611
  return /*#__PURE__*/React__default.createElement(React.Fragment, null, links.top.map(function (link, index) {
548
- return link !== null && link !== void 0 && link.is_submenu ? /*#__PURE__*/React__default.createElement(SubmenuLinkContainer, {
612
+ return link !== null && link !== void 0 && link.isSubMenu ? /*#__PURE__*/React__default.createElement(SubMenuLinkContainer, {
549
613
  key: index
550
- }, /*#__PURE__*/React__default.createElement(SidenavLink, {
551
- href: "/"
552
- }, "Sneakers"), /*#__PURE__*/React__default.createElement(SubmenuRightIcon, {
553
- src: right_arrow_icon_url,
614
+ }, /*#__PURE__*/React__default.createElement(SideNavLink, {
615
+ href: link.url
616
+ }, link.name), /*#__PURE__*/React__default.createElement(SubMenuRightIcon, {
617
+ src: rightArrowIconUrl,
554
618
  onClick: function onClick() {
555
- return setshowSidenavSubmenu(true);
619
+ return setShowSideNavSubMenu(true);
556
620
  }
557
- })) : /*#__PURE__*/React__default.createElement(SidenavLink, {
621
+ })) : /*#__PURE__*/React__default.createElement(SideNavLink, {
558
622
  key: index,
559
623
  href: link.url
560
624
  }, link.name);
561
625
  }), /*#__PURE__*/React__default.createElement(SellToUsLink$1, {
562
626
  href: links.button.url
563
627
  }, links.button.name), links.bottom.map(function (link, index) {
564
- return /*#__PURE__*/React__default.createElement(SidenavLink, {
628
+ return /*#__PURE__*/React__default.createElement(SideNavLink, {
565
629
  key: index,
566
630
  href: link.url,
567
- onClick: link !== null && link !== void 0 && link.is_button ? link.onClick : null
631
+ className: "side-nav-link--bottom",
632
+ onClick: link !== null && link !== void 0 && link.isButton ? link.onClick : null
568
633
  }, link.name);
634
+ }), /*#__PURE__*/React__default.createElement(Currency, {
635
+ className: "side-nav__currency",
636
+ currencyFlagIconUrl: currencyFlagIconUrl
569
637
  }));
570
638
  }
571
639
 
572
- function SidenavSubmenuLinks(_ref) {
640
+ function SideNavSubMenuLinks(_ref) {
573
641
  var links = _ref.links;
574
- return /*#__PURE__*/React__default.createElement(React.Fragment, null, links.submenu_links.map(function (link, index) {
575
- return /*#__PURE__*/React__default.createElement(SidenavLink, {
642
+ return /*#__PURE__*/React__default.createElement(React.Fragment, null, links.subMenuLinks.map(function (link, index) {
643
+ return /*#__PURE__*/React__default.createElement(SideNavLink, {
576
644
  key: index,
577
645
  href: link.url
578
646
  }, link.name);
@@ -580,26 +648,28 @@
580
648
  }
581
649
 
582
650
  function RareStepMobileHeader(_ref) {
583
- var header_logo_img_url = _ref.header_logo_img_url,
584
- search_icon_url = _ref.search_icon_url,
585
- menu_icon_url = _ref.menu_icon_url,
586
- cart_icon_url = _ref.cart_icon_url,
587
- close_icon_url = _ref.close_icon_url,
588
- mobile_header_links = _ref.mobile_header_links,
589
- right_arrow_icon_url = _ref.right_arrow_icon_url,
590
- navigation_search_icon_url = _ref.navigation_search_icon_url,
591
- wordpress_site_url = _ref.wordpress_site_url,
592
- mobile_close_icon_url = _ref.mobile_close_icon_url;
651
+ var headerLogoImgUrl = _ref.headerLogoImgUrl,
652
+ searchIconUrl = _ref.searchIconUrl,
653
+ menuIconUrl = _ref.menuIconUrl,
654
+ cartIconUrl = _ref.cartIconUrl,
655
+ closeIconUrl = _ref.closeIconUrl,
656
+ mobileHeaderLinks = _ref.mobileHeaderLinks,
657
+ rightArrowIconUrl = _ref.rightArrowIconUrl,
658
+ navigationSearchIconUrl = _ref.navigationSearchIconUrl,
659
+ wordpressSiteUrl = _ref.wordpressSiteUrl,
660
+ mobileCloseIconUrl = _ref.mobileCloseIconUrl,
661
+ backIconUrl = _ref.backIconUrl,
662
+ currencyFlagIconUrl = _ref.currencyFlagIconUrl;
593
663
 
594
664
  var _useState = React.useState(false),
595
665
  _useState2 = _slicedToArray(_useState, 2),
596
- showSidenav = _useState2[0],
597
- setshowSidenav = _useState2[1];
666
+ showSideNav = _useState2[0],
667
+ setShowSideNav = _useState2[1];
598
668
 
599
669
  var _useState3 = React.useState(false),
600
670
  _useState4 = _slicedToArray(_useState3, 2),
601
- showSidenavSubmenu = _useState4[0],
602
- setshowSidenavSubmenu = _useState4[1];
671
+ showSideNavSubMenu = _useState4[0],
672
+ setShowSideNavSubMenu = _useState4[1];
603
673
 
604
674
  var _useState5 = React.useState(false),
605
675
  _useState6 = _slicedToArray(_useState5, 2),
@@ -612,84 +682,101 @@
612
682
 
613
683
  return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement(HeaderWrapper$1, null, /*#__PURE__*/React__default.createElement(Icon, {
614
684
  onClick: function onClick() {
615
- return setshowSidenav(true);
685
+ disableBodyScroll();
686
+ setShowSideNav(true);
616
687
  },
617
- src: menu_icon_url
688
+ src: menuIconUrl
618
689
  }), /*#__PURE__*/React__default.createElement(Logo, {
619
- src: header_logo_img_url
690
+ src: headerLogoImgUrl,
691
+ onClick: function onClick() {
692
+ window.location.href = wordpressSiteUrl;
693
+ }
620
694
  }), /*#__PURE__*/React__default.createElement(IconWrapper, null, /*#__PURE__*/React__default.createElement(Icon, {
621
- src: search_icon_url,
695
+ src: searchIconUrl,
622
696
  onClick: toggleSearch
623
697
  }), /*#__PURE__*/React__default.createElement(Icon, {
624
- src: cart_icon_url
698
+ src: cartIconUrl
625
699
  }))), showSearch && /*#__PURE__*/React__default.createElement(MobileSearchContainer, null, /*#__PURE__*/React__default.createElement(Search, {
626
- close_icon_url: mobile_close_icon_url,
627
- navigation_search_icon_url: navigation_search_icon_url,
628
- wordpress_site_url: wordpress_site_url,
700
+ closeIconUrl: mobileCloseIconUrl,
701
+ navigationSearchIconUrl: navigationSearchIconUrl,
702
+ wordpressSiteUrl: wordpressSiteUrl,
629
703
  toggleSearch: toggleSearch
630
- })), /*#__PURE__*/React__default.createElement(Hr, null), showSidenav && /*#__PURE__*/React__default.createElement(MenuSidenav, {
631
- close_icon_url: close_icon_url,
632
- setshowSidenav: setshowSidenav
633
- }, /*#__PURE__*/React__default.createElement(SidenavLinks, {
634
- right_arrow_icon_url: right_arrow_icon_url,
635
- links: mobile_header_links,
636
- setshowSidenavSubmenu: setshowSidenavSubmenu
637
- })), showSidenavSubmenu && /*#__PURE__*/React__default.createElement(MenuSidenav, {
638
- close_icon_url: close_icon_url,
639
- setshowSidenav: setshowSidenavSubmenu
640
- }, /*#__PURE__*/React__default.createElement(SidenavSubmenuLinks, {
641
- links: mobile_header_links
642
- })));
704
+ })), /*#__PURE__*/React__default.createElement(Hr, null), /*#__PURE__*/React__default.createElement(MenuSideNavWrapper, null, /*#__PURE__*/React__default.createElement(MenuSideNav, {
705
+ sideNavClassName: "side-nav side-nav--".concat(showSideNav ? 'open' : 'close'),
706
+ overlayClassName: "overlay overlay--".concat(showSideNav ? 'open' : 'close'),
707
+ closeIconUrl: closeIconUrl,
708
+ backIconUrl: backIconUrl,
709
+ isSubMenu: false,
710
+ setShowSideNav: setShowSideNav
711
+ }, /*#__PURE__*/React__default.createElement(SideNavLinks, {
712
+ rightArrowIconUrl: rightArrowIconUrl,
713
+ links: mobileHeaderLinks,
714
+ setShowSideNavSubMenu: setShowSideNavSubMenu,
715
+ currencyFlagIconUrl: currencyFlagIconUrl
716
+ }))), /*#__PURE__*/React__default.createElement(MenuSideNavWrapper, null, /*#__PURE__*/React__default.createElement(MenuSideNav, {
717
+ sideNavClassName: "side-nav side-nav--".concat(showSideNavSubMenu ? 'open' : 'close'),
718
+ overlayClassName: "overlay overlay--".concat(showSideNavSubMenu ? 'open' : 'close'),
719
+ closeIconUrl: closeIconUrl,
720
+ backIconUrl: backIconUrl,
721
+ isSubMenu: true,
722
+ setShowSideNav: setShowSideNavSubMenu
723
+ }, /*#__PURE__*/React__default.createElement(SideNavSubMenuLinks, {
724
+ links: mobileHeaderLinks
725
+ }))));
643
726
  }
644
727
 
645
728
  var RareStepHeader = function RareStepHeader(_ref) {
646
- var header_logo_img_url = _ref.header_logo_img_url,
647
- search_icon_url = _ref.search_icon_url,
648
- cart_icon_url = _ref.cart_icon_url,
649
- user_icon_url = _ref.user_icon_url,
650
- interest_icon_url = _ref.interest_icon_url,
651
- dropdown_closed_icon_url = _ref.dropdown_closed_icon_url,
652
- dropdown_open_icon_url = _ref.dropdown_open_icon_url,
653
- currency_flag_icon_url = _ref.currency_flag_icon_url,
654
- close_icon_url = _ref.close_icon_url,
655
- navigation_search_icon_url = _ref.navigation_search_icon_url,
656
- wordpress_site_url = _ref.wordpress_site_url,
657
- desktop_header_wrapper_class = _ref.desktop_header_wrapper_class,
658
- menu_icon_url = _ref.menu_icon_url,
659
- mobile_header_wrapper_class = _ref.mobile_header_wrapper_class,
660
- right_arrow_icon_url = _ref.right_arrow_icon_url,
661
- desktop_header_links = _ref.desktop_header_links,
662
- mobile_header_links = _ref.mobile_header_links,
663
- mobile_close_icon_url = _ref.mobile_close_icon_url,
664
- handleOnAccountClick = _ref.handleOnAccountClick;
729
+ var headerLogoImgUrl = _ref.headerLogoImgUrl,
730
+ searchIconUrl = _ref.searchIconUrl,
731
+ cartIconUrl = _ref.cartIconUrl,
732
+ userIconUrl = _ref.userIconUrl,
733
+ interestIconUrl = _ref.interestIconUrl,
734
+ dropdownClosedIconUrl = _ref.dropdownClosedIconUrl,
735
+ dropdownOpenIconUrl = _ref.dropdownOpenIconUrl,
736
+ currencyFlagIconUrl = _ref.currencyFlagIconUrl,
737
+ closeIconUrl = _ref.closeIconUrl,
738
+ navigationSearchIconUrl = _ref.navigationSearchIconUrl,
739
+ wordpressSiteUrl = _ref.wordpressSiteUrl,
740
+ desktopHeaderWrapperClass = _ref.desktopHeaderWrapperClass,
741
+ menuIconUrl = _ref.menuIconUrl,
742
+ mobileHeaderWrapperClass = _ref.mobileHeaderWrapperClass,
743
+ rightArrowIconUrl = _ref.rightArrowIconUrl,
744
+ desktopHeaderLinks = _ref.desktopHeaderLinks,
745
+ mobileHeaderLinks = _ref.mobileHeaderLinks,
746
+ mobileCloseIconUrl = _ref.mobileCloseIconUrl,
747
+ handleOnAccountClick = _ref.handleOnAccountClick,
748
+ backIconUrl = _ref.backIconUrl;
665
749
  return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
666
- className: desktop_header_wrapper_class
750
+ className: desktopHeaderWrapperClass
667
751
  }, /*#__PURE__*/React__default.createElement(RareStepDesktopHeader$1, {
668
- header_logo_img_url: header_logo_img_url,
669
- search_icon_url: search_icon_url,
670
- cart_icon_url: cart_icon_url,
671
- user_icon_url: user_icon_url,
672
- interest_icon_url: interest_icon_url,
673
- dropdown_closed_icon_url: dropdown_closed_icon_url,
674
- dropdown_open_icon_url: dropdown_open_icon_url,
675
- currency_flag_icon_url: currency_flag_icon_url,
676
- close_icon_url: close_icon_url,
677
- navigation_search_icon_url: navigation_search_icon_url,
678
- wordpress_site_url: wordpress_site_url,
679
- desktop_header_links: desktop_header_links,
752
+ headerLogoImgUrl: headerLogoImgUrl,
753
+ searchIconUrl: searchIconUrl,
754
+ cartIconUrl: cartIconUrl,
755
+ userIconUrl: userIconUrl,
756
+ interestIconUrl: interestIconUrl,
757
+ dropdownClosedIconUrl: dropdownClosedIconUrl,
758
+ dropdownOpenIconUrl: dropdownOpenIconUrl,
759
+ currencyFlagIconUrl: currencyFlagIconUrl,
760
+ closeIconUrl: closeIconUrl,
761
+ navigationSearchIconUrl: navigationSearchIconUrl,
762
+ wordpressSiteUrl: wordpressSiteUrl,
763
+ desktopHeaderLinks: desktopHeaderLinks,
680
764
  handleOnAccountClick: handleOnAccountClick
681
765
  })), /*#__PURE__*/React__default.createElement("div", {
682
- className: mobile_header_wrapper_class
766
+ className: mobileHeaderWrapperClass
683
767
  }, /*#__PURE__*/React__default.createElement(RareStepMobileHeader, {
684
- menu_icon_url: menu_icon_url,
685
- header_logo_img_url: header_logo_img_url,
686
- search_icon_url: search_icon_url,
687
- cart_icon_url: cart_icon_url,
688
- close_icon_url: close_icon_url,
689
- right_arrow_icon_url: right_arrow_icon_url,
690
- mobile_header_links: mobile_header_links,
691
- navigation_search_icon_url: search_icon_url,
692
- mobile_close_icon_url: mobile_close_icon_url
768
+ menuIconUrl: menuIconUrl,
769
+ headerLogoImgUrl: headerLogoImgUrl,
770
+ searchIconUrl: searchIconUrl,
771
+ cartIconUrl: cartIconUrl,
772
+ closeIconUrl: closeIconUrl,
773
+ rightArrowIconUrl: rightArrowIconUrl,
774
+ mobileHeaderLinks: mobileHeaderLinks,
775
+ navigationSearchIconUrl: searchIconUrl,
776
+ mobileCloseIconUrl: mobileCloseIconUrl,
777
+ wordpressSiteUrl: wordpressSiteUrl,
778
+ backIconUrl: backIconUrl,
779
+ currencyFlagIconUrl: currencyFlagIconUrl
693
780
  })));
694
781
  };
695
782