@bonlineza/luxity-lib 2.40.4 → 2.40.6

package/LuxityFooter.js

@@ -24,6 +24,42 @@
     return _extends.apply(this, arguments);
   }
 
+  function _objectWithoutPropertiesLoose(source, excluded) {
+    if (source == null) return {};
+    var target = {};
+    var sourceKeys = Object.keys(source);
+    var key, i;
+
+    for (i = 0; i < sourceKeys.length; i++) {
+      key = sourceKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      target[key] = source[key];
+    }
+
+    return target;
+  }
+
+  function _objectWithoutProperties(source, excluded) {
+    if (source == null) return {};
+
+    var target = _objectWithoutPropertiesLoose(source, excluded);
+
+    var key, i;
+
+    if (Object.getOwnPropertySymbols) {
+      var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+
+      for (i = 0; i < sourceSymbolKeys.length; i++) {
+        key = sourceSymbolKeys[i];
+        if (excluded.indexOf(key) >= 0) continue;
+        if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+        target[key] = source[key];
+      }
+    }
+
+    return target;
+  }
+
   function _taggedTemplateLiteral(strings, raw) {
     if (!raw) {
       raw = strings.slice(0);
@@ -1824,75 +1860,6 @@
       return _formControl.current;
   }
 
-  var theme = {
-    breakpoints: ['40em', '52em', '64em'],
-    space: ['0px', '4px', '8px', '16px', '32px', '64px', '128px', '256px', '512px'],
-    fontSizes: ['12px', '14px', '16px', '20px', '24px', '32px', '48px', '64px', '72px'],
-    marginPaddings: ['0.5rem', '1rem', '1.5rem', '2rem', '2.5rem', '3rem', '3.5rem', '4rem', '4.5rem', '5rem', '5.5rem', '6rem'],
-    letterSpacings: ['-0.5px', '0px', '+0.5px'],
-    radii: ['0px', '2px', '4px', '8px'],
-    borderRadius: '6px',
-    colors: {
-      primary: '#000',
-      base: '#4e4949',
-      baseLt: '#817c7c',
-      borderColor: '#d8d8d8',
-      ntrlMin: '#fff',
-      ntrlMinTen: '#e6e6e6',
-      gray: '#efefef',
-      darkerGray: '#454141'
-    },
-    rareStepColors: {
-      primary: '#202b58',
-      secondary: '#ef5c2d',
-      ntrlMin: '#ffffff',
-      ntrl40: '#f4f4f4',
-      ntrl50: '#808080',
-      ntrl60: '#e8e8e8',
-      ntrl70: '#252525',
-      ntrlMax: '#000000'
-    },
-    rareStepFontWeights: {
-      normal: 400,
-      medium: 500,
-      semiBold: 600,
-      bold: 700
-    },
-    rareStepFontSize: {
-      h1: '36px',
-      h2: '30px',
-      h3: '24px',
-      h4: '20px',
-      h5: '16px',
-      h6: '14px',
-      footerTitle: '16px'
-    },
-    rareStepPageSizes: {
-      mobile: '500px',
-      tablet: '768px',
-      desktop: '992px',
-      screenl: '1280px',
-      screenxl: '1680px',
-      screenxxl: '1920px',
-      container: '1600px'
-    }
-  };
-
-  var themed = (function (Component) {
-    return /*#__PURE__*/React.forwardRef(function (props, ref) {
-      return /*#__PURE__*/React__default.createElement(styled.ThemeProvider, {
-        theme: theme
-      }, /*#__PURE__*/React__default.createElement(Component, _extends({}, props, {
-        ref: ref
-      })));
-    });
-  });
-
-  var _templateObject;
-  var FooterWrapper = styled__default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n   {\n    background-color: ", ";\n  }\n"])), function (props) {
-    return props.theme.colors.gray;
-  });
-
   var Event = function Event(instance, track) {
     var category = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
     var action = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '';
@@ -1909,26 +1876,35 @@
     }
   };
 
