@bonlineza/luxity-lib 2.34.1 → 2.34.3

package/LuxityMobileHeader.js

@@ -1,110 +1,119 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('axios')) :
-  typeof define === 'function' && define.amd ? define(['react', 'axios'], factory) :
-  (global = global || self, global.LuxityMobileHeader = factory(global.React, global.axios));
-}(this, (function (React, axios) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('axios'), require('styled-components')) :
+  typeof define === 'function' && define.amd ? define(['react', 'axios', 'styled-components'], factory) :
+  (global = global || self, global.LuxityMobileHeader = factory(global.React, global.axios, global.styled));
+}(this, (function (React, axios, styled) { 'use strict';
 
   var React__default = 'default' in React ? React['default'] : React;
   axios = axios && Object.prototype.hasOwnProperty.call(axios, 'default') ? axios['default'] : axios;
+  var styled__default = 'default' in styled ? styled['default'] : styled;
 
-  function ownKeys(object, enumerableOnly) {
-    var keys = Object.keys(object);
-
-    if (Object.getOwnPropertySymbols) {
-      var symbols = Object.getOwnPropertySymbols(object);
-      enumerableOnly && (symbols = symbols.filter(function (sym) {
-        return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-      })), keys.push.apply(keys, symbols);
+  function _arrayLikeToArray(r, a) {
+    (null == a || a > r.length) && (a = r.length);
+    for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
+    return n;
+  }
+  function _arrayWithHoles(r) {
+    if (Array.isArray(r)) return r;
+  }
+  function _defineProperty(e, r, t) {
+    return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
+      value: t,
+      enumerable: !0,
+      configurable: !0,
+      writable: !0
+    }) : e[r] = t, e;
+  }
+  function _extends() {
+    return _extends = Object.assign ? Object.assign.bind() : function (n) {
+      for (var e = 1; e < arguments.length; e++) {
+        var t = arguments[e];
+        for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
+      }
+      return n;
+    }, _extends.apply(null, arguments);
+  }
+  function _iterableToArrayLimit(r, l) {
+    var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
+    if (null != t) {
+      var e,
+        n,
+        i,
+        u,
+        a = [],
+        f = !0,
+        o = !1;
+      try {
+        if (i = (t = t.call(r)).next, 0 === l) {
+          if (Object(t) !== t) return;
+          f = !1;
+        } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
+      } catch (r) {
+        o = !0, n = r;
+      } finally {
+        try {
+          if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return;
+        } finally {
+          if (o) throw n;
+        }
+      }
+      return a;
     }
-
-    return keys;
   }
-
-  function _objectSpread2(target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = null != arguments[i] ? arguments[i] : {};
-      i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
-        _defineProperty(target, key, source[key]);
-      }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
-        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-      });
+  function _nonIterableRest() {
+    throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+  }
+  function ownKeys(e, r) {
+    var t = Object.keys(e);
+    if (Object.getOwnPropertySymbols) {
+      var o = Object.getOwnPropertySymbols(e);
+      r && (o = o.filter(function (r) {
+        return Object.getOwnPropertyDescriptor(e, r).enumerable;
+      })), t.push.apply(t, o);
     }
-
-    return target;
+    return t;
   }
-
-  function _defineProperty(obj, key, value) {
-    if (key in obj) {
-      Object.defineProperty(obj, key, {
-        value: value,
-        enumerable: true,
-        configurable: true,
-        writable: true
+  function _objectSpread2(e) {
+    for (var r = 1; r < arguments.length; r++) {
+      var t = null != arguments[r] ? arguments[r] : {};
+      r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
+        _defineProperty(e, r, t[r]);
+      }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
+        Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
       });
-    } else {
-      obj[key] = value;
     }
-
-    return obj;
-  }
-
-  function _slicedToArray(arr, i) {
-    return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+    return e;
   }
-
-  function _arrayWithHoles(arr) {
-    if (Array.isArray(arr)) return arr;
+  function _slicedToArray(r, e) {
+    return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest();
   }
-
-  function _iterableToArrayLimit(arr, i) {
-    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-
-    if (_i == null) return;
-    var _arr = [];
-    var _n = true;
-    var _d = false;
-
-    var _s, _e;
-
-    try {
-      for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
-        _arr.push(_s.value);
-
-        if (i && _arr.length === i) break;
-      }
-    } catch (err) {
-      _d = true;
-      _e = err;
-    } finally {
-      try {
-        if (!_n && _i["return"] != null) _i["return"]();
-      } finally {
-        if (_d) throw _e;
+  function _taggedTemplateLiteral(e, t) {
+    return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, {
+      raw: {
+        value: Object.freeze(t)
       }
-    }
-
-    return _arr;
+    }));
   }
-
-  function _unsupportedIterableToArray(o, minLen) {
-    if (!o) return;
-    if (typeof o === "string") return _arrayLikeToArray(o, minLen);
-    var n = Object.prototype.toString.call(o).slice(8, -1);
-    if (n === "Object" && o.constructor) n = o.constructor.name;
-    if (n === "Map" || n === "Set") return Array.from(o);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+  function _toPrimitive(t, r) {
+    if ("object" != typeof t || !t) return t;
+    var e = t[Symbol.toPrimitive];
+    if (void 0 !== e) {
+      var i = e.call(t, r || "default");
+      if ("object" != typeof i) return i;
+      throw new TypeError("@@toPrimitive must return a primitive value.");
+    }
+    return ("string" === r ? String : Number)(t);
   }
-
-  function _arrayLikeToArray(arr, len) {
-    if (len == null || len > arr.length) len = arr.length;
-
-    for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
-
-    return arr2;
+  function _toPropertyKey(t) {
+    var i = _toPrimitive(t, "string");
+    return "symbol" == typeof i ? i : i + "";
   }
-
-  function _nonIterableRest() {
-    throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+  function _unsupportedIterableToArray(r, a) {
+    if (r) {
+      if ("string" == typeof r) return _arrayLikeToArray(r, a);
+      var t = {}.toString.call(r).slice(8, -1);
+      return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
+    }
   }
 
   var cssUnit = {
@@ -236,33 +245,30 @@
 
   var LuxityAppSideNav = function LuxityAppSideNav(_ref) {
     var closeIcon = _ref.closeIcon,
-        accountIcon = _ref.accountIcon,
-        orderIcon = _ref.orderIcon,
-        saleIcon = _ref.saleIcon,
-        onDashboardClick = _ref.onDashboardClick,
-        onLogoutClick = _ref.onLogoutClick,
-        bugReportLink = _ref.bugReportLink,
-        onLuxityShopClick = _ref.onLuxityShopClick,
-        onInterestClick = _ref.onInterestClick,
-        onAddressClick = _ref.onAddressClick,
-        onCouponsClick = _ref.onCouponsClick,
-        onEditProfileClick = _ref.onEditProfileClick,
-        onCurrentOrdersClick = _ref.onCurrentOrdersClick,
-        onPastOrdersClick = _ref.onPastOrdersClick,
-        onSubmissionsClick = _ref.onSubmissionsClick,
-        onPastSalesClick = _ref.onPastSalesClick,
-        onPaidOutClick = _ref.onPaidOutClick,
-        showSideNav = _ref.showSideNav,
-        onMenuClick = _ref.onMenuClick;
-
+      accountIcon = _ref.accountIcon,
+      orderIcon = _ref.orderIcon,
+      saleIcon = _ref.saleIcon,
+      onDashboardClick = _ref.onDashboardClick,
+      onLogoutClick = _ref.onLogoutClick,
+      bugReportLink = _ref.bugReportLink,
+      onLuxityShopClick = _ref.onLuxityShopClick,
+      onInterestClick = _ref.onInterestClick,
+      onAddressClick = _ref.onAddressClick,
+      onCouponsClick = _ref.onCouponsClick,
+      onEditProfileClick = _ref.onEditProfileClick,
+      onCurrentOrdersClick = _ref.onCurrentOrdersClick,
+      onPastOrdersClick = _ref.onPastOrdersClick,
+      onSubmissionsClick = _ref.onSubmissionsClick,
+      onPastSalesClick = _ref.onPastSalesClick,
+      onPaidOutClick = _ref.onPaidOutClick,
+      showSideNav = _ref.showSideNav,
+      onMenuClick = _ref.onMenuClick;
     var onCloseSideNav = function onCloseSideNav(e) {
       onMenuClick();
-
       if (e.key === 'Enter') {
         e.preventDefault();
       }
     };
-
     return /*#__PURE__*/React__default.createElement("div", {
       className: "side-nav"
     }, /*#__PURE__*/React__default.createElement("div", {
@@ -420,9 +426,9 @@
 
   var StoresDropdown = function StoresDropdown(_ref) {
     var backIcon = _ref.backIcon,
-        onBackClick = _ref.onBackClick,
-        stores = _ref.stores,
-        onContactUsClick = _ref.onContactUsClick;
+      onBackClick = _ref.onBackClick,
+      stores = _ref.stores,
+      onContactUsClick = _ref.onContactUsClick;
     return /*#__PURE__*/React__default.createElement("div", {
       className: "side-nav__sub-menu"
     }, /*#__PURE__*/React__default.createElement("button", {
@@ -462,19 +468,19 @@
 
   var BrandsDropDown = function BrandsDropDown(_ref) {
     var subMenuOpen = _ref.subMenuOpen,
-        onBackClick = _ref.onBackClick,
-        backIcon = _ref.backIcon,
-        subMenuCategoryTitle = _ref.subMenuCategoryTitle,
-        productUrl = _ref.productUrl,
-        categoryElements = _ref.categoryElements,
-        subMenuBrandsTitle = _ref.subMenuBrandsTitle,
-        _ref$brandsList = _ref.brandsList,
-        brandsList = _ref$brandsList === void 0 ? [] : _ref$brandsList,
-        categorySlug = _ref.categorySlug,
-        isLoading = _ref.isLoading,
-        hasError = _ref.hasError,
-        LinkComponent = _ref.LinkComponent,
-        setSubMenuOpen = _ref.setSubMenuOpen;
+      onBackClick = _ref.onBackClick,
+      backIcon = _ref.backIcon,
+      subMenuCategoryTitle = _ref.subMenuCategoryTitle,
+      productUrl = _ref.productUrl,
+      categoryElements = _ref.categoryElements,
+      subMenuBrandsTitle = _ref.subMenuBrandsTitle,
+      _ref$brandsList = _ref.brandsList,
+      brandsList = _ref$brandsList === void 0 ? [] : _ref$brandsList,
+      categorySlug = _ref.categorySlug,
+      isLoading = _ref.isLoading,
+      hasError = _ref.hasError,
+      LinkComponent = _ref.LinkComponent,
+      setSubMenuOpen = _ref.setSubMenuOpen;
     return /*#__PURE__*/React__default.createElement("div", {
       className: "side-nav__content ".concat(subMenuOpen ? '' : 'side-nav__content--hidden')
     }, hasError ? /*#__PURE__*/React__default.createElement("div", {
@@ -538,7 +544,6 @@
 
   var removeCategoryByName = function removeCategoryByName(categories, name) {
     var _categories$filter;
-
     return (_categories$filter = categories === null || categories === void 0 ? void 0 : categories.filter(function (category) {
       return category.name !== name;
     })) !== null && _categories$filter !== void 0 ? _categories$filter : [];
@@ -567,85 +572,268 @@
     }
   };
 
+  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+
+  /* position relative is required for the Body element to be positioned correctly */
+  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);
+  };
+  var getBottomMiddleBodyStyle = function getBottomMiddleBodyStyle(props) {
+    return styled.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 100%;\n  left: calc(50% - ", " / 2);\n"])), props.bodyWidth);
+  };
+  var getBottomMiddleArrowAfterStyle = function getBottomMiddleArrowAfterStyle(props) {
+    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$1;
+  var getBodyStyle = function getBodyStyle() {
+    var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    var _props$toolTipPositio = props.toolTipPosition,
+      toolTipPosition = _props$toolTipPositio === void 0 ? '' : _props$toolTipPositio;
+    switch (toolTipPosition) {
+      case 'top':
+        return topMiddleBodyStyle;
+      case 'bottom':
+        return getBottomMiddleBodyStyle(props);
+      default:
+        return null;
+    }
+  };
+  var getAfterStyling = function getAfterStyling() {
+    var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    var toolTipPosition = props.toolTipPosition;
+    switch (toolTipPosition) {
+      case 'top':
+        return getTopMiddleArrowAfterStyle(props);
+      case 'bottom':
+        return getBottomMiddleArrowAfterStyle(props);
+      default:
+        return '';
+    }
+  };
+  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';
+  }, function (props) {
+    return getBodyStyle(props);
+  }, function (props) {
+    return getAfterStyling(props);
+  });
+
+  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
+      })));
+    });
+  });
+
+  var Tooltip = function Tooltip(_ref) {
+    var children = _ref.children,
+      toolTipText = _ref.toolTipText,
+      toolTipPosition = _ref.toolTipPosition,
+      bodyWidth = _ref.bodyWidth,
+      apexWidth = _ref.apexWidth,
+      containerClassName = _ref.containerClassName,
+      bodyClassName = _ref.bodyClassName;
+    return /*#__PURE__*/React__default.createElement(Container, {
+      className: containerClassName
+    }, children, /*#__PURE__*/React__default.createElement(Body, {
+      toolTipPosition: toolTipPosition,
+      bodyWidth: bodyWidth,
+      apexWidth: apexWidth,
+      className: bodyClassName
+    }, toolTipText));
+  };
+  Tooltip.defaultProps = {
+    children: null,
+    toolTipText: '',
+    toolTipPosition: 'top',
+    bodyWidth: '8em',
+    apexWidth: '5px',
+    containerClassName: '',
+    bodyClassName: ''
+  };
+  var Tooltip$1 = themed(Tooltip);
+
+  var CurrencySelect = function CurrencySelect(_ref) {
+    var currency = _ref.currency,
+      currencyOptions = _ref.currencyOptions,
+      onCurrencyChange = _ref.onCurrencyChange,
+      _ref$isCurrencySelect = _ref.isCurrencySelectionDisabled,
+      isCurrencySelectionDisabled = _ref$isCurrencySelect === void 0 ? false : _ref$isCurrencySelect,
+      _ref$tooltipContent = _ref.tooltipContent,
+      tooltipContent = _ref$tooltipContent === void 0 ? '' : _ref$tooltipContent;
+    if (!currencyOptions || currencyOptions.length === 0) {
+      return null;
+    }
+    var selectedOption = currencyOptions.find(function (opt) {
+      return opt.value === currency;
+    });
+    if (!selectedOption) {
+      return null;
+    }
+    return /*#__PURE__*/React__default.createElement(Tooltip$1, {
+      toolTipText: isCurrencySelectionDisabled ? tooltipContent : '',
+      toolTipPosition: "bottom",
+      bodyWidth: "160px"
+    }, /*#__PURE__*/React__default.createElement("div", {
+      className: "currency-select-container ".concat(isCurrencySelectionDisabled ? 'disabled' : '')
+    }, /*#__PURE__*/React__default.createElement("div", {
+      className: "currency-flag"
+    }, /*#__PURE__*/React__default.createElement("img", {
+      src: selectedOption.flagSrc,
+      alt: "".concat(currency, " flag")
+    })), /*#__PURE__*/React__default.createElement("select", {
+      value: currency,
+      onChange: function onChange(e) {
+        return onCurrencyChange(e.target.value);
+      },
+      className: "currency-select",
+      disabled: isCurrencySelectionDisabled
+    }, currencyOptions.map(function (option) {
+      return /*#__PURE__*/React__default.createElement("option", {
+        key: option.value,
+        value: option.value
+      }, option.value, " (", option.symbol, ")");
+    }))));
+  };
+
   var LuxitySideNav = function LuxitySideNav(_ref) {
     var accordionIcon = _ref.accordionIcon,
-        closeIcon = _ref.closeIcon,
-        backIcon = _ref.backIcon,
-        productUrl = _ref.productUrl,
-        onAccountClick = _ref.onAccountClick,
-        onCartClick = _ref.onCartClick,
-        onContactUsClick = _ref.onContactUsClick,
-        onOurStoryClick = _ref.onOurStoryClick,
-        onBlogClick = _ref.onBlogClick,
-        onSellToUsClick = _ref.onSellToUsClick,
-        stores = _ref.stores,
-        categoryElements = _ref.categoryElements,
-        showSideNav = _ref.showSideNav,
-        onMenuClick = _ref.onMenuClick,
-        menuData = _ref.menuData,
-        LinkComponent = _ref.LinkComponent;
-
+      closeIcon = _ref.closeIcon,
+      backIcon = _ref.backIcon,
+      productUrl = _ref.productUrl,
+      onAccountClick = _ref.onAccountClick,
+      onCartClick = _ref.onCartClick,
+      onContactUsClick = _ref.onContactUsClick,
+      onOurStoryClick = _ref.onOurStoryClick,
+      onBlogClick = _ref.onBlogClick,
+      onSellToUsClick = _ref.onSellToUsClick,
+      stores = _ref.stores,
+      categoryElements = _ref.categoryElements,
+      showSideNav = _ref.showSideNav,
+      onMenuClick = _ref.onMenuClick,
+      menuData = _ref.menuData,
+      LinkComponent = _ref.LinkComponent,
+      currency = _ref.currency,
+      currencyOptions = _ref.currencyOptions,
+      onCurrencyChange = _ref.onCurrencyChange,
+      isCurrencySelectionDisabled = _ref.isCurrencySelectionDisabled,
+      tooltipContent = _ref.tooltipContent;
     var _useState = React.useState(false),
-        _useState2 = _slicedToArray(_useState, 2),
-        subMenuOpen = _useState2[0],
-        setSubMenuOpen = _useState2[1];
-
+      _useState2 = _slicedToArray(_useState, 2),
+      subMenuOpen = _useState2[0],
+      setSubMenuOpen = _useState2[1];
     var _useState3 = React.useState(''),
-        _useState4 = _slicedToArray(_useState3, 2),
-        displayedSubMenu = _useState4[0],
-        setDisplayedSubMenu = _useState4[1];
-
+      _useState4 = _slicedToArray(_useState3, 2),
+      displayedSubMenu = _useState4[0],
+      setDisplayedSubMenu = _useState4[1];
     var _useState5 = React.useState(false),
-        _useState6 = _slicedToArray(_useState5, 2),
-        loading = _useState6[0],
-        setLoading = _useState6[1];
-
+      _useState6 = _slicedToArray(_useState5, 2),
+      loading = _useState6[0],
+      setLoading = _useState6[1];
     var _useState7 = React.useState({
-      latestArrivals: [],
-      bags: [],
-      shoes: [],
-      apparel: [],
-      accessories: [],
-      watches: [],
-      accessoriesCategories: [],
-      apparelStyles: []
-    }),
-        _useState8 = _slicedToArray(_useState7, 2),
-        dropdownData = _useState8[0],
-        setDropdownData = _useState8[1];
-
+        latestArrivals: [],
+        bags: [],
+        shoes: [],
+        apparel: [],
+        accessories: [],
+        watches: [],
+        accessoriesCategories: [],
+        apparelStyles: []
+      }),
+      _useState8 = _slicedToArray(_useState7, 2),
+      dropdownData = _useState8[0],
+      setDropdownData = _useState8[1];
     var _useState9 = React.useState(false),
-        _useState10 = _slicedToArray(_useState9, 2),
-        hasError = _useState10[0],
-        setHasError = _useState10[1];
-
+      _useState10 = _slicedToArray(_useState9, 2),
+      hasError = _useState10[0],
+      setHasError = _useState10[1];
     var onSubMenuClick = function onSubMenuClick(subMenu) {
       setSubMenuOpen(function (prev) {
         return !prev;
       });
       setDisplayedSubMenu(subMenu);
     };
-
     var onStoresClick = function onStoresClick() {
       setSubMenuOpen(false);
       setDisplayedSubMenu('stores');
     };
-
     var onBackClick = function onBackClick() {
       setSubMenuOpen(false);
       setDisplayedSubMenu('');
     };
-
     var onCloseSideNav = function onCloseSideNav(e) {
       onMenuClick();
       setSubMenuOpen(false);
       setDisplayedSubMenu('');
-
       if (e.key === 'Enter') {
         e.preventDefault();
       }
     };
-
     function addCategoryToElements(elements, categoryName) {
       return elements.map(function (element) {
         return _objectSpread2(_objectSpread2({}, element), {}, {
@@ -653,7 +841,6 @@
         });
       });
     }
-
     React.useMemo(function () {
       setLoading(true);
       axios.get("".concat(menuData)).then(function (_ref2) {
@@ -827,7 +1014,13 @@
       type: "button",
       className: "side-nav__sub-link",
       onClick: onCartClick
-    }, "My Cart")))), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
+    }, "My Cart")), /*#__PURE__*/React__default.createElement(CurrencySelect, {
+      currency: currency,
+      currencyOptions: currencyOptions,
+      onCurrencyChange: onCurrencyChange,
+      isCurrencySelectionDisabled: isCurrencySelectionDisabled,
+      tooltipContent: tooltipContent
+    }))), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
       subMenuOpen: subMenuOpen && displayedSubMenu === 'new',
       onBackClick: onBackClick,
       backIcon: backIcon,
