@laerdal/life-react-components 2.2.1-dev.2.full → 2.2.1-dev.21

package/dist/GlobalNavigationBar/desktop/SubMenu.js

@@ -0,0 +1,166 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+import _pt from "prop-types";
+var _templateObject;
+import * as React from 'react';
+import styled from 'styled-components';
+import { Menu, MenuSection, MenuSectionList } from './ExtendedMainMenu';
+import { Size } from '../../types';
+import { SystemIcons } from '../../icons';
+import { checkIfContainsItem } from '../utils';
+import Tabs from '../../Tabs/Tabs';
+import TabLink from '../../Tabs/TabLink';
+import { MenuItem } from '../../MenuItem';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+export var SubMenuWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", " {\n    top: ", ";\n    left: ", ";\n  }\n\n  ", "\n\n  button {\n    padding-left: 0px;\n  }\n"])), Menu, function (props) {
+  return props.topLevel ? '100%' : '0px';
+}, function (props) {
+  return props.topLevel ? '0px' : 'calc(100% - 12px)';
+}, function (props) {
+  return !props.visible ? 'display: none;' : '';
+});
+export var SubMenu = function SubMenu(_ref) {
+  var item = _ref.item,
+    index = _ref.index,
+    topLevel = _ref.topLevel,
+    dropdownMenusOpenedArray = _ref.dropdownMenusOpenedArray,
+    onSubMenuHidden = _ref.onSubMenuHidden,
+    onSubMenuOpened = _ref.onSubMenuOpened,
+    onItemStateChanged = _ref.onItemStateChanged,
+    activeItemId = _ref.activeItemId,
+    nestPath = _ref.nestPath;
+  var _React$useState = React.useState({}),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    forceUpdate = _React$useState2[1];
+  var existingRef = dropdownMenusOpenedArray.current.find(function (x) {
+    return x == item.id;
+  });
+  var _onMouseLeave = function onMouseLeave(event, id) {
+    dropdownMenusOpenedArray.current = _toConsumableArray(dropdownMenusOpenedArray.current.filter(function (x) {
+      return x != id;
+    }));
+    //just trigger rerendering
+    onSubMenuHidden && onSubMenuHidden(id);
+    forceUpdate({});
+  };
+  var containActiveItem = false;
+  if (item.type == 'desktopgroup' && activeItemId) containActiveItem = checkIfContainsItem(item, activeItemId);
+  var _onMouseEnter = function onMouseEnter(event, id) {
+    var existingRefForId = dropdownMenusOpenedArray.current.find(function (x) {
+      return x == id;
+    });
+    if (existingRefForId == null) {
+      dropdownMenusOpenedArray.current = [].concat(_toConsumableArray(dropdownMenusOpenedArray.current), [id]);
+      //just trigger rerendering
+      onSubMenuOpened && onSubMenuOpened(id);
+      forceUpdate({});
+    }
+  };
+  var _onKeyDown = function onKeyDown(event, entryId) {
+    if (event.key == 'Enter' || event.code == 'Space') {
+      dropdownMenusOpenedArray.current = [].concat(_toConsumableArray(dropdownMenusOpenedArray.current), [entryId]);
+      //just trigger rerendering
+      forceUpdate({});
+    }
+  };
+  var onFocus = function onFocus(event) {
+    dropdownMenusOpenedArray.current = _toConsumableArray(nestPath !== null && nestPath !== void 0 ? nestPath : []);
+    forceUpdate({});
+  };
+  return /*#__PURE__*/_jsx(SubMenuWrapper, {
+    id: item.id,
+    className: existingRef ? 'open' : '',
+    topLevel: topLevel,
+    visible: Boolean(existingRef),
+    children: /*#__PURE__*/_jsx(Menu, {
+      role: "menu",
+      "aria-labelledby": "UserMenuButton",
+      children: /*#__PURE__*/_jsx(MenuSection, {
+        children: /*#__PURE__*/_jsx(MenuSectionList, {
+          children: /*#__PURE__*/_jsx(Tabs, {
+            size: Size.Medium,
+            children: item.items.map(function (entry) {
+              var _entry$label2;
+              var isGroup = entry.type == 'desktopgroup';
+              var key = isGroup ? entry.id : entry.type == 'item' ? entry.to : '';
+              var SubItemOpened = Boolean(dropdownMenusOpenedArray.current.find(function (x) {
+                return x == entry.id;
+              }));
+              if (isGroup) {
+                var _entry$label;
+                return /*#__PURE__*/_jsxs("div", {
+                  style: {
+                    position: 'relative'
+                  },
+                  onMouseEnter: function onMouseEnter(event) {
+                    return _onMouseEnter(event, entry.id);
+                  },
+                  onMouseLeave: function onMouseLeave(event) {
+                    return _onMouseLeave(event, entry.id);
+                  },
+                  children: [/*#__PURE__*/_jsx(MenuItem, {
+                    tabIndex: 0,
+                    onFocus: onFocus,
+                    onKeyDown: function onKeyDown(event) {
+                      return _onKeyDown(event, entry.id);
+                    },
+                    id: entry.id,
+                    item: {
+                      value: (_entry$label = entry.label) !== null && _entry$label !== void 0 ? _entry$label : ''
+                    },
+                    iconRight: /*#__PURE__*/_jsx(SystemIcons.ArrowDropRight, {
+                      size: "24px"
+                    }),
+                    active: SubItemOpened || Boolean(activeItemId) && activeItemId != '' && checkIfContainsItem(entry, activeItemId),
+                    onClickHandler: function onClickHandler() {}
+                  }), /*#__PURE__*/_jsx(SubMenu, {
+                    nestPath: [].concat(_toConsumableArray(nestPath !== null && nestPath !== void 0 ? nestPath : []), [entry.id]),
+                    onItemStateChanged: onItemStateChanged,
+                    activeItemId: activeItemId,
+                    dropdownMenusOpenedArray: dropdownMenusOpenedArray,
+                    item: entry,
+                    index: index + 1,
+                    topLevel: false
+                  })]
+                });
+              }
+              return /*#__PURE__*/_jsx(_Fragment, {
+                children: /*#__PURE__*/_jsx(TabLink, {
+                  to: isGroup ? '' : key,
+                  onFocus: onFocus,
+                  onActiveStateChanged: function onActiveStateChanged(state) {
+                    return onItemStateChanged && entry.type == 'item' && onItemStateChanged(entry.to, state);
+                  },
+                  forceDeactivate: isGroup,
+                  requiredLine: (_entry$label2 = entry.label) !== null && _entry$label2 !== void 0 ? _entry$label2 : '',
+                  optionalLine: '',
+                  endLineIcon: isGroup ? /*#__PURE__*/_jsx(SystemIcons.ArrowDropRight, {
+                    size: "24px"
+                  }) : null,
+                  OptionalLineIcon: '',
+                  disabled: entry.disabled,
+                  showNotificationDot: false,
+                  size: Size.Medium,
+                  variant: "positive"
+                }, key)
+              });
+            })
+          })
+        })
+      })
+    })
+  });
+};
+SubMenu.propTypes = {
+  index: _pt.number.isRequired,
+  topLevel: _pt.bool.isRequired,
+  onSubMenuOpened: _pt.func,
+  onSubMenuHidden: _pt.func,
+  onItemStateChanged: _pt.func,
+  activeItemId: _pt.string,
+  nestPath: _pt.arrayOf(_pt.string)
+};
+//# sourceMappingURL=SubMenu.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SubMenu.js","names":["React","styled","Menu","MenuSection","MenuSectionList","Size","SystemIcons","checkIfContainsItem","Tabs","TabLink","MenuItem","SubMenuWrapper","div","props","topLevel","visible","SubMenu","item","index","dropdownMenusOpenedArray","onSubMenuHidden","onSubMenuOpened","onItemStateChanged","activeItemId","nestPath","useState","forceUpdate","existingRef","current","find","x","id","onMouseLeave","event","filter","containActiveItem","type","onMouseEnter","existingRefForId","onKeyDown","entryId","key","code","onFocus","Boolean","Medium","items","map","entry","isGroup","to","SubItemOpened","position","value","label","state","disabled"],"sources":["../../../src/GlobalNavigationBar/desktop/SubMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { NavLink, useLocation } from 'react-router-dom';\nimport styled from 'styled-components';\n\nimport { NavItem } from '../../NavItem';\nimport { MoreHorizontal } from '../../icons/systemicons/SystemIcons';\nimport { COLORS, BREAKPOINTS } from '../../styles';\nimport ExtendedMainMenu, { Menu, MenuSection, MenuSectionList } from './ExtendedMainMenu';\nimport { IconButton } from '../../Button';\nimport { defaultOnMouseDownHandler } from '../../common';\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\nimport { DropdownContent } from '../../Dropdown';\nimport { VerticalTabEntry, VerticalTabs } from '../../Tabs';\nimport { Size } from '../../types';\nimport { SystemIcons } from '../../icons';\nimport { checkIfContainsItem } from '../utils';\nimport Tabs from '../../Tabs/Tabs';\nimport TabLink from '../../Tabs/TabLink';\nimport { MenuItem } from '../../MenuItem';\nimport { NavItemDiv } from '../../NavItem/NavItem';\n\nexport type SubMenuProps = {\n  item: MenuNavigationItemTypeDesktopGroup;\n  index: number;\n  topLevel: boolean;\n  dropdownMenusOpenedArray: React.MutableRefObject<string[]>;\n  onSubMenuOpened?: (item: string) => void;\n  onSubMenuHidden?: (item: string) => void;\n  onItemStateChanged?: (item: string, state: boolean) => void;\n  activeItemId?: string;\n  nestPath?: string[];\n};\n\nexport const SubMenuWrapper = styled.div<{ topLevel: boolean, visible: boolean }>`\n  ${Menu} {\n    top: ${(props) => (props.topLevel ? '100%' : '0px')};\n    left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\n  }\n\n  ${props => !props.visible ? 'display: none;' : ''}\n\n  button {\n    padding-left: 0px;\n  }\n`;\n\nexport const SubMenu = ({ item, index, topLevel, dropdownMenusOpenedArray, onSubMenuHidden, onSubMenuOpened, onItemStateChanged, activeItemId, nestPath }: SubMenuProps): React.ReactElement<SubMenuProps> => {\n  const [, forceUpdate] = React.useState({});\n\n  const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\n  const onMouseLeave = (event: any, id: string) => {\n    dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\n    //just trigger rerendering\n    onSubMenuHidden && onSubMenuHidden(id);\n    forceUpdate({});\n  };\n  let containActiveItem = false;\n  if(item.type == 'desktopgroup' && activeItemId)\n    containActiveItem = checkIfContainsItem(item, activeItemId);\n\n  const onMouseEnter = (event: any, id: string) => {\n    const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\n    if (existingRefForId == null) {\n      dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\n      //just trigger rerendering\n      onSubMenuOpened && onSubMenuOpened(id);\n      forceUpdate({});\n    }\n  };\n\n  const onKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>, entryId: string) => {\n    if(event.key == 'Enter' || event.code == 'Space')\n    {\n      dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, entryId];\n      //just trigger rerendering\n      forceUpdate({});\n    }\n  };\n\n  const onFocus = (event: React.FocusEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n    dropdownMenusOpenedArray.current = [...(nestPath ?? [])];\n    forceUpdate({});\n  }\n\n  return <SubMenuWrapper id={item.id} className={existingRef ? 'open' : ''} topLevel={topLevel} visible={Boolean(existingRef)}>\n      <Menu role=\"menu\" aria-labelledby=\"UserMenuButton\">\n        <MenuSection>\n          <MenuSectionList>\n            <Tabs size={Size.Medium}>\n              {item.items.map((entry) => {\n                const isGroup = entry.type == 'desktopgroup';\n                const key = isGroup ? entry.id : entry.type == 'item' ? entry.to : '';\n                const SubItemOpened = Boolean(dropdownMenusOpenedArray.current.find((x) => x == entry.id));\n                if (isGroup) {\n                  return (\n                    <div style={{ position: 'relative' }} onMouseEnter={(event) => onMouseEnter(event, entry.id)} onMouseLeave={(event) => onMouseLeave(event, entry.id)}>\n                      <MenuItem\n                        tabIndex={0}\n                        onFocus={onFocus}\n                        onKeyDown={(event) => onKeyDown(event, entry.id)}\n                        id={entry.id}\n                        item={{\n                          value: entry.label ?? '',\n                        }}\n                        iconRight={<SystemIcons.ArrowDropRight size=\"24px\" />}\n                        active={SubItemOpened || (Boolean(activeItemId) && activeItemId != '' && checkIfContainsItem(entry, activeItemId!))}\n                        onClickHandler={() => {}}\n                      />\n                      <SubMenu nestPath={[...(nestPath ?? []), entry.id]} onItemStateChanged={onItemStateChanged} activeItemId={activeItemId} dropdownMenusOpenedArray={dropdownMenusOpenedArray} item={entry as MenuNavigationItemTypeDesktopGroup} index={index + 1} topLevel={false} />\n                    </div>\n                  );\n                }\n                return (\n                  <>\n                    <TabLink\n                      key={key}\n                      to={isGroup ? '' : key}\n                      onFocus={onFocus}\n                      onActiveStateChanged={(state) => onItemStateChanged && entry.type == 'item' && onItemStateChanged(entry.to, state)}\n                      forceDeactivate={isGroup}\n                      requiredLine={entry.label ?? ''}\n                      optionalLine={''}\n                      endLineIcon={isGroup ? <SystemIcons.ArrowDropRight size=\"24px\" /> : null}\n                      OptionalLineIcon={''}\n                      disabled={entry.disabled}\n                      showNotificationDot={false}\n                      size={Size.Medium}\n                      variant=\"positive\"\n                    />\n                  </>\n                );\n              })}\n            </Tabs>\n          </MenuSectionList>\n        </MenuSection>\n      </Menu>\n    </SubMenuWrapper>;\n};\n"],"mappings":"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"}