-  var GALink = function GALink(props) {
+  var _excluded = ["instance", "track", "label", "onClick", "children"];
+
+  var GALink = function GALink(_ref) {
+    var instance = _ref.instance,
+        track = _ref.track,
+        label = _ref.label,
+        onClick = _ref.onClick,
+        children = _ref.children,
+        rest = _objectWithoutProperties(_ref, _excluded);
+
     var gaOnClick = function gaOnClick(event) {
-      Event(props.instance, props.track, 'Link', "Click on ".concat(props.href), props.label);
+      Event(instance, track, 'Link', "Click on ".concat(rest.href), label);
 
-      if (typeof props.onClick === 'function') {
-        props.onClick(event);
+      if (typeof onClick === 'function') {
+        onClick(event);
       }
     };
 
     return /*#__PURE__*/React__default.createElement("a", _extends({
       href: "/"
-    }, props, {
+    }, rest, {
       onClick: gaOnClick
-    }), props.children);
+    }), children);
   };
 
-  var _templateObject$1, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
   /* position relative is required for the Body element to be positioned correctly */
 
-  var relativeInlineStyle = styled.css(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral(["\n  position: relative;\n"])));
+  var relativeInlineStyle = styled.css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: relative;\n"])));
   var topMiddleBodyStyle = styled.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  position: absolute;\n  z-index: 1;\n  bottom: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n"])));
   var getTopMiddleArrowAfterStyle = function getTopMiddleArrowAfterStyle(props) {
     return styled.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  /*Bottom Arrow*/\n  top: 100%; /* At the bottom of the tooltip */\n  left: calc(50% - ", ");\n  border-width: ", ";\n  border-style: solid;\n  border-color: ", " transparent transparent transparent;\n"])), props.$apexWidth, props.$apexWidth, props.theme.colors.base);
@@ -1940,7 +1916,7 @@
     return styled.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  /*Top Arrow*/\n  bottom: 100%; /* At the top of the tooltip */\n  top: initial;\n  left: 50%;\n  border-style: solid;\n  border-color: transparent transparent ", " transparent;\n"])), props.theme.colors.base);
   };
 
-  var _templateObject$2;
+  var _templateObject$1;
 
   var getBodyStyle = function getBodyStyle() {
     var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
@@ -1975,7 +1951,7 @@
     }
   };
 
-  var Body = styled__default.span(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n  ", ";\n  visibility: hidden;\n  opacity: 0;\n  width: ", ";\n  transition: visibility 0.3s linear, opacity 0.3s linear;\n  background-color: ", ";\n  color: white;\n  text-align: center;\n  border-radius: 5px;\n  ", "\n  &::after {\n    content: ' ';\n    position: absolute;\n    ", "\n  }\n"])), relativeInlineStyle, function (props) {
+  var Body = styled__default.span(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral(["\n  ", ";\n  visibility: hidden;\n  opacity: 0;\n  width: ", ";\n  transition: visibility 0.3s linear, opacity 0.3s linear;\n  background-color: ", ";\n  color: white;\n  text-align: center;\n  border-radius: 5px;\n  ", "\n  &::after {\n    content: ' ';\n    position: absolute;\n    ", "\n  }\n"])), relativeInlineStyle, function (props) {
     return props.$bodyWidth;
   }, function (props) {
     return props.theme.colors.base || 'black';
@@ -1985,8 +1961,72 @@
     return getAfterStyling(props);
   });
 
