@laerdal/life-react-components 3.5.2 → 3.5.3

package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.cjs

@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.flowDown = exports["default"] = exports.MenuSectionList = exports.MenuSection = exports.Menu = void 0;
+exports.flowDown = exports.default = exports.MenuSectionList = exports.MenuSection = exports.Menu = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -16,26 +16,22 @@ var _Tabs = require("../../Tabs");
 var _index = require("../../index");
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
-var flowDown = (0, _styledComponents.keyframes)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  0% {\n    opacity: 0;\n    transform: translateY(-10px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n"])));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var flowDown = (0, _styledComponents.keyframes)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  0% {\n    opacity: 0;\n    transform: translateY(-10px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n"])));
 exports.flowDown = flowDown;
-var Menu = _styledComponents["default"].ul(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: none;\n  right: -8px;\n  min-width: 300px;\n  -webkit-animation: ", " 0.2s ease-in-out;\n  animation: ", " 0.2s ease-in-out;\n  position: absolute;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);\n  border-radius: 4px;\n  z-index: ", ";\n\n  top: 12px;\n  ", " {\n    top: 18px;\n  }\n  ", " {\n    top: 24px;\n  }\n\n  .open & {\n    display: block;\n  }\n\n  &:focus {\n    ", "\n  }\n"])), function (props) {
-  return _styles.COLORS.getColor('white', props.theme);
-}, flowDown, flowDown, _styles.Z_INDEXES.dropdown, _styles.BREAKPOINTS.SMALL, _styles.BREAKPOINTS.MEDIUM, _styles.focusStyles);
+var Menu = _styledComponents.default.ul(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: none;\n  right: -8px;\n  min-width: 300px;\n  -webkit-animation: ", " 0.2s ease-in-out;\n  animation: ", " 0.2s ease-in-out;\n  position: absolute;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);\n  border-radius: 4px;\n  z-index: ", ";\n\n  top: 12px;\n  ", " {\n    top: 18px;\n  }\n  ", " {\n    top: 24px;\n  }\n\n  .open & {\n    display: block;\n  }\n\n  &:focus {\n    ", "\n  }\n"])), _styles.COLORS.white, flowDown, flowDown, _styles.Z_INDEXES.dropdown, _styles.BREAKPOINTS.SMALL, _styles.BREAKPOINTS.MEDIUM, _styles.focusStyles);
 exports.Menu = Menu;