@@ -933,17 +1126,15 @@
 
   var SearchResults = function SearchResults(_ref) {
     var searchValue = _ref.searchValue,
-        searchResults = _ref.searchResults,
-        onViewAll = _ref.onViewAll,
-        searchResultsRef = _ref.searchResultsRef,
-        onSearchSubmit = _ref.onSearchSubmit,
-        setSearchValue = _ref.setSearchValue;
-
+      searchResults = _ref.searchResults,
+      onViewAll = _ref.onViewAll,
+      searchResultsRef = _ref.searchResultsRef,
+      onSearchSubmit = _ref.onSearchSubmit,
+      setSearchValue = _ref.setSearchValue;
     if (searchValue.trim().length >= 3) {
       if (searchResults.brands.length === 0 && searchResults.products.length === 0) {
         return null;
       }
-
       return /*#__PURE__*/React__default.createElement("div", {
         className: "z-50 absolute md:top-14 font-body bg-white w-full lg:w-1/2 flex flex-col md:flex-row md:divide-x divide-black lg:mt-1 shadow-md",
         ref: searchResultsRef
@@ -980,98 +1171,93 @@
         className: "bottom-0 mt-5 py-3 w-full font-body text-center text-white uppercase bg-black hover:bg-gray-950 border border-black transition-all ease-in-out duration-300 cursor-pointer"
       }, "View all"))));
     }