-  var _templateObject$3;
-  var Container = styled__default.div(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral(["\n  ", ";\n  cursor: pointer;\n  &:hover ", " {\n    opacity: 1;\n    visibility: visible;\n  }\n"])), relativeInlineStyle, Body);
+  var _templateObject$2;
+  var Container = styled__default.div(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n  ", ";\n  cursor: pointer;\n  &:hover ", " {\n    opacity: 1;\n    visibility: visible;\n  }\n"])), relativeInlineStyle, Body);
+
+  var theme = {
+    breakpoints: ['40em', '52em', '64em'],
+    space: ['0px', '4px', '8px', '16px', '32px', '64px', '128px', '256px', '512px'],
+    fontSizes: ['12px', '14px', '16px', '20px', '24px', '32px', '48px', '64px', '72px'],
+    marginPaddings: ['0.5rem', '1rem', '1.5rem', '2rem', '2.5rem', '3rem', '3.5rem', '4rem', '4.5rem', '5rem', '5.5rem', '6rem'],
+    letterSpacings: ['-0.5px', '0px', '+0.5px'],
+    radii: ['0px', '2px', '4px', '8px'],
+    borderRadius: '6px',
+    colors: {
+      primary: '#000',
+      base: '#4e4949',
+      baseLt: '#817c7c',
+      borderColor: '#d8d8d8',
+      ntrlMin: '#fff',
+      ntrlMinTen: '#e6e6e6',
+      gray: '#efefef',
+      darkerGray: '#454141'
+    },
+    rareStepColors: {
+      primary: '#202b58',
+      secondary: '#ef5c2d',
+      ntrlMin: '#ffffff',
+      ntrl40: '#f4f4f4',
+      ntrl50: '#808080',
+      ntrl60: '#e8e8e8',
+      ntrl70: '#252525',
+      ntrlMax: '#000000'
+    },
+    rareStepFontWeights: {
+      normal: 400,
+      medium: 500,
+      semiBold: 600,
+      bold: 700
+    },
+    rareStepFontSize: {
+      h1: '36px',
+      h2: '30px',
+      h3: '24px',
+      h4: '20px',
+      h5: '16px',
+      h6: '14px',
+      footerTitle: '16px'
+    },
+    rareStepPageSizes: {
+      mobile: '500px',
+      tablet: '768px',
+      desktop: '992px',
+      screenl: '1280px',
+      screenxl: '1680px',
+      screenxxl: '1920px',
+      container: '1600px'
+    }
+  };
+
+  var themed = (function (Component) {
+    return /*#__PURE__*/React.forwardRef(function (props, ref) {
+      return /*#__PURE__*/React__default.createElement(styled.ThemeProvider, {
+        theme: theme
+      }, /*#__PURE__*/React__default.createElement(Component, _extends({}, props, {
+        ref: ref
+      })));
+    });
+  });
 
   /* eslint-disable react/require-default-props */
 
@@ -2151,16 +2191,28 @@
       })), /*#__PURE__*/React__default.createElement("div", {
         className: "footer__links"
       }, !!contactLinks.map && contactLinks.map(function (link) {
-        return !link.isContact ? /*#__PURE__*/React__default.createElement(GALink, {
-          key: link.label,
-          instance: link.instance,
-          href: link.href,
-          label: link.label,
-          className: "footer__link",
-          rel: "noopener noreferrer",
-          track: link === null || link === void 0 ? void 0 : link.track,
-          target: link.target
-        }, link.label) : /*#__PURE__*/React__default.createElement("div", {
+        if (!link.isContact) {
+          return /*#__PURE__*/React__default.createElement(GALink, {
+            key: link.label,
+            instance: link.instance,
+            href: link.href,
+            label: link.label,
+            className: "footer__link",
+            rel: "noopener noreferrer",
+            track: link === null || link === void 0 ? void 0 : link.track,
+            target: link.target
+          }, link.label);
+        }
+
+        if (link.href) {
+          return /*#__PURE__*/React__default.createElement("a", {
+            key: link.label,
+            href: link.href,
+            className: "footer__text"
+          }, link.label);
+        }
+
+        return /*#__PURE__*/React__default.createElement("div", {
           key: link.label,
           className: "footer__text"
         }, link.label);
@@ -2215,7 +2267,9 @@
       });
     };
 
-    return /*#__PURE__*/React__default.createElement(FooterWrapper, null, showNewsletter && /*#__PURE__*/React__default.createElement("div", {
+    return /*#__PURE__*/React__default.createElement("div", {
+      className: "footer__container"
+    }, showNewsletter && /*#__PURE__*/React__default.createElement("div", {
       className: "footer__newsletter-section"
     }, /*#__PURE__*/React__default.createElement("div", {
       className: "footer__newsletter-wrapper"
@@ -2302,8 +2356,6 @@
     }, "Copyright ", currentYear, " | Luxity (Pty) LTD | All Rights Reserved")));
   };
 
-  var index = themed(LuxityFooter);
-
-  return index;
+  return LuxityFooter;
 
 })));