package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MobileMenu.cjs","names":["Wrapper","styled","div","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","SwitcherLabel","MobileFooter","COLORS","neutral_200","ComponentXSStyling","ComponentTextStyle","Bold","neutral_600","ComponentSStyling","CustomContent","MobileMenu","show","profile","buttons","label","header","items","footer","action","onClose","useStackState","reset","length","push","pop","peek","isMediumScreen","useMediaMatch","LARGE","replace","location","useLocation","onSubMenuOpen","menu","type","content","customContent","custom","React","useEffect","setTimeout","current","switcher","find","a","undefined"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, Z_INDEXES} from '../../styles';\nimport {SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport {useLocation} from 'react-router-dom';\nimport {IconButton} from '../../Button';\nimport {LaerdalLogo} from '../../assets';\nimport {\n  MenuAccountInfo,\n  MenuButton,\n  MenuNavigationItemTypeGroup,\n  MenuGroupFooter,\n  MenuGroupHeader,\n  MenuIconButton,\n  MenuNavigationItemTypeItem,\n  MobileNavigationMenuProps,\n  ProfileMenu,\n  MenuNavigationItemTypeSection,\n  MobileMenuButtonTypes,\n  MenuSwitcherButton,\n  MenuNavigationCustomSubMenu\n} from '../types';\nimport MobileMenuHeader from './MobileMenuHeader';\nimport MobileMenuContent from './MobileMenuContent';\nimport {useStackState} from '../../common/StackState';\nimport {useMediaMatch} from \"rooks\";\n\nconst Wrapper = styled.div`\n  width: 320px;\n  z-index: ${Z_INDEXES.off_canvas};\n  height: 100%;\n  box-sizing: border-box;\n\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n\n  ${BREAKPOINTS.SMALL} {\n    width: 400px;\n  }\n`;\n\nconst SwitcherLabel = styled.div`\n  margin-left: auto;\n`;\n\nconst MobileFooter = styled.div`\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  height: 48px;\n\n  padding: 0 4px 0 16px;\n  border-top: 1px solid ${COLORS.neutral_200};\n\n  ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n    padding: 4px 8px 4px 16px;\n    ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\n\nconst CustomContent = styled.div`\n  width: 100%;\n  box-sizing: border-box;\n  flex-flow: column;\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n`;\n\ntype Props = MobileNavigationMenuProps & {\n  profile?: ProfileMenu;\n  show?: boolean;\n  onClose: () => void;\n};\n\ninterface MenuState {\n  header: {\n    label?: string;\n    buttons?: MobileMenuButtonTypes[];\n  }\n  content?: {\n    header?: MenuGroupHeader;\n    items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n    footer?: MenuGroupFooter;\n    action?: MenuButton;\n  },\n  customContent?: () => React.ReactNode;\n  footer?: boolean;\n}\n\nconst MobileMenu = ({\n                      show,\n                      profile,\n                      buttons,\n                      label,\n                      header,\n                      items,\n                      footer,\n                      action,\n                      onClose,\n                    }: Props) => {\n\n  const {reset, length, push, pop, peek} = useStackState<MenuState>();\n\n  const isMediumScreen = useMediaMatch(BREAKPOINTS.LARGE.replace('@media ', ''));\n\n  const location = useLocation();\n\n  const onSubMenuOpen = (menu?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => {\n\n    switch (menu?.type) {\n      case 'group':\n        push({\n          header: {\n            label: menu.label,\n            buttons: menu.buttons,\n          },\n          content: {\n            header: menu.header,\n            items: menu.items,\n            footer: menu.footer,\n            action: menu.action\n          },\n          footer: false\n        });\n        break;\n      case 'custom':\n        push({\n          header: {\n            label: menu.label,\n            buttons: menu.buttons,\n          },\n          customContent: menu.custom,\n          footer: false\n        });\n        break;\n      default:\n        break;\n    }\n\n  };\n\n  React.useEffect(() => {\n    onClose();\n  }, [location]);\n\n  React.useEffect(() => {\n    isMediumScreen && onClose()\n  }, [isMediumScreen]);\n\n  React.useEffect(() => {\n    setTimeout(() => {\n      reset({\n        footer: true,\n        header: {\n          label: label,\n          buttons: buttons,\n        },\n        content: {\n          header: header,\n          items: items,\n          footer: footer,\n          action: action\n        }\n      })\n    }, 300)\n  }, [show])\n\n\n  const current = peek();\n\n  const switcher = current?.header?.buttons?.find(a => a.type === 'switcher') as MenuSwitcherButton;\n\n  return (\n    <Wrapper>\n      <MobileMenuHeader buttons={current?.header.buttons}\n                        onGoBack={length > 1 ? pop : undefined}\n                        onSubMenuOpen={onSubMenuOpen}\n                        profile={profile}\n                        label={current?.header.label}\n                        onClose={onClose}/>\n      {current?.customContent && <CustomContent>{current?.customContent()}</CustomContent>}\n      {current?.content && <MobileMenuContent header={current?.content.header}\n                                              items={current?.content.items}\n                                              footer={current?.content.footer}\n                                              action={current?.content.action}\n                                              onSubMenuOpen={onSubMenuOpen}/>}\n\n      {\n        current?.footer &&\n        <MobileFooter>\n          <LaerdalLogo height={'36px'} width={'66px'}/>\n          {switcher &&\n            <>\n              <SwitcherLabel className={'globalNav-toggler'} onClick={() => switcher.action && switcher.action() && onClose()}>Switch site</SwitcherLabel>\n              <IconButton\n                variant={'secondary'}\n                shape={'circular'}\n                id=\"globalNavAppsButton\"\n                action={() => switcher.action && switcher.action() && onClose()}>\n                <SwitchApp size=\"24px\"/>\n              </IconButton>\n            </>\n          }\n\n        </MobileFooter>\n      }\n    </Wrapper>\n  );\n};\n\nexport default MobileMenu;\n"],"mappings":"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"}
+{"version":3,"file":"MobileMenu.cjs","names":["Wrapper","styled","div","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","SwitcherLabel","MobileFooter","COLORS","neutral_200","ComponentXSStyling","ComponentTextStyle","Bold","neutral_600","ComponentSStyling","CustomContent","MobileMenu","show","profile","buttons","label","header","items","footer","action","onClose","useStackState","reset","length","push","pop","peek","isMediumScreen","useMediaMatch","LARGE","replace","location","useLocation","onSubMenuOpen","menu","type","content","customContent","custom","React","useEffect","setTimeout","current","switcher","find","a","undefined"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, Z_INDEXES} from '../../styles';\nimport {SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport {useLocation} from 'react-router-dom';\nimport {IconButton} from '../../Button';\nimport {LaerdalLogo} from '../../assets';\nimport {\n  MenuAccountInfo,\n  MenuButton,\n  MenuNavigationItemTypeGroup,\n  MenuGroupFooter,\n  MenuGroupHeader,\n  MenuIconButton,\n  MenuNavigationItemTypeItem,\n  MobileNavigationMenuProps,\n  ProfileMenu,\n  MenuNavigationItemTypeSection,\n  MobileMenuButtonTypes,\n  MenuSwitcherButton,\n  MenuNavigationCustomSubMenu\n} from '../types';\nimport MobileMenuHeader from './MobileMenuHeader';\nimport MobileMenuContent from './MobileMenuContent';\nimport {useStackState} from '../../common/StackState';\nimport {useMediaMatch} from \"rooks\";\n\nconst Wrapper = styled.div`\n  width: 320px;\n  z-index: ${Z_INDEXES.off_canvas};\n  height: 100%;\n  box-sizing: border-box;\n\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n\n  ${BREAKPOINTS.SMALL} {\n    width: 400px;\n  }\n`;\n\nconst SwitcherLabel = styled.div`\n  margin-left: auto;\n`;\n\nconst MobileFooter = styled.div`\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  height: 48px;\n\n  padding: 0 4px 0 16px;\n  border-top: 1px solid ${COLORS.neutral_200};\n\n  ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n    padding: 4px 8px 4px 16px;\n    ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\n\nconst CustomContent = styled.div`\n  width: 100%;\n  box-sizing: border-box;\n  flex-flow: column;\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n`;\n\ntype Props = MobileNavigationMenuProps & {\n  profile?: ProfileMenu;\n  show?: boolean;\n  onClose: () => void;\n};\n\ninterface MenuState {\n  header: {\n    label?: string;\n    buttons?: MobileMenuButtonTypes[];\n  }\n  content?: {\n    header?: MenuGroupHeader;\n    items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n    footer?: MenuGroupFooter;\n    action?: MenuButton;\n  },\n  customContent?: () => React.ReactNode;\n  footer?: boolean;\n}\n\nconst MobileMenu = ({\n                      show,\n                      profile,\n                      buttons,\n                      label,\n                      header,\n                      items,\n                      footer,\n                      action,\n                      onClose,\n                    }: Props) => {\n\n  const {reset, length, push, pop, peek} = useStackState<MenuState>();\n\n  const isMediumScreen = useMediaMatch(BREAKPOINTS.LARGE.replace('@media ', ''));\n\n  const location = useLocation();\n\n  const onSubMenuOpen = (menu?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => {\n\n    switch (menu?.type) {\n      case 'group':\n        push({\n          header: {\n            label: menu.label,\n            buttons: menu.buttons,\n          },\n          content: {\n            header: menu.header,\n            items: menu.items,\n            footer: menu.footer,\n            action: menu.action\n          },\n          footer: false\n        });\n        break;\n      case 'custom':\n        push({\n          header: {\n            label: menu.label,\n            buttons: menu.buttons,\n          },\n          customContent: menu.custom,\n          footer: false\n        });\n        break;\n      default:\n        break;\n    }\n\n  };\n\n  React.useEffect(() => {\n    onClose();\n  }, [location]);\n\n  React.useEffect(() => {\n    isMediumScreen && onClose()\n  }, [isMediumScreen]);\n\n  React.useEffect(() => {\n    setTimeout(() => {\n      reset({\n        footer: true,\n        header: {\n          label: label,\n          buttons: buttons,\n        },\n        content: {\n          header: header,\n          items: items,\n          footer: footer,\n          action: action\n        }\n      })\n    }, 300)\n  }, [show])\n\n\n  const current = peek();\n\n  const switcher = current?.header?.buttons?.find(a => a.type === 'switcher') as MenuSwitcherButton;\n\n  return (\n    <Wrapper>\n      <MobileMenuHeader buttons={current?.header.buttons}\n                        onGoBack={length > 1 ? pop : undefined}\n                        onSubMenuOpen={onSubMenuOpen}\n                        profile={profile}\n                        label={current?.header.label}\n                        onClose={onClose}/>\n      {current?.customContent && <CustomContent>{current?.customContent()}</CustomContent>}\n      {current?.content && <MobileMenuContent header={current?.content.header}\n                                              items={current?.content.items}\n                                              footer={current?.content.footer}\n                                              action={current?.content.action}\n                                              onSubMenuOpen={onSubMenuOpen}/>}\n\n      {\n        current?.footer &&\n        <MobileFooter>\n          <LaerdalLogo height={'36px'} width={'66px'}/>\n          {switcher &&\n            <>\n              <SwitcherLabel className={'globalNav-toggler'} onClick={() => switcher.action && switcher.action() && onClose()}>Switch site</SwitcherLabel>\n              <IconButton\n                variant={'secondary'}\n                shape={'circular'}\n                id=\"globalNavAppsButton\"\n                action={() => switcher.action && switcher.action() && onClose()}>\n                <SwitchApp size=\"24px\"/>\n              </IconButton>\n            </>\n          }\n\n        </MobileFooter>\n      }\n    </Wrapper>\n  );\n};\n\nexport default MobileMenu;\n"],"mappings":"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"}