-
     return null;
   };
 
   var LuxityMobileHeader = function LuxityMobileHeader(_ref) {
     var logoSrc = _ref.logoSrc,
-        menuIcon = _ref.menuIcon,
-        inputSearchIcon = _ref.inputSearchIcon,
-        onCartClick = _ref.onCartClick,
-        cartIcon = _ref.cartIcon,
-        cartCount = _ref.cartCount,
-        closeIcon = _ref.closeIcon,
-        accountIcon = _ref.accountIcon,
-        saleIcon = _ref.saleIcon,
-        orderIcon = _ref.orderIcon,
-        accordionIcon = _ref.accordionIcon,
-        backIcon = _ref.backIcon,
-        productsUrl = _ref.productsUrl,
-        stores = _ref.stores,
-        categoryElements = _ref.categoryElements,
-        onAccountClick = _ref.onAccountClick,
-        onDashboardClick = _ref.onDashboardClick,
-        onContactUsClick = _ref.onContactUsClick,
-        onOurStoryClick = _ref.onOurStoryClick,
-        onBlogClick = _ref.onBlogClick,
-        bugReportLink = _ref.bugReportLink,
-        onSellToUsClick = _ref.onSellToUsClick,
-        onLogoClick = _ref.onLogoClick,
-        onLuxityShopClick = _ref.onLuxityShopClick,
-        endpoint = _ref.endpoint,
-        menuData = _ref.menuData,
-        onSearchSubmit = _ref.onSearchSubmit,
-        onProductIdsReceived = _ref.onProductIdsReceived,
-        onLogoutClick = _ref.onLogoutClick,
-        onInterestClick = _ref.onInterestClick,
-        onAddressClick = _ref.onAddressClick,
-        onCouponsClick = _ref.onCouponsClick,
-        onEditProfileClick = _ref.onEditProfileClick,
-        onCurrentOrdersClick = _ref.onCurrentOrdersClick,
-        onPastOrdersClick = _ref.onPastOrdersClick,
-        onSubmissionsClick = _ref.onSubmissionsClick,
-        onPastSalesClick = _ref.onPastSalesClick,
-        onPaidOutClick = _ref.onPaidOutClick,
-        LinkComponent = _ref.LinkComponent,
-        shop = _ref.shop,
-        app = _ref.app;
-
+      menuIcon = _ref.menuIcon,
+      inputSearchIcon = _ref.inputSearchIcon,
+      onCartClick = _ref.onCartClick,
+      cartIcon = _ref.cartIcon,
+      cartCount = _ref.cartCount,
+      closeIcon = _ref.closeIcon,
+      accountIcon = _ref.accountIcon,
+      saleIcon = _ref.saleIcon,
+      orderIcon = _ref.orderIcon,
+      accordionIcon = _ref.accordionIcon,
+      backIcon = _ref.backIcon,
+      productsUrl = _ref.productsUrl,
+      stores = _ref.stores,
+      categoryElements = _ref.categoryElements,
+      onAccountClick = _ref.onAccountClick,
+      onDashboardClick = _ref.onDashboardClick,
+      onContactUsClick = _ref.onContactUsClick,
+      onOurStoryClick = _ref.onOurStoryClick,
+      onBlogClick = _ref.onBlogClick,
+      bugReportLink = _ref.bugReportLink,
+      onSellToUsClick = _ref.onSellToUsClick,
+      onLogoClick = _ref.onLogoClick,
+      onLuxityShopClick = _ref.onLuxityShopClick,
+      endpoint = _ref.endpoint,
+      menuData = _ref.menuData,
+      onSearchSubmit = _ref.onSearchSubmit,
+      onProductIdsReceived = _ref.onProductIdsReceived,
+      onLogoutClick = _ref.onLogoutClick,
+      onInterestClick = _ref.onInterestClick,
+      onAddressClick = _ref.onAddressClick,
+      onCouponsClick = _ref.onCouponsClick,
+      onEditProfileClick = _ref.onEditProfileClick,
+      onCurrentOrdersClick = _ref.onCurrentOrdersClick,
+      onPastOrdersClick = _ref.onPastOrdersClick,
+      onSubmissionsClick = _ref.onSubmissionsClick,
+      onPastSalesClick = _ref.onPastSalesClick,
+      onPaidOutClick = _ref.onPaidOutClick,
+      LinkComponent = _ref.LinkComponent,
+      currency = _ref.currency,
+      currencyOptions = _ref.currencyOptions,
+      onCurrencyChange = _ref.onCurrencyChange,
+      isCurrencySelectionDisabled = _ref.isCurrencySelectionDisabled,
+      tooltipContent = _ref.tooltipContent,
+      shop = _ref.shop,
+      app = _ref.app;
     var _useState = React.useState(''),
-        _useState2 = _slicedToArray(_useState, 2),
-        searchValue = _useState2[0],
-        setSearchValue = _useState2[1];
-
+      _useState2 = _slicedToArray(_useState, 2),
+      searchValue = _useState2[0],
+      setSearchValue = _useState2[1];
     var _useState3 = React.useState(false),
-        _useState4 = _slicedToArray(_useState3, 2),
-        showSearchBar = _useState4[0],
-        setShowSearchbar = _useState4[1];
-
+      _useState4 = _slicedToArray(_useState3, 2),
+      showSearchBar = _useState4[0],
+      setShowSearchbar = _useState4[1];
     var _useState5 = React.useState(false),
-        _useState6 = _slicedToArray(_useState5, 2),
-        showSideNav = _useState6[0],
-        setShowSideNav = _useState6[1];
-
+      _useState6 = _slicedToArray(_useState5, 2),
+      showSideNav = _useState6[0],
+      setShowSideNav = _useState6[1];
     var _useState7 = React.useState(false),
-        _useState8 = _slicedToArray(_useState7, 2),
-        searchLoading = _useState8[0],
-        setSearchLoading = _useState8[1];
-
+      _useState8 = _slicedToArray(_useState7, 2),
+      searchLoading = _useState8[0],
+      setSearchLoading = _useState8[1];
     var _useState9 = React.useState({
-      brands: [],
-      products: []
-    }),
-        _useState10 = _slicedToArray(_useState9, 2),
-        searchResults = _useState10[0],
-        setSearchResults = _useState10[1];
-
+        brands: [],
+        products: []
+      }),
+      _useState10 = _slicedToArray(_useState9, 2),
+      searchResults = _useState10[0],
+      setSearchResults = _useState10[1];
     var debounce = function debounce(func, wait) {
       var timeout;
       return function executedFunction() {
         for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
           args[_key] = arguments[_key];
         }
-
         var later = function later() {
           clearTimeout(timeout);
           func.apply(void 0, args);
         };
-
         clearTimeout(timeout);
         timeout = setTimeout(later, wait);
       };
     };