package/LuxityGraphQLDropdownSelector.js

@@ -1134,9 +1134,30 @@
         return category;
       });
 
-      _defineProperty(_assertThisInitialized(_this), "render", function () {
-        var _data$min_shoe_size, _data$max_shoe_size;
+      _defineProperty(_assertThisInitialized(_this), "hasSize", function () {
+        var category_type = _this.props.data.category_type;
+        if (category_type === interestCategories.SHOES) return true;
+        if (category_type === interestCategories.APPAREL) return true;
+        return false;
+      });
 
+      _defineProperty(_assertThisInitialized(_this), "getSizeValue", function () {
+        var data = _this.props.data;
+
+        if (data.category_type === interestCategories.SHOES) {
+          var _data$min_shoe_size, _data$max_shoe_size;
+
+          return "".concat((data === null || data === void 0 ? void 0 : (_data$min_shoe_size = data.min_shoe_size) === null || _data$min_shoe_size === void 0 ? void 0 : _data$min_shoe_size.size) || '', " - ").concat((data === null || data === void 0 ? void 0 : (_data$max_shoe_size = data.max_shoe_size) === null || _data$max_shoe_size === void 0 ? void 0 : _data$max_shoe_size.size) || '');
+        }
+
+        var apparelSizes = data.universal_apparel_sizes || [];
+        if (apparelSizes.length === 0) return '-';
+        return apparelSizes.map(function (apparelSize) {
+          return apparelSize.size;
+        }).join(', ');
+      });
+
+      _defineProperty(_assertThisInitialized(_this), "render", function () {
         var data = _this.props.data;
         var success = _this.state.delete.success;
         return /*#__PURE__*/React__default.createElement(InterestItemContainer, {
@@ -1174,10 +1195,10 @@
             key: "".concat(style.name, "-").concat(data.id)
           }, style.name);
         }) : 'All')), /*#__PURE__*/React__default.createElement("div", {
-          className: "interest-item__container_heading ".concat(data.category_type === interestCategories.SHOES ? '' : 'no-shoe-size-section')
-        }, data.category_type === interestCategories.SHOES ? /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(InterestItemTitle, null, "Shoe Size:"), /*#__PURE__*/React__default.createElement("div", {
+          className: "interest-item__container_heading ".concat(_this.hasSize() ? '' : 'no-shoe-size-section')
+        }, _this.hasSize() ? /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(InterestItemTitle, null, "Size:"), /*#__PURE__*/React__default.createElement("div", {
           className: "list-items"
-        }, "".concat((data === null || data === void 0 ? void 0 : (_data$min_shoe_size = data.min_shoe_size) === null || _data$min_shoe_size === void 0 ? void 0 : _data$min_shoe_size.size) || '', " - "), "".concat((data === null || data === void 0 ? void 0 : (_data$max_shoe_size = data.max_shoe_size) === null || _data$max_shoe_size === void 0 ? void 0 : _data$max_shoe_size.size) || '', " "))) : /*#__PURE__*/React__default.createElement(SheoSizeContentDiv, null, "-"))), /*#__PURE__*/React__default.createElement(TrashIcon, {
+        }, _this.getSizeValue())) : /*#__PURE__*/React__default.createElement(SheoSizeContentDiv, null, "-"))), /*#__PURE__*/React__default.createElement(TrashIcon, {
           id: "interest-".concat(data.id, "-delete-button"),
           onClick: function onClick() {
             if (!_this.state.delete.fetching) {
@@ -11103,7 +11124,7 @@
       className: "heading-title"
     }, "Style"), /*#__PURE__*/React__default.createElement("div", {
       className: "heading-title"
-    }, "Shoe Size")), /*#__PURE__*/React__default.createElement("div", {
+    }, "Size")), /*#__PURE__*/React__default.createElement("div", {
       className: "heading-title-empty"
     })));
   };