-var MenuSection = _styledComponents["default"].li(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n  padding: 8px 0;\n  position: relative;\n\n  &:not(:first-of-type)::before {\n    content: '';\n    position: absolute;\n    background: ", ";\n    height: 1px;\n    top: 0;\n    left: 16px;\n    right: 16px;\n  }\n"])), function (props) {
-  return _styles.COLORS.getColor('neutral_100', props.theme);
-});
+var MenuSection = _styledComponents.default.li(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  padding: 8px 0;\n  position: relative;\n\n  &:not(:first-of-type)::before {\n    content: '';\n    position: absolute;\n    background: ", ";\n    height: 1px;\n    top: 0;\n    left: 16px;\n    right: 16px;\n  }\n"])), _styles.COLORS.neutral_100);
 exports.MenuSection = MenuSection;
-var MenuSectionList = _styledComponents["default"].ul(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n  list-style: none;\n  margin: 0;\n  padding: 0 2px;\n"])));
+var MenuSectionList = _styledComponents.default.ul(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  list-style: none;\n  margin: 0;\n  padding: 0 2px;\n"])));
 exports.MenuSectionList = MenuSectionList;
 var ExtendedMainMenu = function ExtendedMainMenu(_ref) {
   var clickMenuAction = _ref.clickMenuAction,
     navigationOptions = _ref.navigationOptions;
   console.log(navigationOptions);
   var _React$useState = React.useState([]),
-    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
     entries = _React$useState2[0],
     setEntries = _React$useState2[1];
   React.useEffect(function () {
@@ -76,9 +72,9 @@ var ExtendedMainMenu = function ExtendedMainMenu(_ref) {
   });
 };
 ExtendedMainMenu.propTypes = {
-  clickMenuAction: _propTypes["default"].func.isRequired,
-  navigationOptions: _propTypes["default"].array.isRequired
+  clickMenuAction: _propTypes.default.func.isRequired,
+  navigationOptions: _propTypes.default.array.isRequired
 };
 var _default = ExtendedMainMenu;
-exports["default"] = _default;
+exports.default = _default;
 //# sourceMappingURL=ExtendedMainMenu.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"ExtendedMainMenu.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_styles","_Tabs","_index","_jsxRuntime","_templateObject","_templateObject2","_templateObject3","_templateObject4","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","flowDown","keyframes","_taggedTemplateLiteral2","exports","Menu","styled","ul","props","COLORS","getColor","theme","Z_INDEXES","dropdown","BREAKPOINTS","SMALL","MEDIUM","focusStyles","MenuSection","li","MenuSectionList","ExtendedMainMenu","_ref","clickMenuAction","navigationOptions","console","log","_React$useState","useState","_React$useState2","_slicedToArray2","entries","setEntries","useEffect","handleKeyPress","keyCode","document","addEventListener","removeEventListener","list","map","requiredLine","label","to","disabled","onClick","action","exact","jsx","role","children","VerticalTabs","size","Size","Medium","propTypes","_propTypes","func","isRequired","array","_default"],"sources":["../../../src/GlobalNavigationBar/desktop/ExtendedMainMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { keyframes } from 'styled-components';\r\n\r\nimport { BREAKPOINTS, COLORS, focusStyles } from '../../styles';\r\nimport { VerticalTabs } from '../../Tabs';\r\nimport { VerticalTabEntry } from '../../Tabs';\r\nimport {MenuNavigationItemTypeItem, Size} from '../../index';\r\nimport {Z_INDEXES} from '../../styles';\r\n\r\nexport const flowDown = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    transform: translateY(-10px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n`;\r\n\r\nexport const Menu = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0;\r\n  background-color: ${props => COLORS.getColor('white', props.theme)};\r\n  box-sizing: border-box;\r\n  display: none;\r\n  right: -8px;\r\n  min-width: 300px;\r\n  -webkit-animation: ${flowDown} 0.2s ease-in-out;\r\n  animation: ${flowDown} 0.2s ease-in-out;\r\n  position: absolute;\r\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);\r\n  border-radius: 4px;\r\n  z-index: ${Z_INDEXES.dropdown};\r\n\r\n  top: 12px;\r\n  ${BREAKPOINTS.SMALL} {\r\n    top: 18px;\r\n  }\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    top: 24px;\r\n  }\r\n\r\n  .open & {\r\n    display: block;\r\n  }\r\n\r\n  &:focus {\r\n    ${focusStyles}\r\n  }\r\n`;\r\n\r\nexport const MenuSection = styled.li`\r\n  padding: 8px 0;\r\n  position: relative;\r\n\r\n  &:not(:first-of-type)::before {\r\n    content: '';\r\n    position: absolute;\r\n    background: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n    height: 1px;\r\n    top: 0;\r\n    left: 16px;\r\n    right: 16px;\r\n  }\r\n`;\r\n\r\nexport const MenuSectionList = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0 2px;\r\n`;\r\n\r\ntype Props = {\r\n  clickMenuAction: () => void;\r\n  navigationOptions: MenuNavigationItemTypeItem[];\r\n};\r\n\r\nconst ExtendedMainMenu = ({ clickMenuAction, navigationOptions }: Props) => {\r\n  console.log(navigationOptions);\r\n  const [entries, setEntries] = React.useState<VerticalTabEntry[]>([]);\r\n  React.useEffect(() => {\r\n    function handleKeyPress(e: any) {\r\n      if (e.keyCode === 27) {\r\n        clickMenuAction();\r\n      }\r\n    }\r\n\r\n    document.addEventListener('keydown', handleKeyPress, false);\r\n    return () => {\r\n      document.removeEventListener('keydown', handleKeyPress, false);\r\n    };\r\n  }, [clickMenuAction]);\r\n\r\n  React.useEffect(() => {\r\n    const list = navigationOptions?.map(n => {\r\n      return { requiredLine: n.label, to: n.to, disabled: n.disabled, onClick: n.action, exact: n.exact };\r\n    }) as VerticalTabEntry[];\r\n    setEntries(list);\r\n  }, [navigationOptions]);\r\n\r\n  return (\r\n    <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\r\n      <MenuSection>\r\n        <MenuSectionList>\r\n          <VerticalTabs key=\"ExtendedMenu\" entries={entries} size={Size.Medium} />\r\n        </MenuSectionList>\r\n      </MenuSection>\r\n    </Menu>\r\n  );\r\n};\r\n\r\nexport default ExtendedMainMenu;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ExtendedMainMenu.cjs","names":["flowDown","keyframes","Menu","styled","ul","COLORS","white","Z_INDEXES","dropdown","BREAKPOINTS","SMALL","MEDIUM","focusStyles","MenuSection","li","neutral_100","MenuSectionList","ExtendedMainMenu","clickMenuAction","navigationOptions","console","log","React","useState","entries","setEntries","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","list","map","n","requiredLine","label","to","disabled","onClick","action","exact","Size","Medium"],"sources":["../../../src/GlobalNavigationBar/desktop/ExtendedMainMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { keyframes } from 'styled-components';\r\n\r\nimport { BREAKPOINTS, COLORS, focusStyles } from '../../styles';\r\nimport { VerticalTabs } from '../../Tabs';\r\nimport { VerticalTabEntry } from '../../Tabs';\r\nimport {MenuNavigationItemTypeItem, Size} from '../../index';\r\nimport {Z_INDEXES} from '../../styles';\r\n\r\nexport const flowDown = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    transform: translateY(-10px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n`;\r\n\r\nexport const Menu = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0;\r\n  background-color: ${COLORS.white};\r\n  box-sizing: border-box;\r\n  display: none;\r\n  right: -8px;\r\n  min-width: 300px;\r\n  -webkit-animation: ${flowDown} 0.2s ease-in-out;\r\n  animation: ${flowDown} 0.2s ease-in-out;\r\n  position: absolute;\r\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);\r\n  border-radius: 4px;\r\n  z-index: ${Z_INDEXES.dropdown};\r\n\r\n  top: 12px;\r\n  ${BREAKPOINTS.SMALL} {\r\n    top: 18px;\r\n  }\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    top: 24px;\r\n  }\r\n\r\n  .open & {\r\n    display: block;\r\n  }\r\n\r\n  &:focus {\r\n    ${focusStyles}\r\n  }\r\n`;\r\n\r\nexport const MenuSection = styled.li`\r\n  padding: 8px 0;\r\n  position: relative;\r\n\r\n  &:not(:first-of-type)::before {\r\n    content: '';\r\n    position: absolute;\r\n    background: ${COLORS.neutral_100};\r\n    height: 1px;\r\n    top: 0;\r\n    left: 16px;\r\n    right: 16px;\r\n  }\r\n`;\r\n\r\nexport const MenuSectionList = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0 2px;\r\n`;\r\n\r\ntype Props = {\r\n  clickMenuAction: () => void;\r\n  navigationOptions: MenuNavigationItemTypeItem[];\r\n};\r\n\r\nconst ExtendedMainMenu = ({ clickMenuAction, navigationOptions }: Props) => {\r\n  console.log(navigationOptions);\r\n  const [entries, setEntries] = React.useState<VerticalTabEntry[]>([]);\r\n  React.useEffect(() => {\r\n    function handleKeyPress(e: any) {\r\n      if (e.keyCode === 27) {\r\n        clickMenuAction();\r\n      }\r\n    }\r\n\r\n    document.addEventListener('keydown', handleKeyPress, false);\r\n    return () => {\r\n      document.removeEventListener('keydown', handleKeyPress, false);\r\n    };\r\n  }, [clickMenuAction]);\r\n\r\n  React.useEffect(() => {\r\n    const list = navigationOptions?.map(n => {\r\n      return { requiredLine: n.label, to: n.to, disabled: n.disabled, onClick: n.action, exact: n.exact };\r\n    }) as VerticalTabEntry[];\r\n    setEntries(list);\r\n  }, [navigationOptions]);\r\n\r\n  return (\r\n    <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\r\n      <MenuSection>\r\n        <MenuSectionList>\r\n          <VerticalTabs key=\"ExtendedMenu\" entries={entries} size={Size.Medium} />\r\n        </MenuSectionList>\r\n      </MenuSection>\r\n    </Menu>\r\n  );\r\n};\r\n\r\nexport default ExtendedMainMenu;\r\n"],"mappings":";;;;;;;;;;;AAAA;AACA;AAEA;AACA;AAEA;AAA6D;AAAA;AAAA;AAAA;AAGtD,IAAMA,QAAQ,OAAGC,2BAAS,oNAShC;AAAC;AAEK,IAAMC,IAAI,GAAGC,yBAAM,CAACC,EAAE,8kBAIPC,cAAM,CAACC,KAAK,EAKXN,QAAQ,EAChBA,QAAQ,EAIVO,iBAAS,CAACC,QAAQ,EAG3BC,mBAAW,CAACC,KAAK,EAGjBD,mBAAW,CAACE,MAAM,EAShBC,mBAAW,CAEhB;AAAC;AAEK,IAAMC,WAAW,GAAGV,yBAAM,CAACW,EAAE,gTAOlBT,cAAM,CAACU,WAAW,CAMnC;AAAC;AAEK,IAAMC,eAAe,GAAGb,yBAAM,CAACC,EAAE,6IAIvC;AAAC;AAOF,IAAMa,gBAAgB,GAAG,SAAnBA,gBAAgB,OAAsD;EAAA,IAAhDC,eAAe,QAAfA,eAAe;IAAEC,iBAAiB,QAAjBA,iBAAiB;EAC5DC,OAAO,CAACC,GAAG,CAACF,iBAAiB,CAAC;EAC9B,sBAA8BG,KAAK,CAACC,QAAQ,CAAqB,EAAE,CAAC;IAAA;IAA7DC,OAAO;IAAEC,UAAU;EAC1BH,KAAK,CAACI,SAAS,CAAC,YAAM;IACpB,SAASC,cAAc,CAACC,CAAM,EAAE;MAC9B,IAAIA,CAAC,CAACC,OAAO,KAAK,EAAE,EAAE;QACpBX,eAAe,EAAE;MACnB;IACF;IAEAY,QAAQ,CAACC,gBAAgB,CAAC,SAAS,EAAEJ,cAAc,EAAE,KAAK,CAAC;IAC3D,OAAO,YAAM;MACXG,QAAQ,CAACE,mBAAmB,CAAC,SAAS,EAAEL,cAAc,EAAE,KAAK,CAAC;IAChE,CAAC;EACH,CAAC,EAAE,CAACT,eAAe,CAAC,CAAC;EAErBI,KAAK,CAACI,SAAS,CAAC,YAAM;IACpB,IAAMO,IAAI,GAAGd,iBAAiB,aAAjBA,iBAAiB,uBAAjBA,iBAAiB,CAAEe,GAAG,CAAC,UAAAC,CAAC,EAAI;MACvC,OAAO;QAAEC,YAAY,EAAED,CAAC,CAACE,KAAK;QAAEC,EAAE,EAAEH,CAAC,CAACG,EAAE;QAAEC,QAAQ,EAAEJ,CAAC,CAACI,QAAQ;QAAEC,OAAO,EAAEL,CAAC,CAACM,MAAM;QAAEC,KAAK,EAAEP,CAAC,CAACO;MAAM,CAAC;IACrG,CAAC,CAAuB;IACxBjB,UAAU,CAACQ,IAAI,CAAC;EAClB,CAAC,EAAE,CAACd,iBAAiB,CAAC,CAAC;EAEvB,oBACE,qBAAC,IAAI;IAAC,OAAO,EAAED,eAAgB;IAAC,IAAI,EAAC,MAAM;IAAC,mBAAgB,gBAAgB;IAAA,uBAC1E,qBAAC,WAAW;MAAA,uBACV,qBAAC,eAAe;QAAA,uBACd,qBAAC,kBAAY;UAAoB,OAAO,EAAEM,OAAQ;UAAC,IAAI,EAAEmB,WAAI,CAACC;QAAO,GAAnD,cAAc;MAAwC;IACxD;EACN,EACT;AAEX,CAAC;AAAC;EApCA1B,eAAe;EACfC,iBAAiB;AAAA;AAAA,eAqCJF,gBAAgB;AAAA"}

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+/// <reference types="react" />
 import { MenuNavigationItemTypeItem } from '../../index';
 export declare const flowDown: import("styled-components").Keyframes;
 export declare const Menu: import("styled-components").StyledComponent<"ul", any, {}, never>;
@@ -8,5 +8,5 @@ type Props = {
     clickMenuAction: () => void;
     navigationOptions: MenuNavigationItemTypeItem[];
 };
-declare const ExtendedMainMenu: ({ clickMenuAction, navigationOptions }: Props) => React.JSX.Element;
+declare const ExtendedMainMenu: ({ clickMenuAction, navigationOptions }: Props) => JSX.Element;
 export default ExtendedMainMenu;

package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.js

@@ -10,12 +10,8 @@ import { Size } from '../../index';
 import { Z_INDEXES } from '../../styles';
 import { jsx as _jsx } from "react/jsx-runtime";
 export var flowDown = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  0% {\n    opacity: 0;\n    transform: translateY(-10px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n"])));
-export var Menu = styled.ul(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: none;\n  right: -8px;\n  min-width: 300px;\n  -webkit-animation: ", " 0.2s ease-in-out;\n  animation: ", " 0.2s ease-in-out;\n  position: absolute;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);\n  border-radius: 4px;\n  z-index: ", ";\n\n  top: 12px;\n  ", " {\n    top: 18px;\n  }\n  ", " {\n    top: 24px;\n  }\n\n  .open & {\n    display: block;\n  }\n\n  &:focus {\n    ", "\n  }\n"])), function (props) {
-  return COLORS.getColor('white', props.theme);
-}, flowDown, flowDown, Z_INDEXES.dropdown, BREAKPOINTS.SMALL, BREAKPOINTS.MEDIUM, focusStyles);
-export var MenuSection = styled.li(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  padding: 8px 0;\n  position: relative;\n\n  &:not(:first-of-type)::before {\n    content: '';\n    position: absolute;\n    background: ", ";\n    height: 1px;\n    top: 0;\n    left: 16px;\n    right: 16px;\n  }\n"])), function (props) {
-  return COLORS.getColor('neutral_100', props.theme);
-});
+export var Menu = styled.ul(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: none;\n  right: -8px;\n  min-width: 300px;\n  -webkit-animation: ", " 0.2s ease-in-out;\n  animation: ", " 0.2s ease-in-out;\n  position: absolute;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);\n  border-radius: 4px;\n  z-index: ", ";\n\n  top: 12px;\n  ", " {\n    top: 18px;\n  }\n  ", " {\n    top: 24px;\n  }\n\n  .open & {\n    display: block;\n  }\n\n  &:focus {\n    ", "\n  }\n"])), COLORS.white, flowDown, flowDown, Z_INDEXES.dropdown, BREAKPOINTS.SMALL, BREAKPOINTS.MEDIUM, focusStyles);
+export var MenuSection = styled.li(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  padding: 8px 0;\n  position: relative;\n\n  &:not(:first-of-type)::before {\n    content: '';\n    position: absolute;\n    background: ", ";\n    height: 1px;\n    top: 0;\n    left: 16px;\n    right: 16px;\n  }\n"])), COLORS.neutral_100);
 export var MenuSectionList = styled.ul(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  list-style: none;\n  margin: 0;\n  padding: 0 2px;\n"])));
 var ExtendedMainMenu = function ExtendedMainMenu(_ref) {
   var clickMenuAction = _ref.clickMenuAction,

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

@@ -1 +1 @@
-{"version":3,"file":"ExtendedMainMenu.js","names":["React","styled","keyframes","BREAKPOINTS","COLORS","focusStyles","VerticalTabs","Size","Z_INDEXES","jsx","_jsx","flowDown","_templateObject","_taggedTemplateLiteral","Menu","ul","_templateObject2","props","getColor","theme","dropdown","SMALL","MEDIUM","MenuSection","li","_templateObject3","MenuSectionList","_templateObject4","ExtendedMainMenu","_ref","clickMenuAction","navigationOptions","console","log","_React$useState","useState","_React$useState2","_slicedToArray","entries","setEntries","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","list","map","n","requiredLine","label","to","disabled","onClick","action","exact","role","children","size","Medium","propTypes","_pt","func","isRequired","array"],"sources":["../../../src/GlobalNavigationBar/desktop/ExtendedMainMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { keyframes } from 'styled-components';\r\n\r\nimport { BREAKPOINTS, COLORS, focusStyles } from '../../styles';\r\nimport { VerticalTabs } from '../../Tabs';\r\nimport { VerticalTabEntry } from '../../Tabs';\r\nimport {MenuNavigationItemTypeItem, Size} from '../../index';\r\nimport {Z_INDEXES} from '../../styles';\r\n\r\nexport const flowDown = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    transform: translateY(-10px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n`;\r\n\r\nexport const Menu = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0;\r\n  background-color: ${props => COLORS.getColor('white', props.theme)};\r\n  box-sizing: border-box;\r\n  display: none;\r\n  right: -8px;\r\n  min-width: 300px;\r\n  -webkit-animation: ${flowDown} 0.2s ease-in-out;\r\n  animation: ${flowDown} 0.2s ease-in-out;\r\n  position: absolute;\r\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);\r\n  border-radius: 4px;\r\n  z-index: ${Z_INDEXES.dropdown};\r\n\r\n  top: 12px;\r\n  ${BREAKPOINTS.SMALL} {\r\n    top: 18px;\r\n  }\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    top: 24px;\r\n  }\r\n\r\n  .open & {\r\n    display: block;\r\n  }\r\n\r\n  &:focus {\r\n    ${focusStyles}\r\n  }\r\n`;\r\n\r\nexport const MenuSection = styled.li`\r\n  padding: 8px 0;\r\n  position: relative;\r\n\r\n  &:not(:first-of-type)::before {\r\n    content: '';\r\n    position: absolute;\r\n    background: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n    height: 1px;\r\n    top: 0;\r\n    left: 16px;\r\n    right: 16px;\r\n  }\r\n`;\r\n\r\nexport const MenuSectionList = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0 2px;\r\n`;\r\n\r\ntype Props = {\r\n  clickMenuAction: () => void;\r\n  navigationOptions: MenuNavigationItemTypeItem[];\r\n};\r\n\r\nconst ExtendedMainMenu = ({ clickMenuAction, navigationOptions }: Props) => {\r\n  console.log(navigationOptions);\r\n  const [entries, setEntries] = React.useState<VerticalTabEntry[]>([]);\r\n  React.useEffect(() => {\r\n    function handleKeyPress(e: any) {\r\n      if (e.keyCode === 27) {\r\n        clickMenuAction();\r\n      }\r\n    }\r\n\r\n    document.addEventListener('keydown', handleKeyPress, false);\r\n    return () => {\r\n      document.removeEventListener('keydown', handleKeyPress, false);\r\n    };\r\n  }, [clickMenuAction]);\r\n\r\n  React.useEffect(() => {\r\n    const list = navigationOptions?.map(n => {\r\n      return { requiredLine: n.label, to: n.to, disabled: n.disabled, onClick: n.action, exact: n.exact };\r\n    }) as VerticalTabEntry[];\r\n    setEntries(list);\r\n  }, [navigationOptions]);\r\n\r\n  return (\r\n    <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\r\n      <MenuSection>\r\n        <MenuSectionList>\r\n          <VerticalTabs key=\"ExtendedMenu\" entries={entries} size={Size.Medium} />\r\n        </MenuSectionList>\r\n      </MenuSection>\r\n    </Menu>\r\n  );\r\n};\r\n\r\nexport default ExtendedMainMenu;\r\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,IAAIC,SAAS,QAAQ,mBAAmB;AAErD,SAASC,WAAW,EAAEC,MAAM,EAAEC,WAAW,QAAQ,cAAc;AAC/D,SAASC,YAAY,QAAQ,YAAY;AAEzC,SAAoCC,IAAI,QAAO,aAAa;AAC5D,SAAQC,SAAS,QAAO,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEvC,OAAO,IAAMC,QAAQ,GAAGT,SAAS,CAAAU,eAAA,KAAAA,eAAA,GAAAC,sBAAA,wIAShC;AAED,OAAO,IAAMC,IAAI,GAAGb,MAAM,CAACc,EAAE,CAAAC,gBAAA,KAAAA,gBAAA,GAAAH,sBAAA,igBAIP,UAAAI,KAAK;EAAA,OAAIb,MAAM,CAACc,QAAQ,CAAC,OAAO,EAAED,KAAK,CAACE,KAAK,CAAC;AAAA,GAK7CR,QAAQ,EAChBA,QAAQ,EAIVH,SAAS,CAACY,QAAQ,EAG3BjB,WAAW,CAACkB,KAAK,EAGjBlB,WAAW,CAACmB,MAAM,EAShBjB,WAAW,CAEhB;AAED,OAAO,IAAMkB,WAAW,GAAGtB,MAAM,CAACuB,EAAE,CAAAC,gBAAA,KAAAA,gBAAA,GAAAZ,sBAAA,mOAOlB,UAAAI,KAAK;EAAA,OAAIb,MAAM,CAACc,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AAAA,EAMrE;AAED,OAAO,IAAMO,eAAe,GAAGzB,MAAM,CAACc,EAAE,CAAAY,gBAAA,KAAAA,gBAAA,GAAAd,sBAAA,gEAIvC;AAOD,IAAMe,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAAC,IAAA,EAAsD;EAAA,IAAhDC,eAAe,GAAAD,IAAA,CAAfC,eAAe;IAAEC,iBAAiB,GAAAF,IAAA,CAAjBE,iBAAiB;EAC5DC,OAAO,CAACC,GAAG,CAACF,iBAAiB,CAAC;EAC9B,IAAAG,eAAA,GAA8BlC,KAAK,CAACmC,QAAQ,CAAqB,EAAE,CAAC;IAAAC,gBAAA,GAAAC,cAAA,CAAAH,eAAA;IAA7DI,OAAO,GAAAF,gBAAA;IAAEG,UAAU,GAAAH,gBAAA;EAC1BpC,KAAK,CAACwC,SAAS,CAAC,YAAM;IACpB,SAASC,cAAcA,CAACC,CAAM,EAAE;MAC9B,IAAIA,CAAC,CAACC,OAAO,KAAK,EAAE,EAAE;QACpBb,eAAe,CAAC,CAAC;MACnB;IACF;IAEAc,QAAQ,CAACC,gBAAgB,CAAC,SAAS,EAAEJ,cAAc,EAAE,KAAK,CAAC;IAC3D,OAAO,YAAM;MACXG,QAAQ,CAACE,mBAAmB,CAAC,SAAS,EAAEL,cAAc,EAAE,KAAK,CAAC;IAChE,CAAC;EACH,CAAC,EAAE,CAACX,eAAe,CAAC,CAAC;EAErB9B,KAAK,CAACwC,SAAS,CAAC,YAAM;IACpB,IAAMO,IAAI,GAAGhB,iBAAiB,aAAjBA,iBAAiB,uBAAjBA,iBAAiB,CAAEiB,GAAG,CAAC,UAAAC,CAAC,EAAI;MACvC,OAAO;QAAEC,YAAY,EAAED,CAAC,CAACE,KAAK;QAAEC,EAAE,EAAEH,CAAC,CAACG,EAAE;QAAEC,QAAQ,EAAEJ,CAAC,CAACI,QAAQ;QAAEC,OAAO,EAAEL,CAAC,CAACM,MAAM;QAAEC,KAAK,EAAEP,CAAC,CAACO;MAAM,CAAC;IACrG,CAAC,CAAuB;IACxBjB,UAAU,CAACQ,IAAI,CAAC;EAClB,CAAC,EAAE,CAAChB,iBAAiB,CAAC,CAAC;EAEvB,oBACErB,IAAA,CAACI,IAAI;IAACwC,OAAO,EAAExB,eAAgB;IAAC2B,IAAI,EAAC,MAAM;IAAC,mBAAgB,gBAAgB;IAAAC,QAAA,eAC1EhD,IAAA,CAACa,WAAW;MAAAmC,QAAA,eACVhD,IAAA,CAACgB,eAAe;QAAAgC,QAAA,eACdhD,IAAA,CAACJ,YAAY;UAAoBgC,OAAO,EAAEA,OAAQ;UAACqB,IAAI,EAAEpD,IAAI,CAACqD;QAAO,GAAnD,cAAqD;MAAC,CACzD;IAAC,CACP;EAAC,CACV,CAAC;AAEX,CAAC;AAAChC,gBAAA,CAAAiC,SAAA;EApCA/B,eAAe,EAAAgC,GAAA,CAAAC,IAAA,CAAAC,UAAA;EACfjC,iBAAiB,EAAA+B,GAAA,CAAAG,KAAA,CAAAD;AAAA;AAqCnB,eAAepC,gBAAgB","ignoreList":[]}
+{"version":3,"file":"ExtendedMainMenu.js","names":["React","styled","keyframes","BREAKPOINTS","COLORS","focusStyles","VerticalTabs","Size","Z_INDEXES","flowDown","Menu","ul","white","dropdown","SMALL","MEDIUM","MenuSection","li","neutral_100","MenuSectionList","ExtendedMainMenu","clickMenuAction","navigationOptions","console","log","useState","entries","setEntries","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","list","map","n","requiredLine","label","to","disabled","onClick","action","exact","Medium"],"sources":["../../../src/GlobalNavigationBar/desktop/ExtendedMainMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { keyframes } from 'styled-components';\r\n\r\nimport { BREAKPOINTS, COLORS, focusStyles } from '../../styles';\r\nimport { VerticalTabs } from '../../Tabs';\r\nimport { VerticalTabEntry } from '../../Tabs';\r\nimport {MenuNavigationItemTypeItem, Size} from '../../index';\r\nimport {Z_INDEXES} from '../../styles';\r\n\r\nexport const flowDown = keyframes`\r\n  0% {\r\n    opacity: 0;\r\n    transform: translateY(-10px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n`;\r\n\r\nexport const Menu = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0;\r\n  background-color: ${COLORS.white};\r\n  box-sizing: border-box;\r\n  display: none;\r\n  right: -8px;\r\n  min-width: 300px;\r\n  -webkit-animation: ${flowDown} 0.2s ease-in-out;\r\n  animation: ${flowDown} 0.2s ease-in-out;\r\n  position: absolute;\r\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);\r\n  border-radius: 4px;\r\n  z-index: ${Z_INDEXES.dropdown};\r\n\r\n  top: 12px;\r\n  ${BREAKPOINTS.SMALL} {\r\n    top: 18px;\r\n  }\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    top: 24px;\r\n  }\r\n\r\n  .open & {\r\n    display: block;\r\n  }\r\n\r\n  &:focus {\r\n    ${focusStyles}\r\n  }\r\n`;\r\n\r\nexport const MenuSection = styled.li`\r\n  padding: 8px 0;\r\n  position: relative;\r\n\r\n  &:not(:first-of-type)::before {\r\n    content: '';\r\n    position: absolute;\r\n    background: ${COLORS.neutral_100};\r\n    height: 1px;\r\n    top: 0;\r\n    left: 16px;\r\n    right: 16px;\r\n  }\r\n`;\r\n\r\nexport const MenuSectionList = styled.ul`\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0 2px;\r\n`;\r\n\r\ntype Props = {\r\n  clickMenuAction: () => void;\r\n  navigationOptions: MenuNavigationItemTypeItem[];\r\n};\r\n\r\nconst ExtendedMainMenu = ({ clickMenuAction, navigationOptions }: Props) => {\r\n  console.log(navigationOptions);\r\n  const [entries, setEntries] = React.useState<VerticalTabEntry[]>([]);\r\n  React.useEffect(() => {\r\n    function handleKeyPress(e: any) {\r\n      if (e.keyCode === 27) {\r\n        clickMenuAction();\r\n      }\r\n    }\r\n\r\n    document.addEventListener('keydown', handleKeyPress, false);\r\n    return () => {\r\n      document.removeEventListener('keydown', handleKeyPress, false);\r\n    };\r\n  }, [clickMenuAction]);\r\n\r\n  React.useEffect(() => {\r\n    const list = navigationOptions?.map(n => {\r\n      return { requiredLine: n.label, to: n.to, disabled: n.disabled, onClick: n.action, exact: n.exact };\r\n    }) as VerticalTabEntry[];\r\n    setEntries(list);\r\n  }, [navigationOptions]);\r\n\r\n  return (\r\n    <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\r\n      <MenuSection>\r\n        <MenuSectionList>\r\n          <VerticalTabs key=\"ExtendedMenu\" entries={entries} size={Size.Medium} />\r\n        </MenuSectionList>\r\n      </MenuSection>\r\n    </Menu>\r\n  );\r\n};\r\n\r\nexport default ExtendedMainMenu;\r\n"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,IAAIC,SAAS,QAAQ,mBAAmB;AAErD,SAASC,WAAW,EAAEC,MAAM,EAAEC,WAAW,QAAQ,cAAc;AAC/D,SAASC,YAAY,QAAQ,YAAY;AAEzC,SAAoCC,IAAI,QAAO,aAAa;AAC5D,SAAQC,SAAS,QAAO,cAAc;AAAC;AAEvC,OAAO,IAAMC,QAAQ,GAAGP,SAAS,qMAShC;AAED,OAAO,IAAMQ,IAAI,GAAGT,MAAM,CAACU,EAAE,gkBAIPP,MAAM,CAACQ,KAAK,EAKXH,QAAQ,EAChBA,QAAQ,EAIVD,SAAS,CAACK,QAAQ,EAG3BV,WAAW,CAACW,KAAK,EAGjBX,WAAW,CAACY,MAAM,EAShBV,WAAW,CAEhB;AAED,OAAO,IAAMW,WAAW,GAAGf,MAAM,CAACgB,EAAE,kSAOlBb,MAAM,CAACc,WAAW,CAMnC;AAED,OAAO,IAAMC,eAAe,GAAGlB,MAAM,CAACU,EAAE,+HAIvC;AAOD,IAAMS,gBAAgB,GAAG,SAAnBA,gBAAgB,OAAsD;EAAA,IAAhDC,eAAe,QAAfA,eAAe;IAAEC,iBAAiB,QAAjBA,iBAAiB;EAC5DC,OAAO,CAACC,GAAG,CAACF,iBAAiB,CAAC;EAC9B,sBAA8BtB,KAAK,CAACyB,QAAQ,CAAqB,EAAE,CAAC;IAAA;IAA7DC,OAAO;IAAEC,UAAU;EAC1B3B,KAAK,CAAC4B,SAAS,CAAC,YAAM;IACpB,SAASC,cAAc,CAACC,CAAM,EAAE;MAC9B,IAAIA,CAAC,CAACC,OAAO,KAAK,EAAE,EAAE;QACpBV,eAAe,EAAE;MACnB;IACF;IAEAW,QAAQ,CAACC,gBAAgB,CAAC,SAAS,EAAEJ,cAAc,EAAE,KAAK,CAAC;IAC3D,OAAO,YAAM;MACXG,QAAQ,CAACE,mBAAmB,CAAC,SAAS,EAAEL,cAAc,EAAE,KAAK,CAAC;IAChE,CAAC;EACH,CAAC,EAAE,CAACR,eAAe,CAAC,CAAC;EAErBrB,KAAK,CAAC4B,SAAS,CAAC,YAAM;IACpB,IAAMO,IAAI,GAAGb,iBAAiB,aAAjBA,iBAAiB,uBAAjBA,iBAAiB,CAAEc,GAAG,CAAC,UAAAC,CAAC,EAAI;MACvC,OAAO;QAAEC,YAAY,EAAED,CAAC,CAACE,KAAK;QAAEC,EAAE,EAAEH,CAAC,CAACG,EAAE;QAAEC,QAAQ,EAAEJ,CAAC,CAACI,QAAQ;QAAEC,OAAO,EAAEL,CAAC,CAACM,MAAM;QAAEC,KAAK,EAAEP,CAAC,CAACO;MAAM,CAAC;IACrG,CAAC,CAAuB;IACxBjB,UAAU,CAACQ,IAAI,CAAC;EAClB,CAAC,EAAE,CAACb,iBAAiB,CAAC,CAAC;EAEvB,oBACE,KAAC,IAAI;IAAC,OAAO,EAAED,eAAgB;IAAC,IAAI,EAAC,MAAM;IAAC,mBAAgB,gBAAgB;IAAA,uBAC1E,KAAC,WAAW;MAAA,uBACV,KAAC,eAAe;QAAA,uBACd,KAAC,YAAY;UAAoB,OAAO,EAAEK,OAAQ;UAAC,IAAI,EAAEnB,IAAI,CAACsC;QAAO,GAAnD,cAAc;MAAwC;IACxD;EACN,EACT;AAEX,CAAC;AAAC;EApCAxB,eAAe;EACfC,iBAAiB;AAAA;AAqCnB,eAAeF,gBAAgB"}

package/dist/GlobalNavigationBar/desktop/MainMenu.cjs

@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports.default = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
@@ -27,21 +27,17 @@ var _utils = require("../utils");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["icon", "to", "exact", "disabled", "external", "action", "label", "note", "pinned"];
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
-var 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);
-var NavButton = _styledComponents["default"].button(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  background: ", ";\n  border: 0;\n"])), function (props) {
-  return _styles.COLORS.getColor('white', props.theme);
-});
-var ExtendedMenuWrapper = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  margin-left: ", ";\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: ", ";\n  }\n"])), function (props) {
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var 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);
+var NavButton = _styledComponents.default.button(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  background: ", ";\n  border: 0;\n"])), _styles.COLORS.white);
+var ExtendedMenuWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  margin-left: ", ";\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: ", ";\n  }\n"])), function (props) {
   return props.floatRight ? 'auto' : 'unset';
-}, function (props) {
-  return _styles.COLORS.getColor('white', props.theme);
-});
-var ExtendedSection = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n  position: relative;\n"])));
-var SubMenuWrapper = _styledComponents["default"].div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n  ", " {\n    top: ", ";\n    left: ", ";\n  }\n\n  button {\n    padding-left: 0px;\n  }\n"])), _ExtendedMainMenu.Menu, function (props) {
+}, _styles.COLORS.white);
+var ExtendedSection = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n"])));
+var SubMenuWrapper = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  ", " {\n    top: ", ";\n    left: ", ";\n  }\n\n  button {\n    padding-left: 0px;\n  }\n"])), _ExtendedMainMenu.Menu, function (props) {
   return props.topLevel ? '100%' : '0px';
 }, function (props) {
   return props.topLevel ? '0px' : 'calc(100% - 12px)';
@@ -55,11 +51,11 @@ var MainMenu = function MainMenu(_ref) {
   var dropdownMenusOpenedArray = React.useRef([]);
   var mainMenuRef = React.useRef(null);
   var _React$useState = React.useState(1),
-    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
     numberOfItemsAllowed = _React$useState2[0],
     setNumberOfItemsAllowed = _React$useState2[1];
   var _React$useState3 = React.useState([]),
-    _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
+    _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
     subMenuRefs = _React$useState4[0],
     setAllSubMenuRefs = _React$useState4[1];
   var extendedMenuOptionRef = /*#__PURE__*/React.createRef();
@@ -69,14 +65,14 @@ var MainMenu = function MainMenu(_ref) {
     }));
   }, [items]);
   var _React$useState5 = React.useState({}),