-
     var debouncedSearch = React.useCallback(debounce(function (nextValue) {
       setSearchLoading(true);
       axios.post(endpoint, searchProducts(nextValue, 6)).then(function (response) {
@@ -1083,11 +1269,9 @@
         setSearchLoading(false);
       });
     }, 500), [endpoint]);
-
     var handleChange = function handleChange(event) {
       var value = event.target.value;
       setSearchValue(value);
-
       if (value.trim().length >= 3) {
         debouncedSearch(value);
       } else {
@@ -1097,7 +1281,6 @@
         });
       }
     };
-
     var handleKeyDown = function handleKeyDown(event) {
       if (event.key === 'Enter') {
         onSearchSubmit(searchValue);
@@ -1106,97 +1289,75 @@
         setSearchValue('');
       }
     };
-
     var onSearchClick = function onSearchClick() {
       setShowSearchbar(function (prev) {
         return !prev;
       });
       setSearchValue('');
     };
-
     var onMenuClick = function onMenuClick() {
       setShowSideNav(function (prev) {
         return !prev;
       });
     };
-
     var handleClick = function handleClick(callback) {
       callback();
       setShowSideNav(false);
     };
-
     var handleDashboardClick = function handleDashboardClick() {
       return handleClick(onDashboardClick);
     };