@@ -12246,16 +12267,11 @@
   var FooterConnectContainer = styled__default.div(_templateObject16$2 || (_templateObject16$2 = _taggedTemplateLiteral(["\n   {\n    display: flex;\n    flex-direction: column;\n  }\n"])));
 
   var _templateObject$V;
-  var FooterWrapper$1 = styled__default.div(_templateObject$V || (_templateObject$V = _taggedTemplateLiteral(["\n   {\n    background-color: ", ";\n  }\n"])), function (props) {
-    return props.theme.colors.gray;
-  });
-
-  var _templateObject$W;
   var ALL_ITEM$1 = {
     label: 'ALL',
     value: 'ALL'
   };
-  var StyledMultiselector$1 = styled__default.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteral(["\n  .multiselector__selected-items,\n  .multiselector__selectable-items {\n    display: flex;\n    flex-flow: no-wrap;\n    margin-bottom: 40px;\n    .dropdown-select-container {\n      width: 100%;\n      .dropdown-select {\n        &__control {\n          border-color: ", ";\n          border-radius: 0px;\n          background-color: ", ";\n          color: ", ";\n        }\n        &__multi-value {\n          background-color: ", ";\n        }\n        &__multi-value__label {\n          color: ", ";\n          font-size: 100%;\n        }\n        &__multi-value__remove {\n          svg {\n            fill: ", ";\n          }\n        }\n      }\n    }\n  }\n"])), function (props) {
+  var StyledMultiselector$1 = styled__default.div(_templateObject$V || (_templateObject$V = _taggedTemplateLiteral(["\n  .multiselector__selected-items,\n  .multiselector__selectable-items {\n    display: flex;\n    flex-flow: no-wrap;\n    margin-bottom: 40px;\n    .dropdown-select-container {\n      width: 100%;\n      .dropdown-select {\n        &__control {\n          border-color: ", ";\n          border-radius: 0px;\n          background-color: ", ";\n          color: ", ";\n        }\n        &__multi-value {\n          background-color: ", ";\n        }\n        &__multi-value__label {\n          color: ", ";\n          font-size: 100%;\n        }\n        &__multi-value__remove {\n          svg {\n            fill: ", ";\n          }\n        }\n      }\n    }\n  }\n"])), function (props) {
     return props.theme.colors.primary;
   }, function (props) {
     return props.theme.colors.ntrlMin;

package/LuxityMobileHeader.js

@@ -341,7 +341,10 @@
     var backIcon = _ref.backIcon,
         onBackClick = _ref.onBackClick,
         stores = _ref.stores,
-        onContactUsClick = _ref.onContactUsClick;
+        contactUsLink = _ref.contactUsLink,
+        onContactUsLinkClick = _ref.onContactUsLinkClick,
+        _ref$LinkComponent = _ref.LinkComponent,
+        LinkComponent = _ref$LinkComponent === void 0 ? 'a' : _ref$LinkComponent;
     return /*#__PURE__*/React__default.createElement("div", {
       className: "side-nav__sub-menu"
     }, /*#__PURE__*/React__default.createElement("button", {
@@ -371,10 +374,10 @@
         className: "stores-dropdown__open-days"
       }, store.weekendOpenDays), /*#__PURE__*/React__default.createElement("div", {
         className: "stores-dropdown__open-hours"
-      }, store.weekendOpenHours), /*#__PURE__*/React__default.createElement("button", {
-        type: "button",
+      }, store.weekendOpenHours), /*#__PURE__*/React__default.createElement(LinkComponent, {
+        href: contactUsLink,
         className: "stores-dropdown__view-more",
-        onClick: onContactUsClick
+        onClick: onContactUsLinkClick
       }, "View More"));
     })));
   };
@@ -675,10 +678,10 @@
         productUrl = _ref.productUrl,
         onAccountClick = _ref.onAccountClick,
         onCartClick = _ref.onCartClick,