-    _React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 2),
+    _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),
+    _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),
+    _React$useState10 = (0, _slicedToArray2.default)(_React$useState9, 2),
     focusedItemId = _React$useState10[0],
     setFocusedItemId = _React$useState10[1];
   var widthOfItem = 120;
@@ -90,7 +86,7 @@ var MainMenu = function MainMenu(_ref) {
     }
   };
   var _onMouseLeave = function onMouseLeave(event, id) {
-    dropdownMenusOpenedArray.current = (0, _toConsumableArray2["default"])(dropdownMenusOpenedArray.current.filter(function (x) {
+    dropdownMenusOpenedArray.current = (0, _toConsumableArray2.default)(dropdownMenusOpenedArray.current.filter(function (x) {
       return x != id;
     }));
     //just trigger rerendering
@@ -101,7 +97,7 @@ var MainMenu = function MainMenu(_ref) {
       return x == id;
     });
     if (existingRefForId == null) {
-      dropdownMenusOpenedArray.current = [].concat((0, _toConsumableArray2["default"])(dropdownMenusOpenedArray.current), [id]);
+      dropdownMenusOpenedArray.current = [].concat((0, _toConsumableArray2.default)(dropdownMenusOpenedArray.current), [id]);
       //just trigger rerendering
       forceUpdate({});
     }
@@ -143,7 +139,7 @@ var MainMenu = function MainMenu(_ref) {
         label = _ref2.label,
         note = _ref2.note,
         pinned = _ref2.pinned,
-        rest = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
+        rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
       return item !== null && item !== void 0 && item.disabled ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_NavItem.NavItem, {
         as: NavButton,
         className: "disabled",
@@ -166,14 +162,14 @@ var MainMenu = function MainMenu(_ref) {
       });
       var onClick = function onClick() {
         if (existingRef == null) {
-          dropdownMenusOpenedArray.current = [].concat((0, _toConsumableArray2["default"])(dropdownMenusOpenedArray.current), [item.id]);
+          dropdownMenusOpenedArray.current = [].concat((0, _toConsumableArray2.default)(dropdownMenusOpenedArray.current), [item.id]);
           //just trigger rerendering
           forceUpdate({});
         }
       };
       var onKeyDown = function onKeyDown(event) {
         if (event.key == 'Enter' || event.code == 'Space') {
-          dropdownMenusOpenedArray.current = [].concat((0, _toConsumableArray2["default"])(dropdownMenusOpenedArray.current), [item.id]);
+          dropdownMenusOpenedArray.current = [].concat((0, _toConsumableArray2.default)(dropdownMenusOpenedArray.current), [item.id]);
           //just trigger rerendering
           forceUpdate({});
         }
@@ -289,8 +285,8 @@ var MainMenu = function MainMenu(_ref) {
   });
 };
 MainMenu.propTypes = {
-  items: _propTypes["default"].array.isRequired
+  items: _propTypes.default.array.isRequired
 };
 var _default = MainMenu;
-exports["default"] = _default;
+exports.default = _default;
 //# sourceMappingURL=MainMenu.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"MainMenu.cjs","names":["React","_interopRequireWildcard","require","_reactRouterDom","_styledComponents","_interopRequireDefault","_NavItem","_icons","_styles","_ExtendedMainMenu","_SubMenu","_Button","_common","_NavItem2","_utils","_jsxRuntime","_excluded","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","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","ExtendedMenuWrapper","floatRight","ExtendedSection","SubMenuWrapper","Menu","topLevel","ExtendedMenuOption","MainMenu","_ref","items","rightSideRef","menuButtonRef","useRef","dropdownMenusOpenedArray","mainMenuRef","_React$useState","useState","_React$useState2","_slicedToArray2","numberOfItemsAllowed","setNumberOfItemsAllowed","_React$useState3","_React$useState4","subMenuRefs","setAllSubMenuRefs","extendedMenuOptionRef","createRef","useEffect","map","x","type","undefined","_React$useState5","_React$useState6","forceUpdate","_React$useState7","_React$useState8","activeItem","setActiveItemId","_React$useState9","_React$useState10","focusedItemId","setFocusedItemId","widthOfItem","recalculateNumberOfItemsAllowed","current","_rightSideRef$current","_mainMenuRef$current","number","Math","floor","offsetLeft","onMouseLeave","event","id","_toConsumableArray2","onMouseEnter","existingRefForId","find","concat","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","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\ninterface ExtendedMenuWrapperProps {\r\n  floatRight: boolean;\r\n}\r\n\r\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\r\n  display: flex;\r\n  margin-left: ${(props) => (props.floatRight ? 'auto' : 'unset')};\r\n\r\n  position: absolute;\r\n  flex-direction: column;\r\n  left: 290px;\r\n  top: 22px;\r\n\r\n  height: 0;\r\n  width: 0;\r\n\r\n  &:focus-within,\r\n  &:hover,\r\n  &.open {\r\n    background: ${props => COLORS.getColor('white', props.theme)};\r\n  }\r\n`;\r\n\r\nconst ExtendedSection = styled.div`\r\n  position: relative;\r\n`;\r\n\r\nconst SubMenuWrapper = styled.div<{ topLevel: boolean }>`\r\n  ${Menu} {\r\n    top: ${(props) => (props.topLevel ? '100%' : '0px')};\r\n    left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\r\n  }\r\n\r\n  button {\r\n    padding-left: 0px;\r\n  }\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":";;;;;;;;;;;;;;AAAA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,eAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,QAAA,GAAAJ,OAAA;AACA,IAAAK,MAAA,GAAAL,OAAA;AACA,IAAAM,OAAA,GAAAN,OAAA;AACA,IAAAO,iBAAA,GAAAP,OAAA;AACA,IAAAQ,QAAA,GAAAR,OAAA;AACA,IAAAS,OAAA,GAAAT,OAAA;AACA,IAAAU,OAAA,GAAAV,OAAA;AAEA,IAAAW,SAAA,GAAAX,OAAA;AACA,IAAAY,MAAA,GAAAZ,OAAA;AAA+C,IAAAa,WAAA,GAAAb,OAAA;AAAA,IAAAc,SAAA;AAAA,IAAAC,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;AAAA,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAtB,wBAAAsB,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,gBAAAK,OAAA,CAAAL,CAAA,0BAAAA,CAAA,sBAAAA,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,cAAAR,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAAA,SAAAW,QAAAnB,CAAA,EAAAE,CAAA,QAAAC,CAAA,GAAAQ,MAAA,CAAAS,IAAA,CAAApB,CAAA,OAAAW,MAAA,CAAAU,qBAAA,QAAAC,CAAA,GAAAX,MAAA,CAAAU,qBAAA,CAAArB,CAAA,GAAAE,CAAA,KAAAoB,CAAA,GAAAA,CAAA,CAAAC,MAAA,WAAArB,CAAA,WAAAS,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAE,CAAA,EAAAsB,UAAA,OAAArB,CAAA,CAAAsB,IAAA,CAAAC,KAAA,CAAAvB,CAAA,EAAAmB,CAAA,YAAAnB,CAAA;AAAA,SAAAwB,cAAA3B,CAAA,aAAAE,CAAA,MAAAA,CAAA,GAAA0B,SAAA,CAAAC,MAAA,EAAA3B,CAAA,UAAAC,CAAA,WAAAyB,SAAA,CAAA1B,CAAA,IAAA0B,SAAA,CAAA1B,CAAA,QAAAA,CAAA,OAAAiB,OAAA,CAAAR,MAAA,CAAAR,CAAA,OAAA2B,OAAA,WAAA5B,CAAA,QAAA6B,gBAAA,aAAA/B,CAAA,EAAAE,CAAA,EAAAC,CAAA,CAAAD,CAAA,SAAAS,MAAA,CAAAqB,yBAAA,GAAArB,MAAA,CAAAsB,gBAAA,CAAAjC,CAAA,EAAAW,MAAA,CAAAqB,yBAAA,CAAA7B,CAAA,KAAAgB,OAAA,CAAAR,MAAA,CAAAR,CAAA,GAAA2B,OAAA,WAAA5B,CAAA,IAAAS,MAAA,CAAAC,cAAA,CAAAZ,CAAA,EAAAE,CAAA,EAAAS,MAAA,CAAAE,wBAAA,CAAAV,CAAA,EAAAD,CAAA,iBAAAF,CAAA;AAE/C,IAAMkC,YAAY,GAAGC,4BAAM,CAACC,GAAG,CAAA1C,eAAA,KAAAA,eAAA,OAAA2C,uBAAA,uSAQ3BC,mBAAW,CAACC,MAAM,EAIlBC,oBAAU,EAGVF,mBAAW,CAACG,KAAK,CAOpB;AAED,IAAMC,SAAS,GAAGP,4BAAM,CAACQ,MAAM,CAAAhD,gBAAA,KAAAA,gBAAA,OAAA0C,uBAAA,0DACf,UAAAO,KAAK;EAAA,OAAIC,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAEF,KAAK,CAACG,KAAK,CAAC;AAAA,EAE7D;AAMD,IAAMC,mBAAmB,GAAGb,4BAAM,CAACC,GAAG,CAAAxC,gBAAA,KAAAA,gBAAA,OAAAyC,uBAAA,uPAErB,UAACO,KAAK;EAAA,OAAMA,KAAK,CAACK,UAAU,GAAG,MAAM,GAAG,OAAO;AAAA,CAAC,EAa/C,UAAAL,KAAK;EAAA,OAAIC,cAAM,CAACC,QAAQ,CAAC,OAAO,EAAEF,KAAK,CAACG,KAAK,CAAC;AAAA,EAE/D;AAED,IAAMG,eAAe,GAAGf,4BAAM,CAACC,GAAG,CAAAvC,gBAAA,KAAAA,gBAAA,OAAAwC,uBAAA,6CAEjC;AAED,IAAMc,cAAc,GAAGhB,4BAAM,CAACC,GAAG,CAAAtC,gBAAA,KAAAA,gBAAA,OAAAuC,uBAAA,kHAC7Be,sBAAI,EACG,UAACR,KAAK;EAAA,OAAMA,KAAK,CAACS,QAAQ,GAAG,MAAM,GAAG,KAAK;AAAA,CAAC,EAC3C,UAACT,KAAK;EAAA,OAAMA,KAAK,CAACS,QAAQ,GAAG,KAAK,GAAG,mBAAmB;AAAA,CAAC,CAMpE;AAED,IAAMC,kBAAkB,GAAG,gBAAgB;AAO3C,IAAMC,QAAQ,GAAG,SAAXA,QAAQA,CAAAC,IAAA,EAAkE;EAAA,IAA5DC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAEC,YAAY,GAAAF,IAAA,CAAZE,YAAY;EACrC,IAAMC,aAAa,GAAGlF,KAAK,CAACmF,MAAM,CAAoB,IAAI,CAAC;EAC3D;EACA,IAAMC,wBAAwB,GAAGpF,KAAK,CAACmF,MAAM,CAAW,EAAE,CAAC;EAC3D,IAAME,WAA+D,GAAGrF,KAAK,CAACmF,MAAM,CAAC,IAAI,CAAC;EAC1F,IAAAG,eAAA,GAAwDtF,KAAK,CAACuF,QAAQ,CAAS,CAAC,CAAC;IAAAC,gBAAA,OAAAC,eAAA,aAAAH,eAAA;IAA1EI,oBAAoB,GAAAF,gBAAA;IAAEG,uBAAuB,GAAAH,gBAAA;EACpD,IAAAI,gBAAA,GAAyC5F,KAAK,CAACuF,QAAQ,CAAoD,EAAE,CAAC;IAAAM,gBAAA,OAAAJ,eAAA,aAAAG,gBAAA;IAAvGE,WAAW,GAAAD,gBAAA;IAAEE,iBAAiB,GAAAF,gBAAA;EACrC,IAAMG,qBAAqB,gBAAGhG,KAAK,CAACiG,SAAS,CAAmB,CAAC;EAEjEjG,KAAK,CAACkG,SAAS,CAAC,YAAM;IACpBH,iBAAiB,CAACf,KAAK,CAACmB,GAAG,CAAC,UAACC,CAAC;MAAA,OAAMA,CAAC,CAACC,IAAI,IAAI,cAAc,gBAAGrG,KAAK,CAACiG,SAAS,CAAmB,CAAC,GAAGK,SAAS;IAAA,CAAC,CAAC,CAAC;EACnH,CAAC,EAAE,CAACtB,KAAK,CAAC,CAAC;EAEX,IAAAuB,gBAAA,GAAwBvG,KAAK,CAACuF,QAAQ,CAAC,CAAC,CAAC,CAAC;IAAAiB,gBAAA,OAAAf,eAAA,aAAAc,gBAAA;IAAjCE,WAAW,GAAAD,gBAAA;EACpB,IAAAE,gBAAA,GAAsC1G,KAAK,CAACuF,QAAQ,CAAS,EAAE,CAAC;IAAAoB,gBAAA,OAAAlB,eAAA,aAAAiB,gBAAA;IAAzDE,UAAU,GAAAD,gBAAA;IAAEE,eAAe,GAAAF,gBAAA;EAClC,IAAAG,gBAAA,GAA0C9G,KAAK,CAACuF,QAAQ,CAAS,EAAE,CAAC;IAAAwB,iBAAA,OAAAtB,eAAA,aAAAqB,gBAAA;IAA7DE,aAAa,GAAAD,iBAAA;IAAEE,gBAAgB,GAAAF,iBAAA;EAEtC,IAAMG,WAAW,GAAG,GAAG;EACvB,IAAMC,+BAA+B,GAAG,SAAlCA,+BAA+BA,CAAA,EAAS;IAC5C,IAAIlC,YAAY,aAAZA,YAAY,eAAZA,YAAY,CAAEmC,OAAO,IAAI/B,WAAW,aAAXA,WAAW,eAAXA,WAAW,CAAE+B,OAAO,EAAE;MAAA,IAAAC,qBAAA,EAAAC,oBAAA;MACjD,IAAMC,MAAM,GAAGC,IAAI,CAACC,KAAK,CAAC,CAAC,CAAAxC,YAAY,aAAZA,YAAY,wBAAAoC,qBAAA,GAAZpC,YAAY,CAAEmC,OAAO,cAAAC,qBAAA,uBAArBA,qBAAA,CAAuBK,UAAU,KAAGrC,WAAW,aAAXA,WAAW,wBAAAiC,oBAAA,GAAXjC,WAAW,CAAE+B,OAAO,cAAAE,oBAAA,uBAApBA,oBAAA,CAAsBI,UAAU,KAAIR,WAAW,CAAC;MAC/G,IAAIK,MAAM,KAAK7B,oBAAoB,EAAE;QACnCC,uBAAuB,CAAC4B,MAAM,CAAC;MACjC;IACF;EACF,CAAC;EAED,IAAMI,aAAY,GAAG,SAAfA,YAAYA,CAAIC,KAAU,EAAEC,EAAU,EAAK;IAC/CzC,wBAAwB,CAACgC,OAAO,OAAAU,mBAAA,aAAO1C,wBAAwB,CAACgC,OAAO,CAACtE,MAAM,CAAC,UAACsD,CAAC;MAAA,OAAKA,CAAC,IAAIyB,EAAE;IAAA,EAAC,CAAC;IAC/F;IACApB,WAAW,CAAC,CAAC,CAAC,CAAC;EACjB,CAAC;EAED,IAAMsB,aAAY,GAAG,SAAfA,YAAYA,CAAIH,KAAU,EAAEC,EAAU,EAAK;IAC/C,IAAMG,gBAAgB,GAAG5C,wBAAwB,CAACgC,OAAO,CAACa,IAAI,CAAC,UAAC7B,CAAC;MAAA,OAAKA,CAAC,IAAIyB,EAAE;IAAA,EAAC;IAC9E,IAAIG,gBAAgB,IAAI,IAAI,EAAE;MAC5B5C,wBAAwB,CAACgC,OAAO,MAAAc,MAAA,KAAAJ,mBAAA,aAAO1C,wBAAwB,CAACgC,OAAO,IAAES,EAAE,EAAC;MAC5E;MACApB,WAAW,CAAC,CAAC,CAAC,CAAC;IACjB;EACF,CAAC;EAEDzG,KAAK,CAACkG,SAAS,CAAC,YAAM;IACpBiB,+BAA+B,CAAC,CAAC;IACjC;IACAgB,MAAM,CAACC,gBAAgB,CAAC,QAAQ,EAAEjB,+BAA+B,CAAC;IAClE,OAAO,YAAM;MACX;MACAgB,MAAM,CAACE,mBAAmB,CAAC,QAAQ,EAAElB,+BAA+B,CAAC;IACvE,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAENnH,KAAK,CAACkG,SAAS,CAAC,YAAM;IACpBiB,+BAA+B,CAAC,CAAC;EACnC,CAAC,EAAE,CAACnC,KAAK,CAAC5B,MAAM,CAAC,CAAC;EAElB,IAAMkF,OAAO,GAAG,SAAVA,OAAOA,CAAIV,KAAuC,EAAK;IAC3D;IACAxC,wBAAwB,CAACgC,OAAO,GAAG,EAAE;IACrCX,WAAW,CAAC,CAAC,CAAC,CAAC;EACjB,CAAC;EAED,IAAM8B,YAAY,GAAG,SAAfA,YAAYA,CAAIX,KAA0C,EAAK;IACnE,IAAIA,KAAK,CAACY,GAAG,KAAK,QAAQ,IAAIZ,KAAK,CAACY,GAAG,KAAK,KAAK,EAAE;MACjDpD,wBAAwB,CAACgC,OAAO,GAAG,EAAE;MACrC;MACAX,WAAW,CAAC,CAAC,CAAC,CAAC;IACjB;EACF,CAAC;EAED,IAAMgC,UAAU,GAAG,SAAbA,UAAUA,CAAIC,IAAqE,EAAEC,KAAa,EAAK;IAC3G,IAAIA,KAAK,GAAGjD,oBAAoB,GAAG,CAAC,EAAE,OAAO,IAAI;IACjD,IAAIgD,IAAI,CAACrC,IAAI,IAAI,cAAc,EAAE;MAC/B,IAAAuC,KAAA,GAAsFF,IAAI;QAAlFG,IAAI,GAAAD,KAAA,CAAJC,IAAI;QAAEC,EAAE,GAAAF,KAAA,CAAFE,EAAE;QAAEC,KAAK,GAAAH,KAAA,CAALG,KAAK;QAAEC,QAAQ,GAAAJ,KAAA,CAARI,QAAQ;QAAEC,QAAQ,GAAAL,KAAA,CAARK,QAAQ;QAAEC,MAAM,GAAAN,KAAA,CAANM,MAAM;QAAEC,KAAK,GAAAP,KAAA,CAALO,KAAK;QAAEC,IAAI,GAAAR,KAAA,CAAJQ,IAAI;QAAEC,MAAM,GAAAT,KAAA,CAANS,MAAM;QAAKC,IAAI,OAAAC,yBAAA,aAAAX,KAAA,EAAA5H,SAAA;MACjF,OAAO0H,IAAI,aAAJA,IAAI,eAAJA,IAAI,CAAEM,QAAQ,gBACnB,IAAAjI,WAAA,CAAAyI,GAAA,EAAClJ,QAAA,CAAAmJ,OAAO;QAACC,EAAE,EAAEzF,SAAU;QAAC0F,SAAS,EAAC,UAAU;QAAkBC,WAAW,EAAEC,iCAA0B;QAAAC,QAAA,EAClGpB,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAES;MAAK,GADoCT,IAAI,CAACS,KAE9C,CAAC,gBAEV,IAAApI,WAAA,CAAAyI,GAAA,EAAClJ,QAAA,CAAAmJ,OAAO,EAAAvG,aAAA,CAAAA,aAAA;QAACwG,EAAE,EAAEK,uBAAQ;QAACzB,OAAO,EAAEA,OAAQ;QAACQ,EAAE,EAAEA,EAAE,IAAI,EAAG;QAAac,WAAW,EAAEC,iCAA0B;QAACG,OAAO,EAAE,SAAAA,QAACzI,CAAmB;UAAA,OAAK2H,MAAM,IAAIA,MAAM,CAAC3H,CAAC,CAAC;QAAA;MAAC,GAAK+H,IAAI;QAAAQ,QAAA,EACtKpB,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAES;MAAK,IAD6CA,KAElD,CACV;IACH,CAAC,MAAM;MACL,IAAMc,WAAW,GAAG7E,wBAAwB,CAACgC,OAAO,CAACa,IAAI,CAAC,UAAC7B,CAAC;QAAA,OAAKA,CAAC,IAAIsC,IAAI,CAACb,EAAE;MAAA,EAAC;MAC9E,IAAMmC,OAAO,GAAG,SAAVA,OAAOA,CAAA,EAAS;QACpB,IAAIC,WAAW,IAAI,IAAI,EAAE;UACvB7E,wBAAwB,CAACgC,OAAO,MAAAc,MAAA,KAAAJ,mBAAA,aAAO1C,wBAAwB,CAACgC,OAAO,IAAEsB,IAAI,CAACb,EAAE,EAAC;UACjF;UACApB,WAAW,CAAC,CAAC,CAAC,CAAC;QACjB;MACF,CAAC;MACD,IAAMyD,SAAS,GAAG,SAAZA,SAASA,CAAItC,KAA0C,EAAK;QAChE,IAAIA,KAAK,CAACY,GAAG,IAAI,OAAO,IAAIZ,KAAK,CAACuC,IAAI,IAAI,OAAO,EAAE;UACjD/E,wBAAwB,CAACgC,OAAO,MAAAc,MAAA,KAAAJ,mBAAA,aAAO1C,wBAAwB,CAACgC,OAAO,IAAEsB,IAAI,CAACb,EAAE,EAAC;UACjF;UACApB,WAAW,CAAC,CAAC,CAAC,CAAC;QACjB;MACF,CAAC;MAED,IAAM2D,kBAAkB,GAAG,IAAAC,0BAAmB,EAAC3B,IAAI,EAAE9B,UAAU,CAAC;MAChE,oBACE,IAAA7F,WAAA,CAAAuJ,IAAA;QACEC,KAAK,EAAE;UAAEC,QAAQ,EAAE;QAAW,CAAE;QAChCzC,YAAY,EAAE,SAAAA,aAACH,KAAK;UAAA,IAAA6C,QAAA;UAAA,OAAK1C,aAAY,CAACH,KAAK,GAAA6C,QAAA,GAAE/B,IAAI,CAACb,EAAE,cAAA4C,QAAA,cAAAA,QAAA,GAAI,EAAE,CAAC;QAAA,CAAC;QAC5D9C,YAAY,EAAE,SAAAA,aAACC,KAAK;UAAA,IAAA8C,SAAA;UAAA,OAAK/C,aAAY,CAACC,KAAK,GAAA8C,SAAA,GAAEhC,IAAI,CAACb,EAAE,cAAA6C,SAAA,cAAAA,SAAA,GAAI,EAAE,CAAC;QAAA,CAAC;QAAAZ,QAAA,gBAC5D,IAAA/I,WAAA,CAAAuJ,IAAA,EAAChK,QAAA,CAAAmJ,OAAO;UACN5B,EAAE,EAAEa,IAAI,CAACb,EAAE,GAAG,eAAgB;UAC9B,iBAAe8C,OAAO,CAACV,WAAW,CAAE;UACpC,yBAAuBG,kBAAkB,GAAGxD,UAAU,GAAG,EAAG;UAC5D,iBAAe8B,IAAI,CAACb,EAAG;UACvB+C,IAAI,EAAC,SAAS;UACdtC,OAAO,EAAEA,OAAQ;UACjB4B,SAAS,EAAEA,SAAU;UACrBW,QAAQ,EAAE,CAAE;UACZlB,SAAS,EAAEM,WAAW,IAAI,IAAI,IAAI,IAAAI,0BAAmB,EAAC3B,IAAI,EAAE9B,UAAU,CAAC,GAAG,QAAQ,GAAG,EAAG;UAExFkC,EAAE,EAAE,IAAK;UACTkB,OAAO,EAAEA,OAAQ;UAAAF,QAAA,GAChBpB,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAES,KAAK,EAAC,GAAC,mBAAApI,WAAA,CAAAyI,GAAA,EAACjJ,MAAA,CAAAuK,WAAW,CAACC,aAAa;YAACC,IAAI,EAAC;UAAM,CAAE,CAAC;QAAA,GAHlDtC,IAAI,CAACS,KAIH,CAAC,eACV,IAAApI,WAAA,CAAAyI,GAAA,EAAC9I,QAAA,CAAAuK,OAAO;UACNC,cAAc,EAAExC,IAAI,CAACb,EAAE,GAAG,eAAgB;UAC1CsD,GAAG,EAAErF,WAAW,CAAC6C,KAAK,CAAE;UACxByC,aAAa,EAAEnE,gBAAiB;UAChCD,aAAa,EAAEA,aAAc;UAC7BqE,YAAY,EAAEzE,UAAW;UACzB0E,QAAQ,EAAE,CAAC5C,IAAI,CAACb,EAAE,CAAE;UACpB0D,kBAAkB,EAAE,SAAAA,mBAAC7C,IAAI,EAAE8C,KAAK,EAAK;YACnC,IAAIA,KAAK,EAAE;cACT3E,eAAe,CAAC6B,IAAI,CAAC;YACvB,CAAC,MAAM,IAAIA,IAAI,IAAI9B,UAAU,EAAEC,eAAe,CAAC,EAAE,CAAC;UACpD,CAAE;UACF6B,IAAI,EAAEA,IAA2C;UACjDtD,wBAAwB,EAAEA,wBAAyB;UACnDuD,KAAK,EAAEA,KAAK,GAAG,CAAE;UACjB/D,QAAQ,EAAE;QAAK,CAChB,CAAC;MAAA,CACC,CAAC;IAEV;EACF,CAAC;EAGD,IAAM6G,QAAQ,GAAGrG,wBAAwB,CAACgC,OAAO,CAACa,IAAI,CAAC,UAAC7B,CAAC;IAAA,OAAKA,CAAC,IAAIvB,kBAAkB;EAAA,EAAC;EACtF,IAAM6G,yBAAyB,GAAG,SAA5BA,yBAAyBA,CAAI9D,KAA0C,EAAK;IAChF,IAAIA,KAAK,CAACY,GAAG,IAAI,OAAO,IAAIZ,KAAK,CAACuC,IAAI,IAAI,OAAO,EAAE;MACjDvC,KAAK,CAAC+D,eAAe,CAAC,CAAC;MAEvBvG,wBAAwB,CAACgC,OAAO,GAAG,CAACvC,kBAAkB,CAAC;MACvD4B,WAAW,CAAC,CAAC,CAAC,CAAC;IACjB;EACF,CAAC;EAED,oBACE,IAAA1F,WAAA,CAAAuJ,IAAA,EAAC7G,YAAY;IAACmH,IAAI,EAAC,YAAY;IAACjB,SAAS,EAAC,0BAA0B;IAACwB,GAAG,EAAE9F,WAAY;IAAC6E,SAAS,EAAE3B,YAAa;IAAAuB,QAAA,GAC5G9E,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEmB,GAAG,CAACsC,UAAU,CAAC,EACtBzD,KAAK,CAAC5B,MAAM,GAAG,CAAC,GAAGsC,oBAAoB,iBACtC,IAAA3E,WAAA,CAAAuJ,IAAA,EAAC7F,eAAe;MACdyF,SAAS,EAAE,SAAAA,UAACtC,KAAK;QAAA,OAAK8D,yBAAyB,CAAC9D,KAAK,CAAC;MAAA,CAAC;MACvDG,YAAY,EAAE,SAAAA,aAACH,KAAK;QAAA,OAAKG,aAAY,CAACH,KAAK,EAAE/C,kBAAkB,CAAC;MAAA,CAAC;MACjE8C,YAAY,EAAE,SAAAA,aAACC,KAAK;QAAA,OAAKD,aAAY,CAACC,KAAK,EAAE/C,kBAAkB,CAAC;MAAA,CAAC;MAAAiF,QAAA,gBACjE,IAAA/I,WAAA,CAAAyI,GAAA,EAAC7I,OAAA,CAAAiL,UAAU;QACT/D,EAAE,EAAEhD,kBAAkB,GAAG,eAAgB;QACzC,iBAAe8F,OAAO,CAACc,QAAQ,CAAE;QACjC,yBAAuB,IAAApB,0BAAmB,EAAC;UAAErF,KAAK,EAAEA,KAAK,CAAC6G,KAAK,CAACnG,oBAAoB,GAAG,CAAC,CAAC;UAAEmC,EAAE,EAAEhD;QAAmB,CAAC,EAAE+B,UAAU,CAAC,GAAGA,UAAU,GAAG,EAAG;QACnJ,iBAAe/B,kBAAmB;QAClC+F,IAAI,EAAC,SAAS;QAEdO,GAAG,EAAEjG,aAAc;QAAC4G,OAAO,EAAE,WAAY;QAACC,KAAK,EAAE,UAAW;QAAC7C,MAAM,EAAE,SAAAA,OAAA,EAAM,CAAC,CAAE;QAAAY,QAAA,eAC9E,IAAA/I,WAAA,CAAAyI,GAAA,EAACjJ,MAAA,CAAAuK,WAAW,CAACkB,cAAc;UAAChB,IAAI,EAAC;QAAM,CAAC;MAAC,CAC/B,CAAC,eACb,IAAAjK,WAAA,CAAAyI,GAAA,EAAC9I,QAAA,CAAAuK,OAAO;QACNC,cAAc,EAAErG,kBAAkB,GAAG,eAAgB;QACrDwG,YAAY,EAAEzE,UAAW;QACzBwE,aAAa,EAAEnE,gBAAiB;QAChCD,aAAa,EAAEA,aAAc;QAC7BmE,GAAG,EAAEnF,qBAAsB;QAC3BuF,kBAAkB,EAAE,SAAAA,mBAAC7C,IAAI,EAAE8C,KAAK,EAAK;UACnC,IAAIA,KAAK,EAAE3E,eAAe,CAAC6B,IAAI,CAAC,CAAC,KAC5B,IAAIA,IAAI,IAAI9B,UAAU,EAAEC,eAAe,CAAC,EAAE,CAAC;QAClD,CAAE;QACFyE,QAAQ,EAAE,CAACzG,kBAAkB,CAAE;QAC/B6D,IAAI,EAAE;UAAE1D,KAAK,EAAEA,KAAK,CAAC6G,KAAK,CAACnG,oBAAoB,GAAG,CAAC,CAAC;UAAEmC,EAAE,EAAEhD;QAAmB,CAAE;QAC/ED,QAAQ,EAAE,IAAK;QACf+D,KAAK,EAAE,CAAE;QACTvD,wBAAwB,EAAEA;MAAyB,CACpD,CAAC;IAAA,CACa,CAClB;EAAA,CACW,CAAC;AAEnB,CAAC;AAACN,QAAA,CAAAmH,SAAA;EApMAjH,KAAK,EAAAkH,UAAA,YAAAC,KAAA,CAAAC;AAAA;AAAA,IAAAC,QAAA,GAsMQvH,QAAQ;AAAAwH,OAAA,cAAAD,QAAA","ignoreList":[]}
+{"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"],"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: ${COLORS.white};\r\n  border: 0;\r\n`;\r\n\r\ninterface ExtendedMenuWrapperProps {\r\n  floatRight: boolean;\r\n}\r\n\r\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\r\n  display: flex;\r\n  margin-left: ${(props) => (props.floatRight ? 'auto' : 'unset')};\r\n\r\n  position: absolute;\r\n  flex-direction: column;\r\n  left: 290px;\r\n  top: 22px;\r\n\r\n  height: 0;\r\n  width: 0;\r\n\r\n  &:focus-within,\r\n  &:hover,\r\n  &.open {\r\n    background: ${COLORS.white};\r\n  }\r\n`;\r\n\r\nconst ExtendedSection = styled.div`\r\n  position: relative;\r\n`;\r\n\r\nconst SubMenuWrapper = styled.div<{ topLevel: boolean }>`\r\n  ${Menu} {\r\n    top: ${(props) => (props.topLevel ? '100%' : '0px')};\r\n    left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\r\n  }\r\n\r\n  button {\r\n    padding-left: 0px;\r\n  }\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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"}

package/dist/GlobalNavigationBar/desktop/MainMenu.js

@@ -6,8 +6,8 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLit
 import _pt from "prop-types";
 var _excluded = ["icon", "to", "exact", "disabled", "external", "action", "label", "note", "pinned"];
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-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; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import * as React from 'react';
 import { NavLink } from 'react-router-dom';
 import styled from 'styled-components';
@@ -23,14 +23,10 @@ import { checkIfContainsItem } from '../utils';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var 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);
-var NavButton = styled.button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  background: ", ";\n  border: 0;\n"])), function (props) {
-  return COLORS.getColor('white', props.theme);
-});
+var NavButton = styled.button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  background: ", ";\n  border: 0;\n"])), COLORS.white);
 var ExtendedMenuWrapper = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  margin-left: ", ";\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: ", ";\n  }\n"])), function (props) {
   return props.floatRight ? 'auto' : 'unset';