-
     var handleSellToUsClick = function handleSellToUsClick() {
       return handleClick(onSellToUsClick);
     };
-
     var handleCartClick = function handleCartClick() {
       return handleClick(onCartClick);
     };
-
     var handleLuxityShopClick = function handleLuxityShopClick() {
       return handleClick(onLuxityShopClick);
     };
-
     var handleLogoutClick = function handleLogoutClick() {
       return handleClick(onLogoutClick);
     };
-
     var handleInterestClick = function handleInterestClick() {
       return handleClick(onInterestClick);
     };
-
     var handleAddressClick = function handleAddressClick() {
       return handleClick(onAddressClick);
     };
-
     var handleCouponsClick = function handleCouponsClick() {
       return handleClick(onCouponsClick);
     };
-
     var handleEditProfileClick = function handleEditProfileClick() {
       return handleClick(onEditProfileClick);
     };
-
     var handleCurrentOrdersClick = function handleCurrentOrdersClick() {
       return handleClick(onCurrentOrdersClick);
     };
-
     var handlePastOrdersClick = function handlePastOrdersClick() {
       return handleClick(onPastOrdersClick);
     };
-
     var handlePastSalesClick = function handlePastSalesClick() {
       return handleClick(onPastSalesClick);
     };
-
     var handlePaidOutClick = function handlePaidOutClick() {
       return handleClick(onPaidOutClick);
     };
