@laerdal/life-react-components 5.1.0 → 6.0.0-dev.1

package/dist/GlobalNavigationBar/desktop/MainMenu.cjs

@@ -7,10 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var React = _interopRequireWildcard(require("react"));
-var _reactRouterDom = require("react-router-dom");
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _NavItem = require("../../NavItem");
 var _icons = require("../../icons");
@@ -20,16 +18,43 @@ var _Button = require("../../Button");
 var _common = require("../../common");
 var _NavItem2 = require("../../NavItem/NavItem");
 var _utils = require("../utils");
+var _HyperLink = require("../../HyperLink/HyperLink");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["icon", "to", "exact", "disabled", "external", "action", "label", "note", "pinned"];
-var _templateObject, _templateObject2, _templateObject3;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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 t; }
 function _objectSpread(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) { (0, _defineProperty2.default)(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)); }); } return e; }
-const NavContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: none;\n  flex-grow: 1;\n  justify-content: flex-start;\n  align-items: center;\n  \n  padding: 0 16px;\n\n  ", " {\n    display: flex;\n  }\n  \n  ", " {\n    cursor: pointer;\n  }\n  ", " {\n    padding: 0 32px;\n  }\n\n  a {\n    text-decoration: none;\n  }\n"])), _styles.BREAKPOINTS.MEDIUM, _NavItem2.NavItemDiv, _styles.BREAKPOINTS.LARGE);
-const NavButton = _styledComponents.default.button(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  background: ", ";\n  border: 0;\n"])), props => _styles.COLORS.getColor('white', props.theme));
-const ExtendedSection = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n"])));
+const NavContainer = _styledComponents.default.div`
+  display: none;
+  flex-grow: 1;
+  justify-content: flex-start;
+  align-items: center;
+  
+  padding: 0 16px;
+
+  ${_styles.BREAKPOINTS.MEDIUM} {
+    display: flex;
+  }
+  
+  ${_NavItem2.NavItemDiv} {
+    cursor: pointer;
+  }
+  ${_styles.BREAKPOINTS.LARGE} {
+    padding: 0 32px;
+  }
+
+  a {
+    text-decoration: none;
+  }
+`;
+const NavButton = _styledComponents.default.button`
+  background: ${props => _styles.COLORS.getColor('white', props.theme)};
+  border: 0;
+`;
+const ExtendedSection = _styledComponents.default.div`
+  position: relative;
+`;
 const ExtendedMenuOption = 'extendedOption';
 const MainMenu = _ref => {
   let {
@@ -51,9 +76,8 @@ const MainMenu = _ref => {
   const [focusedItemId, setFocusedItemId] = React.useState('');
   const widthOfItem = 120;
   const recalculateNumberOfItemsAllowed = () => {
-    if (rightSideRef !== null && rightSideRef !== void 0 && rightSideRef.current && mainMenuRef !== null && mainMenuRef !== void 0 && mainMenuRef.current) {
-      var _rightSideRef$current, _mainMenuRef$current;
-      const number = Math.floor(((rightSideRef === null || rightSideRef === void 0 || (_rightSideRef$current = rightSideRef.current) === null || _rightSideRef$current === void 0 ? void 0 : _rightSideRef$current.offsetLeft) - (mainMenuRef === null || mainMenuRef === void 0 || (_mainMenuRef$current = mainMenuRef.current) === null || _mainMenuRef$current === void 0 ? void 0 : _mainMenuRef$current.offsetLeft)) / widthOfItem);
+    if (rightSideRef?.current && mainMenuRef?.current) {
+      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);
       if (number !== numberOfItemsAllowed) {
         setNumberOfItemsAllowed(number);
       }
@@ -112,19 +136,20 @@ const MainMenu = _ref => {
           pinned
         } = _ref2,
         rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
-      return item !== null && item !== void 0 && item.disabled ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_NavItem.NavItem, {
+      return item?.disabled ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_NavItem.NavItem, {
         as: NavButton,
         className: "disabled",
         onMouseDown: _common.defaultOnMouseDownHandler,
-        children: item === null || item === void 0 ? void 0 : item.label
+        children: item?.label
       }, item.label) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_NavItem.NavItem, _objectSpread(_objectSpread({
-        as: _reactRouterDom.NavLink,
+        as: _HyperLink.StyledLink,
+        $variant: "styleless",
         onFocus: onFocus,
-        to: to || '',
+        href: to || '',
         onMouseDown: _common.defaultOnMouseDownHandler,
         onClick: e => action && action(e)
       }, rest), {}, {
-        children: item === null || item === void 0 ? void 0 : item.label
+        children: item?.label
       }), label);
     } else {
       const existingRef = dropdownMenusOpenedArray.current.find(x => x == item.id);
@@ -147,14 +172,8 @@ const MainMenu = _ref => {
         style: {
           position: 'relative'
         },
-        onMouseEnter: event => {
-          var _item$id;
-          return onMouseEnter(event, (_item$id = item.id) !== null && _item$id !== void 0 ? _item$id : '');
-        },
-        onMouseLeave: event => {
-          var _item$id2;
-          return onMouseLeave(event, (_item$id2 = item.id) !== null && _item$id2 !== void 0 ? _item$id2 : '');
-        },
+        onMouseEnter: event => onMouseEnter(event, item.id ?? ''),
+        onMouseLeave: event => onMouseLeave(event, item.id ?? ''),
         children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_NavItem.NavItem, {
           id: item.id + '_parentOption',
           "aria-expanded": Boolean(existingRef),
@@ -165,9 +184,9 @@ const MainMenu = _ref => {
           onKeyDown: onKeyDown,
           tabIndex: 0,
           className: existingRef != null || (0, _utils.checkIfContainsItem)(item, activeItem) ? 'active' : '',
-          to: null,
+          href: null,
           onClick: onClick,
-          children: [item === null || item === void 0 ? void 0 : item.label, " ", /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ArrowDropDown, {
+          children: [item?.label, " ", /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ArrowDropDown, {
             size: "24px"
           })]
         }, item.label), /*#__PURE__*/(0, _jsxRuntime.jsx)(_SubMenu.SubMenu, {
@@ -203,7 +222,7 @@ const MainMenu = _ref => {
     className: "GlobalNavigationMainMenu",
     ref: mainMenuRef,
     onKeyDown: onKeyDownTop,
-    children: [items === null || items === void 0 ? void 0 : items.map(renderItem), items.length + 1 > numberOfItemsAllowed && /*#__PURE__*/(0, _jsxRuntime.jsxs)(ExtendedSection, {
+    children: [items?.map(renderItem), items.length + 1 > numberOfItemsAllowed && /*#__PURE__*/(0, _jsxRuntime.jsxs)(ExtendedSection, {
       onKeyDown: event => extendedSectionKeyHandler(event),
       onMouseEnter: event => onMouseEnter(event, ExtendedMenuOption),
       onMouseLeave: event => onMouseLeave(event, ExtendedMenuOption),

package/dist/GlobalNavigationBar/desktop/MainMenu.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MainMenu.cjs","names":["React","_interopRequireWildcard","require","_reactRouterDom","_styledComponents","_interopRequireDefault","_NavItem","_icons","_styles","_SubMenu","_Button","_common","_NavItem2","_utils","_jsxRuntime","_excluded","_templateObject","_templateObject2","_templateObject3","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","NavContainer","styled","div","_taggedTemplateLiteral2","BREAKPOINTS","MEDIUM","NavItemDiv","LARGE","NavButton","button","props","COLORS","getColor","theme","ExtendedSection","ExtendedMenuOption","MainMenu","_ref","items","rightSideRef","menuButtonRef","useRef","dropdownMenusOpenedArray","mainMenuRef","numberOfItemsAllowed","setNumberOfItemsAllowed","useState","subMenuRefs","setAllSubMenuRefs","extendedMenuOptionRef","createRef","useEffect","map","x","type","undefined","forceUpdate","activeItem","setActiveItemId","focusedItemId","setFocusedItemId","widthOfItem","recalculateNumberOfItemsAllowed","current","_rightSideRef$current","_mainMenuRef$current","number","Math","floor","offsetLeft","onMouseLeave","event","id","onMouseEnter","existingRefForId","find","window","addEventListener","removeEventListener","onFocus","onKeyDownTop","key","renderItem","item","index","_ref2","icon","to","exact","disabled","external","action","label","note","pinned","rest","_objectWithoutProperties2","jsx","NavItem","as","className","onMouseDown","defaultOnMouseDownHandler","children","NavLink","onClick","existingRef","onKeyDown","code","containsActiveItem","checkIfContainsItem","jsxs","style","position","_item$id","_item$id2","Boolean","role","tabIndex","SystemIcons","ArrowDropDown","size","SubMenu","ariaLabelledBy","ref","onItemFocused","activeItemId","nestPath","onItemStateChanged","state","topLevel","extended","extendedSectionKeyHandler","stopPropagation","IconButton","slice","variant","shape","MoreHorizontal","propTypes","_propTypes","array","isRequired","_default","exports"],"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { NavLink, useLocation } from 'react-router-dom';\r\nimport styled from 'styled-components';\r\nimport { NavItem } from '../../NavItem';\r\nimport {SystemIcons} from '../../icons';\r\nimport { COLORS, BREAKPOINTS } from '../../styles';\r\nimport { Menu } from './ExtendedMainMenu';\r\nimport { SubMenu } from './SubMenu';\r\nimport { IconButton } from '../../Button';\r\nimport { defaultOnMouseDownHandler } from '../../common';\r\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\r\nimport { NavItemDiv } from '../../NavItem/NavItem';\r\nimport { checkIfContainsItem } from '../utils';\r\n\r\nconst NavContainer = styled.div`\r\n  display: none;\r\n  flex-grow: 1;\r\n  justify-content: flex-start;\r\n  align-items: center;\r\n  \r\n  padding: 0 16px;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    display: flex;\r\n  }\r\n  \r\n  ${NavItemDiv} {\r\n    cursor: pointer;\r\n  }\r\n  ${BREAKPOINTS.LARGE} {\r\n    padding: 0 32px;\r\n  }\r\n\r\n  a {\r\n    text-decoration: none;\r\n  }\r\n`;\r\n\r\nconst NavButton = styled.button`\r\n  background: ${props => COLORS.getColor('white', props.theme)};\r\n  border: 0;\r\n`;\r\n\r\nconst ExtendedSection = styled.div`\r\n  position: relative;\r\n`;\r\n\r\nconst ExtendedMenuOption = 'extendedOption';\r\n\r\ntype Props = {\r\n  items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\r\n  rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;\r\n};\r\n\r\nconst MainMenu = ({ items, rightSideRef }: Props): React.ReactElement<Props> => {\r\n  const menuButtonRef = React.useRef<HTMLButtonElement>(null);\r\n  //we have to use refs instead of 'state' here, because when onmouseleave is triggered for multiple nested divs, state update is not being updated in between\r\n  const dropdownMenusOpenedArray = React.useRef<string[]>([]);\r\n  const mainMenuRef: React.RefObject<HTMLDivElement> | null | undefined = React.useRef(null);\r\n  const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\r\n  const [subMenuRefs, setAllSubMenuRefs] = React.useState<(React.RefObject<HTMLUListElement> | undefined)[]>([]);\r\n  const extendedMenuOptionRef = React.createRef<HTMLUListElement>();\r\n\r\n  React.useEffect(() => {\r\n    setAllSubMenuRefs(items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLUListElement>() : undefined)));\r\n  }, [items]);\r\n\r\n  const [, forceUpdate] = React.useState({});\r\n  const [activeItem, setActiveItemId] = React.useState<string>('');\r\n  const [focusedItemId, setFocusedItemId] = React.useState<string>('');\r\n\r\n  const widthOfItem = 120;\r\n  const recalculateNumberOfItemsAllowed = () => {\r\n    if (rightSideRef?.current && mainMenuRef?.current) {\r\n      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\r\n      if (number !== numberOfItemsAllowed) {\r\n        setNumberOfItemsAllowed(number);\r\n      }\r\n    }\r\n  };\r\n\r\n  const onMouseLeave = (event: any, id: string) => {\r\n    dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\r\n    //just trigger rerendering\r\n    forceUpdate({});\r\n  };\r\n\r\n  const onMouseEnter = (event: any, id: string) => {\r\n    const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\r\n    if (existingRefForId == null) {\r\n      dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\r\n      //just trigger rerendering\r\n      forceUpdate({});\r\n    }\r\n  };\r\n\r\n  React.useEffect(() => {\r\n    recalculateNumberOfItemsAllowed();\r\n    // Bind the event listener\r\n    window.addEventListener('resize', recalculateNumberOfItemsAllowed);\r\n    return () => {\r\n      // Unbind the event listener on clean up\r\n      window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\r\n    };\r\n  }, []);\r\n\r\n  React.useEffect(() => {\r\n    recalculateNumberOfItemsAllowed();\r\n  }, [items.length]);\r\n\r\n  const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\r\n    //no open dropdowns if top level was entered\r\n    dropdownMenusOpenedArray.current = [];\r\n    forceUpdate({});\r\n  };\r\n\r\n  const onKeyDownTop = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n    if (event.key === 'Escape' || event.key === 'Esc') {\r\n      dropdownMenusOpenedArray.current = [];\r\n      //just trigger rerendering\r\n      forceUpdate({});\r\n    }\r\n  };\r\n\r\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup, index: number) => {\r\n    if (index > numberOfItemsAllowed - 2) return null;\r\n    if (item.type != 'desktopgroup') {\r\n      const { icon, to, exact, disabled, external, action, label, note, pinned, ...rest } = item as MenuNavigationItemTypeItem;\r\n      return item?.disabled ? (\r\n        <NavItem as={NavButton} className=\"disabled\" key={item.label} onMouseDown={defaultOnMouseDownHandler}>\r\n          {item?.label}\r\n        </NavItem>\r\n      ) : (\r\n        <NavItem as={NavLink} onFocus={onFocus} to={to || ''} key={label} onMouseDown={defaultOnMouseDownHandler} onClick={(e: React.MouseEvent) => action && action(e)} {...rest}>\r\n          {item?.label}\r\n        </NavItem>\r\n      );\r\n    } else {\r\n      const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\r\n      const onClick = () => {\r\n        if (existingRef == null) {\r\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n          //just trigger rerendering\r\n          forceUpdate({});\r\n        }\r\n      };\r\n      const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n        if (event.key == 'Enter' || event.code == 'Space') {\r\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n          //just trigger rerendering\r\n          forceUpdate({});\r\n        } \r\n      };\r\n\r\n      const containsActiveItem = checkIfContainsItem(item, activeItem);\r\n      return (\r\n        <div\r\n          style={{ position: 'relative' }}\r\n          onMouseEnter={(event) => onMouseEnter(event, item.id ?? '')}\r\n          onMouseLeave={(event) => onMouseLeave(event, item.id ?? '')}>\r\n          <NavItem\r\n            id={item.id + '_parentOption'}\r\n            aria-expanded={Boolean(existingRef)}\r\n            aria-activedescendant={containsActiveItem ? activeItem : ''}\r\n            aria-controls={item.id}\r\n            role=\"listbox\"\r\n            onFocus={onFocus}\r\n            onKeyDown={onKeyDown}\r\n            tabIndex={0}\r\n            className={existingRef != null || checkIfContainsItem(item, activeItem) ? 'active' : ''}\r\n            key={item.label}\r\n            to={null}\r\n            onClick={onClick}>\r\n            {item?.label} <SystemIcons.ArrowDropDown size=\"24px\" />\r\n          </NavItem>\r\n          <SubMenu\r\n            ariaLabelledBy={item.id + '_parentOption'}\r\n            ref={subMenuRefs[index]}\r\n            onItemFocused={setFocusedItemId}\r\n            focusedItemId={focusedItemId}\r\n            activeItemId={activeItem}\r\n            nestPath={[item.id]}\r\n            onItemStateChanged={(item, state) => {\r\n              if (state) {\r\n                setActiveItemId(item);\r\n              } else if (item == activeItem) setActiveItemId('');\r\n            }}\r\n            item={item as MenuNavigationItemTypeDesktopGroup}\r\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n            index={index + 1}\r\n            topLevel={true}\r\n          />\r\n        </div>\r\n      );\r\n    }\r\n  };\r\n\r\n\r\n  const extended = dropdownMenusOpenedArray.current.find((x) => x == ExtendedMenuOption);\r\n  const extendedSectionKeyHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n    if (event.key == 'Enter' || event.code == 'Space') {\r\n      event.stopPropagation();\r\n\r\n      dropdownMenusOpenedArray.current = [ExtendedMenuOption];\r\n      forceUpdate({});\r\n    }\r\n  };\r\n\r\n  return (\r\n    <NavContainer role=\"navigation\" className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} onKeyDown={onKeyDownTop}>\r\n      {items?.map(renderItem)}\r\n      {items.length + 1 > numberOfItemsAllowed && (\r\n        <ExtendedSection\r\n          onKeyDown={(event) => extendedSectionKeyHandler(event)}\r\n          onMouseEnter={(event) => onMouseEnter(event, ExtendedMenuOption)}\r\n          onMouseLeave={(event) => onMouseLeave(event, ExtendedMenuOption)}>\r\n          <IconButton\r\n            id={ExtendedMenuOption + '_parentOption'}\r\n            aria-expanded={Boolean(extended)}\r\n            aria-activedescendant={checkIfContainsItem({ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }, activeItem) ? activeItem : ''}\r\n            aria-controls={ExtendedMenuOption}\r\n            role=\"listbox\"\r\n            \r\n            ref={menuButtonRef} variant={'secondary'} shape={'circular'} action={() => {}}>\r\n            <SystemIcons.MoreHorizontal size=\"24px\"/>\r\n          </IconButton>\r\n          <SubMenu\r\n            ariaLabelledBy={ExtendedMenuOption + '_parentOption'}\r\n            activeItemId={activeItem}\r\n            onItemFocused={setFocusedItemId}\r\n            focusedItemId={focusedItemId}\r\n            ref={extendedMenuOptionRef}\r\n            onItemStateChanged={(item, state) => {\r\n              if (state) setActiveItemId(item);\r\n              else if (item == activeItem) setActiveItemId('');\r\n            }}\r\n            nestPath={[ExtendedMenuOption]}\r\n            item={{ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }}\r\n            topLevel={true}\r\n            index={0}\r\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n          />\r\n        </ExtendedSection>\r\n      )}\r\n    </NavContainer>\r\n  );\r\n};\r\n\r\nexport default MainMenu;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"MainMenu.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_NavItem","_icons","_styles","_SubMenu","_Button","_common","_NavItem2","_utils","_HyperLink","_jsxRuntime","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","NavContainer","styled","div","BREAKPOINTS","MEDIUM","NavItemDiv","LARGE","NavButton","button","props","COLORS","getColor","theme","ExtendedSection","ExtendedMenuOption","MainMenu","_ref","items","rightSideRef","menuButtonRef","useRef","dropdownMenusOpenedArray","mainMenuRef","numberOfItemsAllowed","setNumberOfItemsAllowed","useState","subMenuRefs","setAllSubMenuRefs","extendedMenuOptionRef","createRef","useEffect","map","x","type","undefined","forceUpdate","activeItem","setActiveItemId","focusedItemId","setFocusedItemId","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","onMouseLeave","event","id","onMouseEnter","existingRefForId","find","window","addEventListener","removeEventListener","onFocus","onKeyDownTop","key","renderItem","item","index","_ref2","icon","to","exact","disabled","external","action","label","note","pinned","rest","_objectWithoutProperties2","jsx","NavItem","as","className","onMouseDown","defaultOnMouseDownHandler","children","StyledLink","$variant","href","onClick","existingRef","onKeyDown","code","containsActiveItem","checkIfContainsItem","jsxs","style","position","Boolean","role","tabIndex","SystemIcons","ArrowDropDown","size","SubMenu","ariaLabelledBy","ref","onItemFocused","activeItemId","nestPath","onItemStateChanged","state","topLevel","extended","extendedSectionKeyHandler","stopPropagation","IconButton","slice","variant","shape","MoreHorizontal","propTypes","_propTypes","array","isRequired","_default","exports"],"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { NavItem } from '../../NavItem';\r\nimport {SystemIcons} from '../../icons';\r\nimport { COLORS, BREAKPOINTS } from '../../styles';\r\nimport { Menu } from './ExtendedMainMenu';\r\nimport { SubMenu } from './SubMenu';\r\nimport { IconButton } from '../../Button';\r\nimport { defaultOnMouseDownHandler } from '../../common';\r\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\r\nimport { NavItemDiv } from '../../NavItem/NavItem';\r\nimport { checkIfContainsItem } from '../utils';\r\nimport HyperLink, { StyledLink } from '../../HyperLink/HyperLink';\r\n\r\nconst NavContainer = styled.div`\r\n  display: none;\r\n  flex-grow: 1;\r\n  justify-content: flex-start;\r\n  align-items: center;\r\n  \r\n  padding: 0 16px;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    display: flex;\r\n  }\r\n  \r\n  ${NavItemDiv} {\r\n    cursor: pointer;\r\n  }\r\n  ${BREAKPOINTS.LARGE} {\r\n    padding: 0 32px;\r\n  }\r\n\r\n  a {\r\n    text-decoration: none;\r\n  }\r\n`;\r\n\r\nconst NavButton = styled.button`\r\n  background: ${props => COLORS.getColor('white', props.theme)};\r\n  border: 0;\r\n`;\r\n\r\nconst ExtendedSection = styled.div`\r\n  position: relative;\r\n`;\r\n\r\nconst ExtendedMenuOption = 'extendedOption';\r\n\r\ntype Props = {\r\n  items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\r\n  rightSideRef?: React.RefObject<HTMLDivElement | null> | null | undefined;\r\n};\r\n\r\nconst MainMenu = ({ items, rightSideRef }: Props): React.ReactElement<Props> => {\r\n  const menuButtonRef = React.useRef<HTMLButtonElement>(null);\r\n  //we have to use refs instead of 'state' here, because when onmouseleave is triggered for multiple nested divs, state update is not being updated in between\r\n  const dropdownMenusOpenedArray = React.useRef<string[]>([]);\r\n  const mainMenuRef: React.RefObject<HTMLDivElement | null> | null | undefined = React.useRef(null);\r\n  const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\r\n  const [subMenuRefs, setAllSubMenuRefs] = React.useState<(React.RefObject<HTMLUListElement | null> | undefined)[]>([]);\r\n  const extendedMenuOptionRef = React.createRef<HTMLUListElement>();\r\n\r\n  React.useEffect(() => {\r\n    setAllSubMenuRefs(items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLUListElement>() : undefined)));\r\n  }, [items]);\r\n\r\n  const [, forceUpdate] = React.useState({});\r\n  const [activeItem, setActiveItemId] = React.useState<string>('');\r\n  const [focusedItemId, setFocusedItemId] = React.useState<string>('');\r\n\r\n  const widthOfItem = 120;\r\n  const recalculateNumberOfItemsAllowed = () => {\r\n    if (rightSideRef?.current && mainMenuRef?.current) {\r\n      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\r\n      if (number !== numberOfItemsAllowed) {\r\n        setNumberOfItemsAllowed(number);\r\n      }\r\n    }\r\n  };\r\n\r\n  const onMouseLeave = (event: any, id: string) => {\r\n    dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\r\n    //just trigger rerendering\r\n    forceUpdate({});\r\n  };\r\n\r\n  const onMouseEnter = (event: any, id: string) => {\r\n    const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\r\n    if (existingRefForId == null) {\r\n      dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\r\n      //just trigger rerendering\r\n      forceUpdate({});\r\n    }\r\n  };\r\n\r\n  React.useEffect(() => {\r\n    recalculateNumberOfItemsAllowed();\r\n    // Bind the event listener\r\n    window.addEventListener('resize', recalculateNumberOfItemsAllowed);\r\n    return () => {\r\n      // Unbind the event listener on clean up\r\n      window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\r\n    };\r\n  }, []);\r\n\r\n  React.useEffect(() => {\r\n    recalculateNumberOfItemsAllowed();\r\n  }, [items.length]);\r\n\r\n  const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\r\n    //no open dropdowns if top level was entered\r\n    dropdownMenusOpenedArray.current = [];\r\n    forceUpdate({});\r\n  };\r\n\r\n  const onKeyDownTop = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n    if (event.key === 'Escape' || event.key === 'Esc') {\r\n      dropdownMenusOpenedArray.current = [];\r\n      //just trigger rerendering\r\n      forceUpdate({});\r\n    }\r\n  };\r\n\r\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup, index: number) => {\r\n    if (index > numberOfItemsAllowed - 2) return null;\r\n    if (item.type != 'desktopgroup') {\r\n      const { icon, to, exact, disabled, external, action, label, note, pinned, ...rest } = item as MenuNavigationItemTypeItem;\r\n      return item?.disabled ? (\r\n        <NavItem as={NavButton} className=\"disabled\" key={item.label} onMouseDown={defaultOnMouseDownHandler}>\r\n          {item?.label}\r\n        </NavItem>\r\n      ) : (\r\n        <NavItem as={StyledLink} $variant=\"styleless\" onFocus={onFocus} href={to || ''} key={label} onMouseDown={defaultOnMouseDownHandler} onClick={(e: React.MouseEvent) => action && action(e)} {...rest}>\r\n          {item?.label}\r\n        </NavItem>\r\n      );\r\n    } else {\r\n      const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\r\n      const onClick = () => {\r\n        if (existingRef == null) {\r\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n          //just trigger rerendering\r\n          forceUpdate({});\r\n        }\r\n      };\r\n      const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n        if (event.key == 'Enter' || event.code == 'Space') {\r\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n          //just trigger rerendering\r\n          forceUpdate({});\r\n        } \r\n      };\r\n\r\n      const containsActiveItem = checkIfContainsItem(item, activeItem);\r\n      return (\r\n        <div\r\n          style={{ position: 'relative' }}\r\n          onMouseEnter={(event) => onMouseEnter(event, item.id ?? '')}\r\n          onMouseLeave={(event) => onMouseLeave(event, item.id ?? '')}>\r\n          <NavItem\r\n            id={item.id + '_parentOption'}\r\n            aria-expanded={Boolean(existingRef)}\r\n            aria-activedescendant={containsActiveItem ? activeItem : ''}\r\n            aria-controls={item.id}\r\n            role=\"listbox\"\r\n            onFocus={onFocus}\r\n            onKeyDown={onKeyDown}\r\n            tabIndex={0}\r\n            className={existingRef != null || checkIfContainsItem(item, activeItem) ? 'active' : ''}\r\n            key={item.label}\r\n            href={null}\r\n            onClick={onClick}>\r\n            {item?.label} <SystemIcons.ArrowDropDown size=\"24px\" />\r\n          </NavItem>\r\n          <SubMenu\r\n            ariaLabelledBy={item.id + '_parentOption'}\r\n            ref={subMenuRefs[index]}\r\n            onItemFocused={setFocusedItemId}\r\n            focusedItemId={focusedItemId}\r\n            activeItemId={activeItem}\r\n            nestPath={[item.id]}\r\n            onItemStateChanged={(item, state) => {\r\n              if (state) {\r\n                setActiveItemId(item);\r\n              } else if (item == activeItem) setActiveItemId('');\r\n            }}\r\n            item={item as MenuNavigationItemTypeDesktopGroup}\r\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n            index={index + 1}\r\n            topLevel={true}\r\n          />\r\n        </div>\r\n      );\r\n    }\r\n  };\r\n\r\n\r\n  const extended = dropdownMenusOpenedArray.current.find((x) => x == ExtendedMenuOption);\r\n  const extendedSectionKeyHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n    if (event.key == 'Enter' || event.code == 'Space') {\r\n      event.stopPropagation();\r\n\r\n      dropdownMenusOpenedArray.current = [ExtendedMenuOption];\r\n      forceUpdate({});\r\n    }\r\n  };\r\n\r\n  return (\r\n    <NavContainer role=\"navigation\" className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} onKeyDown={onKeyDownTop}>\r\n      {items?.map(renderItem)}\r\n      {items.length + 1 > numberOfItemsAllowed && (\r\n        <ExtendedSection\r\n          onKeyDown={(event) => extendedSectionKeyHandler(event)}\r\n          onMouseEnter={(event) => onMouseEnter(event, ExtendedMenuOption)}\r\n          onMouseLeave={(event) => onMouseLeave(event, ExtendedMenuOption)}>\r\n          <IconButton\r\n            id={ExtendedMenuOption + '_parentOption'}\r\n            aria-expanded={Boolean(extended)}\r\n            aria-activedescendant={checkIfContainsItem({ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }, activeItem) ? activeItem : ''}\r\n            aria-controls={ExtendedMenuOption}\r\n            role=\"listbox\"\r\n            \r\n            ref={menuButtonRef} variant={'secondary'} shape={'circular'} action={() => {}}>\r\n            <SystemIcons.MoreHorizontal size=\"24px\"/>\r\n          </IconButton>\r\n          <SubMenu\r\n            ariaLabelledBy={ExtendedMenuOption + '_parentOption'}\r\n            activeItemId={activeItem}\r\n            onItemFocused={setFocusedItemId}\r\n            focusedItemId={focusedItemId}\r\n            ref={extendedMenuOptionRef}\r\n            onItemStateChanged={(item, state) => {\r\n              if (state) setActiveItemId(item);\r\n              else if (item == activeItem) setActiveItemId('');\r\n            }}\r\n            nestPath={[ExtendedMenuOption]}\r\n            item={{ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }}\r\n            topLevel={true}\r\n            index={0}\r\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n          />\r\n        </ExtendedSection>\r\n      )}\r\n    </NavContainer>\r\n  );\r\n};\r\n\r\nexport default MainMenu;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/GlobalNavigationBar/desktop/MainMenu.d.ts

@@ -1,8 +1,8 @@
-import * as React from 'react';
-import { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';
-type Props = {
-    items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];
-    rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;
-};
-declare const MainMenu: ({ items, rightSideRef }: Props) => React.ReactElement<Props>;
-export default MainMenu;
+import * as React from 'react';
+import { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';
+type Props = {
+    items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];
+    rightSideRef?: React.RefObject<HTMLDivElement | null> | null | undefined;
+};
+declare const MainMenu: ({ items, rightSideRef }: Props) => React.ReactElement<Props>;
+export default MainMenu;

package/dist/GlobalNavigationBar/desktop/MainMenu.js

@@ -1,13 +1,10 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
 import _pt from "prop-types";
 const _excluded = ["icon", "to", "exact", "disabled", "external", "action", "label", "note", "pinned"];
-var _templateObject, _templateObject2, _templateObject3;
 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 t; }
 function _objectSpread(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)); }); } return e; }
 import * as React from 'react';
-import { NavLink } from 'react-router-dom';
 import styled from 'styled-components';
 import { NavItem } from '../../NavItem';
 import { SystemIcons } from '../../icons';
@@ -17,10 +14,38 @@ import { IconButton } from '../../Button';
 import { defaultOnMouseDownHandler } from '../../common';
 import { NavItemDiv } from '../../NavItem/NavItem';
 import { checkIfContainsItem } from '../utils';
+import { StyledLink } from '../../HyperLink/HyperLink';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const NavContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: none;\n  flex-grow: 1;\n  justify-content: flex-start;\n  align-items: center;\n  \n  padding: 0 16px;\n\n  ", " {\n    display: flex;\n  }\n  \n  ", " {\n    cursor: pointer;\n  }\n  ", " {\n    padding: 0 32px;\n  }\n\n  a {\n    text-decoration: none;\n  }\n"])), BREAKPOINTS.MEDIUM, NavItemDiv, BREAKPOINTS.LARGE);
-const NavButton = styled.button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  background: ", ";\n  border: 0;\n"])), props => COLORS.getColor('white', props.theme));
-const ExtendedSection = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  position: relative;\n"])));
+const NavContainer = styled.div`
+  display: none;
+  flex-grow: 1;
+  justify-content: flex-start;
+  align-items: center;
+  
+  padding: 0 16px;
+
+  ${BREAKPOINTS.MEDIUM} {
+    display: flex;
+  }
+  
+  ${NavItemDiv} {
+    cursor: pointer;
+  }
+  ${BREAKPOINTS.LARGE} {
+    padding: 0 32px;
+  }
+
+  a {
+    text-decoration: none;
+  }
+`;
+const NavButton = styled.button`
+  background: ${props => COLORS.getColor('white', props.theme)};
+  border: 0;
+`;
+const ExtendedSection = styled.div`
+  position: relative;
+`;
 const ExtendedMenuOption = 'extendedOption';
 const MainMenu = _ref => {
   let {
@@ -42,9 +67,8 @@ const MainMenu = _ref => {
   const [focusedItemId, setFocusedItemId] = React.useState('');
   const widthOfItem = 120;
   const recalculateNumberOfItemsAllowed = () => {
-    if (rightSideRef !== null && rightSideRef !== void 0 && rightSideRef.current && mainMenuRef !== null && mainMenuRef !== void 0 && mainMenuRef.current) {
-      var _rightSideRef$current, _mainMenuRef$current;
-      const number = Math.floor(((rightSideRef === null || rightSideRef === void 0 || (_rightSideRef$current = rightSideRef.current) === null || _rightSideRef$current === void 0 ? void 0 : _rightSideRef$current.offsetLeft) - (mainMenuRef === null || mainMenuRef === void 0 || (_mainMenuRef$current = mainMenuRef.current) === null || _mainMenuRef$current === void 0 ? void 0 : _mainMenuRef$current.offsetLeft)) / widthOfItem);
+    if (rightSideRef?.current && mainMenuRef?.current) {
+      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);
       if (number !== numberOfItemsAllowed) {
         setNumberOfItemsAllowed(number);
       }
@@ -103,19 +127,20 @@ const MainMenu = _ref => {
           pinned
         } = _ref2,
         rest = _objectWithoutProperties(_ref2, _excluded);
-      return item !== null && item !== void 0 && item.disabled ? /*#__PURE__*/_jsx(NavItem, {
+      return item?.disabled ? /*#__PURE__*/_jsx(NavItem, {
         as: NavButton,
         className: "disabled",
         onMouseDown: defaultOnMouseDownHandler,
-        children: item === null || item === void 0 ? void 0 : item.label
+        children: item?.label
       }, item.label) : /*#__PURE__*/_jsx(NavItem, _objectSpread(_objectSpread({
-        as: NavLink,
+        as: StyledLink,
+        $variant: "styleless",
         onFocus: onFocus,
-        to: to || '',
+        href: to || '',
         onMouseDown: defaultOnMouseDownHandler,
         onClick: e => action && action(e)
       }, rest), {}, {
-        children: item === null || item === void 0 ? void 0 : item.label
+        children: item?.label
       }), label);
     } else {
       const existingRef = dropdownMenusOpenedArray.current.find(x => x == item.id);
@@ -138,14 +163,8 @@ const MainMenu = _ref => {
         style: {
           position: 'relative'
         },
-        onMouseEnter: event => {
-          var _item$id;
-          return onMouseEnter(event, (_item$id = item.id) !== null && _item$id !== void 0 ? _item$id : '');
-        },
-        onMouseLeave: event => {
-          var _item$id2;
-          return onMouseLeave(event, (_item$id2 = item.id) !== null && _item$id2 !== void 0 ? _item$id2 : '');
-        },
+        onMouseEnter: event => onMouseEnter(event, item.id ?? ''),
+        onMouseLeave: event => onMouseLeave(event, item.id ?? ''),
         children: [/*#__PURE__*/_jsxs(NavItem, {
           id: item.id + '_parentOption',
           "aria-expanded": Boolean(existingRef),
@@ -156,9 +175,9 @@ const MainMenu = _ref => {
           onKeyDown: onKeyDown,
           tabIndex: 0,
           className: existingRef != null || checkIfContainsItem(item, activeItem) ? 'active' : '',
-          to: null,
+          href: null,
           onClick: onClick,
-          children: [item === null || item === void 0 ? void 0 : item.label, " ", /*#__PURE__*/_jsx(SystemIcons.ArrowDropDown, {
+          children: [item?.label, " ", /*#__PURE__*/_jsx(SystemIcons.ArrowDropDown, {
             size: "24px"
           })]
         }, item.label), /*#__PURE__*/_jsx(SubMenu, {
@@ -194,7 +213,7 @@ const MainMenu = _ref => {
     className: "GlobalNavigationMainMenu",
     ref: mainMenuRef,
     onKeyDown: onKeyDownTop,
-    children: [items === null || items === void 0 ? void 0 : items.map(renderItem), items.length + 1 > numberOfItemsAllowed && /*#__PURE__*/_jsxs(ExtendedSection, {
+    children: [items?.map(renderItem), items.length + 1 > numberOfItemsAllowed && /*#__PURE__*/_jsxs(ExtendedSection, {
       onKeyDown: event => extendedSectionKeyHandler(event),
       onMouseEnter: event => onMouseEnter(event, ExtendedMenuOption),
       onMouseLeave: event => onMouseLeave(event, ExtendedMenuOption),

package/dist/GlobalNavigationBar/desktop/MainMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"MainMenu.js","names":["React","NavLink","styled","NavItem","SystemIcons","COLORS","BREAKPOINTS","SubMenu","IconButton","defaultOnMouseDownHandler","NavItemDiv","checkIfContainsItem","jsx","_jsx","jsxs","_jsxs","NavContainer","div","_templateObject","_taggedTemplateLiteral","MEDIUM","LARGE","NavButton","button","_templateObject2","props","getColor","theme","ExtendedSection","_templateObject3","ExtendedMenuOption","MainMenu","_ref","items","rightSideRef","menuButtonRef","useRef","dropdownMenusOpenedArray","mainMenuRef","numberOfItemsAllowed","setNumberOfItemsAllowed","useState","subMenuRefs","setAllSubMenuRefs","extendedMenuOptionRef","createRef","useEffect","map","x","type","undefined","forceUpdate","activeItem","setActiveItemId","focusedItemId","setFocusedItemId","widthOfItem","recalculateNumberOfItemsAllowed","current","_rightSideRef$current","_mainMenuRef$current","number","Math","floor","offsetLeft","onMouseLeave","event","id","filter","onMouseEnter","existingRefForId","find","window","addEventListener","removeEventListener","length","onFocus","onKeyDownTop","key","renderItem","item","index","_ref2","icon","to","exact","disabled","external","action","label","note","pinned","rest","_objectWithoutProperties","_excluded","as","className","onMouseDown","children","_objectSpread","onClick","e","existingRef","onKeyDown","code","containsActiveItem","style","position","_item$id","_item$id2","Boolean","role","tabIndex","ArrowDropDown","size","ariaLabelledBy","ref","onItemFocused","activeItemId","nestPath","onItemStateChanged","state","topLevel","extended","extendedSectionKeyHandler","stopPropagation","slice","variant","shape","MoreHorizontal","propTypes","_pt","array","isRequired"],"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { NavLink, useLocation } from 'react-router-dom';\r\nimport styled from 'styled-components';\r\nimport { NavItem } from '../../NavItem';\r\nimport {SystemIcons} from '../../icons';\r\nimport { COLORS, BREAKPOINTS } from '../../styles';\r\nimport { Menu } from './ExtendedMainMenu';\r\nimport { SubMenu } from './SubMenu';\r\nimport { IconButton } from '../../Button';\r\nimport { defaultOnMouseDownHandler } from '../../common';\r\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\r\nimport { NavItemDiv } from '../../NavItem/NavItem';\r\nimport { checkIfContainsItem } from '../utils';\r\n\r\nconst NavContainer = styled.div`\r\n  display: none;\r\n  flex-grow: 1;\r\n  justify-content: flex-start;\r\n  align-items: center;\r\n  \r\n  padding: 0 16px;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    display: flex;\r\n  }\r\n  \r\n  ${NavItemDiv} {\r\n    cursor: pointer;\r\n  }\r\n  ${BREAKPOINTS.LARGE} {\r\n    padding: 0 32px;\r\n  }\r\n\r\n  a {\r\n    text-decoration: none;\r\n  }\r\n`;\r\n\r\nconst NavButton = styled.button`\r\n  background: ${props => COLORS.getColor('white', props.theme)};\r\n  border: 0;\r\n`;\r\n\r\nconst ExtendedSection = styled.div`\r\n  position: relative;\r\n`;\r\n\r\nconst ExtendedMenuOption = 'extendedOption';\r\n\r\ntype Props = {\r\n  items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\r\n  rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;\r\n};\r\n\r\nconst MainMenu = ({ items, rightSideRef }: Props): React.ReactElement<Props> => {\r\n  const menuButtonRef = React.useRef<HTMLButtonElement>(null);\r\n  //we have to use refs instead of 'state' here, because when onmouseleave is triggered for multiple nested divs, state update is not being updated in between\r\n  const dropdownMenusOpenedArray = React.useRef<string[]>([]);\r\n  const mainMenuRef: React.RefObject<HTMLDivElement> | null | undefined = React.useRef(null);\r\n  const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\r\n  const [subMenuRefs, setAllSubMenuRefs] = React.useState<(React.RefObject<HTMLUListElement> | undefined)[]>([]);\r\n  const extendedMenuOptionRef = React.createRef<HTMLUListElement>();\r\n\r\n  React.useEffect(() => {\r\n    setAllSubMenuRefs(items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLUListElement>() : undefined)));\r\n  }, [items]);\r\n\r\n  const [, forceUpdate] = React.useState({});\r\n  const [activeItem, setActiveItemId] = React.useState<string>('');\r\n  const [focusedItemId, setFocusedItemId] = React.useState<string>('');\r\n\r\n  const widthOfItem = 120;\r\n  const recalculateNumberOfItemsAllowed = () => {\r\n    if (rightSideRef?.current && mainMenuRef?.current) {\r\n      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\r\n      if (number !== numberOfItemsAllowed) {\r\n        setNumberOfItemsAllowed(number);\r\n      }\r\n    }\r\n  };\r\n\r\n  const onMouseLeave = (event: any, id: string) => {\r\n    dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\r\n    //just trigger rerendering\r\n    forceUpdate({});\r\n  };\r\n\r\n  const onMouseEnter = (event: any, id: string) => {\r\n    const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\r\n    if (existingRefForId == null) {\r\n      dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\r\n      //just trigger rerendering\r\n      forceUpdate({});\r\n    }\r\n  };\r\n\r\n  React.useEffect(() => {\r\n    recalculateNumberOfItemsAllowed();\r\n    // Bind the event listener\r\n    window.addEventListener('resize', recalculateNumberOfItemsAllowed);\r\n    return () => {\r\n      // Unbind the event listener on clean up\r\n      window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\r\n    };\r\n  }, []);\r\n\r\n  React.useEffect(() => {\r\n    recalculateNumberOfItemsAllowed();\r\n  }, [items.length]);\r\n\r\n  const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\r\n    //no open dropdowns if top level was entered\r\n    dropdownMenusOpenedArray.current = [];\r\n    forceUpdate({});\r\n  };\r\n\r\n  const onKeyDownTop = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n    if (event.key === 'Escape' || event.key === 'Esc') {\r\n      dropdownMenusOpenedArray.current = [];\r\n      //just trigger rerendering\r\n      forceUpdate({});\r\n    }\r\n  };\r\n\r\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup, index: number) => {\r\n    if (index > numberOfItemsAllowed - 2) return null;\r\n    if (item.type != 'desktopgroup') {\r\n      const { icon, to, exact, disabled, external, action, label, note, pinned, ...rest } = item as MenuNavigationItemTypeItem;\r\n      return item?.disabled ? (\r\n        <NavItem as={NavButton} className=\"disabled\" key={item.label} onMouseDown={defaultOnMouseDownHandler}>\r\n          {item?.label}\r\n        </NavItem>\r\n      ) : (\r\n        <NavItem as={NavLink} onFocus={onFocus} to={to || ''} key={label} onMouseDown={defaultOnMouseDownHandler} onClick={(e: React.MouseEvent) => action && action(e)} {...rest}>\r\n          {item?.label}\r\n        </NavItem>\r\n      );\r\n    } else {\r\n      const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\r\n      const onClick = () => {\r\n        if (existingRef == null) {\r\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n          //just trigger rerendering\r\n          forceUpdate({});\r\n        }\r\n      };\r\n      const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n        if (event.key == 'Enter' || event.code == 'Space') {\r\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n          //just trigger rerendering\r\n          forceUpdate({});\r\n        } \r\n      };\r\n\r\n      const containsActiveItem = checkIfContainsItem(item, activeItem);\r\n      return (\r\n        <div\r\n          style={{ position: 'relative' }}\r\n          onMouseEnter={(event) => onMouseEnter(event, item.id ?? '')}\r\n          onMouseLeave={(event) => onMouseLeave(event, item.id ?? '')}>\r\n          <NavItem\r\n            id={item.id + '_parentOption'}\r\n            aria-expanded={Boolean(existingRef)}\r\n            aria-activedescendant={containsActiveItem ? activeItem : ''}\r\n            aria-controls={item.id}\r\n            role=\"listbox\"\r\n            onFocus={onFocus}\r\n            onKeyDown={onKeyDown}\r\n            tabIndex={0}\r\n            className={existingRef != null || checkIfContainsItem(item, activeItem) ? 'active' : ''}\r\n            key={item.label}\r\n            to={null}\r\n            onClick={onClick}>\r\n            {item?.label} <SystemIcons.ArrowDropDown size=\"24px\" />\r\n          </NavItem>\r\n          <SubMenu\r\n            ariaLabelledBy={item.id + '_parentOption'}\r\n            ref={subMenuRefs[index]}\r\n            onItemFocused={setFocusedItemId}\r\n            focusedItemId={focusedItemId}\r\n            activeItemId={activeItem}\r\n            nestPath={[item.id]}\r\n            onItemStateChanged={(item, state) => {\r\n              if (state) {\r\n                setActiveItemId(item);\r\n              } else if (item == activeItem) setActiveItemId('');\r\n            }}\r\n            item={item as MenuNavigationItemTypeDesktopGroup}\r\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n            index={index + 1}\r\n            topLevel={true}\r\n          />\r\n        </div>\r\n      );\r\n    }\r\n  };\r\n\r\n\r\n  const extended = dropdownMenusOpenedArray.current.find((x) => x == ExtendedMenuOption);\r\n  const extendedSectionKeyHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n    if (event.key == 'Enter' || event.code == 'Space') {\r\n      event.stopPropagation();\r\n\r\n      dropdownMenusOpenedArray.current = [ExtendedMenuOption];\r\n      forceUpdate({});\r\n    }\r\n  };\r\n\r\n  return (\r\n    <NavContainer role=\"navigation\" className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} onKeyDown={onKeyDownTop}>\r\n      {items?.map(renderItem)}\r\n      {items.length + 1 > numberOfItemsAllowed && (\r\n        <ExtendedSection\r\n          onKeyDown={(event) => extendedSectionKeyHandler(event)}\r\n          onMouseEnter={(event) => onMouseEnter(event, ExtendedMenuOption)}\r\n          onMouseLeave={(event) => onMouseLeave(event, ExtendedMenuOption)}>\r\n          <IconButton\r\n            id={ExtendedMenuOption + '_parentOption'}\r\n            aria-expanded={Boolean(extended)}\r\n            aria-activedescendant={checkIfContainsItem({ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }, activeItem) ? activeItem : ''}\r\n            aria-controls={ExtendedMenuOption}\r\n            role=\"listbox\"\r\n            \r\n            ref={menuButtonRef} variant={'secondary'} shape={'circular'} action={() => {}}>\r\n            <SystemIcons.MoreHorizontal size=\"24px\"/>\r\n          </IconButton>\r\n          <SubMenu\r\n            ariaLabelledBy={ExtendedMenuOption + '_parentOption'}\r\n            activeItemId={activeItem}\r\n            onItemFocused={setFocusedItemId}\r\n            focusedItemId={focusedItemId}\r\n            ref={extendedMenuOptionRef}\r\n            onItemStateChanged={(item, state) => {\r\n              if (state) setActiveItemId(item);\r\n              else if (item == activeItem) setActiveItemId('');\r\n            }}\r\n            nestPath={[ExtendedMenuOption]}\r\n            item={{ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }}\r\n            topLevel={true}\r\n            index={0}\r\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n          />\r\n        </ExtendedSection>\r\n      )}\r\n    </NavContainer>\r\n  );\r\n};\r\n\r\nexport default MainMenu;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"MainMenu.js","names":["React","styled","NavItem","SystemIcons","COLORS","BREAKPOINTS","SubMenu","IconButton","defaultOnMouseDownHandler","NavItemDiv","checkIfContainsItem","StyledLink","jsx","_jsx","jsxs","_jsxs","NavContainer","div","MEDIUM","LARGE","NavButton","button","props","getColor","theme","ExtendedSection","ExtendedMenuOption","MainMenu","_ref","items","rightSideRef","menuButtonRef","useRef","dropdownMenusOpenedArray","mainMenuRef","numberOfItemsAllowed","setNumberOfItemsAllowed","useState","subMenuRefs","setAllSubMenuRefs","extendedMenuOptionRef","createRef","useEffect","map","x","type","undefined","forceUpdate","activeItem","setActiveItemId","focusedItemId","setFocusedItemId","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","onMouseLeave","event","id","filter","onMouseEnter","existingRefForId","find","window","addEventListener","removeEventListener","length","onFocus","onKeyDownTop","key","renderItem","item","index","_ref2","icon","to","exact","disabled","external","action","label","note","pinned","rest","_objectWithoutProperties","_excluded","as","className","onMouseDown","children","_objectSpread","$variant","href","onClick","e","existingRef","onKeyDown","code","containsActiveItem","style","position","Boolean","role","tabIndex","ArrowDropDown","size","ariaLabelledBy","ref","onItemFocused","activeItemId","nestPath","onItemStateChanged","state","topLevel","extended","extendedSectionKeyHandler","stopPropagation","slice","variant","shape","MoreHorizontal","propTypes","_pt","array","isRequired"],"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { NavItem } from '../../NavItem';\r\nimport {SystemIcons} from '../../icons';\r\nimport { COLORS, BREAKPOINTS } from '../../styles';\r\nimport { Menu } from './ExtendedMainMenu';\r\nimport { SubMenu } from './SubMenu';\r\nimport { IconButton } from '../../Button';\r\nimport { defaultOnMouseDownHandler } from '../../common';\r\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\r\nimport { NavItemDiv } from '../../NavItem/NavItem';\r\nimport { checkIfContainsItem } from '../utils';\r\nimport HyperLink, { StyledLink } from '../../HyperLink/HyperLink';\r\n\r\nconst NavContainer = styled.div`\r\n  display: none;\r\n  flex-grow: 1;\r\n  justify-content: flex-start;\r\n  align-items: center;\r\n  \r\n  padding: 0 16px;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    display: flex;\r\n  }\r\n  \r\n  ${NavItemDiv} {\r\n    cursor: pointer;\r\n  }\r\n  ${BREAKPOINTS.LARGE} {\r\n    padding: 0 32px;\r\n  }\r\n\r\n  a {\r\n    text-decoration: none;\r\n  }\r\n`;\r\n\r\nconst NavButton = styled.button`\r\n  background: ${props => COLORS.getColor('white', props.theme)};\r\n  border: 0;\r\n`;\r\n\r\nconst ExtendedSection = styled.div`\r\n  position: relative;\r\n`;\r\n\r\nconst ExtendedMenuOption = 'extendedOption';\r\n\r\ntype Props = {\r\n  items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\r\n  rightSideRef?: React.RefObject<HTMLDivElement | null> | null | undefined;\r\n};\r\n\r\nconst MainMenu = ({ items, rightSideRef }: Props): React.ReactElement<Props> => {\r\n  const menuButtonRef = React.useRef<HTMLButtonElement>(null);\r\n  //we have to use refs instead of 'state' here, because when onmouseleave is triggered for multiple nested divs, state update is not being updated in between\r\n  const dropdownMenusOpenedArray = React.useRef<string[]>([]);\r\n  const mainMenuRef: React.RefObject<HTMLDivElement | null> | null | undefined = React.useRef(null);\r\n  const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\r\n  const [subMenuRefs, setAllSubMenuRefs] = React.useState<(React.RefObject<HTMLUListElement | null> | undefined)[]>([]);\r\n  const extendedMenuOptionRef = React.createRef<HTMLUListElement>();\r\n\r\n  React.useEffect(() => {\r\n    setAllSubMenuRefs(items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLUListElement>() : undefined)));\r\n  }, [items]);\r\n\r\n  const [, forceUpdate] = React.useState({});\r\n  const [activeItem, setActiveItemId] = React.useState<string>('');\r\n  const [focusedItemId, setFocusedItemId] = React.useState<string>('');\r\n\r\n  const widthOfItem = 120;\r\n  const recalculateNumberOfItemsAllowed = () => {\r\n    if (rightSideRef?.current && mainMenuRef?.current) {\r\n      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\r\n      if (number !== numberOfItemsAllowed) {\r\n        setNumberOfItemsAllowed(number);\r\n      }\r\n    }\r\n  };\r\n\r\n  const onMouseLeave = (event: any, id: string) => {\r\n    dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\r\n    //just trigger rerendering\r\n    forceUpdate({});\r\n  };\r\n\r\n  const onMouseEnter = (event: any, id: string) => {\r\n    const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\r\n    if (existingRefForId == null) {\r\n      dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\r\n      //just trigger rerendering\r\n      forceUpdate({});\r\n    }\r\n  };\r\n\r\n  React.useEffect(() => {\r\n    recalculateNumberOfItemsAllowed();\r\n    // Bind the event listener\r\n    window.addEventListener('resize', recalculateNumberOfItemsAllowed);\r\n    return () => {\r\n      // Unbind the event listener on clean up\r\n      window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\r\n    };\r\n  }, []);\r\n\r\n  React.useEffect(() => {\r\n    recalculateNumberOfItemsAllowed();\r\n  }, [items.length]);\r\n\r\n  const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\r\n    //no open dropdowns if top level was entered\r\n    dropdownMenusOpenedArray.current = [];\r\n    forceUpdate({});\r\n  };\r\n\r\n  const onKeyDownTop = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n    if (event.key === 'Escape' || event.key === 'Esc') {\r\n      dropdownMenusOpenedArray.current = [];\r\n      //just trigger rerendering\r\n      forceUpdate({});\r\n    }\r\n  };\r\n\r\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup, index: number) => {\r\n    if (index > numberOfItemsAllowed - 2) return null;\r\n    if (item.type != 'desktopgroup') {\r\n      const { icon, to, exact, disabled, external, action, label, note, pinned, ...rest } = item as MenuNavigationItemTypeItem;\r\n      return item?.disabled ? (\r\n        <NavItem as={NavButton} className=\"disabled\" key={item.label} onMouseDown={defaultOnMouseDownHandler}>\r\n          {item?.label}\r\n        </NavItem>\r\n      ) : (\r\n        <NavItem as={StyledLink} $variant=\"styleless\" onFocus={onFocus} href={to || ''} key={label} onMouseDown={defaultOnMouseDownHandler} onClick={(e: React.MouseEvent) => action && action(e)} {...rest}>\r\n          {item?.label}\r\n        </NavItem>\r\n      );\r\n    } else {\r\n      const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\r\n      const onClick = () => {\r\n        if (existingRef == null) {\r\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n          //just trigger rerendering\r\n          forceUpdate({});\r\n        }\r\n      };\r\n      const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n        if (event.key == 'Enter' || event.code == 'Space') {\r\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\r\n          //just trigger rerendering\r\n          forceUpdate({});\r\n        } \r\n      };\r\n\r\n      const containsActiveItem = checkIfContainsItem(item, activeItem);\r\n      return (\r\n        <div\r\n          style={{ position: 'relative' }}\r\n          onMouseEnter={(event) => onMouseEnter(event, item.id ?? '')}\r\n          onMouseLeave={(event) => onMouseLeave(event, item.id ?? '')}>\r\n          <NavItem\r\n            id={item.id + '_parentOption'}\r\n            aria-expanded={Boolean(existingRef)}\r\n            aria-activedescendant={containsActiveItem ? activeItem : ''}\r\n            aria-controls={item.id}\r\n            role=\"listbox\"\r\n            onFocus={onFocus}\r\n            onKeyDown={onKeyDown}\r\n            tabIndex={0}\r\n            className={existingRef != null || checkIfContainsItem(item, activeItem) ? 'active' : ''}\r\n            key={item.label}\r\n            href={null}\r\n            onClick={onClick}>\r\n            {item?.label} <SystemIcons.ArrowDropDown size=\"24px\" />\r\n          </NavItem>\r\n          <SubMenu\r\n            ariaLabelledBy={item.id + '_parentOption'}\r\n            ref={subMenuRefs[index]}\r\n            onItemFocused={setFocusedItemId}\r\n            focusedItemId={focusedItemId}\r\n            activeItemId={activeItem}\r\n            nestPath={[item.id]}\r\n            onItemStateChanged={(item, state) => {\r\n              if (state) {\r\n                setActiveItemId(item);\r\n              } else if (item == activeItem) setActiveItemId('');\r\n            }}\r\n            item={item as MenuNavigationItemTypeDesktopGroup}\r\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n            index={index + 1}\r\n            topLevel={true}\r\n          />\r\n        </div>\r\n      );\r\n    }\r\n  };\r\n\r\n\r\n  const extended = dropdownMenusOpenedArray.current.find((x) => x == ExtendedMenuOption);\r\n  const extendedSectionKeyHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n    if (event.key == 'Enter' || event.code == 'Space') {\r\n      event.stopPropagation();\r\n\r\n      dropdownMenusOpenedArray.current = [ExtendedMenuOption];\r\n      forceUpdate({});\r\n    }\r\n  };\r\n\r\n  return (\r\n    <NavContainer role=\"navigation\" className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} onKeyDown={onKeyDownTop}>\r\n      {items?.map(renderItem)}\r\n      {items.length + 1 > numberOfItemsAllowed && (\r\n        <ExtendedSection\r\n          onKeyDown={(event) => extendedSectionKeyHandler(event)}\r\n          onMouseEnter={(event) => onMouseEnter(event, ExtendedMenuOption)}\r\n          onMouseLeave={(event) => onMouseLeave(event, ExtendedMenuOption)}>\r\n          <IconButton\r\n            id={ExtendedMenuOption + '_parentOption'}\r\n            aria-expanded={Boolean(extended)}\r\n            aria-activedescendant={checkIfContainsItem({ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }, activeItem) ? activeItem : ''}\r\n            aria-controls={ExtendedMenuOption}\r\n            role=\"listbox\"\r\n            \r\n            ref={menuButtonRef} variant={'secondary'} shape={'circular'} action={() => {}}>\r\n            <SystemIcons.MoreHorizontal size=\"24px\"/>\r\n          </IconButton>\r\n          <SubMenu\r\n            ariaLabelledBy={ExtendedMenuOption + '_parentOption'}\r\n            activeItemId={activeItem}\r\n            onItemFocused={setFocusedItemId}\r\n            focusedItemId={focusedItemId}\r\n            ref={extendedMenuOptionRef}\r\n            onItemStateChanged={(item, state) => {\r\n              if (state) setActiveItemId(item);\r\n              else if (item == activeItem) setActiveItemId('');\r\n            }}\r\n            nestPath={[ExtendedMenuOption]}\r\n            item={{ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }}\r\n            topLevel={true}\r\n            index={0}\r\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\r\n          />\r\n        </ExtendedSection>\r\n      )}\r\n    </NavContainer>\r\n  );\r\n};\r\n\r\nexport default MainMenu;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/GlobalNavigationBar/desktop/RightSideNav.cjs

@@ -6,50 +6,79 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var React = _interopRequireWildcard(require("react"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-var _reactRouterDom = require("react-router-dom");
 var _NavItem = require("../../NavItem");
 var _styles = require("../../styles");
 var _Button = require("../../Button");
 var _common = require("../../common");
 var _Tooltips = require("../../Tooltips");
+var _HyperLink = require("../../HyperLink/HyperLink");
 var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject, _templateObject2;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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 t; }
 function _objectSpread(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) { (0, _defineProperty2.default)(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)); }); } return e; }
-const NavContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: none;\n  margin: auto 0 auto auto;\n  align-items: center;\n  height: 64px;\n\n  a {\n    text-decoration: none;\n  }\n\n  ", " {\n    display: flex;\n  }\n\n  ", " {\n    height: 80px;\n  }\n\n  button,\n  div {\n    &:hover {\n      cursor: pointer;\n    }\n  }\n"])), _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.LARGE);
-const StyledButton = (0, _styledComponents.default)(_Button.Button)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  height: 40px;\n  margin: 0 8px;\n\n  ", "\n"])), (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Bold, 'unset'));
+const NavContainer = _styledComponents.default.div`
+  display: none;
+  margin: auto 0 auto auto;
+  align-items: center;
+  height: 64px;
+
+  a {
+    text-decoration: none;
+  }
+
+  ${_styles.BREAKPOINTS.MEDIUM} {
+    display: flex;
+  }
+
+  ${_styles.BREAKPOINTS.LARGE} {
+    height: 80px;
+  }
+
+  button,
+  div {
+    &:hover {
+      cursor: pointer;
+    }
+  }
+`;
+const StyledButton = (0, _styledComponents.default)(_Button.Button)`
+  height: 40px;
+  margin: 0 8px;
+
+  ${(0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Bold, 'unset')}
+`;
 const RightSideNav = _ref => {
   let {
     items,
     action
   } = _ref;
   const getNavItem = item => {
-    if (item !== null && item !== void 0 && item.disabled) {
+    if (item?.disabled) {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_NavItem.NavItem, {
         as: _Button.Button,
         className: "disabled",
-        children: item === null || item === void 0 ? void 0 : item.label
-      }, item === null || item === void 0 ? void 0 : item.label);
+        children: item?.label
+      }, item?.label);
     } else {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_NavItem.NavItem, {
-        as: _reactRouterDom.NavLink,
-        to: (item === null || item === void 0 ? void 0 : item.to) || '',
+        as: _HyperLink.StyledLink,
+        $variant: "styleless",
+        target: "_self",
+        href: item?.to || '',
         onMouseDown: _common.defaultOnMouseDownHandler,
         onClick: e => item.action && item.action(e),
-        children: item === null || item === void 0 ? void 0 : item.label
-      }, item === null || item === void 0 ? void 0 : item.label);
+        children: item?.label
+      }, item?.label);
     }
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(NavContainer, {
-    children: [items === null || items === void 0 ? void 0 : items.reverse().map(no => getNavItem(no)), action && !action.tooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledButton, _objectSpread(_objectSpread({
+    children: [items?.reverse().map(no => getNavItem(no)), action && !action.tooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledButton, _objectSpread(_objectSpread({
       variant: "secondary",
-      onClick: action === null || action === void 0 ? void 0 : action.action
+      onClick: action?.action
     }, _objectSpread(_objectSpread({}, action), {}, {
       action: undefined
     })), {}, {
@@ -57,7 +86,7 @@ const RightSideNav = _ref => {
     })), action && !!action.tooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltips.TooltipWrapper, _objectSpread(_objectSpread({}, action.tooltip), {}, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledButton, _objectSpread(_objectSpread({
         variant: "secondary",
-        onClick: action === null || action === void 0 ? void 0 : action.action
+        onClick: action?.action
       }, _objectSpread(_objectSpread({}, action), {}, {
         action: undefined
       })), {}, {