-}, function (props) {
-  return COLORS.getColor('white', props.theme);
-});
+}, COLORS.white);
 var ExtendedSection = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  position: relative;\n"])));
 var SubMenuWrapper = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  ", " {\n    top: ", ";\n    left: ", ";\n  }\n\n  button {\n    padding-left: 0px;\n  }\n"])), Menu, function (props) {
   return props.topLevel ? '100%' : '0px';

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","jsx","_jsx","jsxs","_jsxs","NavContainer","div","_templateObject","_taggedTemplateLiteral","MEDIUM","LARGE","NavButton","button","_templateObject2","props","getColor","theme","ExtendedMenuWrapper","_templateObject3","floatRight","ExtendedSection","_templateObject4","SubMenuWrapper","_templateObject5","topLevel","ExtendedMenuOption","MainMenu","_ref","items","rightSideRef","menuButtonRef","useRef","dropdownMenusOpenedArray","mainMenuRef","_React$useState","useState","_React$useState2","_slicedToArray","numberOfItemsAllowed","setNumberOfItemsAllowed","_React$useState3","_React$useState4","subMenuRefs","setAllSubMenuRefs","extendedMenuOptionRef","createRef","useEffect","map","x","type","undefined","_React$useState5","_React$useState6","forceUpdate","_React$useState7","_React$useState8","activeItem","setActiveItemId","_React$useState9","_React$useState10","focusedItemId","setFocusedItemId","widthOfItem","recalculateNumberOfItemsAllowed","current","_rightSideRef$current","_mainMenuRef$current","number","Math","floor","offsetLeft","onMouseLeave","event","id","_toConsumableArray","filter","onMouseEnter","existingRefForId","find","concat","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","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\ninterface ExtendedMenuWrapperProps {\r\n  floatRight: boolean;\r\n}\r\n\r\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\r\n  display: flex;\r\n  margin-left: ${(props) => (props.floatRight ? 'auto' : 'unset')};\r\n\r\n  position: absolute;\r\n  flex-direction: column;\r\n  left: 290px;\r\n  top: 22px;\r\n\r\n  height: 0;\r\n  width: 0;\r\n\r\n  &:focus-within,\r\n  &:hover,\r\n  &.open {\r\n    background: ${props => COLORS.getColor('white', props.theme)};\r\n  }\r\n`;\r\n\r\nconst ExtendedSection = styled.div`\r\n  position: relative;\r\n`;\r\n\r\nconst SubMenuWrapper = styled.div<{ topLevel: boolean }>`\r\n  ${Menu} {\r\n    top: ${(props) => (props.topLevel ? '100%' : '0px')};\r\n    left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\r\n  }\r\n\r\n  button {\r\n    padding-left: 0px;\r\n  }\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","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"],"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: ${COLORS.white};\r\n  border: 0;\r\n`;\r\n\r\ninterface ExtendedMenuWrapperProps {\r\n  floatRight: boolean;\r\n}\r\n\r\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\r\n  display: flex;\r\n  margin-left: ${(props) => (props.floatRight ? 'auto' : 'unset')};\r\n\r\n  position: absolute;\r\n  flex-direction: column;\r\n  left: 290px;\r\n  top: 22px;\r\n\r\n  height: 0;\r\n  width: 0;\r\n\r\n  &:focus-within,\r\n  &:hover,\r\n  &.open {\r\n    background: ${COLORS.white};\r\n  }\r\n`;\r\n\r\nconst ExtendedSection = styled.div`\r\n  position: relative;\r\n`;\r\n\r\nconst SubMenuWrapper = styled.div<{ topLevel: boolean }>`\r\n  ${Menu} {\r\n    top: ${(props) => (props.topLevel ? '100%' : '0px')};\r\n    left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\r\n  }\r\n\r\n  button {\r\n    padding-left: 0px;\r\n  }\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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"}