-
     var handleSubmissionsClick = function handleSubmissionsClick() {
       return handleClick(onSubmissionsClick);
     };
-
     var handleAccountClick = function handleAccountClick() {
       return handleClick(onAccountClick);
     };
-
     var handleContactUsClick = function handleContactUsClick() {
       return handleClick(onContactUsClick);
     };
-
     var handleOurStoryClick = function handleOurStoryClick() {
       return handleClick(onOurStoryClick);
     };
-
     var handleBlogClick = function handleBlogClick() {
       return handleClick(onBlogClick);
     };
-
     return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
       className: "navbar navbar__mobile-wrapper"
     }, /*#__PURE__*/React__default.createElement("div", {
@@ -1229,14 +1390,18 @@
     }, /*#__PURE__*/React__default.createElement("img", {
       src: inputSearchIcon,
       className: "navbar__icon",
-      alt: "interest-icon"
+      alt: "interest-icon",
+      width: 20,
+      height: 20
     })), /*#__PURE__*/React__default.createElement("button", {
       type: "button",
       className: "navbar__cart-icon navbar__icon",
       onClick: onCartClick
     }, /*#__PURE__*/React__default.createElement("img", {
       src: cartIcon,
-      alt: "cart-icon"
+      alt: "cart-icon",
+      width: 20,
+      height: 20
     }), shop && /*#__PURE__*/React__default.createElement("div", {
       className: "navbar__cart-count"
     }, cartCount))))), showSearchBar && /*#__PURE__*/React__default.createElement("div", {
@@ -1291,7 +1456,12 @@
       onMenuClick: onMenuClick,
       endpoint: endpoint,
       menuData: menuData,
-      LinkComponent: LinkComponent
+      LinkComponent: LinkComponent,
+      currency: currency,
+      currencyOptions: currencyOptions,
+      onCurrencyChange: onCurrencyChange,
+      isCurrencySelectionDisabled: isCurrencySelectionDisabled,
+      tooltipContent: tooltipContent
     }), app && /*#__PURE__*/React__default.createElement(LuxityAppSideNav, {
       accordionIcon: accordionIcon,
       closeIcon: closeIcon,