@ohos-ports/sprucelabs-react-heartwood-components 9.1.0-beta.0

package/lib/components/Core/components/HeaderPrimary/HeaderPrimary.js

@@ -0,0 +1,238 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Hamburger = _interopRequireDefault(require("./components/Hamburger/Hamburger"));
+
+var _DefaultLockup = _interopRequireDefault(require("./components/DefaultLockup/DefaultLockup"));
+
+var _UserMenu = _interopRequireDefault(require("./components/UserMenu/UserMenu"));
+
+var _LocationMenu = _interopRequireDefault(require("./components/LocationMenu/LocationMenu"));
+
+var _Button = _interopRequireDefault(require("../../../Button/Button"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var HeaderPrimary =
+/*#__PURE__*/
+function (_Component) {
+  (0, _inherits2["default"])(HeaderPrimary, _Component);
+
+  function HeaderPrimary() {
+    var _getPrototypeOf2;
+
+    var _this;
+
+    (0, _classCallCheck2["default"])(this, HeaderPrimary);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = (0, _possibleConstructorReturn2["default"])(this, (_getPrototypeOf2 = (0, _getPrototypeOf3["default"])(HeaderPrimary)).call.apply(_getPrototypeOf2, [this].concat(args)));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
+      isMenuExpanded: false,
+      isUserMenuVisible: false,
+      isLocationMenuVisible: false
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "hideUserMenu", function (e) {
+      if (e.key === 'Escape' || e.target.contains(_this.ref) || e.type === 'click' && e.target.id !== 'avatar') {
+        _this.setState({
+          isUserMenuVisible: false
+        }, function () {
+          return _this.manageListeners();
+        });
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "hideLocationMenu", function (e) {
+      if (e.key === 'Escape' || e.target.contains(_this.ref)) {
+        _this.setState({
+          isLocationMenuVisible: false
+        }, function () {
+          return _this.manageListeners();
+        });
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleSearchClick", function () {
+      _this.props.onClickSearch && _this.props.onClickSearch();
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "toggleUserMenuVisibility", function () {
+      _this.setState(function (prevState) {
+        return {
+          isUserMenuVisible: !prevState.isUserMenuVisible
+        };
+      }, function () {
+        return _this.manageListeners();
+      });
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "toggleLocationMenuVisibility", function () {
+      _this.setState(function (prevState) {
+        return {
+          isLocationMenuVisible: !prevState.isLocationMenuVisible
+        };
+      }, function () {
+        return _this.manageListeners();
+      });
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "manageListeners", function () {
+      if (typeof window !== 'undefined') {
+        if (_this.state.isUserMenuVisible) {
+          window.addEventListener('click', _this.hideUserMenu, false);
+          window.addEventListener('keyup', _this.hideUserMenu, false);
+        } else if (_this.state.isLocationMenuVisible) {
+          window.addEventListener('click', _this.hideLocationMenu, false);
+          window.addEventListener('keyup', _this.hideLocationMenu, false);
+        } else {
+          window.removeEventListener('click', _this.hideUserMenu, false);
+          window.removeEventListener('keyup', _this.hideUserMenu, false);
+          window.removeEventListener('click', _this.hideLocationMenu, false);
+          window.removeEventListener('keyup', _this.hideLocationMenu, false);
+        }
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "renderHeader", function (organization, location) {
+      if (organization) {
+        if (location) {
+          return _react["default"].createElement("div", {
+            className: "header-primary__location"
+          }, _react["default"].createElement("p", {
+            className: "header-primary__text"
+          }, location.name), location.address && _react["default"].createElement("p", {
+            className: "header-primary__text header-primary__address"
+          }, _react["default"].createElement("a", {
+            href: "#"
+          }, location.address)));
+        } else {
+          return _react["default"].createElement("div", {
+            className: "header-primary__organization"
+          }, organization.image && _react["default"].createElement("div", {
+            className: "header-primary__organization-image",
+            style: {
+              backgroundImage: "url(".concat(organization.image, ")")
+            }
+          }), _react["default"].createElement("p", {
+            className: "header-primary__text"
+          }, organization.name));
+        }
+      } else {
+        return _react["default"].createElement(_DefaultLockup["default"], null);
+      }
+    });
+    return _this;
+  }
+
+  (0, _createClass2["default"])(HeaderPrimary, [{
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var _this$state = this.state,
+          isUserMenuVisible = _this$state.isUserMenuVisible,
+          isLocationMenuVisible = _this$state.isLocationMenuVisible;
+      var _this$props = this.props,
+          user = _this$props.user,
+          organization = _this$props.organization,
+          location = _this$props.location,
+          toggleSidebarVisibility = _this$props.toggleSidebarVisibility,
+          isSidebarVisible = _this$props.isSidebarVisible,
+          enableHamburgerMenu = _this$props.enableHamburgerMenu,
+          searchPlaceholder = _this$props.searchPlaceholder,
+          isLocationManagmentButtonVisible = _this$props.isLocationManagmentButtonVisible,
+          isSkillManagementButtonVisible = _this$props.isSkillManagementButtonVisible,
+          userMenuItems = _this$props.userMenuItems,
+          skillsHref = _this$props.skillsHref,
+          locationManagementHref = _this$props.locationManagementHref,
+          loginHref = _this$props.loginHref,
+          loginCTA = _this$props.loginCTA,
+          onClickSearch = _this$props.onClickSearch;
+      return _react["default"].createElement("header", {
+        className: (0, _classnames["default"])('header-primary', {
+          'hamburger-enabled': enableHamburgerMenu
+        }),
+        ref: function ref(_ref) {
+          return _this2.ref = _ref;
+        }
+      }, enableHamburgerMenu && _react["default"].createElement(_Hamburger["default"], {
+        onClick: toggleSidebarVisibility,
+        isSidebarVisible: isSidebarVisible
+      }), _react["default"].createElement("div", {
+        className: "header-primary__left"
+      }, this.renderHeader(organization, location)), _react["default"].createElement("div", {
+        className: "header-primary__right"
+      }, user ? _react["default"].createElement(_react.Fragment, null, location && isLocationManagmentButtonVisible && _react["default"].createElement(_LocationMenu["default"], {
+        onClick: this.toggleLocationMenuVisibility,
+        isMenuVisible: isLocationMenuVisible,
+        locationManagementHref: locationManagementHref,
+        locationName: location.name,
+        locationAddress: location.address
+      }), isSkillManagementButtonVisible && _react["default"].createElement("div", {
+        className: "header-primary__shortcut-btn-wrapper"
+      }, _react["default"].createElement(_Button["default"], {
+        className: "header-primary__shortcut-btn",
+        icon: {
+          name: 'skill'
+        },
+        text: "Skills",
+        isIconOnly: true,
+        href: skillsHref,
+        target: "_blank"
+      })), onClickSearch && _react["default"].createElement(_Button["default"], {
+        text: searchPlaceholder,
+        icon: {
+          name: 'search'
+        },
+        className: "header-primary__search-btn",
+        onClick: this.handleSearchClick
+      }), _react["default"].createElement(_UserMenu["default"], (0, _extends2["default"])({
+        menuIsVisible: isUserMenuVisible,
+        toggleMenu: this.toggleUserMenuVisibility,
+        userMenuItems: userMenuItems
+      }, user))) : _react["default"].createElement(_react.Fragment, null, _react["default"].createElement(_Button["default"], {
+        kind: "primary",
+        isSmall: true,
+        text: loginCTA,
+        href: loginHref
+      }))));
+    }
+  }]);
+  return HeaderPrimary;
+}(_react.Component);
+
+exports["default"] = HeaderPrimary;
+(0, _defineProperty2["default"])(HeaderPrimary, "defaultProps", {
+  enableHamburgerMenu: true,
+  searchPlaceholder: 'Search…',
+  isLocationManagmentButtonVisible: false,
+  isSkillManagementButtonVisible: false,
+  skillsHref: '',
+  loginHref: '/',
+  loginCTA: 'Log In / Signup',
+  locationManagementHref: ''
+});
+//# sourceMappingURL=HeaderPrimary.js.map

package/lib/components/Core/components/HeaderPrimary/HeaderPrimary.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/Core/components/HeaderPrimary/HeaderPrimary.js"],"names":["HeaderPrimary","isMenuExpanded","isUserMenuVisible","isLocationMenuVisible","e","key","target","contains","ref","type","id","setState","manageListeners","props","onClickSearch","prevState","window","state","addEventListener","hideUserMenu","hideLocationMenu","removeEventListener","organization","location","name","address","image","backgroundImage","user","toggleSidebarVisibility","isSidebarVisible","enableHamburgerMenu","searchPlaceholder","isLocationManagmentButtonVisible","isSkillManagementButtonVisible","userMenuItems","skillsHref","locationManagementHref","loginHref","loginCTA","renderHeader","toggleLocationMenuVisibility","handleSearchClick","toggleUserMenuVisibility","Component"],"mappings":"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","sourcesContent":["// @flow\nimport React, { Component, Fragment } from 'react'\nimport Hamburger from './components/Hamburger/Hamburger'\nimport DefaultLockup from './components/DefaultLockup/DefaultLockup'\nimport UserMenu from './components/UserMenu/UserMenu'\nimport LocationMenu from './components/LocationMenu/LocationMenu'\nimport Button from '../../../Button/Button'\nimport cx from 'classnames'\n\ntype State = {\n\tisMenuExpanded: boolean,\n\tisUserMenuVisible: boolean,\n\tisLocationMenuVisible: boolean\n}\ntype Props = {\n\t/** The logged-in user */\n\tuser?: Object,\n\n\t/** The current organization */\n\torganization?: Object,\n\n\t/** The current location */\n\tlocation?: Object,\n\n\t/** Handler to set sidebar visibility to true or false */\n\ttoggleSidebarVisibility: Function,\n\n\t/** Set true to show the sidebar (small screens only) */\n\tisSidebarVisible: boolean,\n\n\t/** Whether or not we will need to handle hamburger functionality */\n\tenableHamburgerMenu: boolean,\n\n\t/** Placeholder text for the search field */\n\tsearchPlaceholder?: string,\n\n\t/** Handle search click */\n\tonClickSearch?: Function,\n\n\t/** Set true to show location management shortcut */\n\tisLocationManagmentButtonVisible?: boolean,\n\n\t/** Set true to show skill management shortcut */\n\tisSkillManagementButtonVisible: boolean,\n\n\t/** Destination for the skills link */\n\tskillsHref?: string,\n\n\t/** Destination for the login link */\n\tloginHref?: string,\n\n\t/** CTA Copy for the login link */\n\tloginCTA?: string,\n\n\t/** Destination for the location management link */\n\tlocationManagementHref?: string,\n\n\t/** Menu children (<ListItem> or <li>) */\n\tuserMenuItems: ReactNode\n}\n\nexport default class HeaderPrimary extends Component<Props, State> {\n\tstatic defaultProps = {\n\t\tenableHamburgerMenu: true,\n\t\tsearchPlaceholder: 'Search…',\n\t\tisLocationManagmentButtonVisible: false,\n\t\tisSkillManagementButtonVisible: false,\n\t\tskillsHref: '',\n\t\tloginHref: '/',\n\t\tloginCTA: 'Log In / Signup',\n\t\tlocationManagementHref: ''\n\t}\n\n\tstate = {\n\t\tisMenuExpanded: false,\n\t\tisUserMenuVisible: false,\n\t\tisLocationMenuVisible: false\n\t}\n\n\tref: any\n\n\thideUserMenu = (e: Event) => {\n\t\tif (\n\t\t\te.key === 'Escape' ||\n\t\t\te.target.contains(this.ref) ||\n\t\t\t(e.type === 'click' && e.target.id !== 'avatar')\n\t\t) {\n\t\t\tthis.setState(\n\t\t\t\t{\n\t\t\t\t\tisUserMenuVisible: false\n\t\t\t\t},\n\t\t\t\t() => this.manageListeners()\n\t\t\t)\n\t\t}\n\t}\n\n\thideLocationMenu = (e: Event) => {\n\t\tif (e.key === 'Escape' || e.target.contains(this.ref)) {\n\t\t\tthis.setState(\n\t\t\t\t{\n\t\t\t\t\tisLocationMenuVisible: false\n\t\t\t\t},\n\t\t\t\t() => this.manageListeners()\n\t\t\t)\n\t\t}\n\t}\n\n\thandleSearchClick = () => {\n\t\tthis.props.onClickSearch && this.props.onClickSearch()\n\t}\n\n\ttoggleUserMenuVisibility = () => {\n\t\tthis.setState(\n\t\t\tprevState => ({\n\t\t\t\tisUserMenuVisible: !prevState.isUserMenuVisible\n\t\t\t}),\n\t\t\t() => this.manageListeners()\n\t\t)\n\t}\n\n\ttoggleLocationMenuVisibility = () => {\n\t\tthis.setState(\n\t\t\tprevState => ({\n\t\t\t\tisLocationMenuVisible: !prevState.isLocationMenuVisible\n\t\t\t}),\n\t\t\t() => this.manageListeners()\n\t\t)\n\t}\n\n\tmanageListeners = () => {\n\t\tif (typeof window !== 'undefined') {\n\t\t\tif (this.state.isUserMenuVisible) {\n\t\t\t\twindow.addEventListener('click', this.hideUserMenu, false)\n\t\t\t\twindow.addEventListener('keyup', this.hideUserMenu, false)\n\t\t\t} else if (this.state.isLocationMenuVisible) {\n\t\t\t\twindow.addEventListener('click', this.hideLocationMenu, false)\n\t\t\t\twindow.addEventListener('keyup', this.hideLocationMenu, false)\n\t\t\t} else {\n\t\t\t\twindow.removeEventListener('click', this.hideUserMenu, false)\n\t\t\t\twindow.removeEventListener('keyup', this.hideUserMenu, false)\n\t\t\t\twindow.removeEventListener('click', this.hideLocationMenu, false)\n\t\t\t\twindow.removeEventListener('keyup', this.hideLocationMenu, false)\n\t\t\t}\n\t\t}\n\t}\n\n\trenderHeader = (organization: Object, location: Object) => {\n\t\tif (organization) {\n\t\t\tif (location) {\n\t\t\t\treturn (\n\t\t\t\t\t<div className=\"header-primary__location\">\n\t\t\t\t\t\t<p className=\"header-primary__text\">{location.name}</p>\n\t\t\t\t\t\t{location.address && (\n\t\t\t\t\t\t\t<p className=\"header-primary__text header-primary__address\">\n\t\t\t\t\t\t\t\t<a href=\"#\">{location.address}</a>\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t)\n\t\t\t} else {\n\t\t\t\treturn (\n\t\t\t\t\t<div className=\"header-primary__organization\">\n\t\t\t\t\t\t{organization.image && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName=\"header-primary__organization-image\"\n\t\t\t\t\t\t\t\tstyle={{ backgroundImage: `url(${organization.image})` }}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<p className=\"header-primary__text\">{organization.name}</p>\n\t\t\t\t\t</div>\n\t\t\t\t)\n\t\t\t}\n\t\t} else {\n\t\t\treturn <DefaultLockup />\n\t\t}\n\t}\n\n\trender() {\n\t\tconst { isUserMenuVisible, isLocationMenuVisible } = this.state\n\n\t\tconst {\n\t\t\tuser,\n\t\t\torganization,\n\t\t\tlocation,\n\t\t\ttoggleSidebarVisibility,\n\t\t\tisSidebarVisible,\n\t\t\tenableHamburgerMenu,\n\t\t\tsearchPlaceholder,\n\t\t\tisLocationManagmentButtonVisible,\n\t\t\tisSkillManagementButtonVisible,\n\t\t\tuserMenuItems,\n\t\t\tskillsHref,\n\t\t\tlocationManagementHref,\n\t\t\tloginHref,\n\t\t\tloginCTA,\n\t\t\tonClickSearch\n\t\t} = this.props\n\n\t\treturn (\n\t\t\t<header\n\t\t\t\tclassName={cx('header-primary', {\n\t\t\t\t\t'hamburger-enabled': enableHamburgerMenu\n\t\t\t\t})}\n\t\t\t\tref={ref => (this.ref = ref)}\n\t\t\t>\n\t\t\t\t{enableHamburgerMenu && (\n\t\t\t\t\t<Hamburger\n\t\t\t\t\t\tonClick={toggleSidebarVisibility}\n\t\t\t\t\t\tisSidebarVisible={isSidebarVisible}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<div className=\"header-primary__left\">\n\t\t\t\t\t{this.renderHeader(organization, location)}\n\t\t\t\t</div>\n\t\t\t\t<div className=\"header-primary__right\">\n\t\t\t\t\t{user ? (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t{location && isLocationManagmentButtonVisible && (\n\t\t\t\t\t\t\t\t<LocationMenu\n\t\t\t\t\t\t\t\t\tonClick={this.toggleLocationMenuVisibility}\n\t\t\t\t\t\t\t\t\tisMenuVisible={isLocationMenuVisible}\n\t\t\t\t\t\t\t\t\tlocationManagementHref={locationManagementHref}\n\t\t\t\t\t\t\t\t\tlocationName={location.name}\n\t\t\t\t\t\t\t\t\tlocationAddress={location.address}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{isSkillManagementButtonVisible && (\n\t\t\t\t\t\t\t\t<div className=\"header-primary__shortcut-btn-wrapper\">\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tclassName=\"header-primary__shortcut-btn\"\n\t\t\t\t\t\t\t\t\t\ticon={{ name: 'skill' }}\n\t\t\t\t\t\t\t\t\t\ttext=\"Skills\"\n\t\t\t\t\t\t\t\t\t\tisIconOnly\n\t\t\t\t\t\t\t\t\t\thref={skillsHref}\n\t\t\t\t\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{onClickSearch && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\ttext={searchPlaceholder}\n\t\t\t\t\t\t\t\t\ticon={{ name: 'search' }}\n\t\t\t\t\t\t\t\t\tclassName=\"header-primary__search-btn\"\n\t\t\t\t\t\t\t\t\tonClick={this.handleSearchClick}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t<UserMenu\n\t\t\t\t\t\t\t\tmenuIsVisible={isUserMenuVisible}\n\t\t\t\t\t\t\t\ttoggleMenu={this.toggleUserMenuVisibility}\n\t\t\t\t\t\t\t\tuserMenuItems={userMenuItems}\n\t\t\t\t\t\t\t\t{...user}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t<Button kind=\"primary\" isSmall text={loginCTA} href={loginHref} />\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</header>\n\t\t)\n\t}\n}\n"],"file":"HeaderPrimary.js"}

package/lib/components/Core/components/HeaderPrimary/components/DefaultLockup/DefaultLockup.js

@@ -0,0 +1,32 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var DefaultLockup = function DefaultLockup() {
+  return _react["default"].createElement(_react.Fragment, null, _react["default"].createElement("p", {
+    className: "header-primary__lockup"
+  }, _react["default"].createElement("svg", {
+    width: "120",
+    height: "28",
+    viewBox: "0 0 120 28",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, _react["default"].createElement("path", {
+    d: "M15 0.715866L2.03165 19.2296C4.74976 21.653 8.93065 23.6725 13.2971 24L13.6464 19.8628C11.6924 19.6881 9.80394 19.1096 8.07919 18.2254L15 8.34625L21.9208 18.2254C20.1961 19.1096 18.3076 19.6881 16.3536 19.8628L16.7029 24C21.0694 23.6725 25.2503 21.653 27.9684 19.2296L15 0.715866Z",
+    fill: "#24B2B2"
+  }), _react["default"].createElement("path", {
+    d: "M47.464 17.436C47.464 15.17 46.188 14.092 43.284 13.652C42.866 13.586 41.172 13.344 40.468 13.234C38.752 12.97 38.378 12.772 38.378 12.244C38.378 11.672 38.95 11.364 40.886 11.364C42.558 11.364 43.196 11.65 43.438 11.98C43.548 12.134 43.592 12.508 43.592 12.64H47.002C47.002 12.398 46.936 11.65 46.782 11.188C46.166 9.45 44.076 8.592 40.754 8.592C36.86 8.592 34.924 10 34.924 12.156C34.924 14.466 36.2 15.632 38.862 16.006C39.588 16.116 41.04 16.336 41.502 16.402C43.284 16.666 44.01 16.82 44.01 17.502C44.01 18.206 43.394 18.558 41.392 18.558C39.478 18.558 38.554 18.404 38.334 17.832C38.246 17.59 38.224 17.37 38.224 17.216H34.726C34.726 17.612 34.748 17.942 34.858 18.426C35.364 20.406 37.3 21.22 41.392 21.22C45.572 21.22 47.464 19.944 47.464 17.436ZM63.2502 14.73C63.2502 12.86 62.6782 11.562 61.8422 10.484C60.9622 9.34 59.2022 8.636 57.4202 8.636C55.0882 8.636 53.4382 9.604 52.9982 10.616L52.8882 8.9H49.4562V24.806H52.9982V19.504C53.8782 20.648 55.5722 21.088 57.3762 21.088C59.1582 21.088 60.9402 20.34 61.8422 19.284C62.7662 18.206 63.2502 16.732 63.2502 14.73ZM59.6642 14.95C59.6642 15.764 59.4882 16.424 59.1142 16.952C58.5642 17.722 57.5962 18.162 56.2102 18.162C55.0882 18.162 54.2522 17.832 53.7022 17.26C53.1522 16.71 52.8882 15.918 52.8882 14.95C52.8882 13.916 53.2402 13.036 53.9442 12.442C54.4942 11.98 55.2642 11.716 56.2102 11.716C57.3982 11.716 58.2342 12.024 58.7842 12.53C59.4002 13.124 59.6642 13.96 59.6642 14.95ZM74.8853 8.856C74.4013 8.724 73.7193 8.614 72.7073 8.614C70.9033 8.614 68.9453 9.604 68.6593 10.858V8.9H65.1613V21H68.7473V15.192C68.7473 13.08 70.1113 11.87 71.9813 11.87C73.2353 11.87 74.0493 11.98 74.8853 12.244V8.856ZM88.7192 21H85.3092L85.2212 19.306C84.4072 20.67 82.6032 21.198 80.8212 21.198C78.0712 21.198 76.2232 20.164 76.2232 17.216C76.2232 10.198 76.2012 8.988 76.1132 8.9C76.1132 8.9 79.7652 8.9 79.6992 8.9C79.7652 8.9 79.7872 14.092 79.7872 16.314C79.7872 17.92 80.8652 18.448 82.2512 18.448C84.0112 18.448 85.1112 17.568 85.1112 16.138V8.9H88.6532C88.6532 8.9 88.6532 16.996 88.6532 19.108C88.6532 20.208 88.6972 20.89 88.7192 21ZM104.158 13.74C104.158 13.102 104.048 12.376 103.74 11.672C103.036 10.066 101.276 8.614 97.4258 8.614C95.3798 8.614 93.4658 9.142 92.2118 10.374C91.1558 11.408 90.5618 12.926 90.5618 14.906C90.5618 17.062 91.1778 18.69 92.4318 19.746C93.6198 20.736 95.3358 21.198 97.5578 21.198C99.9998 21.198 101.65 20.582 102.662 19.658C103.74 18.712 104.136 17.436 104.136 16.314H100.748C100.748 16.666 100.638 17.128 100.264 17.502C99.8018 17.942 98.9658 18.272 97.6238 18.272C96.3258 18.272 95.4238 18.03 94.8738 17.48C94.2798 16.93 94.1038 16.05 94.1038 14.928C94.1038 13.894 94.3458 12.992 94.9178 12.42C95.4898 11.848 96.3698 11.606 97.5358 11.606C98.8778 11.606 99.7358 12.002 100.198 12.508C100.55 12.882 100.704 13.322 100.704 13.74H104.158ZM118.983 17.062H115.529C115.463 17.326 115.155 17.722 114.517 18.008C114.011 18.228 113.285 18.404 112.295 18.404C110.975 18.404 109.985 18.052 109.479 17.502C109.061 17.04 108.819 16.622 108.819 16.072H119.071C119.269 14.246 118.939 12.508 118.037 11.188C116.959 9.626 115.067 8.614 112.295 8.614C109.655 8.614 107.565 9.604 106.399 11.298C105.717 12.266 105.343 13.498 105.343 14.884C105.343 16.402 105.673 17.612 106.267 18.558C107.433 20.406 109.611 21.198 112.295 21.198C114.253 21.198 115.727 20.78 116.783 20.098C117.993 19.328 118.697 18.228 118.983 17.062ZM115.573 13.762H108.797C108.797 13.41 109.127 12.684 109.545 12.31C110.139 11.782 111.063 11.452 112.317 11.452C113.637 11.452 114.473 11.87 114.979 12.376C115.419 12.838 115.573 13.41 115.573 13.762Z",
+    fill: "white"
+  }))));
+};
+
+var _default = DefaultLockup;
+exports["default"] = _default;
+//# sourceMappingURL=DefaultLockup.js.map

package/lib/components/Core/components/HeaderPrimary/components/DefaultLockup/DefaultLockup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Core/components/HeaderPrimary/components/DefaultLockup/DefaultLockup.js"],"names":["DefaultLockup"],"mappings":";;;;;;;;;AACA;;AAEA,IAAMA,aAAa,GAAG,SAAhBA,aAAgB;AAAA,SACrB,gCAAC,eAAD,QACC;AAAG,IAAA,SAAS,EAAC;AAAb,KACC;AACC,IAAA,KAAK,EAAC,KADP;AAEC,IAAA,MAAM,EAAC,IAFR;AAGC,IAAA,OAAO,EAAC,YAHT;AAIC,IAAA,IAAI,EAAC,MAJN;AAKC,IAAA,KAAK,EAAC;AALP,KAOC;AACC,IAAA,CAAC,EAAC,0RADH;AAEC,IAAA,IAAI,EAAC;AAFN,IAPD,EAWC;AACC,IAAA,CAAC,EAAC,sgHADH;AAEC,IAAA,IAAI,EAAC;AAFN,IAXD,CADD,CADD,CADqB;AAAA,CAAtB;;eAuBeA,a","sourcesContent":["// @flow\nimport React, { Fragment } from 'react'\n\nconst DefaultLockup = () => (\n\t<Fragment>\n\t\t<p className=\"header-primary__lockup\">\n\t\t\t<svg\n\t\t\t\twidth=\"120\"\n\t\t\t\theight=\"28\"\n\t\t\t\tviewBox=\"0 0 120 28\"\n\t\t\t\tfill=\"none\"\n\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t>\n\t\t\t\t<path\n\t\t\t\t\td=\"M15 0.715866L2.03165 19.2296C4.74976 21.653 8.93065 23.6725 13.2971 24L13.6464 19.8628C11.6924 19.6881 9.80394 19.1096 8.07919 18.2254L15 8.34625L21.9208 18.2254C20.1961 19.1096 18.3076 19.6881 16.3536 19.8628L16.7029 24C21.0694 23.6725 25.2503 21.653 27.9684 19.2296L15 0.715866Z\"\n\t\t\t\t\tfill=\"#24B2B2\"\n\t\t\t\t/>\n\t\t\t\t<path\n\t\t\t\t\td=\"M47.464 17.436C47.464 15.17 46.188 14.092 43.284 13.652C42.866 13.586 41.172 13.344 40.468 13.234C38.752 12.97 38.378 12.772 38.378 12.244C38.378 11.672 38.95 11.364 40.886 11.364C42.558 11.364 43.196 11.65 43.438 11.98C43.548 12.134 43.592 12.508 43.592 12.64H47.002C47.002 12.398 46.936 11.65 46.782 11.188C46.166 9.45 44.076 8.592 40.754 8.592C36.86 8.592 34.924 10 34.924 12.156C34.924 14.466 36.2 15.632 38.862 16.006C39.588 16.116 41.04 16.336 41.502 16.402C43.284 16.666 44.01 16.82 44.01 17.502C44.01 18.206 43.394 18.558 41.392 18.558C39.478 18.558 38.554 18.404 38.334 17.832C38.246 17.59 38.224 17.37 38.224 17.216H34.726C34.726 17.612 34.748 17.942 34.858 18.426C35.364 20.406 37.3 21.22 41.392 21.22C45.572 21.22 47.464 19.944 47.464 17.436ZM63.2502 14.73C63.2502 12.86 62.6782 11.562 61.8422 10.484C60.9622 9.34 59.2022 8.636 57.4202 8.636C55.0882 8.636 53.4382 9.604 52.9982 10.616L52.8882 8.9H49.4562V24.806H52.9982V19.504C53.8782 20.648 55.5722 21.088 57.3762 21.088C59.1582 21.088 60.9402 20.34 61.8422 19.284C62.7662 18.206 63.2502 16.732 63.2502 14.73ZM59.6642 14.95C59.6642 15.764 59.4882 16.424 59.1142 16.952C58.5642 17.722 57.5962 18.162 56.2102 18.162C55.0882 18.162 54.2522 17.832 53.7022 17.26C53.1522 16.71 52.8882 15.918 52.8882 14.95C52.8882 13.916 53.2402 13.036 53.9442 12.442C54.4942 11.98 55.2642 11.716 56.2102 11.716C57.3982 11.716 58.2342 12.024 58.7842 12.53C59.4002 13.124 59.6642 13.96 59.6642 14.95ZM74.8853 8.856C74.4013 8.724 73.7193 8.614 72.7073 8.614C70.9033 8.614 68.9453 9.604 68.6593 10.858V8.9H65.1613V21H68.7473V15.192C68.7473 13.08 70.1113 11.87 71.9813 11.87C73.2353 11.87 74.0493 11.98 74.8853 12.244V8.856ZM88.7192 21H85.3092L85.2212 19.306C84.4072 20.67 82.6032 21.198 80.8212 21.198C78.0712 21.198 76.2232 20.164 76.2232 17.216C76.2232 10.198 76.2012 8.988 76.1132 8.9C76.1132 8.9 79.7652 8.9 79.6992 8.9C79.7652 8.9 79.7872 14.092 79.7872 16.314C79.7872 17.92 80.8652 18.448 82.2512 18.448C84.0112 18.448 85.1112 17.568 85.1112 16.138V8.9H88.6532C88.6532 8.9 88.6532 16.996 88.6532 19.108C88.6532 20.208 88.6972 20.89 88.7192 21ZM104.158 13.74C104.158 13.102 104.048 12.376 103.74 11.672C103.036 10.066 101.276 8.614 97.4258 8.614C95.3798 8.614 93.4658 9.142 92.2118 10.374C91.1558 11.408 90.5618 12.926 90.5618 14.906C90.5618 17.062 91.1778 18.69 92.4318 19.746C93.6198 20.736 95.3358 21.198 97.5578 21.198C99.9998 21.198 101.65 20.582 102.662 19.658C103.74 18.712 104.136 17.436 104.136 16.314H100.748C100.748 16.666 100.638 17.128 100.264 17.502C99.8018 17.942 98.9658 18.272 97.6238 18.272C96.3258 18.272 95.4238 18.03 94.8738 17.48C94.2798 16.93 94.1038 16.05 94.1038 14.928C94.1038 13.894 94.3458 12.992 94.9178 12.42C95.4898 11.848 96.3698 11.606 97.5358 11.606C98.8778 11.606 99.7358 12.002 100.198 12.508C100.55 12.882 100.704 13.322 100.704 13.74H104.158ZM118.983 17.062H115.529C115.463 17.326 115.155 17.722 114.517 18.008C114.011 18.228 113.285 18.404 112.295 18.404C110.975 18.404 109.985 18.052 109.479 17.502C109.061 17.04 108.819 16.622 108.819 16.072H119.071C119.269 14.246 118.939 12.508 118.037 11.188C116.959 9.626 115.067 8.614 112.295 8.614C109.655 8.614 107.565 9.604 106.399 11.298C105.717 12.266 105.343 13.498 105.343 14.884C105.343 16.402 105.673 17.612 106.267 18.558C107.433 20.406 109.611 21.198 112.295 21.198C114.253 21.198 115.727 20.78 116.783 20.098C117.993 19.328 118.697 18.228 118.983 17.062ZM115.573 13.762H108.797C108.797 13.41 109.127 12.684 109.545 12.31C110.139 11.782 111.063 11.452 112.317 11.452C113.637 11.452 114.473 11.87 114.979 12.376C115.419 12.838 115.573 13.41 115.573 13.762Z\"\n\t\t\t\t\tfill=\"white\"\n\t\t\t\t/>\n\t\t\t</svg>\n\t\t</p>\n\t</Fragment>\n)\n\nexport default DefaultLockup\n"],"file":"DefaultLockup.js"}

package/lib/components/Core/components/HeaderPrimary/components/Hamburger/Hamburger.js

@@ -0,0 +1,58 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var MenuIcon = function MenuIcon(props) {
+  return _react["default"].createElement("svg", props, _react["default"].createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"
+  }));
+};
+
+MenuIcon.defaultProps = {
+  width: "24",
+  height: "24",
+  viewBox: "0 0 24 24",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+
+var CloseIcon = function CloseIcon(props) {
+  return _react["default"].createElement("svg", props, _react["default"].createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"
+  }));
+};
+
+CloseIcon.defaultProps = {
+  width: "24",
+  height: "24",
+  viewBox: "0 0 24 24",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+
+var Hamburger = function Hamburger(props) {
+  var isSidebarVisible = props.isSidebarVisible,
+      onClick = props.onClick;
+  return _react["default"].createElement("button", {
+    className: "hamburger btn",
+    type: "button",
+    onClick: onClick
+  }, isSidebarVisible ? _react["default"].createElement(CloseIcon, {
+    className: "hamburger__icon"
+  }) : _react["default"].createElement(MenuIcon, {
+    className: "hamburger__icon"
+  }));
+};
+
+var _default = Hamburger;
+exports["default"] = _default;
+//# sourceMappingURL=Hamburger.js.map

package/lib/components/Core/components/HeaderPrimary/components/Hamburger/Hamburger.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Core/components/HeaderPrimary/components/Hamburger/Hamburger.js"],"names":["MenuIcon","CloseIcon","Hamburger","props","isSidebarVisible","onClick"],"mappings":";;;;;;;;;AACA;;IACOA,Q,YAAAA,Q;;;;;;;;AAAAA,Q;;;;;;;IACAC,S,YAAAA,S;;;;;;;;AAAAA,S;;;;;;;AAUP,IAAMC,SAAS,GAAG,SAAZA,SAAY,CAACC,KAAD,EAAkB;AAAA,MAC3BC,gBAD2B,GACGD,KADH,CAC3BC,gBAD2B;AAAA,MACTC,OADS,GACGF,KADH,CACTE,OADS;AAEnC,SACC;AAAQ,IAAA,SAAS,EAAC,eAAlB;AAAkC,IAAA,IAAI,EAAC,QAAvC;AAAgD,IAAA,OAAO,EAAEA;AAAzD,KACED,gBAAgB,GAChB,gCAAC,SAAD;AAAW,IAAA,SAAS,EAAC;AAArB,IADgB,GAGhB,gCAAC,QAAD;AAAU,IAAA,SAAS,EAAC;AAApB,IAJF,CADD;AASA,CAXD;;eAaeF,S","sourcesContent":["// @flow\nimport React from 'react'\nimport MenuIcon from '../../../../../../../static/assets/icons/ic_menu.svg'\nimport CloseIcon from '../../../../../../../static/assets/icons/ic_close.svg'\n\ntype Props = {\n\t/** Set true when the sidebar is visible */\n\tisSidebarVisible: boolean,\n\n\t/** Click handler to toggle sidebar visibility */\n\tonClick: Function\n}\n\nconst Hamburger = (props: Props) => {\n\tconst { isSidebarVisible, onClick } = props\n\treturn (\n\t\t<button className=\"hamburger btn\" type=\"button\" onClick={onClick}>\n\t\t\t{isSidebarVisible ? (\n\t\t\t\t<CloseIcon className=\"hamburger__icon\" />\n\t\t\t) : (\n\t\t\t\t<MenuIcon className=\"hamburger__icon\" />\n\t\t\t)}\n\t\t</button>\n\t)\n}\n\nexport default Hamburger\n"],"file":"Hamburger.js"}

package/lib/components/Core/components/HeaderPrimary/components/LocationMenu/LocationMenu.js

@@ -0,0 +1,169 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _velocityReact = require("velocity-react");
+
+var _Button = _interopRequireDefault(require("../../../../../Button/Button"));
+
+var _Card = _interopRequireDefault(require("../../../../../Card/Card"));
+
+var _List = _interopRequireDefault(require("../../../../../List/List"));
+
+var LocationMenu =
+/*#__PURE__*/
+function (_Component) {
+  (0, _inherits2["default"])(LocationMenu, _Component);
+
+  function LocationMenu() {
+    var _getPrototypeOf2;
+
+    var _this;
+
+    (0, _classCallCheck2["default"])(this, LocationMenu);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = (0, _possibleConstructorReturn2["default"])(this, (_getPrototypeOf2 = (0, _getPrototypeOf3["default"])(LocationMenu)).call.apply(_getPrototypeOf2, [this].concat(args)));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
+      menuPosX: 0
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "componentDidMount", function () {
+      _this.updateMenuPosition();
+
+      if (typeof window !== 'undefined') {
+        window.addEventListener('resize', _this.updateMenuPosition, false);
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "componentWillUnmount", function () {
+      _this.updateMenuPosition();
+
+      if (typeof window !== 'undefined') {
+        window.removeEventListener('resize', _this.updateMenuPosition, false);
+      }
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "updateMenuPosition", function () {
+      var menuPosX = _this.state.menuPosX;
+      var menuWidth = 256;
+      var minMargin = 2;
+      var menuOffsetLeft = _this.menuWrapper.offsetLeft;
+      var diffX = 0;
+
+      if (typeof window !== 'undefined') {
+        diffX = menuOffsetLeft + menuWidth + minMargin - window.innerWidth;
+      }
+
+      if (diffX > 0) {
+        _this.setState({
+          menuPosX: diffX
+        });
+      } else if (menuPosX > 0) {
+        _this.setState({
+          menuPosX: 0
+        });
+      }
+    });
+    return _this;
+  }
+
+  (0, _createClass2["default"])(LocationMenu, [{
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var _this$props = this.props,
+          isMenuVisible = _this$props.isMenuVisible,
+          onClick = _this$props.onClick,
+          locationManagementHref = _this$props.locationManagementHref,
+          locationName = _this$props.locationName,
+          locationAddress = _this$props.locationAddress;
+      var menuPosX = this.state.menuPosX;
+      return _react["default"].createElement("div", {
+        className: "header-primary__shortcut-btn-wrapper",
+        ref: function ref(_ref) {
+          return _this2.menuWrapper = _ref;
+        }
+      }, _react["default"].createElement(_Button["default"], {
+        onClick: onClick,
+        className: (0, _classnames["default"])('header-primary__shortcut-btn', {
+          'header-primary__shortcut-btn--is-active': isMenuVisible
+        }),
+        icon: {
+          name: 'location'
+        },
+        text: "Location",
+        isIconOnly: true
+      }), _react["default"].createElement(_velocityReact.VelocityTransitionGroup, {
+        enter: {
+          animation: {
+            opacity: 1,
+            translateY: '0px'
+          },
+          duration: 200
+        },
+        leave: {
+          animation: {
+            opacity: 0,
+            translateY: '4px'
+          },
+          duration: 0
+        }
+      }, isMenuVisible && _react["default"].createElement("div", {
+        className: "header-primary__location-menu-wrapper"
+      }, _react["default"].createElement("div", {
+        className: "header-primary__location-menu-position",
+        style: {
+          transform: "translate(".concat(-menuPosX, "px, 0)")
+        }
+      }, _react["default"].createElement(_Card["default"], {
+        className: "header-primary__location-menu"
+      }, _react["default"].createElement(_List["default"], {
+        className: "header-primary__location-info",
+        items: [{
+          title: locationName,
+          subtitle: locationAddress,
+          icon: {
+            name: 'location',
+            isLineIcon: true
+          }
+        }]
+      }), _react["default"].createElement(_Button["default"], {
+        kind: "simple",
+        className: "header-primary__location-management-btn",
+        text: "Manage locations",
+        href: locationManagementHref
+      }))))));
+    }
+  }]);
+  return LocationMenu;
+}(_react.Component);
+
+exports["default"] = LocationMenu;
+//# sourceMappingURL=LocationMenu.js.map

package/lib/components/Core/components/HeaderPrimary/components/LocationMenu/LocationMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Core/components/HeaderPrimary/components/LocationMenu/LocationMenu.js"],"names":["LocationMenu","menuPosX","updateMenuPosition","window","addEventListener","removeEventListener","state","menuWidth","minMargin","menuOffsetLeft","menuWrapper","offsetLeft","diffX","innerWidth","setState","props","isMenuVisible","onClick","locationManagementHref","locationName","locationAddress","ref","name","animation","opacity","translateY","duration","transform","title","subtitle","icon","isLineIcon","Component"],"mappings":"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","sourcesContent":["// @flow\nimport React, { Component } from 'react'\nimport cx from 'classnames'\nimport { VelocityTransitionGroup } from 'velocity-react'\nimport Button from '../../../../../Button/Button'\nimport Card from '../../../../../Card/Card'\nimport List from '../../../../../List/List'\n\ntype Props = {\n\tisMenuVisible: boolean,\n\tonClick: Function,\n\tlocationManagementHref: string,\n\tlocationName: string,\n\tlocationAddress: string\n}\n\ntype State = {\n\tmenuPosX: number\n}\n\nexport default class LocationMenu extends Component<Props, State> {\n\tstate = {\n\t\tmenuPosX: 0\n\t}\n\tmenuWrapper: any\n\n\tcomponentDidMount = () => {\n\t\tthis.updateMenuPosition()\n\n\t\tif (typeof window !== 'undefined') {\n\t\t\twindow.addEventListener('resize', this.updateMenuPosition, false)\n\t\t}\n\t}\n\n\tcomponentWillUnmount = () => {\n\t\tthis.updateMenuPosition()\n\n\t\tif (typeof window !== 'undefined') {\n\t\t\twindow.removeEventListener('resize', this.updateMenuPosition, false)\n\t\t}\n\t}\n\n\tupdateMenuPosition = () => {\n\t\tconst { menuPosX } = this.state\n\t\tconst menuWidth = 256\n\t\tconst minMargin = 2\n\t\tconst menuOffsetLeft = this.menuWrapper.offsetLeft\n\t\tlet diffX = 0\n\t\tif (typeof window !== 'undefined') {\n\t\t\tdiffX = menuOffsetLeft + menuWidth + minMargin - window.innerWidth\n\t\t}\n\t\tif (diffX > 0) {\n\t\t\tthis.setState({\n\t\t\t\tmenuPosX: diffX\n\t\t\t})\n\t\t} else if (menuPosX > 0) {\n\t\t\tthis.setState({\n\t\t\t\tmenuPosX: 0\n\t\t\t})\n\t\t}\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tisMenuVisible,\n\t\t\tonClick,\n\t\t\tlocationManagementHref,\n\t\t\tlocationName,\n\t\t\tlocationAddress\n\t\t} = this.props\n\t\tconst { menuPosX } = this.state\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName=\"header-primary__shortcut-btn-wrapper\"\n\t\t\t\tref={ref => (this.menuWrapper = ref)}\n\t\t\t>\n\t\t\t\t<Button\n\t\t\t\t\tonClick={onClick}\n\t\t\t\t\tclassName={cx('header-primary__shortcut-btn', {\n\t\t\t\t\t\t'header-primary__shortcut-btn--is-active': isMenuVisible\n\t\t\t\t\t})}\n\t\t\t\t\ticon={{ name: 'location' }}\n\t\t\t\t\ttext=\"Location\"\n\t\t\t\t\tisIconOnly\n\t\t\t\t/>\n\t\t\t\t<VelocityTransitionGroup\n\t\t\t\t\tenter={{\n\t\t\t\t\t\tanimation: {\n\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\ttranslateY: '0px'\n\t\t\t\t\t\t},\n\t\t\t\t\t\tduration: 200\n\t\t\t\t\t}}\n\t\t\t\t\tleave={{\n\t\t\t\t\t\tanimation: {\n\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\ttranslateY: '4px'\n\t\t\t\t\t\t},\n\t\t\t\t\t\tduration: 0\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{isMenuVisible && (\n\t\t\t\t\t\t<div className=\"header-primary__location-menu-wrapper\">\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName=\"header-primary__location-menu-position\"\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\ttransform: `translate(${-menuPosX}px, 0)`\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Card className=\"header-primary__location-menu\">\n\t\t\t\t\t\t\t\t\t<List\n\t\t\t\t\t\t\t\t\t\tclassName=\"header-primary__location-info\"\n\t\t\t\t\t\t\t\t\t\titems={[\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\ttitle: locationName,\n\t\t\t\t\t\t\t\t\t\t\t\tsubtitle: locationAddress,\n\t\t\t\t\t\t\t\t\t\t\t\ticon: {\n\t\t\t\t\t\t\t\t\t\t\t\t\tname: 'location',\n\t\t\t\t\t\t\t\t\t\t\t\t\tisLineIcon: true\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tkind=\"simple\"\n\t\t\t\t\t\t\t\t\t\tclassName=\"header-primary__location-management-btn\"\n\t\t\t\t\t\t\t\t\t\ttext=\"Manage locations\"\n\t\t\t\t\t\t\t\t\t\thref={locationManagementHref}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</Card>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</VelocityTransitionGroup>\n\t\t\t</div>\n\t\t)\n\t}\n}\n"],"file":"LocationMenu.js"}

package/lib/components/Core/components/HeaderPrimary/components/UserMenu/UserMenu.js

@@ -0,0 +1,56 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _velocityReact = require("velocity-react");
+
+var _Avatar = _interopRequireDefault(require("../../../../../Avatar/Avatar"));
+
+var UserMenu = function UserMenu(props) {
+  var image = props.image,
+      name = props.name,
+      menuIsVisible = props.menuIsVisible,
+      toggleMenu = props.toggleMenu,
+      userMenuItems = props.userMenuItems;
+  return _react["default"].createElement("div", {
+    className: "user-menu"
+  }, _react["default"].createElement("button", {
+    className: "btn header-primary__user-btn",
+    onClick: toggleMenu
+  }, _react["default"].createElement("span", {
+    className: "btn__inner"
+  }, _react["default"].createElement(_Avatar["default"], {
+    image: image,
+    alt: name,
+    width: 32,
+    height: 32
+  }))), _react["default"].createElement(_velocityReact.VelocityTransitionGroup, {
+    enter: {
+      animation: {
+        opacity: 1,
+        translateY: '4px'
+      },
+      duration: 200
+    },
+    leave: {
+      animation: {
+        opacity: 0,
+        translateY: '8px'
+      },
+      duration: 0
+    }
+  }, menuIsVisible && _react["default"].createElement("ul", {
+    className: "user-menu__menu list card"
+  }, userMenuItems)));
+};
+
+var _default = UserMenu;
+exports["default"] = _default;
+//# sourceMappingURL=UserMenu.js.map

package/lib/components/Core/components/HeaderPrimary/components/UserMenu/UserMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../src/components/Core/components/HeaderPrimary/components/UserMenu/UserMenu.js"],"names":["UserMenu","props","image","name","menuIsVisible","toggleMenu","userMenuItems","animation","opacity","translateY","duration"],"mappings":";;;;;;;;;AACA;;AACA;;AACA;;AAmBA,IAAMA,QAAQ,GAAG,SAAXA,QAAW,CAACC,KAAD,EAAkB;AAAA,MAC1BC,KAD0B,GACgCD,KADhC,CAC1BC,KAD0B;AAAA,MACnBC,IADmB,GACgCF,KADhC,CACnBE,IADmB;AAAA,MACbC,aADa,GACgCH,KADhC,CACbG,aADa;AAAA,MACEC,UADF,GACgCJ,KADhC,CACEI,UADF;AAAA,MACcC,aADd,GACgCL,KADhC,CACcK,aADd;AAGlC,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC;AAAQ,IAAA,SAAS,EAAC,8BAAlB;AAAiD,IAAA,OAAO,EAAED;AAA1D,KACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KACC,gCAAC,kBAAD;AAAQ,IAAA,KAAK,EAAEH,KAAf;AAAsB,IAAA,GAAG,EAAEC,IAA3B;AAAiC,IAAA,KAAK,EAAE,EAAxC;AAA4C,IAAA,MAAM,EAAE;AAApD,IADD,CADD,CADD,EAMC,gCAAC,sCAAD;AACC,IAAA,KAAK,EAAE;AACNI,MAAAA,SAAS,EAAE;AAAEC,QAAAA,OAAO,EAAE,CAAX;AAAcC,QAAAA,UAAU,EAAE;AAA1B,OADL;AAENC,MAAAA,QAAQ,EAAE;AAFJ,KADR;AAKC,IAAA,KAAK,EAAE;AACNH,MAAAA,SAAS,EAAE;AAAEC,QAAAA,OAAO,EAAE,CAAX;AAAcC,QAAAA,UAAU,EAAE;AAA1B,OADL;AAENC,MAAAA,QAAQ,EAAE;AAFJ;AALR,KAUEN,aAAa,IACb;AAAI,IAAA,SAAS,EAAC;AAAd,KAA2CE,aAA3C,CAXF,CAND,CADD;AAuBA,CA1BD;;eA4BeN,Q","sourcesContent":["// @flow\nimport React from 'react'\nimport { VelocityTransitionGroup } from 'velocity-react'\nimport Avatar from '../../../../../Avatar/Avatar'\n\ntype Props = {\n\t/** User image to show in the avatar */\n\timage: string,\n\n\t/** User name */\n\tname: string,\n\n\t/** Set true to show the menu */\n\tmenuIsVisible: boolean,\n\n\t/** Handler to toggle menu visibility */\n\ttoggleMenu: Function,\n\n\t/** Menu children (<ListItem> or <li>) */\n\tuserMenuItems: ReactNode\n}\n\nconst UserMenu = (props: Props) => {\n\tconst { image, name, menuIsVisible, toggleMenu, userMenuItems } = props\n\n\treturn (\n\t\t<div className=\"user-menu\">\n\t\t\t<button className=\"btn header-primary__user-btn\" onClick={toggleMenu}>\n\t\t\t\t<span className=\"btn__inner\">\n\t\t\t\t\t<Avatar image={image} alt={name} width={32} height={32} />\n\t\t\t\t</span>\n\t\t\t</button>\n\t\t\t<VelocityTransitionGroup\n\t\t\t\tenter={{\n\t\t\t\t\tanimation: { opacity: 1, translateY: '4px' },\n\t\t\t\t\tduration: 200\n\t\t\t\t}}\n\t\t\t\tleave={{\n\t\t\t\t\tanimation: { opacity: 0, translateY: '8px' },\n\t\t\t\t\tduration: 0\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{menuIsVisible && (\n\t\t\t\t\t<ul className=\"user-menu__menu list card\">{userMenuItems}</ul>\n\t\t\t\t)}\n\t\t\t</VelocityTransitionGroup>\n\t\t</div>\n\t)\n}\n\nexport default UserMenu\n"],"file":"UserMenu.js"}