-        onContactUsClick = _ref.onContactUsClick,
-        onOurStoryClick = _ref.onOurStoryClick,
-        onBlogClick = _ref.onBlogClick,
-        onSellToUsClick = _ref.onSellToUsClick,
+        contactUsLink = _ref.contactUsLink,
+        ourStoryLink = _ref.ourStoryLink,
+        blogLink = _ref.blogLink,
+        sellToUsLink = _ref.sellToUsLink,
         stores = _ref.stores,
         categoryElements = _ref.categoryElements,
         showSideNav = _ref.showSideNav,
@@ -688,7 +691,8 @@
         onCurrencyChange = _ref.onCurrencyChange,
         isCurrencySelectionDisabled = _ref.isCurrencySelectionDisabled,
         tooltipContent = _ref.tooltipContent,
-        LinkComponent = _ref.LinkComponent,
+        _ref$LinkComponent = _ref.LinkComponent,
+        LinkComponent = _ref$LinkComponent === void 0 ? 'a' : _ref$LinkComponent,
         categoryConfig = _ref.categoryConfig;
 
     var _useState = React.useState(false),
@@ -701,7 +705,7 @@
         displayedSubMenu = _useState4[0],
         setDisplayedSubMenu = _useState4[1];
 
-    var _useState5 = React.useState(false),
+    var _useState5 = React.useState(true),
         _useState6 = _slicedToArray(_useState5, 2),
         loading = _useState6[0],
         setLoading = _useState6[1];
@@ -751,7 +755,7 @@
       });
     }
 