package/dist/GlobalNavigationBar/mobile/MobileMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"MobileMenu.js","names":["React","styled","BREAKPOINTS","COLORS","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","SwitchApp","useLocation","IconButton","LaerdalLogo","MobileMenuHeader","MobileMenuContent","useStackState","useMediaMatch","Wrapper","div","off_canvas","SMALL","SwitcherLabel","MobileFooter","neutral_200","Bold","neutral_600","CustomContent","MobileMenu","show","profile","buttons","label","header","items","footer","action","onClose","reset","length","push","pop","peek","isMediumScreen","LARGE","replace","location","onSubMenuOpen","menu","type","content","customContent","custom","useEffect","setTimeout","current","switcher","find","a","undefined"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, Z_INDEXES} from '../../styles';\nimport {SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport {useLocation} from 'react-router-dom';\nimport {IconButton} from '../../Button';\nimport {LaerdalLogo} from '../../assets';\nimport {\n  MenuAccountInfo,\n  MenuButton,\n  MenuNavigationItemTypeGroup,\n  MenuGroupFooter,\n  MenuGroupHeader,\n  MenuIconButton,\n  MenuNavigationItemTypeItem,\n  MobileNavigationMenuProps,\n  ProfileMenu,\n  MenuNavigationItemTypeSection,\n  MobileMenuButtonTypes,\n  MenuSwitcherButton,\n  MenuNavigationCustomSubMenu\n} from '../types';\nimport MobileMenuHeader from './MobileMenuHeader';\nimport MobileMenuContent from './MobileMenuContent';\nimport {useStackState} from '../../common/StackState';\nimport {useMediaMatch} from \"rooks\";\n\nconst Wrapper = styled.div`\n  width: 320px;\n  z-index: ${Z_INDEXES.off_canvas};\n  height: 100%;\n  box-sizing: border-box;\n\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n\n  ${BREAKPOINTS.SMALL} {\n    width: 400px;\n  }\n`;\n\nconst SwitcherLabel = styled.div`\n  margin-left: auto;\n`;\n\nconst MobileFooter = styled.div`\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  height: 48px;\n\n  padding: 0 4px 0 16px;\n  border-top: 1px solid ${COLORS.neutral_200};\n\n  ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n    padding: 4px 8px 4px 16px;\n    ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\n\nconst CustomContent = styled.div`\n  width: 100%;\n  box-sizing: border-box;\n  flex-flow: column;\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n`;\n\ntype Props = MobileNavigationMenuProps & {\n  profile?: ProfileMenu;\n  show?: boolean;\n  onClose: () => void;\n};\n\ninterface MenuState {\n  header: {\n    label?: string;\n    buttons?: MobileMenuButtonTypes[];\n  }\n  content?: {\n    header?: MenuGroupHeader;\n    items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n    footer?: MenuGroupFooter;\n    action?: MenuButton;\n  },\n  customContent?: () => React.ReactNode;\n  footer?: boolean;\n}\n\nconst MobileMenu = ({\n                      show,\n                      profile,\n                      buttons,\n                      label,\n                      header,\n                      items,\n                      footer,\n                      action,\n                      onClose,\n                    }: Props) => {\n\n  const {reset, length, push, pop, peek} = useStackState<MenuState>();\n\n  const isMediumScreen = useMediaMatch(BREAKPOINTS.LARGE.replace('@media ', ''));\n\n  const location = useLocation();\n\n  const onSubMenuOpen = (menu?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => {\n\n    switch (menu?.type) {\n      case 'group':\n        push({\n          header: {\n            label: menu.label,\n            buttons: menu.buttons,\n          },\n          content: {\n            header: menu.header,\n            items: menu.items,\n            footer: menu.footer,\n            action: menu.action\n          },\n          footer: false\n        });\n        break;\n      case 'custom':\n        push({\n          header: {\n            label: menu.label,\n            buttons: menu.buttons,\n          },\n          customContent: menu.custom,\n          footer: false\n        });\n        break;\n      default:\n        break;\n    }\n\n  };\n\n  React.useEffect(() => {\n    onClose();\n  }, [location]);\n\n  React.useEffect(() => {\n    isMediumScreen && onClose()\n  }, [isMediumScreen]);\n\n  React.useEffect(() => {\n    setTimeout(() => {\n      reset({\n        footer: true,\n        header: {\n          label: label,\n          buttons: buttons,\n        },\n        content: {\n          header: header,\n          items: items,\n          footer: footer,\n          action: action\n        }\n      })\n    }, 300)\n  }, [show])\n\n\n  const current = peek();\n\n  const switcher = current?.header?.buttons?.find(a => a.type === 'switcher') as MenuSwitcherButton;\n\n  return (\n    <Wrapper>\n      <MobileMenuHeader buttons={current?.header.buttons}\n                        onGoBack={length > 1 ? pop : undefined}\n                        onSubMenuOpen={onSubMenuOpen}\n                        profile={profile}\n                        label={current?.header.label}\n                        onClose={onClose}/>\n      {current?.customContent && <CustomContent>{current?.customContent()}</CustomContent>}\n      {current?.content && <MobileMenuContent header={current?.content.header}\n                                              items={current?.content.items}\n                                              footer={current?.content.footer}\n                                              action={current?.content.action}\n                                              onSubMenuOpen={onSubMenuOpen}/>}\n\n      {\n        current?.footer &&\n        <MobileFooter>\n          <LaerdalLogo height={'36px'} width={'66px'}/>\n          {switcher &&\n            <>\n              <SwitcherLabel className={'globalNav-toggler'} onClick={() => switcher.action && switcher.action() && onClose()}>Switch site</SwitcherLabel>\n              <IconButton\n                variant={'secondary'}\n                shape={'circular'}\n                id=\"globalNavAppsButton\"\n                action={() => switcher.action && switcher.action() && onClose()}>\n                <SwitchApp size=\"24px\"/>\n              </IconButton>\n            </>\n          }\n\n        </MobileFooter>\n      }\n    </Wrapper>\n  );\n};\n\nexport default MobileMenu;\n"],"mappings":"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"}
+{"version":3,"file":"MobileMenu.js","names":["React","styled","BREAKPOINTS","COLORS","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","SwitchApp","useLocation","IconButton","LaerdalLogo","MobileMenuHeader","MobileMenuContent","useStackState","useMediaMatch","Wrapper","div","off_canvas","SMALL","SwitcherLabel","MobileFooter","neutral_200","Bold","neutral_600","CustomContent","MobileMenu","show","profile","buttons","label","header","items","footer","action","onClose","reset","length","push","pop","peek","isMediumScreen","LARGE","replace","location","onSubMenuOpen","menu","type","content","customContent","custom","useEffect","setTimeout","current","switcher","find","a","undefined"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, Z_INDEXES} from '../../styles';\nimport {SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport {useLocation} from 'react-router-dom';\nimport {IconButton} from '../../Button';\nimport {LaerdalLogo} from '../../assets';\nimport {\n  MenuAccountInfo,\n  MenuButton,\n  MenuNavigationItemTypeGroup,\n  MenuGroupFooter,\n  MenuGroupHeader,\n  MenuIconButton,\n  MenuNavigationItemTypeItem,\n  MobileNavigationMenuProps,\n  ProfileMenu,\n  MenuNavigationItemTypeSection,\n  MobileMenuButtonTypes,\n  MenuSwitcherButton,\n  MenuNavigationCustomSubMenu\n} from '../types';\nimport MobileMenuHeader from './MobileMenuHeader';\nimport MobileMenuContent from './MobileMenuContent';\nimport {useStackState} from '../../common/StackState';\nimport {useMediaMatch} from \"rooks\";\n\nconst Wrapper = styled.div`\n  width: 320px;\n  z-index: ${Z_INDEXES.off_canvas};\n  height: 100%;\n  box-sizing: border-box;\n\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n\n  ${BREAKPOINTS.SMALL} {\n    width: 400px;\n  }\n`;\n\nconst SwitcherLabel = styled.div`\n  margin-left: auto;\n`;\n\nconst MobileFooter = styled.div`\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  height: 48px;\n\n  padding: 0 4px 0 16px;\n  border-top: 1px solid ${COLORS.neutral_200};\n\n  ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n    padding: 4px 8px 4px 16px;\n    ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\n\nconst CustomContent = styled.div`\n  width: 100%;\n  box-sizing: border-box;\n  flex-flow: column;\n  display: flex;\n  flex: 1;\n  overflow: hidden;\n`;\n\ntype Props = MobileNavigationMenuProps & {\n  profile?: ProfileMenu;\n  show?: boolean;\n  onClose: () => void;\n};\n\ninterface MenuState {\n  header: {\n    label?: string;\n    buttons?: MobileMenuButtonTypes[];\n  }\n  content?: {\n    header?: MenuGroupHeader;\n    items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n    footer?: MenuGroupFooter;\n    action?: MenuButton;\n  },\n  customContent?: () => React.ReactNode;\n  footer?: boolean;\n}\n\nconst MobileMenu = ({\n                      show,\n                      profile,\n                      buttons,\n                      label,\n                      header,\n                      items,\n                      footer,\n                      action,\n                      onClose,\n                    }: Props) => {\n\n  const {reset, length, push, pop, peek} = useStackState<MenuState>();\n\n  const isMediumScreen = useMediaMatch(BREAKPOINTS.LARGE.replace('@media ', ''));\n\n  const location = useLocation();\n\n  const onSubMenuOpen = (menu?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => {\n\n    switch (menu?.type) {\n      case 'group':\n        push({\n          header: {\n            label: menu.label,\n            buttons: menu.buttons,\n          },\n          content: {\n            header: menu.header,\n            items: menu.items,\n            footer: menu.footer,\n            action: menu.action\n          },\n          footer: false\n        });\n        break;\n      case 'custom':\n        push({\n          header: {\n            label: menu.label,\n            buttons: menu.buttons,\n          },\n          customContent: menu.custom,\n          footer: false\n        });\n        break;\n      default:\n        break;\n    }\n\n  };\n\n  React.useEffect(() => {\n    onClose();\n  }, [location]);\n\n  React.useEffect(() => {\n    isMediumScreen && onClose()\n  }, [isMediumScreen]);\n\n  React.useEffect(() => {\n    setTimeout(() => {\n      reset({\n        footer: true,\n        header: {\n          label: label,\n          buttons: buttons,\n        },\n        content: {\n          header: header,\n          items: items,\n          footer: footer,\n          action: action\n        }\n      })\n    }, 300)\n  }, [show])\n\n\n  const current = peek();\n\n  const switcher = current?.header?.buttons?.find(a => a.type === 'switcher') as MenuSwitcherButton;\n\n  return (\n    <Wrapper>\n      <MobileMenuHeader buttons={current?.header.buttons}\n                        onGoBack={length > 1 ? pop : undefined}\n                        onSubMenuOpen={onSubMenuOpen}\n                        profile={profile}\n                        label={current?.header.label}\n                        onClose={onClose}/>\n      {current?.customContent && <CustomContent>{current?.customContent()}</CustomContent>}\n      {current?.content && <MobileMenuContent header={current?.content.header}\n                                              items={current?.content.items}\n                                              footer={current?.content.footer}\n                                              action={current?.content.action}\n                                              onSubMenuOpen={onSubMenuOpen}/>}\n\n      {\n        current?.footer &&\n        <MobileFooter>\n          <LaerdalLogo height={'36px'} width={'66px'}/>\n          {switcher &&\n            <>\n              <SwitcherLabel className={'globalNav-toggler'} onClick={() => switcher.action && switcher.action() && onClose()}>Switch site</SwitcherLabel>\n              <IconButton\n                variant={'secondary'}\n                shape={'circular'}\n                id=\"globalNavAppsButton\"\n                action={() => switcher.action && switcher.action() && onClose()}>\n                <SwitchApp size=\"24px\"/>\n              </IconButton>\n            </>\n          }\n\n        </MobileFooter>\n      }\n    </Wrapper>\n  );\n};\n\nexport default MobileMenu;\n"],"mappings":"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"}

