@laerdal/life-react-components 2.3.1-dev.12 → 2.3.1-dev.14

package/dist/GlobalNavigationBar/desktop/MainMenu.cjs

@@ -54,27 +54,13 @@ var MainMenu = function MainMenu(_ref) {
     _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
     numberOfItemsAllowed = _React$useState2[0],
     setNumberOfItemsAllowed = _React$useState2[1];
-  var _React$useState3 = React.useState([]),
+  var _React$useState3 = React.useState({}),
     _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
-    subMenuRefs = _React$useState4[0],
-    setAllSubMenuRefs = _React$useState4[1];
-  var extendedMenuOptionRef = /*#__PURE__*/React.createRef();
-  React.useEffect(function () {
-    setAllSubMenuRefs(items.map(function (x) {
-      return x.type == 'desktopgroup' ? /*#__PURE__*/React.createRef() : undefined;
-    }));
-  }, [items]);
-  var _React$useState5 = React.useState({}),
+    forceUpdate = _React$useState4[1];
+  var _React$useState5 = React.useState(''),
     _React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
-    forceUpdate = _React$useState6[1];
-  var _React$useState7 = React.useState(''),
-    _React$useState8 = (0, _slicedToArray2.default)(_React$useState7, 2),
-    activeItem = _React$useState8[0],
-    setActiveItemId = _React$useState8[1];
-  var _React$useState9 = React.useState(''),
-    _React$useState10 = (0, _slicedToArray2.default)(_React$useState9, 2),
-    focusedItemId = _React$useState10[0],
-    setFocusedItemId = _React$useState10[1];
+    activeItem = _React$useState6[0],
+    setActiveItemId = _React$useState6[1];
   var widthOfItem = 120;
   var recalculateNumberOfItemsAllowed = function recalculateNumberOfItemsAllowed() {
     if (rightSideRef !== null && rightSideRef !== void 0 && rightSideRef.current && mainMenuRef !== null && mainMenuRef !== void 0 && mainMenuRef.current) {
@@ -119,13 +105,6 @@ var MainMenu = function MainMenu(_ref) {
     dropdownMenusOpenedArray.current = [];
     forceUpdate({});
   };
-  var onKeyDownTop = function onKeyDownTop(event) {
-    if (event.key === 'Escape' || event.key === 'Esc') {
-      dropdownMenusOpenedArray.current = [];
-      //just trigger rerendering
-      forceUpdate({});
-    }
-  };
   var renderItem = function renderItem(item, index) {
     if (index > numberOfItemsAllowed - 2) return null;
     if (item.type != 'desktopgroup') {
@@ -174,7 +153,6 @@ var MainMenu = function MainMenu(_ref) {
           forceUpdate({});
         }
       };
-      var containsActiveItem = (0, _utils.checkIfContainsItem)(item, activeItem);
       return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         style: {
           position: 'relative'
@@ -188,11 +166,6 @@ var MainMenu = function MainMenu(_ref) {
           return _onMouseLeave(event, (_item$id2 = item.id) !== null && _item$id2 !== void 0 ? _item$id2 : '');
         },
         children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_NavItem.NavItem, {
-          id: item.id + '_parentOption',
-          "aria-expanded": Boolean(existingRef),
-          "aria-activedescendant": containsActiveItem ? activeItem : '',
-          "aria-controls": item.id,
-          role: "listbox",
           onFocus: onFocus,
           onKeyDown: onKeyDown,
           tabIndex: 0,
@@ -203,10 +176,6 @@ var MainMenu = function MainMenu(_ref) {
             size: "24px"
           })]
         }, item.label), /*#__PURE__*/(0, _jsxRuntime.jsx)(_SubMenu.SubMenu, {
-          ariaLabelledBy: item.id + '_parentOption',
-          ref: subMenuRefs[index],
-          onItemFocused: setFocusedItemId,
-          focusedItemId: focusedItemId,
           activeItemId: activeItem,
           nestPath: [item.id],
           onItemStateChanged: function onItemStateChanged(item, state) {
@@ -222,25 +191,12 @@ var MainMenu = function MainMenu(_ref) {
       });
     }
   };
-  var extended = dropdownMenusOpenedArray.current.find(function (x) {
-    return x == ExtendedMenuOption;
-  });
-  var extendedSectionKeyHandler = function extendedSectionKeyHandler(event) {
-    if (event.key == 'Enter' || event.code == 'Space') {
-      event.stopPropagation();
-      dropdownMenusOpenedArray.current = [ExtendedMenuOption];
-      forceUpdate({});
-    }
-  };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(NavContainer, {
     role: "navigation",
+    "aria-label": "Global Navigation",
     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, {
-      onKeyDown: function onKeyDown(event) {
-        return extendedSectionKeyHandler(event);
-      },
       onMouseEnter: function onMouseEnter(event) {
         return _onMouseEnter(event, ExtendedMenuOption);
       },
@@ -248,14 +204,6 @@ var MainMenu = function MainMenu(_ref) {
         return _onMouseLeave(event, ExtendedMenuOption);
       },
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
-        id: ExtendedMenuOption + '_parentOption',
-        "aria-expanded": Boolean(extended),
-        "aria-activedescendant": (0, _utils.checkIfContainsItem)({
-          items: items.slice(numberOfItemsAllowed - 1),
-          id: ExtendedMenuOption
-        }, activeItem) ? activeItem : '',
-        "aria-controls": ExtendedMenuOption,
-        role: "listbox",
         ref: menuButtonRef,
         variant: 'secondary',
         shape: 'circular',
@@ -264,17 +212,10 @@ var MainMenu = function MainMenu(_ref) {
           size: "24px"
         })
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_SubMenu.SubMenu, {
-        ariaLabelledBy: ExtendedMenuOption + '_parentOption',
         activeItemId: activeItem,
-        onItemFocused: setFocusedItemId,
-        focusedItemId: focusedItemId,
-        ref: extendedMenuOptionRef,
         onItemStateChanged: function onItemStateChanged(item, state) {
-          console.log(item);
-          console.log(state);
           if (state) setActiveItemId(item);else if (item == activeItem) setActiveItemId('');
         },
-        nestPath: [ExtendedMenuOption],
         item: {
           items: items.slice(numberOfItemsAllowed - 1),
           id: ExtendedMenuOption

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

@@ -1 +1 @@
-{"version":3,"file":"MainMenu.cjs","names":["NavContainer","styled","div","BREAKPOINTS","MEDIUM","NavItemDiv","LARGE","NavButton","button","COLORS","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","SubMenuWrapper","Menu","topLevel","ExtendedMenuOption","MainMenu","items","rightSideRef","menuButtonRef","React","useRef","dropdownMenusOpenedArray","mainMenuRef","useState","numberOfItemsAllowed","setNumberOfItemsAllowed","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","icon","to","exact","disabled","external","action","label","note","pinned","rest","defaultOnMouseDownHandler","NavLink","e","existingRef","onClick","onKeyDown","code","containsActiveItem","checkIfContainsItem","position","Boolean","state","extended","extendedSectionKeyHandler","stopPropagation","slice","console","log"],"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { NavLink, useLocation } from 'react-router-dom';\nimport styled from 'styled-components';\n\nimport { NavItem } from '../../NavItem';\nimport {SystemIcons} from '../../icons';\nimport { COLORS, BREAKPOINTS } from '../../styles';\nimport ExtendedMainMenu, { Menu, MenuSection, MenuSectionList } from './ExtendedMainMenu';\nimport { SubMenu } from './SubMenu';\nimport { IconButton } from '../../Button';\nimport { defaultOnMouseDownHandler } from '../../common';\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\nimport { DropdownContent } from '../../Dropdown';\nimport { VerticalTabEntry, VerticalTabs } from '../../Tabs';\nimport { Size } from '../../types';\nimport Tabs from '../../Tabs/Tabs';\nimport TabLink from '../../Tabs/TabLink';\nimport { MenuItem } from '../../MenuItem';\nimport { NavItemDiv } from '../../NavItem/NavItem';\nimport { checkIfContainsItem } from '../utils';\n\nconst NavContainer = styled.div`\n  display: none;\n  flex-grow: 1;\n  justify-content: flex-start;\n  align-items: center;\n  \n  padding: 0 16px;\n\n  ${BREAKPOINTS.MEDIUM} {\n    display: flex;\n  }\n  \n  ${NavItemDiv} {\n    cursor: pointer;\n  }\n  ${BREAKPOINTS.LARGE} {\n    padding: 0 32px;\n  }\n\n  a {\n    text-decoration: none;\n  }\n`;\n\nconst NavButton = styled.button`\n  background: ${COLORS.white};\n  border: 0;\n`;\n\ninterface ExtendedMenuWrapperProps {\n  floatRight: boolean;\n}\n\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\n  display: flex;\n  margin-left: ${(props) => (props.floatRight ? 'auto' : 'unset')};\n\n  position: absolute;\n  flex-direction: column;\n  left: 290px;\n  top: 22px;\n\n  height: 0;\n  width: 0;\n\n  &:focus-within,\n  &:hover,\n  &.open {\n    background: ${COLORS.white};\n  }\n`;\n\nconst ExtendedSection = styled.div`\n  position: relative;\n`;\n\nconst SubMenuWrapper = styled.div<{ topLevel: boolean }>`\n  ${Menu} {\n    top: ${(props) => (props.topLevel ? '100%' : '0px')};\n    left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\n  }\n\n  button {\n    padding-left: 0px;\n  }\n`;\n\nconst ExtendedMenuOption = 'extendedOption';\n\ntype Props = {\n  items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\n  rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;\n};\n\nconst MainMenu = ({ items, rightSideRef }: Props): React.ReactElement<Props> => {\n  const menuButtonRef = React.useRef<HTMLButtonElement>(null);\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\n  const dropdownMenusOpenedArray = React.useRef<string[]>([]);\n  const mainMenuRef: React.RefObject<HTMLDivElement> | null | undefined = React.useRef(null);\n  const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\n  const [subMenuRefs, setAllSubMenuRefs] = React.useState<(React.RefObject<HTMLUListElement> | undefined)[]>([]);\n  const extendedMenuOptionRef = React.createRef<HTMLUListElement>();\n\n  React.useEffect(() => {\n    setAllSubMenuRefs(items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLUListElement>() : undefined)));\n  }, [items]);\n\n  const [, forceUpdate] = React.useState({});\n  const [activeItem, setActiveItemId] = React.useState<string>('');\n  const [focusedItemId, setFocusedItemId] = React.useState<string>('');\n\n  const widthOfItem = 120;\n  const recalculateNumberOfItemsAllowed = () => {\n    if (rightSideRef?.current && mainMenuRef?.current) {\n      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\n      if (number !== numberOfItemsAllowed) {\n        setNumberOfItemsAllowed(number);\n      }\n    }\n  };\n\n  const onMouseLeave = (event: any, id: string) => {\n    dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\n    //just trigger rerendering\n    forceUpdate({});\n  };\n\n  const onMouseEnter = (event: any, id: string) => {\n    const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\n    if (existingRefForId == null) {\n      dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\n      //just trigger rerendering\n      forceUpdate({});\n    }\n  };\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n    // Bind the event listener\n    window.addEventListener('resize', recalculateNumberOfItemsAllowed);\n    return () => {\n      // Unbind the event listener on clean up\n      window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\n    };\n  }, []);\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n  }, [items.length]);\n\n  const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\n    //no open dropdowns if top level was entered\n    dropdownMenusOpenedArray.current = [];\n    forceUpdate({});\n  };\n\n  const onKeyDownTop = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key === 'Escape' || event.key === 'Esc') {\n      dropdownMenusOpenedArray.current = [];\n      //just trigger rerendering\n      forceUpdate({});\n    }\n  };\n\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup, index: number) => {\n    if (index > numberOfItemsAllowed - 2) return null;\n    if (item.type != 'desktopgroup') {\n      const { icon, to, exact, disabled, external, action, label, note, pinned, ...rest } = item as MenuNavigationItemTypeItem;\n      return item?.disabled ? (\n        <NavItem as={NavButton} className=\"disabled\" key={item.label} onMouseDown={defaultOnMouseDownHandler}>\n          {item?.label}\n        </NavItem>\n      ) : (\n        <NavItem as={NavLink} onFocus={onFocus} to={to || ''} key={label} onMouseDown={defaultOnMouseDownHandler} onClick={(e: React.MouseEvent) => action && action(e)} {...rest}>\n          {item?.label}\n        </NavItem>\n      );\n    } else {\n      const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\n      const onClick = () => {\n        if (existingRef == null) {\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\n          //just trigger rerendering\n          forceUpdate({});\n        }\n      };\n      const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (event.key == 'Enter' || event.code == 'Space') {\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\n          //just trigger rerendering\n          forceUpdate({});\n        } \n      };\n\n      const containsActiveItem = checkIfContainsItem(item, activeItem);\n      return (\n        <div\n          style={{ position: 'relative' }}\n          onMouseEnter={(event) => onMouseEnter(event, item.id ?? '')}\n          onMouseLeave={(event) => onMouseLeave(event, item.id ?? '')}>\n          <NavItem\n            id={item.id + '_parentOption'}\n            aria-expanded={Boolean(existingRef)}\n            aria-activedescendant={containsActiveItem ? activeItem : ''}\n            aria-controls={item.id}\n            role=\"listbox\"\n            onFocus={onFocus}\n            onKeyDown={onKeyDown}\n            tabIndex={0}\n            className={existingRef != null || checkIfContainsItem(item, activeItem) ? 'active' : ''}\n            key={item.label}\n            to={null}\n            onClick={onClick}>\n            {item?.label} <SystemIcons.ArrowDropDown size=\"24px\" />\n          </NavItem>\n          <SubMenu\n            ariaLabelledBy={item.id + '_parentOption'}\n            ref={subMenuRefs[index]}\n            onItemFocused={setFocusedItemId}\n            focusedItemId={focusedItemId}\n            activeItemId={activeItem}\n            nestPath={[item.id]}\n            onItemStateChanged={(item, state) => {\n              if (state) {\n                setActiveItemId(item);\n              } else if (item == activeItem) setActiveItemId('');\n            }}\n            item={item as MenuNavigationItemTypeDesktopGroup}\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\n            index={index + 1}\n            topLevel={true}\n          />\n        </div>\n      );\n    }\n  };\n\n\n  const extended = dropdownMenusOpenedArray.current.find((x) => x == ExtendedMenuOption);\n  const extendedSectionKeyHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key == 'Enter' || event.code == 'Space') {\n      event.stopPropagation();\n\n      dropdownMenusOpenedArray.current = [ExtendedMenuOption];\n      forceUpdate({});\n    }\n  };\n\n  return (\n    <NavContainer role=\"navigation\" className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} onKeyDown={onKeyDownTop}>\n      {items?.map(renderItem)}\n      {items.length + 1 > numberOfItemsAllowed && (\n        <ExtendedSection\n          onKeyDown={(event) => extendedSectionKeyHandler(event)}\n          onMouseEnter={(event) => onMouseEnter(event, ExtendedMenuOption)}\n          onMouseLeave={(event) => onMouseLeave(event, ExtendedMenuOption)}>\n          <IconButton\n            id={ExtendedMenuOption + '_parentOption'}\n            aria-expanded={Boolean(extended)}\n            aria-activedescendant={checkIfContainsItem({ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }, activeItem) ? activeItem : ''}\n            aria-controls={ExtendedMenuOption}\n            role=\"listbox\"\n            \n            ref={menuButtonRef} variant={'secondary'} shape={'circular'} action={() => {}}>\n            <SystemIcons.MoreHorizontal size=\"24px\"/>\n          </IconButton>\n          <SubMenu\n            ariaLabelledBy={ExtendedMenuOption + '_parentOption'}\n            activeItemId={activeItem}\n            onItemFocused={setFocusedItemId}\n            focusedItemId={focusedItemId}\n            ref={extendedMenuOptionRef}\n            onItemStateChanged={(item, state) => {\n              console.log(item);\n              console.log(state);\n              if (state) setActiveItemId(item);\n              else if (item == activeItem) setActiveItemId('');\n            }}\n            nestPath={[ExtendedMenuOption]}\n            item={{ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }}\n            topLevel={true}\n            index={0}\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\n          />\n        </ExtendedSection>\n      )}\n    </NavContainer>\n  );\n};\n\nexport default MainMenu;\n"],"mappings":"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"}
+{"version":3,"file":"MainMenu.cjs","names":["NavContainer","styled","div","BREAKPOINTS","MEDIUM","NavItemDiv","LARGE","NavButton","button","COLORS","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","SubMenuWrapper","Menu","topLevel","ExtendedMenuOption","MainMenu","items","rightSideRef","menuButtonRef","React","useRef","dropdownMenusOpenedArray","mainMenuRef","useState","numberOfItemsAllowed","setNumberOfItemsAllowed","forceUpdate","activeItem","setActiveItemId","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","onMouseLeave","event","id","filter","x","onMouseEnter","existingRefForId","find","useEffect","window","addEventListener","removeEventListener","length","onFocus","renderItem","item","index","type","icon","to","exact","disabled","external","action","label","note","pinned","rest","defaultOnMouseDownHandler","NavLink","e","existingRef","onClick","onKeyDown","key","code","position","checkIfContainsItem","state","map","slice"],"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { NavLink, useLocation } from 'react-router-dom';\nimport styled from 'styled-components';\n\nimport { NavItem } from '../../NavItem';\nimport {SystemIcons} from '../../icons';\nimport { COLORS, BREAKPOINTS } from '../../styles';\nimport ExtendedMainMenu, { Menu, MenuSection, MenuSectionList } from './ExtendedMainMenu';\nimport { SubMenu } from './SubMenu';\nimport { IconButton } from '../../Button';\nimport { defaultOnMouseDownHandler } from '../../common';\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\nimport { DropdownContent } from '../../Dropdown';\nimport { VerticalTabEntry, VerticalTabs } from '../../Tabs';\nimport { Size } from '../../types';\nimport Tabs from '../../Tabs/Tabs';\nimport TabLink from '../../Tabs/TabLink';\nimport { MenuItem } from '../../MenuItem';\nimport { NavItemDiv } from '../../NavItem/NavItem';\nimport { checkIfContainsItem } from '../utils';\n\nconst NavContainer = styled.div`\n  display: none;\n  flex-grow: 1;\n  justify-content: flex-start;\n  align-items: center;\n  \n  padding: 0 16px;\n\n  ${BREAKPOINTS.MEDIUM} {\n    display: flex;\n  }\n  \n  ${NavItemDiv} {\n    cursor: pointer;\n  }\n  ${BREAKPOINTS.LARGE} {\n    padding: 0 32px;\n  }\n\n  a {\n    text-decoration: none;\n  }\n`;\n\nconst NavButton = styled.button`\n  background: ${COLORS.white};\n  border: 0;\n`;\n\ninterface ExtendedMenuWrapperProps {\n  floatRight: boolean;\n}\n\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\n  display: flex;\n  margin-left: ${(props) => (props.floatRight ? 'auto' : 'unset')};\n\n  position: absolute;\n  flex-direction: column;\n  left: 290px;\n  top: 22px;\n\n  height: 0;\n  width: 0;\n\n  &:focus-within,\n  &:hover,\n  &.open {\n    background: ${COLORS.white};\n  }\n`;\n\nconst ExtendedSection = styled.div`\n  position: relative;\n`;\n\nconst SubMenuWrapper = styled.div<{ topLevel: boolean }>`\n  ${Menu} {\n    top: ${(props) => (props.topLevel ? '100%' : '0px')};\n    left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\n  }\n\n  button {\n    padding-left: 0px;\n  }\n`;\n\nconst ExtendedMenuOption = 'extendedOption';\n\ntype Props = {\n  items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\n  rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;\n};\n\nconst MainMenu = ({ items, rightSideRef }: Props): React.ReactElement<Props> => {\n  const menuButtonRef = React.useRef<HTMLButtonElement>(null);\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\n  const dropdownMenusOpenedArray = React.useRef<string[]>([]);\n  const mainMenuRef: React.RefObject<HTMLDivElement> | null | undefined = React.useRef(null);\n  const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\n  const [, forceUpdate] = React.useState({});\n  const [activeItem, setActiveItemId] = React.useState<string>('');\n\n  const widthOfItem = 120;\n  const recalculateNumberOfItemsAllowed = () => {\n    if (rightSideRef?.current && mainMenuRef?.current) {\n      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\n      if (number !== numberOfItemsAllowed) {\n        setNumberOfItemsAllowed(number);\n      }\n    }\n  };\n\n  const onMouseLeave = (event: any, id: string) => {\n    dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\n    //just trigger rerendering\n    forceUpdate({});\n  };\n\n  const onMouseEnter = (event: any, id: string) => {\n    const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\n    if (existingRefForId == null) {\n      dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\n      //just trigger rerendering\n      forceUpdate({});\n    }\n  };\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n    // Bind the event listener\n    window.addEventListener('resize', recalculateNumberOfItemsAllowed);\n    return () => {\n      // Unbind the event listener on clean up\n      window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\n    };\n  }, []);\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n  }, [items.length]);\n\n  const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\n    //no open dropdowns if top level was entered\n    dropdownMenusOpenedArray.current = [];\n    forceUpdate({});\n  }\n\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup, index: number) => {\n    if (index > numberOfItemsAllowed - 2) return null;\n    if (item.type != 'desktopgroup') {\n      const { icon, to, exact, disabled, external, action, label, note, pinned, ...rest } = item as MenuNavigationItemTypeItem;\n      return item?.disabled ? (\n        <NavItem as={NavButton}  className=\"disabled\" key={item.label} onMouseDown={defaultOnMouseDownHandler}>\n          {item?.label}\n        </NavItem>\n      ) : (\n        <NavItem as={NavLink} onFocus={onFocus} to={to || ''} key={label} onMouseDown={defaultOnMouseDownHandler} onClick={(e: React.MouseEvent) => action && action(e)} {...rest}>\n          {item?.label}\n        </NavItem>\n      );\n    } else {\n      const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\n      const onClick = () => {\n        if (existingRef == null) {\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\n          //just trigger rerendering\n          forceUpdate({});\n        }\n      };\n      const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if(event.key == 'Enter' || event.code == 'Space')\n        {\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\n          //just trigger rerendering\n          forceUpdate({});\n        }\n      }\n\n      return (\n        <div style={{ position: 'relative' }} onMouseEnter={(event) => onMouseEnter(event, item.id ?? '')} onMouseLeave={(event) => onMouseLeave(event, item.id ?? '')}>\n          <NavItem onFocus={onFocus} onKeyDown={onKeyDown} tabIndex={0} className={(existingRef != null || checkIfContainsItem(item, activeItem) ) ? 'active' : ''} key={item.label} to={null} onClick={onClick}>\n            {item?.label} <SystemIcons.ArrowDropDown size=\"24px\" />\n          </NavItem>\n          <SubMenu\n            activeItemId={activeItem}\n            nestPath={[item.id]}\n            onItemStateChanged={(item, state) => {\n              if (state) {\n                setActiveItemId(item);\n              } else if(item == activeItem)\n                setActiveItemId('');\n            }}\n            item={item as MenuNavigationItemTypeDesktopGroup}\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\n            index={index + 1}\n            topLevel={true}\n          />\n        </div>\n      );\n    }\n  };\n\n  return (\n    <NavContainer role=\"navigation\" aria-label=\"Global Navigation\" className=\"GlobalNavigationMainMenu\" ref={mainMenuRef}>\n      {items?.map(renderItem)}\n      {items.length + 1 > numberOfItemsAllowed && (\n        <ExtendedSection onMouseEnter={(event) => onMouseEnter(event, ExtendedMenuOption)} onMouseLeave={(event) => onMouseLeave(event, ExtendedMenuOption)}>\n          <IconButton ref={menuButtonRef} variant={'secondary'} shape={'circular'} action={() => {}}>\n            <SystemIcons.MoreHorizontal size=\"24px\"/>\n          </IconButton>\n          <SubMenu\n            activeItemId={activeItem}\n            onItemStateChanged={(item, state) => {\n              if (state)\n                setActiveItemId(item);\n              else if(item == activeItem)\n                setActiveItemId('');\n            }}\n            item={{ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }}\n            topLevel={true}\n            index={0}\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\n          />\n        </ExtendedSection>\n      )}\n    </NavContainer>\n  );\n};\n\nexport default MainMenu;\n"],"mappings":"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"}

package/dist/GlobalNavigationBar/desktop/MainMenu.js

@@ -45,27 +45,13 @@ var MainMenu = function MainMenu(_ref) {
     _React$useState2 = _slicedToArray(_React$useState, 2),
     numberOfItemsAllowed = _React$useState2[0],
     setNumberOfItemsAllowed = _React$useState2[1];
-  var _React$useState3 = React.useState([]),
+  var _React$useState3 = React.useState({}),
     _React$useState4 = _slicedToArray(_React$useState3, 2),
-    subMenuRefs = _React$useState4[0],
-    setAllSubMenuRefs = _React$useState4[1];
-  var extendedMenuOptionRef = /*#__PURE__*/React.createRef();
-  React.useEffect(function () {
-    setAllSubMenuRefs(items.map(function (x) {
-      return x.type == 'desktopgroup' ? /*#__PURE__*/React.createRef() : undefined;
-    }));
-  }, [items]);
-  var _React$useState5 = React.useState({}),
+    forceUpdate = _React$useState4[1];
+  var _React$useState5 = React.useState(''),
     _React$useState6 = _slicedToArray(_React$useState5, 2),
-    forceUpdate = _React$useState6[1];
-  var _React$useState7 = React.useState(''),
-    _React$useState8 = _slicedToArray(_React$useState7, 2),
-    activeItem = _React$useState8[0],
-    setActiveItemId = _React$useState8[1];
-  var _React$useState9 = React.useState(''),
-    _React$useState10 = _slicedToArray(_React$useState9, 2),
-    focusedItemId = _React$useState10[0],
-    setFocusedItemId = _React$useState10[1];
+    activeItem = _React$useState6[0],
+    setActiveItemId = _React$useState6[1];
   var widthOfItem = 120;
   var recalculateNumberOfItemsAllowed = function recalculateNumberOfItemsAllowed() {
     if (rightSideRef !== null && rightSideRef !== void 0 && rightSideRef.current && mainMenuRef !== null && mainMenuRef !== void 0 && mainMenuRef.current) {
@@ -110,13 +96,6 @@ var MainMenu = function MainMenu(_ref) {
     dropdownMenusOpenedArray.current = [];
     forceUpdate({});
   };
-  var onKeyDownTop = function onKeyDownTop(event) {
-    if (event.key === 'Escape' || event.key === 'Esc') {
-      dropdownMenusOpenedArray.current = [];
-      //just trigger rerendering
-      forceUpdate({});
-    }
-  };
   var renderItem = function renderItem(item, index) {
     if (index > numberOfItemsAllowed - 2) return null;
     if (item.type != 'desktopgroup') {
@@ -165,7 +144,6 @@ var MainMenu = function MainMenu(_ref) {
           forceUpdate({});
         }
       };
-      var containsActiveItem = checkIfContainsItem(item, activeItem);
       return /*#__PURE__*/_jsxs("div", {
         style: {
           position: 'relative'
@@ -179,11 +157,6 @@ var MainMenu = function MainMenu(_ref) {
           return _onMouseLeave(event, (_item$id2 = item.id) !== null && _item$id2 !== void 0 ? _item$id2 : '');
         },
         children: [/*#__PURE__*/_jsxs(NavItem, {
-          id: item.id + '_parentOption',
-          "aria-expanded": Boolean(existingRef),
-          "aria-activedescendant": containsActiveItem ? activeItem : '',
-          "aria-controls": item.id,
-          role: "listbox",
           onFocus: onFocus,
           onKeyDown: onKeyDown,
           tabIndex: 0,
@@ -194,10 +167,6 @@ var MainMenu = function MainMenu(_ref) {
             size: "24px"
           })]
         }, item.label), /*#__PURE__*/_jsx(SubMenu, {
-          ariaLabelledBy: item.id + '_parentOption',
-          ref: subMenuRefs[index],
-          onItemFocused: setFocusedItemId,
-          focusedItemId: focusedItemId,
           activeItemId: activeItem,
           nestPath: [item.id],
           onItemStateChanged: function onItemStateChanged(item, state) {
@@ -213,25 +182,12 @@ var MainMenu = function MainMenu(_ref) {
       });
     }
   };
-  var extended = dropdownMenusOpenedArray.current.find(function (x) {
-    return x == ExtendedMenuOption;
-  });
-  var extendedSectionKeyHandler = function extendedSectionKeyHandler(event) {
-    if (event.key == 'Enter' || event.code == 'Space') {
-      event.stopPropagation();
-      dropdownMenusOpenedArray.current = [ExtendedMenuOption];
-      forceUpdate({});
-    }
-  };
   return /*#__PURE__*/_jsxs(NavContainer, {
     role: "navigation",
+    "aria-label": "Global Navigation",
     className: "GlobalNavigationMainMenu",
     ref: mainMenuRef,
-    onKeyDown: onKeyDownTop,
     children: [items === null || items === void 0 ? void 0 : items.map(renderItem), items.length + 1 > numberOfItemsAllowed && /*#__PURE__*/_jsxs(ExtendedSection, {
-      onKeyDown: function onKeyDown(event) {
-        return extendedSectionKeyHandler(event);
-      },
       onMouseEnter: function onMouseEnter(event) {
         return _onMouseEnter(event, ExtendedMenuOption);
       },
@@ -239,14 +195,6 @@ var MainMenu = function MainMenu(_ref) {
         return _onMouseLeave(event, ExtendedMenuOption);
       },
       children: [/*#__PURE__*/_jsx(IconButton, {
-        id: ExtendedMenuOption + '_parentOption',
-        "aria-expanded": Boolean(extended),
-        "aria-activedescendant": checkIfContainsItem({
-          items: items.slice(numberOfItemsAllowed - 1),
-          id: ExtendedMenuOption
-        }, activeItem) ? activeItem : '',
-        "aria-controls": ExtendedMenuOption,
-        role: "listbox",
         ref: menuButtonRef,
         variant: 'secondary',
         shape: 'circular',
@@ -255,17 +203,10 @@ var MainMenu = function MainMenu(_ref) {
           size: "24px"
         })
       }), /*#__PURE__*/_jsx(SubMenu, {
-        ariaLabelledBy: ExtendedMenuOption + '_parentOption',
         activeItemId: activeItem,
-        onItemFocused: setFocusedItemId,
-        focusedItemId: focusedItemId,
-        ref: extendedMenuOptionRef,
         onItemStateChanged: function onItemStateChanged(item, state) {
-          console.log(item);
-          console.log(state);
           if (state) setActiveItemId(item);else if (item == activeItem) setActiveItemId('');
         },
-        nestPath: [ExtendedMenuOption],
         item: {
           items: items.slice(numberOfItemsAllowed - 1),
           id: ExtendedMenuOption

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

@@ -1 +1 @@
-{"version":3,"file":"MainMenu.js","names":["React","NavLink","styled","NavItem","SystemIcons","COLORS","BREAKPOINTS","Menu","SubMenu","IconButton","defaultOnMouseDownHandler","NavItemDiv","checkIfContainsItem","NavContainer","div","MEDIUM","LARGE","NavButton","button","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","SubMenuWrapper","topLevel","ExtendedMenuOption","MainMenu","items","rightSideRef","menuButtonRef","useRef","dropdownMenusOpenedArray","mainMenuRef","useState","numberOfItemsAllowed","setNumberOfItemsAllowed","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","icon","to","exact","disabled","external","action","label","note","pinned","rest","e","existingRef","onClick","onKeyDown","code","containsActiveItem","position","Boolean","state","extended","extendedSectionKeyHandler","stopPropagation","slice","console","log"],"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { NavLink, useLocation } from 'react-router-dom';\nimport styled from 'styled-components';\n\nimport { NavItem } from '../../NavItem';\nimport {SystemIcons} from '../../icons';\nimport { COLORS, BREAKPOINTS } from '../../styles';\nimport ExtendedMainMenu, { Menu, MenuSection, MenuSectionList } from './ExtendedMainMenu';\nimport { SubMenu } from './SubMenu';\nimport { IconButton } from '../../Button';\nimport { defaultOnMouseDownHandler } from '../../common';\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\nimport { DropdownContent } from '../../Dropdown';\nimport { VerticalTabEntry, VerticalTabs } from '../../Tabs';\nimport { Size } from '../../types';\nimport Tabs from '../../Tabs/Tabs';\nimport TabLink from '../../Tabs/TabLink';\nimport { MenuItem } from '../../MenuItem';\nimport { NavItemDiv } from '../../NavItem/NavItem';\nimport { checkIfContainsItem } from '../utils';\n\nconst NavContainer = styled.div`\n  display: none;\n  flex-grow: 1;\n  justify-content: flex-start;\n  align-items: center;\n  \n  padding: 0 16px;\n\n  ${BREAKPOINTS.MEDIUM} {\n    display: flex;\n  }\n  \n  ${NavItemDiv} {\n    cursor: pointer;\n  }\n  ${BREAKPOINTS.LARGE} {\n    padding: 0 32px;\n  }\n\n  a {\n    text-decoration: none;\n  }\n`;\n\nconst NavButton = styled.button`\n  background: ${COLORS.white};\n  border: 0;\n`;\n\ninterface ExtendedMenuWrapperProps {\n  floatRight: boolean;\n}\n\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\n  display: flex;\n  margin-left: ${(props) => (props.floatRight ? 'auto' : 'unset')};\n\n  position: absolute;\n  flex-direction: column;\n  left: 290px;\n  top: 22px;\n\n  height: 0;\n  width: 0;\n\n  &:focus-within,\n  &:hover,\n  &.open {\n    background: ${COLORS.white};\n  }\n`;\n\nconst ExtendedSection = styled.div`\n  position: relative;\n`;\n\nconst SubMenuWrapper = styled.div<{ topLevel: boolean }>`\n  ${Menu} {\n    top: ${(props) => (props.topLevel ? '100%' : '0px')};\n    left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\n  }\n\n  button {\n    padding-left: 0px;\n  }\n`;\n\nconst ExtendedMenuOption = 'extendedOption';\n\ntype Props = {\n  items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\n  rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;\n};\n\nconst MainMenu = ({ items, rightSideRef }: Props): React.ReactElement<Props> => {\n  const menuButtonRef = React.useRef<HTMLButtonElement>(null);\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\n  const dropdownMenusOpenedArray = React.useRef<string[]>([]);\n  const mainMenuRef: React.RefObject<HTMLDivElement> | null | undefined = React.useRef(null);\n  const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\n  const [subMenuRefs, setAllSubMenuRefs] = React.useState<(React.RefObject<HTMLUListElement> | undefined)[]>([]);\n  const extendedMenuOptionRef = React.createRef<HTMLUListElement>();\n\n  React.useEffect(() => {\n    setAllSubMenuRefs(items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLUListElement>() : undefined)));\n  }, [items]);\n\n  const [, forceUpdate] = React.useState({});\n  const [activeItem, setActiveItemId] = React.useState<string>('');\n  const [focusedItemId, setFocusedItemId] = React.useState<string>('');\n\n  const widthOfItem = 120;\n  const recalculateNumberOfItemsAllowed = () => {\n    if (rightSideRef?.current && mainMenuRef?.current) {\n      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\n      if (number !== numberOfItemsAllowed) {\n        setNumberOfItemsAllowed(number);\n      }\n    }\n  };\n\n  const onMouseLeave = (event: any, id: string) => {\n    dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\n    //just trigger rerendering\n    forceUpdate({});\n  };\n\n  const onMouseEnter = (event: any, id: string) => {\n    const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\n    if (existingRefForId == null) {\n      dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\n      //just trigger rerendering\n      forceUpdate({});\n    }\n  };\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n    // Bind the event listener\n    window.addEventListener('resize', recalculateNumberOfItemsAllowed);\n    return () => {\n      // Unbind the event listener on clean up\n      window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\n    };\n  }, []);\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n  }, [items.length]);\n\n  const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\n    //no open dropdowns if top level was entered\n    dropdownMenusOpenedArray.current = [];\n    forceUpdate({});\n  };\n\n  const onKeyDownTop = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key === 'Escape' || event.key === 'Esc') {\n      dropdownMenusOpenedArray.current = [];\n      //just trigger rerendering\n      forceUpdate({});\n    }\n  };\n\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup, index: number) => {\n    if (index > numberOfItemsAllowed - 2) return null;\n    if (item.type != 'desktopgroup') {\n      const { icon, to, exact, disabled, external, action, label, note, pinned, ...rest } = item as MenuNavigationItemTypeItem;\n      return item?.disabled ? (\n        <NavItem as={NavButton} className=\"disabled\" key={item.label} onMouseDown={defaultOnMouseDownHandler}>\n          {item?.label}\n        </NavItem>\n      ) : (\n        <NavItem as={NavLink} onFocus={onFocus} to={to || ''} key={label} onMouseDown={defaultOnMouseDownHandler} onClick={(e: React.MouseEvent) => action && action(e)} {...rest}>\n          {item?.label}\n        </NavItem>\n      );\n    } else {\n      const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\n      const onClick = () => {\n        if (existingRef == null) {\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\n          //just trigger rerendering\n          forceUpdate({});\n        }\n      };\n      const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (event.key == 'Enter' || event.code == 'Space') {\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\n          //just trigger rerendering\n          forceUpdate({});\n        } \n      };\n\n      const containsActiveItem = checkIfContainsItem(item, activeItem);\n      return (\n        <div\n          style={{ position: 'relative' }}\n          onMouseEnter={(event) => onMouseEnter(event, item.id ?? '')}\n          onMouseLeave={(event) => onMouseLeave(event, item.id ?? '')}>\n          <NavItem\n            id={item.id + '_parentOption'}\n            aria-expanded={Boolean(existingRef)}\n            aria-activedescendant={containsActiveItem ? activeItem : ''}\n            aria-controls={item.id}\n            role=\"listbox\"\n            onFocus={onFocus}\n            onKeyDown={onKeyDown}\n            tabIndex={0}\n            className={existingRef != null || checkIfContainsItem(item, activeItem) ? 'active' : ''}\n            key={item.label}\n            to={null}\n            onClick={onClick}>\n            {item?.label} <SystemIcons.ArrowDropDown size=\"24px\" />\n          </NavItem>\n          <SubMenu\n            ariaLabelledBy={item.id + '_parentOption'}\n            ref={subMenuRefs[index]}\n            onItemFocused={setFocusedItemId}\n            focusedItemId={focusedItemId}\n            activeItemId={activeItem}\n            nestPath={[item.id]}\n            onItemStateChanged={(item, state) => {\n              if (state) {\n                setActiveItemId(item);\n              } else if (item == activeItem) setActiveItemId('');\n            }}\n            item={item as MenuNavigationItemTypeDesktopGroup}\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\n            index={index + 1}\n            topLevel={true}\n          />\n        </div>\n      );\n    }\n  };\n\n\n  const extended = dropdownMenusOpenedArray.current.find((x) => x == ExtendedMenuOption);\n  const extendedSectionKeyHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key == 'Enter' || event.code == 'Space') {\n      event.stopPropagation();\n\n      dropdownMenusOpenedArray.current = [ExtendedMenuOption];\n      forceUpdate({});\n    }\n  };\n\n  return (\n    <NavContainer role=\"navigation\" className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} onKeyDown={onKeyDownTop}>\n      {items?.map(renderItem)}\n      {items.length + 1 > numberOfItemsAllowed && (\n        <ExtendedSection\n          onKeyDown={(event) => extendedSectionKeyHandler(event)}\n          onMouseEnter={(event) => onMouseEnter(event, ExtendedMenuOption)}\n          onMouseLeave={(event) => onMouseLeave(event, ExtendedMenuOption)}>\n          <IconButton\n            id={ExtendedMenuOption + '_parentOption'}\n            aria-expanded={Boolean(extended)}\n            aria-activedescendant={checkIfContainsItem({ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }, activeItem) ? activeItem : ''}\n            aria-controls={ExtendedMenuOption}\n            role=\"listbox\"\n            \n            ref={menuButtonRef} variant={'secondary'} shape={'circular'} action={() => {}}>\n            <SystemIcons.MoreHorizontal size=\"24px\"/>\n          </IconButton>\n          <SubMenu\n            ariaLabelledBy={ExtendedMenuOption + '_parentOption'}\n            activeItemId={activeItem}\n            onItemFocused={setFocusedItemId}\n            focusedItemId={focusedItemId}\n            ref={extendedMenuOptionRef}\n            onItemStateChanged={(item, state) => {\n              console.log(item);\n              console.log(state);\n              if (state) setActiveItemId(item);\n              else if (item == activeItem) setActiveItemId('');\n            }}\n            nestPath={[ExtendedMenuOption]}\n            item={{ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }}\n            topLevel={true}\n            index={0}\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\n          />\n        </ExtendedSection>\n      )}\n    </NavContainer>\n  );\n};\n\nexport default MainMenu;\n"],"mappings":";;;;;;;;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,OAAO,QAAqB,kBAAkB;AACvD,OAAOC,MAAM,MAAM,mBAAmB;AAEtC,SAASC,OAAO,QAAQ,eAAe;AACvC,SAAQC,WAAW,QAAO,aAAa;AACvC,SAASC,MAAM,EAAEC,WAAW,QAAQ,cAAc;AAClD,SAA2BC,IAAI,QAAsC,oBAAoB;AACzF,SAASC,OAAO,QAAQ,WAAW;AACnC,SAASC,UAAU,QAAQ,cAAc;AACzC,SAASC,yBAAyB,QAAQ,cAAc;AAQxD,SAASC,UAAU,QAAQ,uBAAuB;AAClD,SAASC,mBAAmB,QAAQ,UAAU;AAAC;AAAA;AAE/C,IAAMC,YAAY,GAAGX,MAAM,CAACY,GAAG,wVAQ3BR,WAAW,CAACS,MAAM,EAIlBJ,UAAU,EAGVL,WAAW,CAACU,KAAK,CAOpB;AAED,IAAMC,SAAS,GAAGf,MAAM,CAACgB,MAAM,6GACfb,MAAM,CAACc,KAAK,CAE3B;AAMD,IAAMC,mBAAmB,GAAGlB,MAAM,CAACY,GAAG,0SAErB,UAACO,KAAK;EAAA,OAAMA,KAAK,CAACC,UAAU,GAAG,MAAM,GAAG,OAAO;AAAA,CAAC,EAa/CjB,MAAM,CAACc,KAAK,CAE7B;AAED,IAAMI,eAAe,GAAGrB,MAAM,CAACY,GAAG,gGAEjC;AAED,IAAMU,cAAc,GAAGtB,MAAM,CAACY,GAAG,qKAC7BP,IAAI,EACG,UAACc,KAAK;EAAA,OAAMA,KAAK,CAACI,QAAQ,GAAG,MAAM,GAAG,KAAK;AAAA,CAAC,EAC3C,UAACJ,KAAK;EAAA,OAAMA,KAAK,CAACI,QAAQ,GAAG,KAAK,GAAG,mBAAmB;AAAA,CAAC,CAMpE;AAED,IAAMC,kBAAkB,GAAG,gBAAgB;AAO3C,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,OAAkE;EAAA,IAA5DC,KAAK,QAALA,KAAK;IAAEC,YAAY,QAAZA,YAAY;EACrC,IAAMC,aAAa,GAAG9B,KAAK,CAAC+B,MAAM,CAAoB,IAAI,CAAC;EAC3D;EACA,IAAMC,wBAAwB,GAAGhC,KAAK,CAAC+B,MAAM,CAAW,EAAE,CAAC;EAC3D,IAAME,WAA+D,GAAGjC,KAAK,CAAC+B,MAAM,CAAC,IAAI,CAAC;EAC1F,sBAAwD/B,KAAK,CAACkC,QAAQ,CAAS,CAAC,CAAC;IAAA;IAA1EC,oBAAoB;IAAEC,uBAAuB;EACpD,uBAAyCpC,KAAK,CAACkC,QAAQ,CAAoD,EAAE,CAAC;IAAA;IAAvGG,WAAW;IAAEC,iBAAiB;EACrC,IAAMC,qBAAqB,gBAAGvC,KAAK,CAACwC,SAAS,EAAoB;EAEjExC,KAAK,CAACyC,SAAS,CAAC,YAAM;IACpBH,iBAAiB,CAACV,KAAK,CAACc,GAAG,CAAC,UAACC,CAAC;MAAA,OAAMA,CAAC,CAACC,IAAI,IAAI,cAAc,gBAAG5C,KAAK,CAACwC,SAAS,EAAoB,GAAGK,SAAS;IAAA,CAAC,CAAC,CAAC;EACnH,CAAC,EAAE,CAACjB,KAAK,CAAC,CAAC;EAEX,uBAAwB5B,KAAK,CAACkC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAAA;IAAjCY,WAAW;EACpB,uBAAsC9C,KAAK,CAACkC,QAAQ,CAAS,EAAE,CAAC;IAAA;IAAzDa,UAAU;IAAEC,eAAe;EAClC,uBAA0ChD,KAAK,CAACkC,QAAQ,CAAS,EAAE,CAAC;IAAA;IAA7De,aAAa;IAAEC,gBAAgB;EAEtC,IAAMC,WAAW,GAAG,GAAG;EACvB,IAAMC,+BAA+B,GAAG,SAAlCA,+BAA+B,GAAS;IAC5C,IAAIvB,YAAY,aAAZA,YAAY,eAAZA,YAAY,CAAEwB,OAAO,IAAIpB,WAAW,aAAXA,WAAW,eAAXA,WAAW,CAAEoB,OAAO,EAAE;MAAA;MACjD,IAAMC,MAAM,GAAGC,IAAI,CAACC,KAAK,CAAC,CAAC,CAAA3B,YAAY,aAAZA,YAAY,gDAAZA,YAAY,CAAEwB,OAAO,0DAArB,sBAAuBI,UAAU,KAAGxB,WAAW,aAAXA,WAAW,+CAAXA,WAAW,CAAEoB,OAAO,yDAApB,qBAAsBI,UAAU,KAAIN,WAAW,CAAC;MAC/G,IAAIG,MAAM,KAAKnB,oBAAoB,EAAE;QACnCC,uBAAuB,CAACkB,MAAM,CAAC;MACjC;IACF;EACF,CAAC;EAED,IAAMI,aAAY,GAAG,SAAfA,YAAY,CAAIC,KAAU,EAAEC,EAAU,EAAK;IAC/C5B,wBAAwB,CAACqB,OAAO,sBAAOrB,wBAAwB,CAACqB,OAAO,CAACQ,MAAM,CAAC,UAAClB,CAAC;MAAA,OAAKA,CAAC,IAAIiB,EAAE;IAAA,EAAC,CAAC;IAC/F;IACAd,WAAW,CAAC,CAAC,CAAC,CAAC;EACjB,CAAC;EAED,IAAMgB,aAAY,GAAG,SAAfA,YAAY,CAAIH,KAAU,EAAEC,EAAU,EAAK;IAC/C,IAAMG,gBAAgB,GAAG/B,wBAAwB,CAACqB,OAAO,CAACW,IAAI,CAAC,UAACrB,CAAC;MAAA,OAAKA,CAAC,IAAIiB,EAAE;IAAA,EAAC;IAC9E,IAAIG,gBAAgB,IAAI,IAAI,EAAE;MAC5B/B,wBAAwB,CAACqB,OAAO,gCAAOrB,wBAAwB,CAACqB,OAAO,IAAEO,EAAE,EAAC;MAC5E;MACAd,WAAW,CAAC,CAAC,CAAC,CAAC;IACjB;EACF,CAAC;EAED9C,KAAK,CAACyC,SAAS,CAAC,YAAM;IACpBW,+BAA+B,EAAE;IACjC;IACAa,MAAM,CAACC,gBAAgB,CAAC,QAAQ,EAAEd,+BAA+B,CAAC;IAClE,OAAO,YAAM;MACX;MACAa,MAAM,CAACE,mBAAmB,CAAC,QAAQ,EAAEf,+BAA+B,CAAC;IACvE,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAENpD,KAAK,CAACyC,SAAS,CAAC,YAAM;IACpBW,+BAA+B,EAAE;EACnC,CAAC,EAAE,CAACxB,KAAK,CAACwC,MAAM,CAAC,CAAC;EAElB,IAAMC,OAAO,GAAG,SAAVA,OAAO,CAAIV,KAAuC,EAAK;IAC3D;IACA3B,wBAAwB,CAACqB,OAAO,GAAG,EAAE;IACrCP,WAAW,CAAC,CAAC,CAAC,CAAC;EACjB,CAAC;EAED,IAAMwB,YAAY,GAAG,SAAfA,YAAY,CAAIX,KAA0C,EAAK;IACnE,IAAIA,KAAK,CAACY,GAAG,KAAK,QAAQ,IAAIZ,KAAK,CAACY,GAAG,KAAK,KAAK,EAAE;MACjDvC,wBAAwB,CAACqB,OAAO,GAAG,EAAE;MACrC;MACAP,WAAW,CAAC,CAAC,CAAC,CAAC;IACjB;EACF,CAAC;EAED,IAAM0B,UAAU,GAAG,SAAbA,UAAU,CAAIC,IAAqE,EAAEC,KAAa,EAAK;IAC3G,IAAIA,KAAK,GAAGvC,oBAAoB,GAAG,CAAC,EAAE,OAAO,IAAI;IACjD,IAAIsC,IAAI,CAAC7B,IAAI,IAAI,cAAc,EAAE;MAC/B,YAAsF6B,IAAI;QAAlFE,IAAI,SAAJA,IAAI;QAAEC,EAAE,SAAFA,EAAE;QAAEC,KAAK,SAALA,KAAK;QAAEC,QAAQ,SAARA,QAAQ;QAAEC,QAAQ,SAARA,QAAQ;QAAEC,MAAM,SAANA,MAAM;QAAEC,KAAK,SAALA,KAAK;QAAEC,IAAI,SAAJA,IAAI;QAAEC,MAAM,SAANA,MAAM;QAAKC,IAAI;MACjF,OAAOX,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAEK,QAAQ,gBACnB,KAAC,OAAO;QAAC,EAAE,EAAE7D,SAAU;QAAC,SAAS,EAAC,UAAU;QAAkB,WAAW,EAAEP,yBAA0B;QAAA,UAClG+D,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEQ;MAAK,GADoCR,IAAI,CAACQ,KAAK,CAElD,gBAEV,KAAC,OAAO;QAAC,EAAE,EAAEhF,OAAQ;QAAC,OAAO,EAAEoE,OAAQ;QAAC,EAAE,EAAEO,EAAE,IAAI,EAAG;QAAa,WAAW,EAAElE,yBAA0B;QAAC,OAAO,EAAE,iBAAC2E,CAAmB;UAAA,OAAKL,MAAM,IAAIA,MAAM,CAACK,CAAC,CAAC;QAAA;MAAC,GAAKD,IAAI;QAAA,UACtKX,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEQ;MAAK,IAD6CA,KAAK,CAGjE;IACH,CAAC,MAAM;MACL,IAAMK,WAAW,GAAGtD,wBAAwB,CAACqB,OAAO,CAACW,IAAI,CAAC,UAACrB,CAAC;QAAA,OAAKA,CAAC,IAAI8B,IAAI,CAACb,EAAE;MAAA,EAAC;MAC9E,IAAM2B,OAAO,GAAG,SAAVA,OAAO,GAAS;QACpB,IAAID,WAAW,IAAI,IAAI,EAAE;UACvBtD,wBAAwB,CAACqB,OAAO,gCAAOrB,wBAAwB,CAACqB,OAAO,IAAEoB,IAAI,CAACb,EAAE,EAAC;UACjF;UACAd,WAAW,CAAC,CAAC,CAAC,CAAC;QACjB;MACF,CAAC;MACD,IAAM0C,SAAS,GAAG,SAAZA,SAAS,CAAI7B,KAA0C,EAAK;QAChE,IAAIA,KAAK,CAACY,GAAG,IAAI,OAAO,IAAIZ,KAAK,CAAC8B,IAAI,IAAI,OAAO,EAAE;UACjDzD,wBAAwB,CAACqB,OAAO,gCAAOrB,wBAAwB,CAACqB,OAAO,IAAEoB,IAAI,CAACb,EAAE,EAAC;UACjF;UACAd,WAAW,CAAC,CAAC,CAAC,CAAC;QACjB;MACF,CAAC;MAED,IAAM4C,kBAAkB,GAAG9E,mBAAmB,CAAC6D,IAAI,EAAE1B,UAAU,CAAC;MAChE,oBACE;QACE,KAAK,EAAE;UAAE4C,QAAQ,EAAE;QAAW,CAAE;QAChC,YAAY,EAAE,sBAAChC,KAAK;UAAA;UAAA,OAAKG,aAAY,CAACH,KAAK,cAAEc,IAAI,CAACb,EAAE,+CAAI,EAAE,CAAC;QAAA,CAAC;QAC5D,YAAY,EAAE,sBAACD,KAAK;UAAA;UAAA,OAAKD,aAAY,CAACC,KAAK,eAAEc,IAAI,CAACb,EAAE,iDAAI,EAAE,CAAC;QAAA,CAAC;QAAA,wBAC5D,MAAC,OAAO;UACN,EAAE,EAAEa,IAAI,CAACb,EAAE,GAAG,eAAgB;UAC9B,iBAAegC,OAAO,CAACN,WAAW,CAAE;UACpC,yBAAuBI,kBAAkB,GAAG3C,UAAU,GAAG,EAAG;UAC5D,iBAAe0B,IAAI,CAACb,EAAG;UACvB,IAAI,EAAC,SAAS;UACd,OAAO,EAAES,OAAQ;UACjB,SAAS,EAAEmB,SAAU;UACrB,QAAQ,EAAE,CAAE;UACZ,SAAS,EAAEF,WAAW,IAAI,IAAI,IAAI1E,mBAAmB,CAAC6D,IAAI,EAAE1B,UAAU,CAAC,GAAG,QAAQ,GAAG,EAAG;UAExF,EAAE,EAAE,IAAK;UACT,OAAO,EAAEwC,OAAQ;UAAA,WAChBd,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEQ,KAAK,oBAAE,KAAC,WAAW,CAAC,aAAa;YAAC,IAAI,EAAC;UAAM,EAAG;QAAA,GAHlDR,IAAI,CAACQ,KAAK,CAIP,eACV,KAAC,OAAO;UACN,cAAc,EAAER,IAAI,CAACb,EAAE,GAAG,eAAgB;UAC1C,GAAG,EAAEvB,WAAW,CAACqC,KAAK,CAAE;UACxB,aAAa,EAAExB,gBAAiB;UAChC,aAAa,EAAED,aAAc;UAC7B,YAAY,EAAEF,UAAW;UACzB,QAAQ,EAAE,CAAC0B,IAAI,CAACb,EAAE,CAAE;UACpB,kBAAkB,EAAE,4BAACa,IAAI,EAAEoB,KAAK,EAAK;YACnC,IAAIA,KAAK,EAAE;cACT7C,eAAe,CAACyB,IAAI,CAAC;YACvB,CAAC,MAAM,IAAIA,IAAI,IAAI1B,UAAU,EAAEC,eAAe,CAAC,EAAE,CAAC;UACpD,CAAE;UACF,IAAI,EAAEyB,IAA2C;UACjD,wBAAwB,EAAEzC,wBAAyB;UACnD,KAAK,EAAE0C,KAAK,GAAG,CAAE;UACjB,QAAQ,EAAE;QAAK,EACf;MAAA,EACE;IAEV;EACF,CAAC;EAGD,IAAMoB,QAAQ,GAAG9D,wBAAwB,CAACqB,OAAO,CAACW,IAAI,CAAC,UAACrB,CAAC;IAAA,OAAKA,CAAC,IAAIjB,kBAAkB;EAAA,EAAC;EACtF,IAAMqE,yBAAyB,GAAG,SAA5BA,yBAAyB,CAAIpC,KAA0C,EAAK;IAChF,IAAIA,KAAK,CAACY,GAAG,IAAI,OAAO,IAAIZ,KAAK,CAAC8B,IAAI,IAAI,OAAO,EAAE;MACjD9B,KAAK,CAACqC,eAAe,EAAE;MAEvBhE,wBAAwB,CAACqB,OAAO,GAAG,CAAC3B,kBAAkB,CAAC;MACvDoB,WAAW,CAAC,CAAC,CAAC,CAAC;IACjB;EACF,CAAC;EAED,oBACE,MAAC,YAAY;IAAC,IAAI,EAAC,YAAY;IAAC,SAAS,EAAC,0BAA0B;IAAC,GAAG,EAAEb,WAAY;IAAC,SAAS,EAAEqC,YAAa;IAAA,WAC5G1C,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEc,GAAG,CAAC8B,UAAU,CAAC,EACtB5C,KAAK,CAACwC,MAAM,GAAG,CAAC,GAAGjC,oBAAoB,iBACtC,MAAC,eAAe;MACd,SAAS,EAAE,mBAACwB,KAAK;QAAA,OAAKoC,yBAAyB,CAACpC,KAAK,CAAC;MAAA,CAAC;MACvD,YAAY,EAAE,sBAACA,KAAK;QAAA,OAAKG,aAAY,CAACH,KAAK,EAAEjC,kBAAkB,CAAC;MAAA,CAAC;MACjE,YAAY,EAAE,sBAACiC,KAAK;QAAA,OAAKD,aAAY,CAACC,KAAK,EAAEjC,kBAAkB,CAAC;MAAA,CAAC;MAAA,wBACjE,KAAC,UAAU;QACT,EAAE,EAAEA,kBAAkB,GAAG,eAAgB;QACzC,iBAAekE,OAAO,CAACE,QAAQ,CAAE;QACjC,yBAAuBlF,mBAAmB,CAAC;UAAEgB,KAAK,EAAEA,KAAK,CAACqE,KAAK,CAAC9D,oBAAoB,GAAG,CAAC,CAAC;UAAEyB,EAAE,EAAElC;QAAmB,CAAC,EAAEqB,UAAU,CAAC,GAAGA,UAAU,GAAG,EAAG;QACnJ,iBAAerB,kBAAmB;QAClC,IAAI,EAAC,SAAS;QAEd,GAAG,EAAEI,aAAc;QAAC,OAAO,EAAE,WAAY;QAAC,KAAK,EAAE,UAAW;QAAC,MAAM,EAAE,kBAAM,CAAC,CAAE;QAAA,uBAC9E,KAAC,WAAW,CAAC,cAAc;UAAC,IAAI,EAAC;QAAM;MAAE,EAC9B,eACb,KAAC,OAAO;QACN,cAAc,EAAEJ,kBAAkB,GAAG,eAAgB;QACrD,YAAY,EAAEqB,UAAW;QACzB,aAAa,EAAEG,gBAAiB;QAChC,aAAa,EAAED,aAAc;QAC7B,GAAG,EAAEV,qBAAsB;QAC3B,kBAAkB,EAAE,4BAACkC,IAAI,EAAEoB,KAAK,EAAK;UACnCK,OAAO,CAACC,GAAG,CAAC1B,IAAI,CAAC;UACjByB,OAAO,CAACC,GAAG,CAACN,KAAK,CAAC;UAClB,IAAIA,KAAK,EAAE7C,eAAe,CAACyB,IAAI,CAAC,CAAC,KAC5B,IAAIA,IAAI,IAAI1B,UAAU,EAAEC,eAAe,CAAC,EAAE,CAAC;QAClD,CAAE;QACF,QAAQ,EAAE,CAACtB,kBAAkB,CAAE;QAC/B,IAAI,EAAE;UAAEE,KAAK,EAAEA,KAAK,CAACqE,KAAK,CAAC9D,oBAAoB,GAAG,CAAC,CAAC;UAAEyB,EAAE,EAAElC;QAAmB,CAAE;QAC/E,QAAQ,EAAE,IAAK;QACf,KAAK,EAAE,CAAE;QACT,wBAAwB,EAAEM;MAAyB,EACnD;IAAA,EAEL;EAAA,EACY;AAEnB,CAAC;AAAC;EAtMAJ,KAAK;AAAA;AAwMP,eAAeD,QAAQ"}
+{"version":3,"file":"MainMenu.js","names":["React","NavLink","styled","NavItem","SystemIcons","COLORS","BREAKPOINTS","Menu","SubMenu","IconButton","defaultOnMouseDownHandler","NavItemDiv","checkIfContainsItem","NavContainer","div","MEDIUM","LARGE","NavButton","button","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","SubMenuWrapper","topLevel","ExtendedMenuOption","MainMenu","items","rightSideRef","menuButtonRef","useRef","dropdownMenusOpenedArray","mainMenuRef","useState","numberOfItemsAllowed","setNumberOfItemsAllowed","forceUpdate","activeItem","setActiveItemId","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","onMouseLeave","event","id","filter","x","onMouseEnter","existingRefForId","find","useEffect","window","addEventListener","removeEventListener","length","onFocus","renderItem","item","index","type","icon","to","exact","disabled","external","action","label","note","pinned","rest","e","existingRef","onClick","onKeyDown","key","code","position","state","map","slice"],"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { NavLink, useLocation } from 'react-router-dom';\nimport styled from 'styled-components';\n\nimport { NavItem } from '../../NavItem';\nimport {SystemIcons} from '../../icons';\nimport { COLORS, BREAKPOINTS } from '../../styles';\nimport ExtendedMainMenu, { Menu, MenuSection, MenuSectionList } from './ExtendedMainMenu';\nimport { SubMenu } from './SubMenu';\nimport { IconButton } from '../../Button';\nimport { defaultOnMouseDownHandler } from '../../common';\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\nimport { DropdownContent } from '../../Dropdown';\nimport { VerticalTabEntry, VerticalTabs } from '../../Tabs';\nimport { Size } from '../../types';\nimport Tabs from '../../Tabs/Tabs';\nimport TabLink from '../../Tabs/TabLink';\nimport { MenuItem } from '../../MenuItem';\nimport { NavItemDiv } from '../../NavItem/NavItem';\nimport { checkIfContainsItem } from '../utils';\n\nconst NavContainer = styled.div`\n  display: none;\n  flex-grow: 1;\n  justify-content: flex-start;\n  align-items: center;\n  \n  padding: 0 16px;\n\n  ${BREAKPOINTS.MEDIUM} {\n    display: flex;\n  }\n  \n  ${NavItemDiv} {\n    cursor: pointer;\n  }\n  ${BREAKPOINTS.LARGE} {\n    padding: 0 32px;\n  }\n\n  a {\n    text-decoration: none;\n  }\n`;\n\nconst NavButton = styled.button`\n  background: ${COLORS.white};\n  border: 0;\n`;\n\ninterface ExtendedMenuWrapperProps {\n  floatRight: boolean;\n}\n\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\n  display: flex;\n  margin-left: ${(props) => (props.floatRight ? 'auto' : 'unset')};\n\n  position: absolute;\n  flex-direction: column;\n  left: 290px;\n  top: 22px;\n\n  height: 0;\n  width: 0;\n\n  &:focus-within,\n  &:hover,\n  &.open {\n    background: ${COLORS.white};\n  }\n`;\n\nconst ExtendedSection = styled.div`\n  position: relative;\n`;\n\nconst SubMenuWrapper = styled.div<{ topLevel: boolean }>`\n  ${Menu} {\n    top: ${(props) => (props.topLevel ? '100%' : '0px')};\n    left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\n  }\n\n  button {\n    padding-left: 0px;\n  }\n`;\n\nconst ExtendedMenuOption = 'extendedOption';\n\ntype Props = {\n  items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\n  rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;\n};\n\nconst MainMenu = ({ items, rightSideRef }: Props): React.ReactElement<Props> => {\n  const menuButtonRef = React.useRef<HTMLButtonElement>(null);\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\n  const dropdownMenusOpenedArray = React.useRef<string[]>([]);\n  const mainMenuRef: React.RefObject<HTMLDivElement> | null | undefined = React.useRef(null);\n  const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\n  const [, forceUpdate] = React.useState({});\n  const [activeItem, setActiveItemId] = React.useState<string>('');\n\n  const widthOfItem = 120;\n  const recalculateNumberOfItemsAllowed = () => {\n    if (rightSideRef?.current && mainMenuRef?.current) {\n      const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\n      if (number !== numberOfItemsAllowed) {\n        setNumberOfItemsAllowed(number);\n      }\n    }\n  };\n\n  const onMouseLeave = (event: any, id: string) => {\n    dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\n    //just trigger rerendering\n    forceUpdate({});\n  };\n\n  const onMouseEnter = (event: any, id: string) => {\n    const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\n    if (existingRefForId == null) {\n      dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\n      //just trigger rerendering\n      forceUpdate({});\n    }\n  };\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n    // Bind the event listener\n    window.addEventListener('resize', recalculateNumberOfItemsAllowed);\n    return () => {\n      // Unbind the event listener on clean up\n      window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\n    };\n  }, []);\n\n  React.useEffect(() => {\n    recalculateNumberOfItemsAllowed();\n  }, [items.length]);\n\n  const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {\n    //no open dropdowns if top level was entered\n    dropdownMenusOpenedArray.current = [];\n    forceUpdate({});\n  }\n\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup, index: number) => {\n    if (index > numberOfItemsAllowed - 2) return null;\n    if (item.type != 'desktopgroup') {\n      const { icon, to, exact, disabled, external, action, label, note, pinned, ...rest } = item as MenuNavigationItemTypeItem;\n      return item?.disabled ? (\n        <NavItem as={NavButton}  className=\"disabled\" key={item.label} onMouseDown={defaultOnMouseDownHandler}>\n          {item?.label}\n        </NavItem>\n      ) : (\n        <NavItem as={NavLink} onFocus={onFocus} to={to || ''} key={label} onMouseDown={defaultOnMouseDownHandler} onClick={(e: React.MouseEvent) => action && action(e)} {...rest}>\n          {item?.label}\n        </NavItem>\n      );\n    } else {\n      const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\n      const onClick = () => {\n        if (existingRef == null) {\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\n          //just trigger rerendering\n          forceUpdate({});\n        }\n      };\n      const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if(event.key == 'Enter' || event.code == 'Space')\n        {\n          dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, item.id];\n          //just trigger rerendering\n          forceUpdate({});\n        }\n      }\n\n      return (\n        <div style={{ position: 'relative' }} onMouseEnter={(event) => onMouseEnter(event, item.id ?? '')} onMouseLeave={(event) => onMouseLeave(event, item.id ?? '')}>\n          <NavItem onFocus={onFocus} onKeyDown={onKeyDown} tabIndex={0} className={(existingRef != null || checkIfContainsItem(item, activeItem) ) ? 'active' : ''} key={item.label} to={null} onClick={onClick}>\n            {item?.label} <SystemIcons.ArrowDropDown size=\"24px\" />\n          </NavItem>\n          <SubMenu\n            activeItemId={activeItem}\n            nestPath={[item.id]}\n            onItemStateChanged={(item, state) => {\n              if (state) {\n                setActiveItemId(item);\n              } else if(item == activeItem)\n                setActiveItemId('');\n            }}\n            item={item as MenuNavigationItemTypeDesktopGroup}\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\n            index={index + 1}\n            topLevel={true}\n          />\n        </div>\n      );\n    }\n  };\n\n  return (\n    <NavContainer role=\"navigation\" aria-label=\"Global Navigation\" className=\"GlobalNavigationMainMenu\" ref={mainMenuRef}>\n      {items?.map(renderItem)}\n      {items.length + 1 > numberOfItemsAllowed && (\n        <ExtendedSection onMouseEnter={(event) => onMouseEnter(event, ExtendedMenuOption)} onMouseLeave={(event) => onMouseLeave(event, ExtendedMenuOption)}>\n          <IconButton ref={menuButtonRef} variant={'secondary'} shape={'circular'} action={() => {}}>\n            <SystemIcons.MoreHorizontal size=\"24px\"/>\n          </IconButton>\n          <SubMenu\n            activeItemId={activeItem}\n            onItemStateChanged={(item, state) => {\n              if (state)\n                setActiveItemId(item);\n              else if(item == activeItem)\n                setActiveItemId('');\n            }}\n            item={{ items: items.slice(numberOfItemsAllowed - 1), id: ExtendedMenuOption }}\n            topLevel={true}\n            index={0}\n            dropdownMenusOpenedArray={dropdownMenusOpenedArray}\n          />\n        </ExtendedSection>\n      )}\n    </NavContainer>\n  );\n};\n\nexport default MainMenu;\n"],"mappings":"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"}