-    React.useMemo(function () {
+    React.useEffect(function () {
       setLoading(true);
       axios.get("".concat(categoryConfig.menuData)).then(function (_ref2) {
         var data = _ref2.data;
@@ -876,31 +880,31 @@
     }))), /*#__PURE__*/React__default.createElement("div", {
       className: "side-nav__menu-item",
       key: "sell-to-us"
-    }, /*#__PURE__*/React__default.createElement("button", {
-      type: "button",
+    }, /*#__PURE__*/React__default.createElement(LinkComponent, {
+      href: sellToUsLink,
       className: "side-nav__block-button",
-      onClick: onSellToUsClick
+      onClick: onCloseSideNav
     }, "Sell To Us")), /*#__PURE__*/React__default.createElement("div", {
       className: "side-nav__menu-item",
       key: "our-story"
-    }, /*#__PURE__*/React__default.createElement("button", {
-      type: "button",
+    }, /*#__PURE__*/React__default.createElement(LinkComponent, {
+      href: ourStoryLink,
       className: "side-nav__sub-link",
-      onClick: onOurStoryClick
-    }, "Our Story")), typeof onBlogClick === 'function' && /*#__PURE__*/React__default.createElement("div", {
+      onClick: onCloseSideNav
+    }, "Our Story")), blogLink && /*#__PURE__*/React__default.createElement("div", {
       className: "side-nav__menu-item",
       key: "blog"
-    }, /*#__PURE__*/React__default.createElement("button", {
-      type: "button",
+    }, /*#__PURE__*/React__default.createElement(LinkComponent, {
+      href: blogLink,
       className: "side-nav__sub-link",
-      onClick: onBlogClick
+      onClick: onCloseSideNav
     }, "Blog")), /*#__PURE__*/React__default.createElement("div", {
       className: "side-nav__menu-item",
       key: "contact-us"
-    }, /*#__PURE__*/React__default.createElement("button", {
-      type: "button",
+    }, /*#__PURE__*/React__default.createElement(LinkComponent, {
+      href: contactUsLink,
       className: "side-nav__sub-link",
-      onClick: onContactUsClick
+      onClick: onCloseSideNav
     }, "Contact Us")), /*#__PURE__*/React__default.createElement("div", {
       className: "side-nav__menu-item",
       key: "my-account"
@@ -929,7 +933,9 @@
       backIcon: backIcon,
       onBackClick: onBackClick,
       stores: stores,
-      onContactUsClick: onContactUsClick
+      contactUsLink: contactUsLink,
+      onContactUsLinkClick: onCloseSideNav,
+      LinkComponent: LinkComponent
     })));
   };
 
@@ -1564,13 +1570,12 @@
         categoryElements = _ref.categoryElements,
         onAccountClick = _ref.onAccountClick,
         onDashboardClick = _ref.onDashboardClick,
-        onContactUsClick = _ref.onContactUsClick,
-        onOurStoryClick = _ref.onOurStoryClick,
-        _ref$onBlogClick = _ref.onBlogClick,
-        onBlogClick = _ref$onBlogClick === void 0 ? undefined : _ref$onBlogClick,
+        contactUsLink = _ref.contactUsLink,
+        ourStoryLink = _ref.ourStoryLink,
+        blogLink = _ref.blogLink,
         bugReportLink = _ref.bugReportLink,
-        onSellToUsClick = _ref.onSellToUsClick,
-        onLogoClick = _ref.onLogoClick,
+        sellToUsLink = _ref.sellToUsLink,
+        logoHref = _ref.logoHref,
         onLuxityShopClick = _ref.onLuxityShopClick,
         endpoint = _ref.endpoint,
         initialSearchData = _ref.initialSearchData,
@@ -1596,7 +1601,8 @@
         onCurrencyChange = _ref.onCurrencyChange,
         isCurrencySelectionDisabled = _ref.isCurrencySelectionDisabled,
         tooltipContent = _ref.tooltipContent,
-        LinkComponent = _ref.LinkComponent,
+        _ref$LinkComponent = _ref.LinkComponent,
+        LinkComponent = _ref$LinkComponent === void 0 ? 'a' : _ref$LinkComponent,
         shop = _ref.shop,
         app = _ref.app,
         categoryConfig = _ref.categoryConfig,
@@ -1686,7 +1692,7 @@
     var immediateSearch = createImmediateSearch(setSearchValue, setSearchResults, onSearchSubmit);
     var handleChange = useSearchInputChange(setSearchValue, setIsSearchFocused, debouncedSearch, setSearchResults, setCachedResults, app, productsUrl);
     var handleKeyDown = useSearchInputKeyDown(searchValue, immediateSearch, setIsSearchFocused, setSearchValue);
-    React.useMemo(function () {
+    React.useEffect(function () {
       if (!initialSearchData) {
         return;
       }
@@ -1736,10 +1742,6 @@
       return handleClick(onDashboardClick);
     };
 
-    var handleSellToUsClick = function handleSellToUsClick() {
-      return handleClick(onSellToUsClick);
-    };
-
     var handleCartClick = function handleCartClick() {
       return handleClick(onCartClick);
     };
@@ -1792,18 +1794,6 @@
       return handleClick(onAccountClick);
     };
 
-    var handleContactUsClick = function handleContactUsClick() {
-      return handleClick(onContactUsClick);
-    };
-
-    var handleOurStoryClick = function handleOurStoryClick() {
-      return handleClick(onOurStoryClick);
-    };
-
-    var handleBlogClick = onBlogClick ? function () {
-      return handleClick(onBlogClick);
-    } : undefined;
-
     var getInitials = function getInitials(fullName) {
       if (!fullName) return '';
       return fullName.split(' ').map(function (n) {
@@ -1825,9 +1815,8 @@
       className: "navbar__menu-icon"
     })), /*#__PURE__*/React__default.createElement("div", {
       className: "navbar__search-wrapper"
-    }, /*#__PURE__*/React__default.createElement("button", {
-      type: "button",
-      onClick: onLogoClick,
+    }, /*#__PURE__*/React__default.createElement(LinkComponent, {
+      href: logoHref,
       className: "navbar__logo"
     }, /*#__PURE__*/React__default.createElement("img", {
       src: logoSrc,
@@ -1929,10 +1918,10 @@
       productUrl: productsUrl,
       onAccountClick: handleAccountClick,
       onCartClick: handleCartClick,
-      onContactUsClick: handleContactUsClick,
-      onOurStoryClick: handleOurStoryClick,
-      onBlogClick: handleBlogClick,
-      onSellToUsClick: handleSellToUsClick,
+      contactUsLink: contactUsLink,
+      ourStoryLink: ourStoryLink,
+      blogLink: blogLink,
+      sellToUsLink: sellToUsLink,
       stores: stores,
       categoryElements: categoryElements,
       showSideNav: showSideNav,