package/dist/GlobalNavigationBar/types.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"types.cjs","names":[],"sources":["../../src/GlobalNavigationBar/types.tsx"],"sourcesContent":["import React from 'react';\nimport { HyperlinkProps } from '../HyperLink/HyperLink';\nimport { IconButtonProps } from '../Button/Iconbutton';\nimport { ProfileButtonProps } from '../ProfileButton/ProfileButton';\nimport { NavLinkProps } from 'react-router-dom';\nimport {ButtonProps} from \"../Button/Button\";\nimport {TooltipProps} from \"../Tooltips/TooltipTypes\";\n\nexport interface MenuHyperLinkProps extends Pick<HyperlinkProps, 'id' | 'href' | 'onClick' | 'target'> {\n  label: string;\n  icon?: React.ReactElement;\n}\n\nexport interface MenuButton extends Omit<ButtonProps, 'onClick' | 'children' | 'size'> {\n  label: string;\n  action: () => void;\n\n  tooltip?: TooltipProps;\n}\n\nexport interface MenuGroupFooter {\n  header: string;\n  note?: string;\n  link?: MenuHyperLinkProps;\n}\n\nexport interface MenuGroupHeader {\n  header: string;\n  note?: string;\n  link?: MenuHyperLinkProps;\n}\n\nexport interface MenuAccountInfo {\n  firstName: string;\n  lastName: string;\n  email: string;\n  link?: MenuHyperLinkProps;\n}\n\nexport interface ProfileMenu {\n  label?: string;\n\n  user: MenuAccountInfo;\n\n  sections: MenuNavigationSection[];\n\n  signOut?: MenuButton;\n}\n\nexport interface MenuIconSubMenuButton\n  extends Omit<\n    IconButtonProps,\n    | 'type'\n    | 'action'\n    | 'shape'\n    | 'variant'\n    | 'hideOnLowWidth'\n    | 'flatEdge'\n    | 'isInMobileMenu'\n    | 'useTransparentBackground'\n    | 'shouldNotInteract'\n    | 'iconColor'\n    | 'unsetIconSize'\n    | 'borderRadius'\n    | 'focusBackgroundColor'\n    | 'children'\n    | 'invertFocus'\n  > {\n  type: 'submenu';\n  icon: React.ReactNode;\n  menu: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu;\n  placement?: 'left' | 'right';\n}\n\nexport interface MenuIconButton\n  extends Omit<\n    IconButtonProps,\n    | 'type'\n    | 'action'\n    | 'shape'\n    | 'variant'\n    | 'hideOnLowWidth'\n    | 'flatEdge'\n    | 'isInMobileMenu'\n    | 'useTransparentBackground'\n    | 'shouldNotInteract'\n    | 'iconColor'\n    | 'unsetIconSize'\n    | 'borderRadius'\n    | 'focusBackgroundColor'\n    | 'children'\n    | 'invertFocus'\n  > {\n  type: 'action';\n  icon: React.ReactNode;\n  action: (button?: EventTarget) => boolean | void;\n  placement?: 'left' | 'right';\n}\n\nexport interface MenuProfileButton extends Omit<ProfileButtonProps, 'type' | 'onClick' | 'initials' | 'hideOnLowWidth' | 'icon' | 'portraitSrc'> {\n  type: 'profile';\n  action?: (button?: EventTarget) => boolean | void;\n  placement?: 'left' | 'right';\n}\n\nexport interface MenuSwitcherButton\n  extends Omit<\n    IconButtonProps,\n    | 'id'\n    | 'type'\n    | 'action'\n    | 'shape'\n    | 'variant'\n    | 'hideOnLowWidth'\n    | 'flatEdge'\n    | 'isInMobileMenu'\n    | 'useTransparentBackground'\n    | 'shouldNotInteract'\n    | 'iconColor'\n    | 'unsetIconSize'\n    | 'borderRadius'\n    | 'focusBackgroundColor'\n    | 'children'\n    | 'invertFocus'\n  > {\n  type: 'switcher';\n  placement?: 'left' | 'right';\n  action?: (button?: EventTarget) => boolean | void;\n}\n\nexport type DesktopMenuButtonTypes = MenuIconButton | MenuProfileButton | MenuSwitcherButton;\nexport type MobileMenuButtonTypes = MenuIconSubMenuButton | MenuIconButton | MenuProfileButton | MenuSwitcherButton;\n\nexport interface MobileNavigationMenuProps {\n  label?: string;\n  buttons?: MobileMenuButtonTypes[];\n\n  header?: MenuGroupHeader;\n\n  items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup)[];\n\n  footer?: MenuGroupFooter;\n  action?: MenuButton;\n}\n\nexport interface DesktopNavigationMenuProps {\n  buttons?: DesktopMenuButtonTypes[];\n  items: MenuNavigationItemTypeItem[];\n  action?: MenuButton;\n  reverseRightSideOrder?: boolean;\n}\n\n// @ts-ignore\nexport interface MenuNavigationGroup<T = MenuNavigationItem | MenuNavigationSection | MenuNavigationGroup> {\n  label: string;\n  note?: string;\n\n  buttons?: MobileMenuButtonTypes[];\n  header?: MenuGroupHeader;\n\n  items: T[];\n\n  footer?: MenuGroupFooter;\n  action?: MenuButton;\n}\n\nexport type MenuNavigationItem = {\n  icon?: React.ReactNode;\n  to: string;\n  exact?: boolean;\n  disabled?: boolean;\n  external?: boolean;\n  action?: (e: React.MouseEvent) => void;\n  label: string;\n  note?: string;\n  pinned?: boolean;\n} & Omit<NavLinkProps, 'onClick' | 'to' | 'exact' | 'onMouseDown'>;\n\nexport interface MenuNavigationSection<T = MenuNavigationItem> {\n  divider?: boolean;\n  pinned?: boolean;\n  label?: string;\n  items: T[];\n}\n\nexport type MenuNavigationItemTypeItem = MenuNavigationItem & {\n  type?: 'item';\n};\n\nexport type MenuNavigationItemTypeGroup = MenuNavigationGroup<MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection> & {\n  type: 'group';\n  icon?: React.ReactNode;\n  pinned?: boolean;\n  disabled?: boolean;\n};\n\nexport type MenuNavigationItemTypeSection = MenuNavigationSection<MenuNavigationItemTypeItem> & {\n  type: 'section';\n};\n\nexport type MenuNavigationCustomSubMenu = {\n  type: 'custom';\n  label?: string;\n  buttons?: MobileMenuButtonTypes[];\n  custom: () => React.ReactNode;\n};\n"],"mappings":""}
+{"version":3,"file":"types.cjs","names":[],"sources":["../../src/GlobalNavigationBar/types.tsx"],"sourcesContent":["import React from 'react';\nimport { HyperlinkProps } from '../HyperLink/HyperLink';\nimport { IconButtonProps } from '../Button/Iconbutton';\nimport { ProfileButtonProps } from '../ProfileButton/ProfileButton';\nimport { NavLinkProps } from 'react-router-dom';\nimport {ButtonProps} from \"../Button/Button\";\nimport {TooltipProps} from \"../Tooltips/TooltipTypes\";\n\nexport interface MenuHyperLinkProps extends Pick<HyperlinkProps, 'id' | 'href' | 'onClick' | 'target'> {\n  label: string;\n  icon?: React.ReactElement;\n}\n\nexport interface MenuButton extends Omit<ButtonProps, 'onClick' | 'children' | 'size'> {\n  label: string;\n  action: () => void;\n\n  tooltip?: TooltipProps;\n}\n\nexport interface MenuGroupFooter {\n  header: string;\n  note?: string;\n  link?: MenuHyperLinkProps;\n}\n\nexport interface MenuGroupHeader {\n  header: string;\n  note?: string;\n  link?: MenuHyperLinkProps;\n}\n\nexport interface MenuAccountInfo {\n  firstName: string;\n  lastName: string;\n  email: string;\n  link?: MenuHyperLinkProps;\n}\n\nexport interface ProfileMenu {\n  label?: string;\n\n  user: MenuAccountInfo;\n\n  sections: MenuNavigationSection[];\n\n  signOut?: MenuButton;\n}\n\nexport interface MenuIconSubMenuButton\n  extends Omit<\n    IconButtonProps,\n    | 'type'\n    | 'action'\n    | 'shape'\n    | 'variant'\n    | 'hideOnLowWidth'\n    | 'flatEdge'\n    | 'isInMobileMenu'\n    | 'useTransparentBackground'\n    | 'shouldNotInteract'\n    | 'iconColor'\n    | 'unsetIconSize'\n    | 'borderRadius'\n    | 'focusBackgroundColor'\n    | 'children'\n    | 'invertFocus'\n  > {\n  type: 'submenu';\n  icon: React.ReactNode;\n  menu: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu;\n  placement?: 'left' | 'right';\n}\n\nexport interface MenuIconButton\n  extends Omit<\n    IconButtonProps,\n    | 'type'\n    | 'action'\n    | 'shape'\n    | 'variant'\n    | 'hideOnLowWidth'\n    | 'flatEdge'\n    | 'isInMobileMenu'\n    | 'useTransparentBackground'\n    | 'shouldNotInteract'\n    | 'iconColor'\n    | 'unsetIconSize'\n    | 'borderRadius'\n    | 'focusBackgroundColor'\n    | 'children'\n    | 'invertFocus'\n  > {\n  type: 'action';\n  icon: React.ReactNode;\n  action: (button?: EventTarget) => boolean | void;\n  placement?: 'left' | 'right';\n}\n\nexport interface MenuProfileButton extends Omit<ProfileButtonProps, 'type' | 'onClick' | 'initials' | 'hideOnLowWidth' | 'icon' | 'portraitSrc'> {\n  type: 'profile';\n  action?: (button?: EventTarget) => boolean | void;\n  placement?: 'left' | 'right';\n}\n\nexport interface MenuSwitcherButton\n  extends Omit<\n    IconButtonProps,\n    | 'id'\n    | 'type'\n    | 'action'\n    | 'shape'\n    | 'variant'\n    | 'hideOnLowWidth'\n    | 'flatEdge'\n    | 'isInMobileMenu'\n    | 'useTransparentBackground'\n    | 'shouldNotInteract'\n    | 'iconColor'\n    | 'unsetIconSize'\n    | 'borderRadius'\n    | 'focusBackgroundColor'\n    | 'children'\n    | 'invertFocus'\n  > {\n  type: 'switcher';\n  placement?: 'left' | 'right';\n  action?: (button?: EventTarget) => boolean | void;\n}\n\nexport type DesktopMenuButtonTypes = MenuIconButton | MenuProfileButton | MenuSwitcherButton;\nexport type MobileMenuButtonTypes = MenuIconSubMenuButton | MenuIconButton | MenuProfileButton | MenuSwitcherButton;\n\nexport interface MobileNavigationMenuProps {\n  label?: string;\n  buttons?: MobileMenuButtonTypes[];\n\n  header?: MenuGroupHeader;\n\n  items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup)[];\n\n  footer?: MenuGroupFooter;\n  action?: MenuButton;\n}\n\nexport interface DesktopNavigationMenuProps {\n  buttons?: DesktopMenuButtonTypes[];\n  items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\n  action?: MenuButton;\n  reverseRightSideOrder?: boolean;\n}\n\n// @ts-ignore\nexport interface MenuNavigationGroup<T = MenuNavigationItemTypeDesktopGroup | MenuNavigationItem | MenuNavigationSection | MenuNavigationGroup> {\n  label: string;\n  note?: string;\n\n  buttons?: MobileMenuButtonTypes[];\n  header?: MenuGroupHeader;\n\n  items: T[];\n\n  footer?: MenuGroupFooter;\n  action?: MenuButton;\n}\n\nexport type MenuNavigationItem = {\n  icon?: React.ReactNode;\n  to: string;\n  exact?: boolean;\n  disabled?: boolean;\n  external?: boolean;\n  action?: (e: React.MouseEvent) => void;\n  label: string;\n  note?: string;\n  pinned?: boolean;\n  subItems?: MenuNavigationItem[];\n} & Omit<NavLinkProps, 'onClick' | 'to' | 'exact' | 'onMouseDown'>;\n\nexport interface MenuNavigationSection<T = MenuNavigationItem> {\n  divider?: boolean;\n  pinned?: boolean;\n  label?: string;\n  items: T[];\n}\n\nexport type MenuNavigationItemTypeItem = MenuNavigationItem & {\n  type?: 'item';\n};\n\nexport type MenuNavigationItemTypeDesktopGroup = {\n  id: string;\n  label?: string;\n  disabled?: boolean;\n  pinned?: boolean;\n  type?: 'desktopgroup';\n  expanded?: boolean;\n  items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\n}\n\nexport type MenuNavigationItemTypeGroup = MenuNavigationGroup<MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection> & {\n  type: 'group';\n  icon?: React.ReactNode;\n  pinned?: boolean;\n  disabled?: boolean;\n};\n\nexport type MenuNavigationItemTypeSection = MenuNavigationSection<MenuNavigationItemTypeItem> & {\n  type: 'section';\n};\n\nexport type MenuNavigationCustomSubMenu = {\n  type: 'custom';\n  label?: string;\n  buttons?: MobileMenuButtonTypes[];\n  custom: () => React.ReactNode;\n};\n"],"mappings":""}

