@laerdal/life-react-components 3.5.1-dev.16 → 3.5.1-dev.18

package/dist/umd/GlobalNavigationBar/ExtendedMainMenu.js

@@ -1,192 +0,0 @@
-(function (global, factory) {
-  if (typeof define === "function" && define.amd) {
-    define(["exports", "prop-types", "react", "styled-components", "../styles", "../Tabs", "..", "../styles/z-indexes"], factory);
-  } else if (typeof exports !== "undefined") {
-    factory(exports, require("prop-types"), require("react"), require("styled-components"), require("../styles"), require("../Tabs"), require(".."), require("../styles/z-indexes"));
-  } else {
-    var mod = {
-      exports: {}
-    };
-    factory(mod.exports, global.propTypes, global.react, global.styledComponents, global.styles, global.Tabs, global._, global.zIndexes);
-    global.undefined = mod.exports;
-  }
-})(this, function (exports, _propTypes, _react, _styledComponents, _styles, _Tabs, _, _zIndexes) {
-  "use strict";
-
-  Object.defineProperty(exports, "__esModule", {
-    value: true
-  });
-
-  var _propTypes2 = _interopRequireDefault(_propTypes);
-
-  var React = _interopRequireWildcard(_react);
-
-  var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-  function _getRequireWildcardCache(nodeInterop) {
-    if (typeof WeakMap !== "function") return null;
-    var cacheBabelInterop = new WeakMap();
-    var cacheNodeInterop = new WeakMap();
-    return (_getRequireWildcardCache = function (nodeInterop) {
-      return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
-    })(nodeInterop);
-  }
-
-  function _interopRequireWildcard(obj, nodeInterop) {
-    if (!nodeInterop && obj && obj.__esModule) {
-      return obj;
-    }
-
-    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
-      return {
-        default: obj
-      };
-    }
-
-    var cache = _getRequireWildcardCache(nodeInterop);
-
-    if (cache && cache.has(obj)) {
-      return cache.get(obj);
-    }
-
-    var newObj = {};
-    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
-
-    for (var key in obj) {
-      if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
-        var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
-
-        if (desc && (desc.get || desc.set)) {
-          Object.defineProperty(newObj, key, desc);
-        } else {
-          newObj[key] = obj[key];
-        }
-      }
-    }
-
-    newObj.default = obj;
-
-    if (cache) {
-      cache.set(obj, newObj);
-    }
-
-    return newObj;
-  }
-
-  function _interopRequireDefault(obj) {
-    return obj && obj.__esModule ? obj : {
-      default: obj
-    };
-  }
-
-  const flowDown = _styledComponents.keyframes`
-  0% {
-    opacity: 0;
-    transform: translateY(-10px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-`;
-  const Menu = _styledComponents2.default.ul`
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  background-color: ${_styles.COLORS.white};
-  box-sizing: border-box;
-  display: none;
-  right: -8px;
-  min-width: 300px;
-  -webkit-animation: ${flowDown} 0.2s ease-in-out;
-  animation: ${flowDown} 0.2s ease-in-out;
-  position: absolute;
-  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);
-  border-radius: 4px;
-  z-index: ${_zIndexes.Z_INDEXES.dropdown};
-
-  top: 12px;
-  ${_styles.BREAKPOINTS.SMALL} {
-    top: 18px;
-  }
-  ${_styles.BREAKPOINTS.MEDIUM} {
-    top: 24px;
-  }
-
-  .open & {
-    display: block;
-  }
-`;
-  const MenuSection = _styledComponents2.default.li`
-  padding: 8px 0;
-  position: relative;
-
-  &:not(:first-of-type)::before {
-    content: '';
-    position: absolute;
-    background: ${_styles.COLORS.neutral_100};
-    height: 1px;
-    top: 0;
-    left: 16px;
-    right: 16px;
-  }
-
-  .disabled-link {
-    color: #21212150;
-    pointer-events: none;
-    key-events: none;
-  }
-`;
-  const MenuSectionList = _styledComponents2.default.ul`
-  list-style: none;
-  margin: 0;
-  padding: 0 2px;
-`;
-
-  const ExtendedMainMenu = ({
-    clickMenuAction,
-    navigationOptions
-  }) => {
-    const [entries, setEntries] = React.useState([]);
-    React.useEffect(() => {
-      function handleKeyPress(e) {
-        if (e.keyCode === 27) {
-          clickMenuAction();
-        }
-      }
-
-      document.addEventListener('keydown', handleKeyPress, false);
-      return () => {
-        document.removeEventListener('keydown', handleKeyPress, false);
-      };
-    }, [clickMenuAction]);
-    React.useEffect(() => {
-      const list = navigationOptions?.map(n => {
-        return {
-          requiredLine: n.label,
-          to: n.to,
-          disabled: n.disabled,
-          onClick: n.onClick,
-          exact: n.exact
-        };
-      });
-      setEntries(list);
-    }, [navigationOptions]);
-    return /*#__PURE__*/React.createElement(Menu, {
-      onClick: clickMenuAction,
-      role: "menu",
-      "aria-labelledby": "UserMenuButton"
-    }, /*#__PURE__*/React.createElement(MenuSection, null, /*#__PURE__*/React.createElement(MenuSectionList, null, /*#__PURE__*/React.createElement(_Tabs.VerticalTabs, {
-      key: "ExtendedMenu",
-      entries: entries,
-      size: _.Size.Medium
-    }))));
-  };
-
-  ExtendedMainMenu.propTypes = {
-    clickMenuAction: _propTypes2.default.func.isRequired,
-    navigationOptions: _propTypes2.default.array.isRequired
-  };
-  exports.default = ExtendedMainMenu;
-});
-//# sourceMappingURL=ExtendedMainMenu.js.map