package/dist/GlobalNavigationBar/types.d.ts

@@ -70,11 +70,11 @@ export interface MobileNavigationMenuProps {
 }
 export interface DesktopNavigationMenuProps {
     buttons?: DesktopMenuButtonTypes[];
-    items: MenuNavigationItemTypeItem[];
+    items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];
     action?: MenuButton;
     reverseRightSideOrder?: boolean;
 }
-export interface MenuNavigationGroup<T = MenuNavigationItem | MenuNavigationSection | MenuNavigationGroup> {
+export interface MenuNavigationGroup<T = MenuNavigationItemTypeDesktopGroup | MenuNavigationItem | MenuNavigationSection | MenuNavigationGroup> {
     label: string;
     note?: string;
     buttons?: MobileMenuButtonTypes[];
@@ -93,6 +93,7 @@ export type MenuNavigationItem = {
     label: string;
     note?: string;
     pinned?: boolean;
+    subItems?: MenuNavigationItem[];
 } & Omit<NavLinkProps, 'onClick' | 'to' | 'exact' | 'onMouseDown'>;
 export interface MenuNavigationSection<T = MenuNavigationItem> {
     divider?: boolean;
@@ -103,6 +104,15 @@ export interface MenuNavigationSection<T = MenuNavigationItem> {
 export type MenuNavigationItemTypeItem = MenuNavigationItem & {
     type?: 'item';
 };
+export type MenuNavigationItemTypeDesktopGroup = {
+    id: string;
+    label?: string;
+    disabled?: boolean;
+    pinned?: boolean;
+    type?: 'desktopgroup';
+    expanded?: boolean;
+    items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];
+};
 export type MenuNavigationItemTypeGroup = MenuNavigationGroup<MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection> & {
     type: 'group';
     icon?: React.ReactNode;

package/dist/GlobalNavigationBar/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../src/GlobalNavigationBar/types.tsx"],"sourcesContent":["import React from 'react';\nimport { HyperlinkProps } from '../HyperLink/HyperLink';\nimport { IconButtonProps } from '../Button/Iconbutton';\nimport { ProfileButtonProps } from '../ProfileButton/ProfileButton';\nimport { NavLinkProps } from 'react-router-dom';\nimport {ButtonProps} from \"../Button/Button\";\nimport {TooltipProps} from \"../Tooltips/TooltipTypes\";\n\nexport interface MenuHyperLinkProps extends Pick<HyperlinkProps, 'id' | 'href' | 'onClick' | 'target'> {\n  label: string;\n  icon?: React.ReactElement;\n}\n\nexport interface MenuButton extends Omit<ButtonProps, 'onClick' | 'children' | 'size'> {\n  label: string;\n  action: () => void;\n\n  tooltip?: TooltipProps;\n}\n\nexport interface MenuGroupFooter {\n  header: string;\n  note?: string;\n  link?: MenuHyperLinkProps;\n}\n\nexport interface MenuGroupHeader {\n  header: string;\n  note?: string;\n  link?: MenuHyperLinkProps;\n}\n\nexport interface MenuAccountInfo {\n  firstName: string;\n  lastName: string;\n  email: string;\n  link?: MenuHyperLinkProps;\n}\n\nexport interface ProfileMenu {\n  label?: string;\n\n  user: MenuAccountInfo;\n\n  sections: MenuNavigationSection[];\n\n  signOut?: MenuButton;\n}\n\nexport interface MenuIconSubMenuButton\n  extends Omit<\n    IconButtonProps,\n    | 'type'\n    | 'action'\n    | 'shape'\n    | 'variant'\n    | 'hideOnLowWidth'\n    | 'flatEdge'\n    | 'isInMobileMenu'\n    | 'useTransparentBackground'\n    | 'shouldNotInteract'\n    | 'iconColor'\n    | 'unsetIconSize'\n    | 'borderRadius'\n    | 'focusBackgroundColor'\n    | 'children'\n    | 'invertFocus'\n  > {\n  type: 'submenu';\n  icon: React.ReactNode;\n  menu: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu;\n  placement?: 'left' | 'right';\n}\n\nexport interface MenuIconButton\n  extends Omit<\n    IconButtonProps,\n    | 'type'\n    | 'action'\n    | 'shape'\n    | 'variant'\n    | 'hideOnLowWidth'\n    | 'flatEdge'\n    | 'isInMobileMenu'\n    | 'useTransparentBackground'\n    | 'shouldNotInteract'\n    | 'iconColor'\n    | 'unsetIconSize'\n    | 'borderRadius'\n    | 'focusBackgroundColor'\n    | 'children'\n    | 'invertFocus'\n  > {\n  type: 'action';\n  icon: React.ReactNode;\n  action: (button?: EventTarget) => boolean | void;\n  placement?: 'left' | 'right';\n}\n\nexport interface MenuProfileButton extends Omit<ProfileButtonProps, 'type' | 'onClick' | 'initials' | 'hideOnLowWidth' | 'icon' | 'portraitSrc'> {\n  type: 'profile';\n  action?: (button?: EventTarget) => boolean | void;\n  placement?: 'left' | 'right';\n}\n\nexport interface MenuSwitcherButton\n  extends Omit<\n    IconButtonProps,\n    | 'id'\n    | 'type'\n    | 'action'\n    | 'shape'\n    | 'variant'\n    | 'hideOnLowWidth'\n    | 'flatEdge'\n    | 'isInMobileMenu'\n    | 'useTransparentBackground'\n    | 'shouldNotInteract'\n    | 'iconColor'\n    | 'unsetIconSize'\n    | 'borderRadius'\n    | 'focusBackgroundColor'\n    | 'children'\n    | 'invertFocus'\n  > {\n  type: 'switcher';\n  placement?: 'left' | 'right';\n  action?: (button?: EventTarget) => boolean | void;\n}\n\nexport type DesktopMenuButtonTypes = MenuIconButton | MenuProfileButton | MenuSwitcherButton;\nexport type MobileMenuButtonTypes = MenuIconSubMenuButton | MenuIconButton | MenuProfileButton | MenuSwitcherButton;\n\nexport interface MobileNavigationMenuProps {\n  label?: string;\n  buttons?: MobileMenuButtonTypes[];\n\n  header?: MenuGroupHeader;\n\n  items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup)[];\n\n  footer?: MenuGroupFooter;\n  action?: MenuButton;\n}\n\nexport interface DesktopNavigationMenuProps {\n  buttons?: DesktopMenuButtonTypes[];\n  items: MenuNavigationItemTypeItem[];\n  action?: MenuButton;\n  reverseRightSideOrder?: boolean;\n}\n\n// @ts-ignore\nexport interface MenuNavigationGroup<T = MenuNavigationItem | MenuNavigationSection | MenuNavigationGroup> {\n  label: string;\n  note?: string;\n\n  buttons?: MobileMenuButtonTypes[];\n  header?: MenuGroupHeader;\n\n  items: T[];\n\n  footer?: MenuGroupFooter;\n  action?: MenuButton;\n}\n\nexport type MenuNavigationItem = {\n  icon?: React.ReactNode;\n  to: string;\n  exact?: boolean;\n  disabled?: boolean;\n  external?: boolean;\n  action?: (e: React.MouseEvent) => void;\n  label: string;\n  note?: string;\n  pinned?: boolean;\n} & Omit<NavLinkProps, 'onClick' | 'to' | 'exact' | 'onMouseDown'>;\n\nexport interface MenuNavigationSection<T = MenuNavigationItem> {\n  divider?: boolean;\n  pinned?: boolean;\n  label?: string;\n  items: T[];\n}\n\nexport type MenuNavigationItemTypeItem = MenuNavigationItem & {\n  type?: 'item';\n};\n\nexport type MenuNavigationItemTypeGroup = MenuNavigationGroup<MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection> & {\n  type: 'group';\n  icon?: React.ReactNode;\n  pinned?: boolean;\n  disabled?: boolean;\n};\n\nexport type MenuNavigationItemTypeSection = MenuNavigationSection<MenuNavigationItemTypeItem> & {\n  type: 'section';\n};\n\nexport type MenuNavigationCustomSubMenu = {\n  type: 'custom';\n  label?: string;\n  buttons?: MobileMenuButtonTypes[];\n  custom: () => React.ReactNode;\n};\n"],"mappings":""}
+{"version":3,"file":"types.js","names":[],"sources":["../../src/GlobalNavigationBar/types.tsx"],"sourcesContent":["import React from 'react';\nimport { HyperlinkProps } from '../HyperLink/HyperLink';\nimport { IconButtonProps } from '../Button/Iconbutton';\nimport { ProfileButtonProps } from '../ProfileButton/ProfileButton';\nimport { NavLinkProps } from 'react-router-dom';\nimport {ButtonProps} from \"../Button/Button\";\nimport {TooltipProps} from \"../Tooltips/TooltipTypes\";\n\nexport interface MenuHyperLinkProps extends Pick<HyperlinkProps, 'id' | 'href' | 'onClick' | 'target'> {\n  label: string;\n  icon?: React.ReactElement;\n}\n\nexport interface MenuButton extends Omit<ButtonProps, 'onClick' | 'children' | 'size'> {\n  label: string;\n  action: () => void;\n\n  tooltip?: TooltipProps;\n}\n\nexport interface MenuGroupFooter {\n  header: string;\n  note?: string;\n  link?: MenuHyperLinkProps;\n}\n\nexport interface MenuGroupHeader {\n  header: string;\n  note?: string;\n  link?: MenuHyperLinkProps;\n}\n\nexport interface MenuAccountInfo {\n  firstName: string;\n  lastName: string;\n  email: string;\n  link?: MenuHyperLinkProps;\n}\n\nexport interface ProfileMenu {\n  label?: string;\n\n  user: MenuAccountInfo;\n\n  sections: MenuNavigationSection[];\n\n  signOut?: MenuButton;\n}\n\nexport interface MenuIconSubMenuButton\n  extends Omit<\n    IconButtonProps,\n    | 'type'\n    | 'action'\n    | 'shape'\n    | 'variant'\n    | 'hideOnLowWidth'\n    | 'flatEdge'\n    | 'isInMobileMenu'\n    | 'useTransparentBackground'\n    | 'shouldNotInteract'\n    | 'iconColor'\n    | 'unsetIconSize'\n    | 'borderRadius'\n    | 'focusBackgroundColor'\n    | 'children'\n    | 'invertFocus'\n  > {\n  type: 'submenu';\n  icon: React.ReactNode;\n  menu: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu;\n  placement?: 'left' | 'right';\n}\n\nexport interface MenuIconButton\n  extends Omit<\n    IconButtonProps,\n    | 'type'\n    | 'action'\n    | 'shape'\n    | 'variant'\n    | 'hideOnLowWidth'\n    | 'flatEdge'\n    | 'isInMobileMenu'\n    | 'useTransparentBackground'\n    | 'shouldNotInteract'\n    | 'iconColor'\n    | 'unsetIconSize'\n    | 'borderRadius'\n    | 'focusBackgroundColor'\n    | 'children'\n    | 'invertFocus'\n  > {\n  type: 'action';\n  icon: React.ReactNode;\n  action: (button?: EventTarget) => boolean | void;\n  placement?: 'left' | 'right';\n}\n\nexport interface MenuProfileButton extends Omit<ProfileButtonProps, 'type' | 'onClick' | 'initials' | 'hideOnLowWidth' | 'icon' | 'portraitSrc'> {\n  type: 'profile';\n  action?: (button?: EventTarget) => boolean | void;\n  placement?: 'left' | 'right';\n}\n\nexport interface MenuSwitcherButton\n  extends Omit<\n    IconButtonProps,\n    | 'id'\n    | 'type'\n    | 'action'\n    | 'shape'\n    | 'variant'\n    | 'hideOnLowWidth'\n    | 'flatEdge'\n    | 'isInMobileMenu'\n    | 'useTransparentBackground'\n    | 'shouldNotInteract'\n    | 'iconColor'\n    | 'unsetIconSize'\n    | 'borderRadius'\n    | 'focusBackgroundColor'\n    | 'children'\n    | 'invertFocus'\n  > {\n  type: 'switcher';\n  placement?: 'left' | 'right';\n  action?: (button?: EventTarget) => boolean | void;\n}\n\nexport type DesktopMenuButtonTypes = MenuIconButton | MenuProfileButton | MenuSwitcherButton;\nexport type MobileMenuButtonTypes = MenuIconSubMenuButton | MenuIconButton | MenuProfileButton | MenuSwitcherButton;\n\nexport interface MobileNavigationMenuProps {\n  label?: string;\n  buttons?: MobileMenuButtonTypes[];\n\n  header?: MenuGroupHeader;\n\n  items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup)[];\n\n  footer?: MenuGroupFooter;\n  action?: MenuButton;\n}\n\nexport interface DesktopNavigationMenuProps {\n  buttons?: DesktopMenuButtonTypes[];\n  items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\n  action?: MenuButton;\n  reverseRightSideOrder?: boolean;\n}\n\n// @ts-ignore\nexport interface MenuNavigationGroup<T = MenuNavigationItemTypeDesktopGroup | MenuNavigationItem | MenuNavigationSection | MenuNavigationGroup> {\n  label: string;\n  note?: string;\n\n  buttons?: MobileMenuButtonTypes[];\n  header?: MenuGroupHeader;\n\n  items: T[];\n\n  footer?: MenuGroupFooter;\n  action?: MenuButton;\n}\n\nexport type MenuNavigationItem = {\n  icon?: React.ReactNode;\n  to: string;\n  exact?: boolean;\n  disabled?: boolean;\n  external?: boolean;\n  action?: (e: React.MouseEvent) => void;\n  label: string;\n  note?: string;\n  pinned?: boolean;\n  subItems?: MenuNavigationItem[];\n} & Omit<NavLinkProps, 'onClick' | 'to' | 'exact' | 'onMouseDown'>;\n\nexport interface MenuNavigationSection<T = MenuNavigationItem> {\n  divider?: boolean;\n  pinned?: boolean;\n  label?: string;\n  items: T[];\n}\n\nexport type MenuNavigationItemTypeItem = MenuNavigationItem & {\n  type?: 'item';\n};\n\nexport type MenuNavigationItemTypeDesktopGroup = {\n  id: string;\n  label?: string;\n  disabled?: boolean;\n  pinned?: boolean;\n  type?: 'desktopgroup';\n  expanded?: boolean;\n  items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\n}\n\nexport type MenuNavigationItemTypeGroup = MenuNavigationGroup<MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection> & {\n  type: 'group';\n  icon?: React.ReactNode;\n  pinned?: boolean;\n  disabled?: boolean;\n};\n\nexport type MenuNavigationItemTypeSection = MenuNavigationSection<MenuNavigationItemTypeItem> & {\n  type: 'section';\n};\n\nexport type MenuNavigationCustomSubMenu = {\n  type: 'custom';\n  label?: string;\n  buttons?: MobileMenuButtonTypes[];\n  custom: () => React.ReactNode;\n};\n"],"mappings":""}

package/dist/GlobalNavigationBar/utils.cjs

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.checkIfContainsItem = void 0;
+var checkIfContainsItem = function checkIfContainsItem(item, activeId) {
+  if (item.id == activeId) return true;
+  if (item.items.findIndex(function (x) {
+    return x.type == 'item' && x.to == activeId;
+  }) >= 0) return true;
+  return item.items.some(function (x) {
+    return x.type == 'desktopgroup' && checkIfContainsItem(x, activeId);
+  });
+};
+exports.checkIfContainsItem = checkIfContainsItem;
+//# sourceMappingURL=utils.cjs.map

package/dist/GlobalNavigationBar/utils.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.cjs","names":["checkIfContainsItem","item","activeId","id","items","findIndex","x","type","to","some"],"sources":["../../src/GlobalNavigationBar/utils.tsx"],"sourcesContent":["import { MenuNavigationItemTypeDesktopGroup } from './types';\n\nexport const checkIfContainsItem = (item: MenuNavigationItemTypeDesktopGroup, activeId: string) : boolean => {\n    if(item.id == activeId)\n        return true;\n    if(item.items.findIndex(x => x.type == 'item' && x.to == activeId) >= 0)\n        return true;\n    return item.items.some(x => x.type == 'desktopgroup' && checkIfContainsItem(x, activeId));\n}"],"mappings":";;;;;;AAEO,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAmB,CAAIC,IAAwC,EAAEC,QAAgB,EAAe;EACzG,IAAGD,IAAI,CAACE,EAAE,IAAID,QAAQ,EAClB,OAAO,IAAI;EACf,IAAGD,IAAI,CAACG,KAAK,CAACC,SAAS,CAAC,UAAAC,CAAC;IAAA,OAAIA,CAAC,CAACC,IAAI,IAAI,MAAM,IAAID,CAAC,CAACE,EAAE,IAAIN,QAAQ;EAAA,EAAC,IAAI,CAAC,EACnE,OAAO,IAAI;EACf,OAAOD,IAAI,CAACG,KAAK,CAACK,IAAI,CAAC,UAAAH,CAAC;IAAA,OAAIA,CAAC,CAACC,IAAI,IAAI,cAAc,IAAIP,mBAAmB,CAACM,CAAC,EAAEJ,QAAQ,CAAC;EAAA,EAAC;AAC7F,CAAC;AAAA"}

package/dist/GlobalNavigationBar/utils.d.ts

@@ -0,0 +1,2 @@
+import { MenuNavigationItemTypeDesktopGroup } from './types';
+export declare const checkIfContainsItem: (item: MenuNavigationItemTypeDesktopGroup, activeId: string) => boolean;

package/dist/GlobalNavigationBar/utils.js

@@ -0,0 +1,10 @@
+export var checkIfContainsItem = function checkIfContainsItem(item, activeId) {
+  if (item.id == activeId) return true;
+  if (item.items.findIndex(function (x) {
+    return x.type == 'item' && x.to == activeId;
+  }) >= 0) return true;
+  return item.items.some(function (x) {
+    return x.type == 'desktopgroup' && checkIfContainsItem(x, activeId);
+  });
+};
+//# sourceMappingURL=utils.js.map

package/dist/GlobalNavigationBar/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","names":["checkIfContainsItem","item","activeId","id","items","findIndex","x","type","to","some"],"sources":["../../src/GlobalNavigationBar/utils.tsx"],"sourcesContent":["import { MenuNavigationItemTypeDesktopGroup } from './types';\n\nexport const checkIfContainsItem = (item: MenuNavigationItemTypeDesktopGroup, activeId: string) : boolean => {\n    if(item.id == activeId)\n        return true;\n    if(item.items.findIndex(x => x.type == 'item' && x.to == activeId) >= 0)\n        return true;\n    return item.items.some(x => x.type == 'desktopgroup' && checkIfContainsItem(x, activeId));\n}"],"mappings":"AAEA,OAAO,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAmB,CAAIC,IAAwC,EAAEC,QAAgB,EAAe;EACzG,IAAGD,IAAI,CAACE,EAAE,IAAID,QAAQ,EAClB,OAAO,IAAI;EACf,IAAGD,IAAI,CAACG,KAAK,CAACC,SAAS,CAAC,UAAAC,CAAC;IAAA,OAAIA,CAAC,CAACC,IAAI,IAAI,MAAM,IAAID,CAAC,CAACE,EAAE,IAAIN,QAAQ;EAAA,EAAC,IAAI,CAAC,EACnE,OAAO,IAAI;EACf,OAAOD,IAAI,CAACG,KAAK,CAACK,IAAI,CAAC,UAAAH,CAAC;IAAA,OAAIA,CAAC,CAACC,IAAI,IAAI,cAAc,IAAIP,mBAAmB,CAACM,CAAC,EAAEJ,QAAQ,CAAC;EAAA,EAAC;AAC7F,CAAC"}

package/dist/Image/ImageWithFallbacks.js

@@ -13,8 +13,8 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 import { LoadingIndicator } from '..';
 import React from 'react';
-import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var ImageWithFallbacks = /*#__PURE__*/function (_React$Component) {
   _inherits(ImageWithFallbacks, _React$Component);

package/dist/InputFields/DatepickerField.cjs

@@ -20,6 +20,7 @@ var _colors = _interopRequireDefault(require("../styles/colors"));
 var _SystemIcons = require("../icons/systemicons/SystemIcons");
 var _DatepickerFieldHeader = require("./DatepickerFieldHeader");
 var _styles = require("../styles");
+var _TooltipOverflow = _interopRequireDefault(require("../Tooltips/TooltipOverflow"));
 var _styling = require("./styling");
 require("react-datepicker/dist/react-datepicker.css");
 var _common = require("../common");
@@ -86,12 +87,14 @@ var DatepickerField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref
     _React$useState8 = (0, _slicedToArray2.default)(_React$useState7, 2),
     open = _React$useState8[0],
     setOpen = _React$useState8[1];
-
+  var getFormattedValue = function getFormattedValue() {
+    return (0, _dayjs.default)(value).format(dateFormat ? dateFormat : 'MMMM Do, YYYY');
+  };
   /**
    * Format the date in a specific way.
    */
   _react.default.useEffect(function () {
-    if (value) inputRef.current.value = (0, _dayjs.default)(value).format(dateFormat ? dateFormat : 'MMMM Do, YYYY');
+    if (value) inputRef.current.value = getFormattedValue();
   }, [value]);
   _react.default.useEffect(function () {
     if (yearPickerMode) {
@@ -140,6 +143,7 @@ var DatepickerField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref
       onBlur && onBlur(e);
     }
   };
+  var iconSize = 24;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(DatePickerContainer, {
       "data-testId": dataTestId,
@@ -185,10 +189,10 @@ var DatepickerField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref
             setYearPickerMode: setYearPickerMode
           }), null);
         } : undefined,
-        customInput: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styling.InputWrapper, {
+        customInput: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styling.InputWrapper, {
           disabled: disabled,
           readOnly: readOnly,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
             style: {
               display: 'block',
               margin: '4px 0px'
@@ -209,17 +213,25 @@ var DatepickerField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref
                 },
                 autoComplete: autoComplete,
                 placeholder: placeholder,
+                extraRightPadding: iconSize,
                 disabled: disabled,
                 readOnly: true,
                 suppressReadOnlyStyles: !readOnly,
                 required: required
               }, rest)), /*#__PURE__*/(0, _jsxRuntime.jsx)(IconWrapper, {
                 children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.Calendar, {
-                  size: "24"
+                  size: "".concat(iconSize, "px")
                 })
               })]
             })
-          })
+          }), !open && /*#__PURE__*/(0, _jsxRuntime.jsx)(_TooltipOverflow.default, {
+            input: inputRef,
+            withArrow: true,
+            maxWidth: "100%",
+            size: _types.Size.Small,
+            align: "end",
+            children: getFormattedValue()
+          })]
         })
       })
     }), validationMessage && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styling.ErrorMessage, {