package/dist/umd/GlobalNavigationBar/ExtendedMainMenu.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/ExtendedMainMenu.tsx"],"names":["flowDown","keyframes","Menu","styled","ul","COLORS","white","Z_INDEXES","dropdown","BREAKPOINTS","SMALL","MEDIUM","MenuSection","li","neutral_100","MenuSectionList","clickMenuAction","navigationOptions","ExtendedMainMenu","React","e","document","list","n","requiredLine","to","disabled","onClick","exact","setEntries","Size","Medium"],"mappings":";;;;;;;;;;;;;;;;;;;;;MAAA,K;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,QAAMA,QAAQ,GAAGC,2BAAU;AAC3B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA,CAAA;AAWA,QAAMC,IAAI,GAAGC,2BAAOC,EAAG;AACvB;AACA;AACA;AACA,sBAAsBC,eAAOC,KAAM;AACnC;AACA;AACA;AACA;AACA,uBAAuBN,QAAS;AAChC,eAAeA,QAAS;AACxB;AACA;AACA;AACA,aAAaO,oBAAUC,QAAS;AAChC;AACA;AACA,IAAIC,oBAAYC,KAAM;AACtB;AACA;AACA,IAAID,oBAAYE,MAAO;AACvB;AACA;AACA;AACA;AACA;AACA;AA1BA,CAAA;AA6BA,QAAMC,WAAW,GAAGT,2BAAOU,EAAG;AAC9B;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBR,eAAOS,WAAY;AACrC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAlBA,CAAA;AAqBA,QAAMC,eAAe,GAAGZ,2BAAOC,EAAG;AAClC;AACA;AACA;AAHA,CAAA;;AAWA,QAAMc,gBAAgB,GAAG,CAAC;AAAA,IAAA,eAAA;AAAmBD,IAAAA;AAAnB,GAAD,KAAmD;AAC1E,UAAM,CAAA,OAAA,EAAA,UAAA,IAAwBE,KAAK,CAALA,QAAAA,CAA9B,EAA8BA,CAA9B;AACAA,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB,eAAA,cAAA,CAAA,CAAA,EAAgC;AAC9B,YAAIC,CAAC,CAADA,OAAAA,KAAJ,EAAA,EAAsB;AACpBJ,UAAAA,eAAe;AAChB;AACF;;AAEDK,MAAAA,QAAQ,CAARA,gBAAAA,CAAAA,SAAAA,EAAAA,cAAAA,EAAAA,KAAAA;AACA,aAAO,MAAM;AACXA,QAAAA,QAAQ,CAARA,mBAAAA,CAAAA,SAAAA,EAAAA,cAAAA,EAAAA,KAAAA;AADF,OAAA;AARFF,KAAAA,EAWG,CAXHA,eAWG,CAXHA;AAaAA,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB,YAAMG,IAAI,GAAG,iBAAiB,EAAjB,GAAA,CAAuBC,CAAC,IAAI;AACvC,eAAO;AAAEC,UAAAA,YAAY,EAAED,CAAC,CAAjB,KAAA;AAAyBE,UAAAA,EAAE,EAAEF,CAAC,CAA9B,EAAA;AAAmCG,UAAAA,QAAQ,EAAEH,CAAC,CAA9C,QAAA;AAAyDI,UAAAA,OAAO,EAAEJ,CAAC,CAAnE,OAAA;AAA6EK,UAAAA,KAAK,EAAEL,CAAC,CAACK;AAAtF,SAAP;AADF,OAAa,CAAb;AAGAC,MAAAA,UAAU,CAAVA,IAAU,CAAVA;AAJFV,KAAAA,EAKG,CALHA,iBAKG,CALHA;AAOA,WAAA,aACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAM,MAAA,OAAO,EAAb,eAAA;AAAgC,MAAA,IAAI,EAApC,MAAA;AAA4C,yBAAgB;AAA5D,KAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,WAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,kBAAA,EAAA;AAAc,MAAA,GAAG,EAAjB,cAAA;AAAiC,MAAA,OAAO,EAAxC,OAAA;AAAmD,MAAA,IAAI,EAAEW,OAAKC;AAA9D,KAAA,CADF,CADF,CADF,CADF;AAtBF,GAAA;;;AAJEf,IAAAA,e;AACAC,IAAAA,iB;;oBAoCF,gB","sourcesContent":["import * as React from 'react';\r\nimport styled, { keyframes } from 'styled-components';\r\n\r\nimport { NavOption } from '../types';\r\nimport { BREAKPOINTS, COLORS } from '../styles';\r\nimport { VerticalTabs } from '../Tabs';\r\nimport { VerticalTabEntry } from '../Tabs/VerticalTabs';\r\nimport { Size } from '..';\r\nimport {Z_INDEXES} from '../styles/z-indexes';\r\n\r\nconst flowDown = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    transform: translateY(-10px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n`;\r\n\r\nconst Menu = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0;\r\n  background-color: ${COLORS.white};\r\n  box-sizing: border-box;\r\n  display: none;\r\n  right: -8px;\r\n  min-width: 300px;\r\n  -webkit-animation: ${flowDown} 0.2s ease-in-out;\r\n  animation: ${flowDown} 0.2s ease-in-out;\r\n  position: absolute;\r\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);\r\n  border-radius: 4px;\r\n  z-index: ${Z_INDEXES.dropdown};\r\n\r\n  top: 12px;\r\n  ${BREAKPOINTS.SMALL} {\r\n    top: 18px;\r\n  }\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    top: 24px;\r\n  }\r\n\r\n  .open & {\r\n    display: block;\r\n  }\r\n`;\r\n\r\nconst MenuSection = styled.li`\r\n  padding: 8px 0;\r\n  position: relative;\r\n\r\n  &:not(:first-of-type)::before {\r\n    content: '';\r\n    position: absolute;\r\n    background: ${COLORS.neutral_100};\r\n    height: 1px;\r\n    top: 0;\r\n    left: 16px;\r\n    right: 16px;\r\n  }\r\n\r\n  .disabled-link {\r\n    color: #21212150;\r\n    pointer-events: none;\r\n    key-events: none;\r\n  }\r\n`;\r\n\r\nconst MenuSectionList = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0 2px;\r\n`;\r\n\r\ntype Props = {\r\n  clickMenuAction: () => void;\r\n  navigationOptions: NavOption[];\r\n};\r\n\r\nconst ExtendedMainMenu = ({ clickMenuAction, navigationOptions }: Props) => {\r\n  const [entries, setEntries] = React.useState<VerticalTabEntry[]>([]);\r\n  React.useEffect(() => {\r\n    function handleKeyPress(e: any) {\r\n      if (e.keyCode === 27) {\r\n        clickMenuAction();\r\n      }\r\n    }\r\n\r\n    document.addEventListener('keydown', handleKeyPress, false);\r\n    return () => {\r\n      document.removeEventListener('keydown', handleKeyPress, false);\r\n    };\r\n  }, [clickMenuAction]);\r\n\r\n  React.useEffect(() => {\r\n    const list = navigationOptions?.map(n => {\r\n      return { requiredLine: n.label, to: n.to, disabled: n.disabled, onClick: n.onClick, exact: n.exact };\r\n    }) as VerticalTabEntry[];\r\n    setEntries(list);\r\n  }, [navigationOptions]);\r\n\r\n  return (\r\n    <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\r\n      <MenuSection>\r\n        <MenuSectionList>\r\n          <VerticalTabs key=\"ExtendedMenu\" entries={entries} size={Size.Medium} />\r\n        </MenuSectionList>\r\n      </MenuSection>\r\n    </Menu>\r\n  );\r\n};\r\n\r\nexport default ExtendedMainMenu;\r\n"],"file":"ExtendedMainMenu.js"}

package/dist/umd/GlobalNavigationBar/GlobalNavigationBar.js

@@ -1,360 +0,0 @@
-(function (global, factory) {
-  if (typeof define === "function" && define.amd) {
-    define(["exports", "prop-types", "react", "styled-components", "./Logo", "./MainMenu", "./Actions", "../Layouts", "../styles", "./RightSideNav", "./mobile/MobileMenu", "../icons/systemicons/SystemIcons", "./UserMenu/UserMenu", "../hooks/useClickOutside", "./mobile/CommonStyles", "../styles/z-indexes"], factory);
-  } else if (typeof exports !== "undefined") {
-    factory(exports, require("prop-types"), require("react"), require("styled-components"), require("./Logo"), require("./MainMenu"), require("./Actions"), require("../Layouts"), require("../styles"), require("./RightSideNav"), require("./mobile/MobileMenu"), require("../icons/systemicons/SystemIcons"), require("./UserMenu/UserMenu"), require("../hooks/useClickOutside"), require("./mobile/CommonStyles"), require("../styles/z-indexes"));
-  } else {
-    var mod = {
-      exports: {}
-    };
-    factory(mod.exports, global.propTypes, global.react, global.styledComponents, global.Logo, global.MainMenu, global.Actions, global.Layouts, global.styles, global.RightSideNav, global.MobileMenu, global.SystemIcons, global.UserMenu, global.useClickOutside, global.CommonStyles, global.zIndexes);
-    global.undefined = mod.exports;
-  }
-})(this, function (exports, _propTypes, _react, _styledComponents, _Logo, _MainMenu, _Actions, _Layouts, _styles, _RightSideNav, _MobileMenu, _SystemIcons, _UserMenu, _useClickOutside, _CommonStyles, _zIndexes) {
-  "use strict";
-
-  Object.defineProperty(exports, "__esModule", {
-    value: true
-  });
-
-  var _propTypes2 = _interopRequireDefault(_propTypes);
-
-  var React = _interopRequireWildcard(_react);
-
-  var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-  var _Logo2 = _interopRequireDefault(_Logo);
-
-  var _MainMenu2 = _interopRequireDefault(_MainMenu);
-
-  var _Actions2 = _interopRequireDefault(_Actions);
-
-  var _RightSideNav2 = _interopRequireDefault(_RightSideNav);
-
-  var _MobileMenu2 = _interopRequireDefault(_MobileMenu);
-
-  var _UserMenu2 = _interopRequireDefault(_UserMenu);
-
-  var _useClickOutside2 = _interopRequireDefault(_useClickOutside);
-
-  function _getRequireWildcardCache(nodeInterop) {
-    if (typeof WeakMap !== "function") return null;
-    var cacheBabelInterop = new WeakMap();
-    var cacheNodeInterop = new WeakMap();
-    return (_getRequireWildcardCache = function (nodeInterop) {
-      return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
-    })(nodeInterop);
-  }
-
-  function _interopRequireWildcard(obj, nodeInterop) {
-    if (!nodeInterop && obj && obj.__esModule) {
-      return obj;
-    }
-
-    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
-      return {
-        default: obj
-      };
-    }
-
-    var cache = _getRequireWildcardCache(nodeInterop);
-
-    if (cache && cache.has(obj)) {
-      return cache.get(obj);
-    }
-
-    var newObj = {};
-    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
-
-    for (var key in obj) {
-      if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
-        var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
-
-        if (desc && (desc.get || desc.set)) {
-          Object.defineProperty(newObj, key, desc);
-        } else {
-          newObj[key] = obj[key];
-        }
-      }
-    }
-
-    newObj.default = obj;
-
-    if (cache) {
-      cache.set(obj, newObj);
-    }
-
-    return newObj;
-  }
-
-  function _interopRequireDefault(obj) {
-    return obj && obj.__esModule ? obj : {
-      default: obj
-    };
-  }
-
-  const HeaderWrapper = _styledComponents2.default.header`
-  background: white;
-  border-bottom: 1px solid ${_styles.COLORS.neutral_200};
-  
-  z-index: ${_zIndexes.Z_INDEXES.sticky_menu};
-  position: relative;
-  
-  height: 48px;
-
-  ${_styles.BREAKPOINTS.SMALL} {
-    height: 56px;
-  }
-  ${_styles.BREAKPOINTS.MEDIUM} {
-    height: 64px;
-  }
-
-  @media all and (-ms-high-contrast: none) {
-    height: auto;
-  }
-
-  @media print {
-    border-bottom: none;
-  }
-`;
-  const RowLayout = _styledComponents2.default.div`
-  display: flex;
-`;
-  const RightSide = _styledComponents2.default.div`
-  display: flex;
-  margin: 0 0 0 auto;
-`;
-  const MenuWrapper = _styledComponents2.default.div`
-  background: rgba(0, 0, 0, 0.5);
-  display: ${props => props.isVisible ? 'flex' : 'none'};
-  position: fixed;
-  left: 0;
-  top: 0;
-  height: 100%;
-  width: 100%;
-  overflow-y: hidden;
-  bottom: 0;
-  right: 0;
-  z-index: ${_zIndexes.Z_INDEXES.backdrop};
-`;
-  const UserMenuWrapper = _styledComponents2.default.div`
-  background-color: ${_styles.COLORS.white};
-  display: flex;
-  margin-left: ${props => props.floatRight ? 'auto' : 'unset'};
-  position: absolute;
-  right: ${props => props.offsetRight ? `${window.innerWidth - props.offsetRight + 296}px` : '10%'};
-  top: 56px;
-
-  &:focus-within,
-  &:hover,
-  &.open {
-    background: ${_styles.COLORS.white};
-  }
-`;
-  const HamburgerButton = _styledComponents2.default.button`
-  border-width: 0;
-  background-color: ${_styles.COLORS.white};
-  height: 48px;
-
-  ${_styles.BREAKPOINTS.SMALL} {
-    height: 56px;
-  }
-  ${_styles.BREAKPOINTS.MEDIUM} {
-    height: 64px;
-  }
-  &:hover {
-    cursor: pointer;
-  }
-
-  ${_styles.BREAKPOINTS.MEDIUM} {
-    display: none;
-  }
-`;
-  /**
-   * @param props
-   * @constructor
-   * @description This component is a global navigation header bar
-   */
-
-  const GlobalNavigationBar = ({
-    name,
-    mainNavigationOptions,
-    secondaryNavigationOptions,
-    secondaryButton,
-    actions,
-    firstName,
-    lastName,
-    email,
-    organizationName,
-    signout,
-    isAuthenticated,
-    mobileActions,
-    notifications,
-    switcherAction,
-    reverseRightSideOrder = false,
-    showBetaTag,
-    accountSection,
-    organizationSection,
-    supportSection,
-    accountMenuHeader,
-    signOutLabel,
-    useUserMenu,
-    mainLogoTo,
-    trackLogoClick,
-    testId,
-    useMaxWidth = true
-  }) => {
-    const [showMenu, setShowMenu] = React.useState(false);
-    const [showUserMenu, setShowUserMenu] = React.useState(false);
-    const [showMobileUserMenu, setShowMobileUserMenu] = React.useState(false);
-    const menuRef = React.useRef(null);
-    const userMenuRef = React.useRef(null);
-    const rightSideRef = React.useRef(null);
-    const [avatarRight, setAvatarRight] = React.useState(0);
-
-    const handleClickMenuAction = () => {
-      setShowMenu(false);
-    };
-
-    (0, _useClickOutside2.default)(userMenuRef, () => showUserMenu ? setShowUserMenu(false) : null);
-    (0, _useClickOutside2.default)(menuRef, () => {
-      if (showMenu) {
-        setShowMobileUserMenu(false);
-        setShowMenu(false);
-      }
-    });
-    React.useEffect(() => {
-      const handleResize = () => {
-        const right = document?.getElementById('avatarContainer')?.getBoundingClientRect()?.right;
-
-        if (right) {
-          setAvatarRight(right);
-        }
-      };
-
-      handleResize();
-      window.addEventListener('resize', handleResize);
-      return () => window.removeEventListener('resize', handleResize); // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [document?.getElementById('avatarContainer')?.getBoundingClientRect()?.right]);
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(HeaderWrapper, {
-      "data-testid": testId
-    }, /*#__PURE__*/React.createElement(_Layouts.PageWidth, {
-      useMaxWidth: useMaxWidth
-    }, /*#__PURE__*/React.createElement(RowLayout, null, /*#__PURE__*/React.createElement(_Logo2.default, {
-      name: name || '',
-      showBetaTag: showBetaTag,
-      onClick: trackLogoClick,
-      to: mainLogoTo
-    }), isAuthenticated && /*#__PURE__*/React.createElement(_MainMenu2.default, {
-      navigationOptions: mainNavigationOptions || [],
-      rightSideRef: rightSideRef
-    }), /*#__PURE__*/React.createElement(RightSide, {
-      className: "GlobalNavigationRightSide",
-      ref: rightSideRef
-    }, reverseRightSideOrder ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_Actions2.default, {
-      actions: actions,
-      firstName: firstName || '',
-      lastName: lastName || '',
-      hideOnLowWidth: true,
-      useUserMenu: useUserMenu,
-      setShowUserMenu: setShowUserMenu
-    }), /*#__PURE__*/React.createElement(_RightSideNav2.default, {
-      navigationOptions: secondaryNavigationOptions,
-      secondaryButton: secondaryButton
-    })) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_RightSideNav2.default, {
-      navigationOptions: secondaryNavigationOptions,
-      secondaryButton: secondaryButton
-    }), /*#__PURE__*/React.createElement(_Actions2.default, {
-      actions: actions,
-      firstName: firstName || '',
-      lastName: lastName || '',
-      hideOnLowWidth: true,
-      useUserMenu: useUserMenu,
-      setShowUserMenu: setShowUserMenu
-    })), /*#__PURE__*/React.createElement(HamburgerButton, {
-      onClick: () => setShowMenu(!showMenu),
-      hidden: !isAuthenticated
-    }, /*#__PURE__*/React.createElement(_SystemIcons.Menu, {
-      size: "24px"
-    })))))), /*#__PURE__*/React.createElement(MenuWrapper, {
-      className: showMenu ? 'open' : 'closed',
-      isVisible: showMenu
-    }, /*#__PURE__*/React.createElement(_CommonStyles.Menu, {
-      ref: menuRef,
-      onClick: () => {},
-      role: "menu",
-      "aria-labelledby": "UserMenuButton"
-    }, /*#__PURE__*/React.createElement(_MobileMenu2.default, {
-      name: name || '',
-      clickMenuAction: () => {
-        setShowMobileUserMenu(false);
-        handleClickMenuAction();
-      },
-      navigationOptions: mainNavigationOptions || [],
-      secondaryNavigationOptions: secondaryNavigationOptions,
-      secondaryButton: secondaryButton,
-      firstName: firstName || '',
-      lastName: lastName || '',
-      email: email || '',
-      signout: signout,
-      notifications: notifications,
-      actions: mobileActions,
-      switcherAction: switcherAction,
-      isAuthenticated: isAuthenticated,
-      accountSection: accountSection || [],
-      organizationSection: organizationSection || [],
-      supportSection: supportSection || [],
-      accountMenuHeader: accountMenuHeader || '',
-      signOutLabel: signOutLabel || '',
-      organizationName: organizationName || '',
-      useUserMenu: useUserMenu,
-      showUserMenu: showMobileUserMenu,
-      setShowUserMenu: setShowMobileUserMenu
-    }))), useUserMenu && /*#__PURE__*/React.createElement(UserMenuWrapper, {
-      ref: userMenuRef,
-      className: showUserMenu ? 'open' : 'closed',
-      floatRight: false,
-      offsetRight: avatarRight,
-      "data-testid": "testUserMenuWrapper"
-    }, /*#__PURE__*/React.createElement(_UserMenu2.default, {
-      firstName: firstName || '',
-      lastName: lastName || '',
-      email: email || '',
-      organizationName: organizationName || '',
-      clickMenuAction: () => setShowUserMenu(false),
-      accountSection: accountSection,
-      organizationSection: organizationSection,
-      supportSection: supportSection,
-      signOut: signout,
-      signOutLabel: signOutLabel || ''
-    })));
-  };
-
-  GlobalNavigationBar.propTypes = {
-    name: _propTypes2.default.string,
-    mainNavigationOptions: _propTypes2.default.array,
-    secondaryNavigationOptions: _propTypes2.default.array,
-    firstName: _propTypes2.default.string,
-    lastName: _propTypes2.default.string,
-    email: _propTypes2.default.string,
-    organizationName: _propTypes2.default.string,
-    signout: _propTypes2.default.func,
-    isAuthenticated: _propTypes2.default.bool,
-    notifications: _propTypes2.default.array,
-    switcherAction: _propTypes2.default.func,
-    reverseRightSideOrder: _propTypes2.default.bool,
-    showBetaTag: _propTypes2.default.bool,
-    accountSection: _propTypes2.default.array,
-    organizationSection: _propTypes2.default.array,
-    supportSection: _propTypes2.default.array,
-    accountMenuHeader: _propTypes2.default.string,
-    signOutLabel: _propTypes2.default.string,
-    useUserMenu: _propTypes2.default.bool,
-    trackLogoClick: _propTypes2.default.func,
-    mainLogoTo: _propTypes2.default.string,
-    testId: _propTypes2.default.string,
-    useMaxWidth: _propTypes2.default.bool
-  };
-  exports.default = GlobalNavigationBar;
-});
-//# sourceMappingURL=GlobalNavigationBar.js.map

package/dist/umd/GlobalNavigationBar/GlobalNavigationBar.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/GlobalNavigationBar.tsx"],"names":["HeaderWrapper","styled","header","COLORS","neutral_200","Z_INDEXES","sticky_menu","BREAKPOINTS","SMALL","MEDIUM","RowLayout","div","RightSide","MenuWrapper","props","backdrop","UserMenuWrapper","white","window","HamburgerButton","button","name","mainNavigationOptions","secondaryNavigationOptions","firstName","lastName","email","organizationName","signout","isAuthenticated","notifications","switcherAction","reverseRightSideOrder","showBetaTag","accountSection","organizationSection","supportSection","accountMenuHeader","signOutLabel","useUserMenu","trackLogoClick","mainLogoTo","testId","useMaxWidth","GlobalNavigationBar","React","menuRef","userMenuRef","rightSideRef","handleClickMenuAction","setShowMenu","useClickOutside","showUserMenu","setShowUserMenu","setShowMobileUserMenu","handleResize","right","document","setAvatarRight","secondaryButton","showMenu"],"mappings":";;;;;;;;;;;;;;;;;;;;;MAAA,K;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,QAAMA,aAAa,GAAGC,2BAAOC,MAAO;AACpC;AACA,6BAA6BC,eAAOC,WAAY;AAChD;AACA,aAAaC,oBAAUC,WAAY;AACnC;AACA;AACA;AACA;AACA,IAAIC,oBAAYC,KAAM;AACtB;AACA;AACA,IAAID,oBAAYE,MAAO;AACvB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAtBA,CAAA;AAyBA,QAAMC,SAAS,GAAGT,2BAAOU,GAAI;AAC7B;AADA,CAAA;AAIA,QAAMC,SAAS,GAAGX,2BAAOU,GAAI;AAC7B;AACA;AAFA,CAAA;AAKA,QAAME,WAAW,GAAGZ,2BAAOU,GAAsB;AACjD;AACA,aAAcG,KAAD,IAAYA,KAAK,CAALA,SAAAA,GAAAA,MAAAA,GAA2B,MAAQ;AAC5D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAaT,oBAAUU,QAAS;AAXhC,CAAA;AAcA,QAAMC,eAAe,GAAGf,2BAAOU,GAA0B;AACzD,sBAAsBR,eAAOc,KAAM;AACnC;AACA,iBAAkBH,KAAD,IAAYA,KAAK,CAALA,UAAAA,GAAAA,MAAAA,GAA4B,OAAS;AAClE;AACA,WAAYA,KAAD,IAAYA,KAAK,CAALA,WAAAA,GAAqB,GAAEI,MAAM,CAANA,UAAAA,GAAoBJ,KAAK,CAAzBI,WAAAA,GAAwC,GAA/DJ,IAAAA,GAAyE,KAAO;AACvG;AACA;AACA;AACA;AACA;AACA,kBAAkBX,eAAOc,KAAM;AAC/B;AAZA,CAAA;AAoBA,QAAME,eAAe,GAAGlB,2BAAOmB,MAAO;AACtC;AACA,sBAAsBjB,eAAOc,KAAM;AACnC;AACA;AACA,IAAIV,oBAAYC,KAAM;AACtB;AACA;AACA,IAAID,oBAAYE,MAAO;AACvB;AACA;AACA;AACA;AACA;AACA;AACA,IAAIF,oBAAYE,MAAO;AACvB;AACA;AAjBA,CAAA;AAqDA;AACA;AACA;AACA;AACA;;AACA,QAAMmC,mBAAmB,GAAG,CAAC;AAAA,IAAA,IAAA;AAAA,IAAA,qBAAA;AAAA,IAAA,0BAAA;AAAA,IAAA,eAAA;AAAA,IAAA,OAAA;AAAA,IAAA,SAAA;AAAA,IAAA,QAAA;AAAA,IAAA,KAAA;AAAA,IAAA,gBAAA;AAAA,IAAA,OAAA;AAAA,IAAA,eAAA;AAAA,IAAA,aAAA;AAAA,IAAA,aAAA;AAAA,IAAA,cAAA;AAe3BZ,IAAAA,qBAAqB,GAfM,KAAA;AAAA,IAAA,WAAA;AAAA,IAAA,cAAA;AAAA,IAAA,mBAAA;AAAA,IAAA,cAAA;AAAA,IAAA,iBAAA;AAAA,IAAA,YAAA;AAAA,IAAA,WAAA;AAAA,IAAA,UAAA;AAAA,IAAA,cAAA;AAAA,IAAA,MAAA;AA0B3BW,IAAAA,WAAW,GAAG;AA1Ba,GAAD,KA2BY;AACtC,UAAM,CAAA,QAAA,EAAA,WAAA,IAA0BE,KAAK,CAALA,QAAAA,CAAhC,KAAgCA,CAAhC;AACA,UAAM,CAAA,YAAA,EAAA,eAAA,IAAkCA,KAAK,CAALA,QAAAA,CAAxC,KAAwCA,CAAxC;AACA,UAAM,CAAA,kBAAA,EAAA,qBAAA,IAA8CA,KAAK,CAALA,QAAAA,CAApD,KAAoDA,CAApD;AACA,UAAMC,OAAO,GAAGD,KAAK,CAALA,MAAAA,CAAhB,IAAgBA,CAAhB;AACA,UAAME,WAAW,GAAGF,KAAK,CAALA,MAAAA,CAApB,IAAoBA,CAApB;AACA,UAAMG,YAAY,GAAGH,KAAK,CAALA,MAAAA,CAArB,IAAqBA,CAArB;AACA,UAAM,CAAA,WAAA,EAAA,cAAA,IAAgCA,KAAK,CAALA,QAAAA,CAAtC,CAAsCA,CAAtC;;AAEA,UAAMI,qBAAqB,GAAG,MAAM;AAClCC,MAAAA,WAAW,CAAXA,KAAW,CAAXA;AADF,KAAA;;AAIAC,mCAAe,WAAfA,EAA6B,MAAOC,YAAY,GAAGC,eAAe,CAAlB,KAAkB,CAAlB,GAAhDF,IAAAA;AACAA,mCAAe,OAAfA,EAAyB,MAAM;AAC7B,UAAA,QAAA,EAAc;AACZG,QAAAA,qBAAqB,CAArBA,KAAqB,CAArBA;AACAJ,QAAAA,WAAW,CAAXA,KAAW,CAAXA;AACD;AAJHC,KAAAA;AAOAN,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB,YAAMU,YAAY,GAAG,MAAM;AACzB,cAAMC,KAAK,GAAGC,QAAQ,EAARA,cAAAA,CAAAA,iBAAAA,GAAAA,qBAAAA,IAAd,KAAA;;AACA,YAAA,KAAA,EAAW;AACTC,UAAAA,cAAc,CAAdA,KAAc,CAAdA;AACD;AAJH,OAAA;;AAOAH,MAAAA,YAAY;AACZrC,MAAAA,MAAM,CAANA,gBAAAA,CAAAA,QAAAA,EAAAA,YAAAA;AACA,aAAO,MAAMA,MAAM,CAANA,mBAAAA,CAAAA,QAAAA,EAVO,YAUPA,CAAb,CAVoB,CAWpB;AAXF2B,KAAAA,EAYG,CAACY,QAAQ,EAARA,cAAAA,CAAAA,iBAAAA,GAAAA,qBAAAA,IAZJZ,KAYG,CAZHA;AAcA,WAAA,aACE,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,aAAA,EAAA;AAAe,qBAAaH;AAA5B,KAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,kBAAA,EAAA;AAAW,MAAA,WAAW,EAAEC;AAAxB,KAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,cAAA,EAAA;AAAM,MAAA,IAAI,EAAEtB,IAAI,IAAhB,EAAA;AAAwB,MAAA,WAAW,EAAnC,WAAA;AAAkD,MAAA,OAAO,EAAzD,cAAA;AAA2E,MAAA,EAAE,EAAEoB;AAA/E,KAAA,CADF,EAEGZ,eAAe,IAAA,aAAI,KAAA,CAAA,aAAA,CAAA,kBAAA,EAAA;AAAU,MAAA,iBAAiB,EAAEP,qBAAqB,IAAlD,EAAA;AAA0D,MAAA,YAAY,EAAE0B;AAAxE,KAAA,CAFtB,EAAA,aAGE,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA;AAAW,MAAA,SAAS,EAApB,2BAAA;AAAiD,MAAA,GAAG,EAAEA;AAAtD,KAAA,EACGhB,qBAAqB,GAAA,aACpB,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,iBAAA,EAAA;AACE,MAAA,OAAO,EADT,OAAA;AAEE,MAAA,SAAS,EAAER,SAAS,IAFtB,EAAA;AAGE,MAAA,QAAQ,EAAEC,QAAQ,IAHpB,EAAA;AAIE,MAAA,cAAc,EAJhB,IAAA;AAKE,MAAA,WAAW,EALb,WAAA;AAME,MAAA,eAAe,EAAE4B;AANnB,KAAA,CADF,EAAA,aASE,KAAA,CAAA,aAAA,CAAA,sBAAA,EAAA;AAAc,MAAA,iBAAiB,EAA/B,0BAAA;AAA6D,MAAA,eAAe,EAAEM;AAA9E,KAAA,CATF,CADoB,GAAA,aAapB,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,sBAAA,EAAA;AAAc,MAAA,iBAAiB,EAA/B,0BAAA;AAA6D,MAAA,eAAe,EAAEA;AAA9E,KAAA,CADF,EAAA,aAEE,KAAA,CAAA,aAAA,CAAA,iBAAA,EAAA;AACE,MAAA,OAAO,EADT,OAAA;AAEE,MAAA,SAAS,EAAEnC,SAAS,IAFtB,EAAA;AAGE,MAAA,QAAQ,EAAEC,QAAQ,IAHpB,EAAA;AAIE,MAAA,cAAc,EAJhB,IAAA;AAKE,MAAA,WAAW,EALb,WAAA;AAME,MAAA,eAAe,EAAE4B;AANnB,KAAA,CAFF,CAdJ,EAAA,aA0BE,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA;AAAiB,MAAA,OAAO,EAAE,MAAMH,WAAW,CAAC,CAA5C,QAA2C,CAA3C;AAAwD,MAAA,MAAM,EAAE,CAACrB;AAAjE,KAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,iBAAA,EAAA;AAAM,MAAA,IAAI,EAAC;AAAX,KAAA,CADF,CA1BF,CAHF,CADF,CADF,CADF,EAAA,aAuCE,KAAA,CAAA,aAAA,CAAA,WAAA,EAAA;AAAa,MAAA,SAAS,EAAE+B,QAAQ,GAAA,MAAA,GAAhC,QAAA;AAAsD,MAAA,SAAS,EAAEA;AAAjE,KAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,kBAAA,EAAA;AAAmB,MAAA,GAAG,EAAtB,OAAA;AAAiC,MAAA,OAAO,EAAE,MAAM,CAAhD,CAAA;AAAoD,MAAA,IAAI,EAAxD,MAAA;AAAgE,yBAAgB;AAAhF,KAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,oBAAA,EAAA;AACE,MAAA,IAAI,EAAEvC,IAAI,IADZ,EAAA;AAEE,MAAA,eAAe,EAAE,MAAM;AACrBiC,QAAAA,qBAAqB,CAArBA,KAAqB,CAArBA;AACAL,QAAAA,qBAAqB;AAJzB,OAAA;AAME,MAAA,iBAAiB,EAAE3B,qBAAqB,IAN1C,EAAA;AAOE,MAAA,0BAA0B,EAP5B,0BAAA;AAQE,MAAA,eAAe,EARjB,eAAA;AASE,MAAA,SAAS,EAAEE,SAAS,IATtB,EAAA;AAUE,MAAA,QAAQ,EAAEC,QAAQ,IAVpB,EAAA;AAWE,MAAA,KAAK,EAAEC,KAAK,IAXd,EAAA;AAYE,MAAA,OAAO,EAZT,OAAA;AAaE,MAAA,aAAa,EAbf,aAAA;AAcE,MAAA,OAAO,EAdT,aAAA;AAeE,MAAA,cAAc,EAfhB,cAAA;AAgBE,MAAA,eAAe,EAhBjB,eAAA;AAiBE,MAAA,cAAc,EAAEQ,cAAc,IAjBhC,EAAA;AAkBE,MAAA,mBAAmB,EAAEC,mBAAmB,IAlB1C,EAAA;AAmBE,MAAA,cAAc,EAAEC,cAAc,IAnBhC,EAAA;AAoBE,MAAA,iBAAiB,EAAEC,iBAAiB,IApBtC,EAAA;AAqBE,MAAA,YAAY,EAAEC,YAAY,IArB5B,EAAA;AAsBE,MAAA,gBAAgB,EAAEX,gBAAgB,IAtBpC,EAAA;AAuBE,MAAA,WAAW,EAvBb,WAAA;AAwBE,MAAA,YAAY,EAxBd,kBAAA;AAyBE,MAAA,eAAe,EAAE2B;AAzBnB,KAAA,CADF,CADF,CAvCF,EAsEGf,WAAW,IAAA,aACV,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA;AAAiB,MAAA,GAAG,EAApB,WAAA;AAAmC,MAAA,SAAS,EAAEa,YAAY,GAAA,MAAA,GAA1D,QAAA;AAAgF,MAAA,UAAU,EAA1F,KAAA;AAAmG,MAAA,WAAW,EAA9G,WAAA;AAA6H,qBAAY;AAAzI,KAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,kBAAA,EAAA;AACE,MAAA,SAAS,EAAE5B,SAAS,IADtB,EAAA;AAEE,MAAA,QAAQ,EAAEC,QAAQ,IAFpB,EAAA;AAGE,MAAA,KAAK,EAAEC,KAAK,IAHd,EAAA;AAIE,MAAA,gBAAgB,EAAEC,gBAAgB,IAJpC,EAAA;AAKE,MAAA,eAAe,EAAE,MAAM0B,eAAe,CALxC,KAKwC,CALxC;AAME,MAAA,cAAc,EANhB,cAAA;AAOE,MAAA,mBAAmB,EAPrB,mBAAA;AAQE,MAAA,cAAc,EARhB,cAAA;AASE,MAAA,OAAO,EATT,OAAA;AAUE,MAAA,YAAY,EAAEf,YAAY,IAAI;AAVhC,KAAA,CADF,CAvEJ,CADF;AA9DF,GAAA;;;AAjCEjB,IAAAA,I;AACAC,IAAAA,qB;AACAC,IAAAA,0B;AAGAC,IAAAA,S;AACAC,IAAAA,Q;AACAC,IAAAA,K;AACAC,IAAAA,gB;AACAC,IAAAA,O;AACAC,IAAAA,e;AAEAC,IAAAA,a;AACAC,IAAAA,c;AACAC,IAAAA,qB;AACAC,IAAAA,W;AACAC,IAAAA,c;AACAC,IAAAA,mB;AACAC,IAAAA,c;AACAC,IAAAA,iB;AACAC,IAAAA,Y;AACAC,IAAAA,W;AACAC,IAAAA,c;AACAC,IAAAA,U;AACAC,IAAAA,M;AACAC,IAAAA,W;;oBAiKF,mB","sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\n\r\nimport Logo from './Logo';\r\nimport MainMenu from './MainMenu';\r\nimport Actions from './Actions';\r\nimport { PageWidth } from '../Layouts';\r\nimport { COLORS, BREAKPOINTS } from '../styles';\r\nimport RightSideNav from './RightSideNav';\r\nimport { NavOption, NavButton, ActionOptions, UserMenuItem } from '../types';\r\nimport MobileMenu from './mobile/MobileMenu';\r\nimport { Menu } from '../icons/systemicons/SystemIcons';\r\nimport UserMenu from './UserMenu/UserMenu';\r\nimport useClickOutside from '../hooks/useClickOutside';\r\nimport { Menu as MobileMenuWrapper } from './mobile/CommonStyles';\r\nimport {Z_INDEXES} from '../styles/z-indexes';\r\n\r\nconst HeaderWrapper = styled.header`\r\n  background: white;\r\n  border-bottom: 1px solid ${COLORS.neutral_200};\r\n  \r\n  z-index: ${Z_INDEXES.sticky_menu};\r\n  position: relative;\r\n  \r\n  height: 48px;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    height: 56px;\r\n  }\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    height: 64px;\r\n  }\r\n\r\n  @media all and (-ms-high-contrast: none) {\r\n    height: auto;\r\n  }\r\n\r\n  @media print {\r\n    border-bottom: none;\r\n  }\r\n`;\r\n\r\nconst RowLayout = styled.div`\r\n  display: flex;\r\n`;\r\n\r\nconst RightSide = styled.div`\r\n  display: flex;\r\n  margin: 0 0 0 auto;\r\n`;\r\n\r\nconst MenuWrapper = styled.div<MenuWrapperProps>`\r\n  background: rgba(0, 0, 0, 0.5);\r\n  display: ${(props) => (props.isVisible ? 'flex' : 'none')};\r\n  position: fixed;\r\n  left: 0;\r\n  top: 0;\r\n  height: 100%;\r\n  width: 100%;\r\n  overflow-y: hidden;\r\n  bottom: 0;\r\n  right: 0;\r\n  z-index: ${Z_INDEXES.backdrop};\r\n`;\r\n\r\nconst UserMenuWrapper = styled.div<UserMenuWrapperProps>`\r\n  background-color: ${COLORS.white};\r\n  display: flex;\r\n  margin-left: ${(props) => (props.floatRight ? 'auto' : 'unset')};\r\n  position: absolute;\r\n  right: ${(props) => (props.offsetRight ? `${window.innerWidth - props.offsetRight + 296}px` : '10%')};\r\n  top: 56px;\r\n\r\n  &:focus-within,\r\n  &:hover,\r\n  &.open {\r\n    background: ${COLORS.white};\r\n  }\r\n`;\r\n\r\ninterface UserMenuWrapperProps {\r\n  floatRight: boolean;\r\n  offsetRight: number | null | undefined;\r\n}\r\n\r\nconst HamburgerButton = styled.button`\r\n  border-width: 0;\r\n  background-color: ${COLORS.white};\r\n  height: 48px;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    height: 56px;\r\n  }\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    height: 64px;\r\n  }\r\n  &:hover {\r\n    cursor: pointer;\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    display: none;\r\n  }\r\n`;\r\n\r\ninterface MenuWrapperProps {\r\n  isVisible: boolean;\r\n}\r\n\r\ntype Props = {\r\n  name?: string;\r\n  mainNavigationOptions?: NavOption[];\r\n  secondaryNavigationOptions?: NavOption[];\r\n  secondaryButton?: NavButton;\r\n  actions?: ActionOptions;\r\n  firstName?: string;\r\n  lastName?: string;\r\n  email?: string;\r\n  organizationName?: string;\r\n  signout?: (e: any) => void;\r\n  isAuthenticated?: boolean;\r\n  mobileActions?: ActionOptions;\r\n  notifications?: NavOption[];\r\n  switcherAction?: () => void;\r\n  reverseRightSideOrder?: boolean;\r\n  showBetaTag?: boolean;\r\n  accountSection?: UserMenuItem[];\r\n  organizationSection?: UserMenuItem[];\r\n  supportSection?: UserMenuItem[];\r\n  accountMenuHeader?: string;\r\n  signOutLabel?: string;\r\n  useUserMenu?: boolean;\r\n  trackLogoClick?: () => void;\r\n  mainLogoTo?: string;\r\n  testId?: string;\r\n  useMaxWidth?: boolean;\r\n};\r\n\r\n/**\r\n * @param props\r\n * @constructor\r\n * @description This component is a global navigation header bar\r\n */\r\nconst GlobalNavigationBar = ({\r\n  name,\r\n  mainNavigationOptions,\r\n  secondaryNavigationOptions,\r\n  secondaryButton,\r\n  actions,\r\n  firstName,\r\n  lastName,\r\n  email,\r\n  organizationName,\r\n  signout,\r\n  isAuthenticated,\r\n  mobileActions,\r\n  notifications,\r\n  switcherAction,\r\n  reverseRightSideOrder = false,\r\n  showBetaTag,\r\n  accountSection,\r\n  organizationSection,\r\n  supportSection,\r\n  accountMenuHeader,\r\n  signOutLabel,\r\n  useUserMenu,\r\n  mainLogoTo,\r\n  trackLogoClick,\r\n  testId,\r\n  useMaxWidth = true,\r\n}: Props): React.ReactElement<Props> => {\r\n  const [showMenu, setShowMenu] = React.useState(false);\r\n  const [showUserMenu, setShowUserMenu] = React.useState(false);\r\n  const [showMobileUserMenu, setShowMobileUserMenu] = React.useState<boolean>(false);\r\n  const menuRef = React.useRef(null);\r\n  const userMenuRef = React.useRef<HTMLDivElement>(null);\r\n  const rightSideRef = React.useRef(null);\r\n  const [avatarRight, setAvatarRight] = React.useState<number>(0);\r\n\r\n  const handleClickMenuAction = () => {\r\n    setShowMenu(false);\r\n  };\r\n\r\n  useClickOutside(userMenuRef, () => (showUserMenu ? setShowUserMenu(false) : null));\r\n  useClickOutside(menuRef, () => {\r\n    if (showMenu) {\r\n      setShowMobileUserMenu(false);\r\n      setShowMenu(false);\r\n    }\r\n  });\r\n\r\n  React.useEffect(() => {\r\n    const handleResize = () => {\r\n      const right = document?.getElementById('avatarContainer')?.getBoundingClientRect()?.right;\r\n      if (right) {\r\n        setAvatarRight(right);\r\n      }\r\n    };\r\n\r\n    handleResize();\r\n    window.addEventListener('resize', handleResize);\r\n    return () => window.removeEventListener('resize', handleResize);\r\n    // eslint-disable-next-line react-hooks/exhaustive-deps\r\n  }, [document?.getElementById('avatarContainer')?.getBoundingClientRect()?.right]);\r\n\r\n  return (\r\n    <>\r\n      <HeaderWrapper data-testid={testId}>\r\n        <PageWidth useMaxWidth={useMaxWidth}>\r\n          <RowLayout>\r\n            <Logo name={name || ''} showBetaTag={showBetaTag} onClick={trackLogoClick} to={mainLogoTo} />\r\n            {isAuthenticated && <MainMenu navigationOptions={mainNavigationOptions || []} rightSideRef={rightSideRef} />}\r\n            <RightSide className=\"GlobalNavigationRightSide\" ref={rightSideRef}>\r\n              {reverseRightSideOrder ? (\r\n                <>\r\n                  <Actions\r\n                    actions={actions}\r\n                    firstName={firstName || ''}\r\n                    lastName={lastName || ''}\r\n                    hideOnLowWidth={true}\r\n                    useUserMenu={useUserMenu}\r\n                    setShowUserMenu={setShowUserMenu}\r\n                  />\r\n                  <RightSideNav navigationOptions={secondaryNavigationOptions} secondaryButton={secondaryButton} />\r\n                </>\r\n              ) : (\r\n                <>\r\n                  <RightSideNav navigationOptions={secondaryNavigationOptions} secondaryButton={secondaryButton} />\r\n                  <Actions\r\n                    actions={actions}\r\n                    firstName={firstName || ''}\r\n                    lastName={lastName || ''}\r\n                    hideOnLowWidth={true}\r\n                    useUserMenu={useUserMenu}\r\n                    setShowUserMenu={setShowUserMenu}\r\n                  />\r\n                </>\r\n              )}\r\n              <HamburgerButton onClick={() => setShowMenu(!showMenu)} hidden={!isAuthenticated}>\r\n                <Menu size=\"24px\" />\r\n              </HamburgerButton>\r\n            </RightSide>\r\n          </RowLayout>\r\n        </PageWidth>\r\n      </HeaderWrapper>\r\n      <MenuWrapper className={showMenu ? 'open' : 'closed'} isVisible={showMenu}>\r\n        <MobileMenuWrapper ref={menuRef} onClick={() => {}} role=\"menu\" aria-labelledby=\"UserMenuButton\">\r\n          <MobileMenu\r\n            name={name || ''}\r\n            clickMenuAction={() => {\r\n              setShowMobileUserMenu(false);\r\n              handleClickMenuAction();\r\n            }}\r\n            navigationOptions={mainNavigationOptions || []}\r\n            secondaryNavigationOptions={secondaryNavigationOptions}\r\n            secondaryButton={secondaryButton}\r\n            firstName={firstName || ''}\r\n            lastName={lastName || ''}\r\n            email={email || ''}\r\n            signout={signout}\r\n            notifications={notifications}\r\n            actions={mobileActions}\r\n            switcherAction={switcherAction}\r\n            isAuthenticated={isAuthenticated}\r\n            accountSection={accountSection || []}\r\n            organizationSection={organizationSection || []}\r\n            supportSection={supportSection || []}\r\n            accountMenuHeader={accountMenuHeader || ''}\r\n            signOutLabel={signOutLabel || ''}\r\n            organizationName={organizationName || ''}\r\n            useUserMenu={useUserMenu}\r\n            showUserMenu={showMobileUserMenu}\r\n            setShowUserMenu={setShowMobileUserMenu}\r\n          />\r\n        </MobileMenuWrapper>\r\n      </MenuWrapper>\r\n      {useUserMenu && (\r\n        <UserMenuWrapper ref={userMenuRef} className={showUserMenu ? 'open' : 'closed'} floatRight={false} offsetRight={avatarRight} data-testid=\"testUserMenuWrapper\">\r\n          <UserMenu\r\n            firstName={firstName || ''}\r\n            lastName={lastName || ''}\r\n            email={email || ''}\r\n            organizationName={organizationName || ''}\r\n            clickMenuAction={() => setShowUserMenu(false)}\r\n            accountSection={accountSection}\r\n            organizationSection={organizationSection}\r\n            supportSection={supportSection}\r\n            signOut={signout}\r\n            signOutLabel={signOutLabel || ''}\r\n          />\r\n        </UserMenuWrapper>\r\n      )}\r\n    </>\r\n  );\r\n};\r\n\r\nexport default GlobalNavigationBar;\r\n"],"file":"GlobalNavigationBar.js"}