@laerdal/life-react-components 1.10.3-dev.18 → 1.10.3-dev.20

package/dist/GlobalNavigationBar/desktop/RightSideNav.js

@@ -33,8 +33,8 @@ var RightSideNav = function RightSideNav(_ref) {
         exact: item === null || item === void 0 ? void 0 : item.exact,
         to: (item === null || item === void 0 ? void 0 : item.to) || '',
         onMouseDown: defaultOnMouseDownHandler,
-        onClick: function onClick() {
-          return item.action && item.action();
+        onClick: function onClick(e) {
+          return item.action && item.action(e);
         },
         children: item === null || item === void 0 ? void 0 : item.label
       }, item === null || item === void 0 ? void 0 : item.label);

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"names":["React","styled","NavLink","NavItem","BREAKPOINTS","ComponentTextStyle","Button","ComponentMStyling","defaultOnMouseDownHandler","NavContainer","div","SMALL","MEDIUM","SecondaryButton","Bold","RightSideNav","items","action","getNavItem","item","disabled","label","exact","to","reverse","map","no"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,OAAR,QAAsB,kBAAtB;AAEA,SAAQC,OAAR,QAAsB,eAAtB;AACA,SAAQC,WAAR,EAAqBC,kBAArB,QAA8C,cAA9C;AACA,SAAQC,MAAR,QAAqB,cAArB;AACA,SAAQC,iBAAR,QAAgC,cAAhC;AACA,SAAQC,yBAAR,QAAwC,cAAxC;;;AAGA,IAAMC,YAAY,GAAGR,MAAM,CAACS,GAAV,2VAUdN,WAAW,CAACO,KAVE,EAcdP,WAAW,CAACQ,MAdE,CAAlB;AA0BA,IAAMC,eAAe,GAAGZ,MAAM,CAACK,MAAD,CAAT,uHAIjBC,iBAAiB,CAACF,kBAAkB,CAACS,IAApB,EAA0B,OAA1B,CAJA,CAArB;;AAYA,IAAMC,YAAY,GAAG,SAAfA,YAAe,OAAuD;AAAA,MAArDC,KAAqD,QAArDA,KAAqD;AAAA,MAA9CC,MAA8C,QAA9CA,MAA8C;;AAC1E,MAAMC,UAAU,GAAG,SAAbA,UAAa,CAACC,IAAD,EAAsC;AACvD,QAAIA,IAAJ,aAAIA,IAAJ,eAAIA,IAAI,CAAEC,QAAV,EAAoB;AAClB,0BACE,KAAC,OAAD;AAAS,QAAA,EAAE,EAAEd,MAAb;AAAqB,QAAA,SAAS,EAAC,UAA/B;AAAA,kBACGa,IADH,aACGA,IADH,uBACGA,IAAI,CAAEE;AADT,SAA+CF,IAA/C,aAA+CA,IAA/C,uBAA+CA,IAAI,CAAEE,KAArD,CADF;AAKD,KAND,MAMO;AACL,0BACE,KAAC,OAAD;AACE,QAAA,EAAE,EAAEnB,OADN;AAEE,QAAA,KAAK,EAAEiB,IAAF,aAAEA,IAAF,uBAAEA,IAAI,CAAEG,KAFf;AAGE,QAAA,EAAE,EAAE,CAAAH,IAAI,SAAJ,IAAAA,IAAI,WAAJ,YAAAA,IAAI,CAAEI,EAAN,KAAY,EAHlB;AAKE,QAAA,WAAW,EAAEf,yBALf;AAME,QAAA,OAAO,EAAE;AAAA,iBAAMW,IAAI,CAACF,MAAL,IAAeE,IAAI,CAACF,MAAL,EAArB;AAAA,SANX;AAAA,kBAOGE,IAPH,aAOGA,IAPH,uBAOGA,IAAI,CAAEE;AAPT,SAIOF,IAJP,aAIOA,IAJP,uBAIOA,IAAI,CAAEE,KAJb,CADF;AAWD;AACF,GApBD;;AAqBA,sBACE,MAAC,YAAD;AAAA,eACGL,KADH,aACGA,KADH,uBACGA,KAAK,CAAEQ,OAAP,GAAiBC,GAAjB,CAAqB,UAAAC,EAAE;AAAA,aAAIR,UAAU,CAACQ,EAAD,CAAd;AAAA,KAAvB,CADH,EAIIT,MAAM,iBACN,KAAC,eAAD;AAAiB,MAAA,OAAO,EAAC,WAAzB;AAAqC,MAAA,OAAO,EAAEA,MAAF,aAAEA,MAAF,uBAAEA,MAAM,CAAEA,MAAtD;AAAA,gBACGA,MAAM,CAACI;AADV,MALJ;AAAA,IADF;AAYD,CAlCD;;;AAJEL,EAAAA,K;;AAwCF,eAAeD,YAAf","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../../NavItem';\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\nimport {Button} from '../../Button';\nimport {ComponentMStyling} from '../../styles';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div`\n  display: flex;\n  margin: auto 0 auto auto;\n  align-items: center;\n  height: 48px;\n\n  a {\n    text-decoration: none;\n  }\n\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    height: 64px;\n  }\n\n  button,\n  div {\n    &:hover {\n      cursor: pointer;\n    }\n  }\n`;\n\nconst SecondaryButton = styled(Button)`\n  height: 40px;\n  margin: 0 8px;\n\n  ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n  items?: MenuNavigationItemTypeItem[];\n  action?: MenuButton;\n};\n\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\n  const getNavItem = (item: MenuNavigationItemTypeItem) => {\n    if (item?.disabled) {\n      return (\n        <NavItem as={Button} className=\"disabled\" key={item?.label}>\n          {item?.label}\n        </NavItem>\n      );\n    } else {\n      return (\n        <NavItem\n          as={NavLink}\n          exact={item?.exact}\n          to={item?.to || ''}\n          key={item?.label}\n          onMouseDown={defaultOnMouseDownHandler}\n          onClick={() => item.action && item.action()}>\n          {item?.label}\n        </NavItem>\n      );\n    }\n  };\n  return (\n    <NavContainer>\n      {items?.reverse().map(no => getNavItem(no))}\n\n      {\n        action &&\n        <SecondaryButton variant=\"secondary\" onClick={action?.action}>\n          {action.label}\n        </SecondaryButton>\n      }\n    </NavContainer>\n  );\n};\n\nexport default RightSideNav;\n"],"file":"RightSideNav.js"}
+{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"names":["React","styled","NavLink","NavItem","BREAKPOINTS","ComponentTextStyle","Button","ComponentMStyling","defaultOnMouseDownHandler","NavContainer","div","SMALL","MEDIUM","SecondaryButton","Bold","RightSideNav","items","action","getNavItem","item","disabled","label","exact","to","e","reverse","map","no"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,OAAR,QAAsB,kBAAtB;AAEA,SAAQC,OAAR,QAAsB,eAAtB;AACA,SAAQC,WAAR,EAAqBC,kBAArB,QAA8C,cAA9C;AACA,SAAQC,MAAR,QAAqB,cAArB;AACA,SAAQC,iBAAR,QAAgC,cAAhC;AACA,SAAQC,yBAAR,QAAwC,cAAxC;;;AAGA,IAAMC,YAAY,GAAGR,MAAM,CAACS,GAAV,2VAUdN,WAAW,CAACO,KAVE,EAcdP,WAAW,CAACQ,MAdE,CAAlB;AA0BA,IAAMC,eAAe,GAAGZ,MAAM,CAACK,MAAD,CAAT,uHAIjBC,iBAAiB,CAACF,kBAAkB,CAACS,IAApB,EAA0B,OAA1B,CAJA,CAArB;;AAYA,IAAMC,YAAY,GAAG,SAAfA,YAAe,OAAuD;AAAA,MAArDC,KAAqD,QAArDA,KAAqD;AAAA,MAA9CC,MAA8C,QAA9CA,MAA8C;;AAC1E,MAAMC,UAAU,GAAG,SAAbA,UAAa,CAACC,IAAD,EAAsC;AACvD,QAAIA,IAAJ,aAAIA,IAAJ,eAAIA,IAAI,CAAEC,QAAV,EAAoB;AAClB,0BACE,KAAC,OAAD;AAAS,QAAA,EAAE,EAAEd,MAAb;AAAqB,QAAA,SAAS,EAAC,UAA/B;AAAA,kBACGa,IADH,aACGA,IADH,uBACGA,IAAI,CAAEE;AADT,SAA+CF,IAA/C,aAA+CA,IAA/C,uBAA+CA,IAAI,CAAEE,KAArD,CADF;AAKD,KAND,MAMO;AACL,0BACE,KAAC,OAAD;AACE,QAAA,EAAE,EAAEnB,OADN;AAEE,QAAA,KAAK,EAAEiB,IAAF,aAAEA,IAAF,uBAAEA,IAAI,CAAEG,KAFf;AAGE,QAAA,EAAE,EAAE,CAAAH,IAAI,SAAJ,IAAAA,IAAI,WAAJ,YAAAA,IAAI,CAAEI,EAAN,KAAY,EAHlB;AAKE,QAAA,WAAW,EAAEf,yBALf;AAME,QAAA,OAAO,EAAE,iBAACgB,CAAD;AAAA,iBAAwBL,IAAI,CAACF,MAAL,IAAeE,IAAI,CAACF,MAAL,CAAYO,CAAZ,CAAvC;AAAA,SANX;AAAA,kBAOGL,IAPH,aAOGA,IAPH,uBAOGA,IAAI,CAAEE;AAPT,SAIOF,IAJP,aAIOA,IAJP,uBAIOA,IAAI,CAAEE,KAJb,CADF;AAWD;AACF,GApBD;;AAqBA,sBACE,MAAC,YAAD;AAAA,eACGL,KADH,aACGA,KADH,uBACGA,KAAK,CAAES,OAAP,GAAiBC,GAAjB,CAAqB,UAAAC,EAAE;AAAA,aAAIT,UAAU,CAACS,EAAD,CAAd;AAAA,KAAvB,CADH,EAIIV,MAAM,iBACN,KAAC,eAAD;AAAiB,MAAA,OAAO,EAAC,WAAzB;AAAqC,MAAA,OAAO,EAAEA,MAAF,aAAEA,MAAF,uBAAEA,MAAM,CAAEA,MAAtD;AAAA,gBACGA,MAAM,CAACI;AADV,MALJ;AAAA,IADF;AAYD,CAlCD;;;AAJEL,EAAAA,K;;AAwCF,eAAeD,YAAf","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../../NavItem';\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\nimport {Button} from '../../Button';\nimport {ComponentMStyling} from '../../styles';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div`\n  display: flex;\n  margin: auto 0 auto auto;\n  align-items: center;\n  height: 48px;\n\n  a {\n    text-decoration: none;\n  }\n\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    height: 64px;\n  }\n\n  button,\n  div {\n    &:hover {\n      cursor: pointer;\n    }\n  }\n`;\n\nconst SecondaryButton = styled(Button)`\n  height: 40px;\n  margin: 0 8px;\n\n  ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n  items?: MenuNavigationItemTypeItem[];\n  action?: MenuButton;\n};\n\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\n  const getNavItem = (item: MenuNavigationItemTypeItem) => {\n    if (item?.disabled) {\n      return (\n        <NavItem as={Button} className=\"disabled\" key={item?.label}>\n          {item?.label}\n        </NavItem>\n      );\n    } else {\n      return (\n        <NavItem\n          as={NavLink}\n          exact={item?.exact}\n          to={item?.to || ''}\n          key={item?.label}\n          onMouseDown={defaultOnMouseDownHandler}\n          onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\n          {item?.label}\n        </NavItem>\n      );\n    }\n  };\n  return (\n    <NavContainer>\n      {items?.reverse().map(no => getNavItem(no))}\n\n      {\n        action &&\n        <SecondaryButton variant=\"secondary\" onClick={action?.action}>\n          {action.label}\n        </SecondaryButton>\n      }\n    </NavContainer>\n  );\n};\n\nexport default RightSideNav;\n"],"file":"RightSideNav.js"}

package/dist/GlobalNavigationBar/desktop/UserMenu.cjs

@@ -33,7 +33,7 @@ var _breakpoints = _interopRequireDefault(require("../../styles/breakpoints"));
 
 var _MenuItem = require("../../MenuItem");
 
-var _NavigationHelper = require("../NavigationHelper");
+var _NavigationHelper = require("../../common/NavigationHelper");
 
 var _ProfileButton = require("../../ProfileButton");
 
@@ -108,8 +108,8 @@ var UserMenu = function UserMenu(_ref) {
         icon: item.icon,
         displayLabel: item.label
       },
-      onClickHandler: function onClickHandler() {
-        item.action && item.action();
+      onClickHandler: function onClickHandler(e) {
+        item.action && item.action(e);
         navigate(item.to, !!item.external);
       }
     }, index);

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"names":["UserMenuScrollContainer","styled","div","UserMenuPinnedContainer","UserMenuWrapper","COLORS","white","Z_INDEXES","off_canvas","Breakpoints","MEDIUM","flowDown","BOXSHADOWS","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","ComponentTextStyle","Bold","neutral_500","MenuSectionList","UserMenuSectionListStyling","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","React","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Size","Large","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n  BOXSHADOWS,\n  COLORS,\n  ComponentLStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n  flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n  margin: 0;\n  background-color: ${COLORS.white};\n  box-sizing: border-box;\n  display: none;\n  width: 320px;\n\n  position: absolute;\n\n  &.show {\n    display: block;\n  }\n\n  top: 0;\n  right: 0;\n  z-index: ${Z_INDEXES.off_canvas};\n  height: 100%;\n  flex-flow: column;\n\n\n  ${Breakpoints.MEDIUM} {\n    flex-flow: initial;\n    top: initial;\n    right: initial;\n    height: initial;\n    animation: ${flowDown} 0.2s ease-in-out;\n    box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n    border-radius: 8px;\n    border: 1px solid ${COLORS.neutral_200};\n    z-index: ${Z_INDEXES.fixed_menu};\n    padding: 24px 0;\n  }\n`;\n\n\nconst MenuSection = styled.div`\n  padding: 4px 0;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ${COLORS.neutral_200};\n  }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n  align-items: center;\n  justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n  display: flex;\n  align-items: center;\n  padding: 8px 24px 4px 24px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ${COLORS.neutral_20};\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n  margin: 0;\n  padding: 0;\n\n  ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n  pointer-events: none;\n\n  button {\n    padding: 0 !important;\n  }\n\n  button > div {\n    width: 48px !important;\n    height: 48px !important;\n    border-radius: 50% !important;\n  }\n`;\n\nconst UserSectionInfo = styled.div`\n  padding: 2px 0;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n  ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n  word-break: break-all;\n  ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n  padding: 2px 0;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n  svg {\n    width: 16px;\n    height: 16px;\n  }\n`;\n\nconst UserSection = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 0 24px 8px 24px;\n  gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n  show?: boolean;\n  onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n  const {navigate, isActiveRoute} = useNavigationHelper();\n\n  React.useEffect(() => {\n    if (!onHideUserMenu) return;\n\n    function handleKeyPress(e: any) {\n      if (e.key === 'Escape' || e.key === 'Esc') {\n        onHideUserMenu();\n      }\n    }\n\n    document.addEventListener('keydown', handleKeyPress, false);\n    return () => {\n      document.removeEventListener('keydown', handleKeyPress, false);\n    };\n  }, [onHideUserMenu]);\n\n  const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n    <MenuItem key={index}\n              id={`profile_${index}`}\n              active={!item.external && isActiveRoute(item.to, !!item.exact)}\n              item={{\n                value: item.to,\n                disabled: item.disabled,\n                icon: item.icon,\n                displayLabel: item.label,\n              }}\n              onClickHandler={() => {\n                item.action && item.action();\n                navigate(item.to, !!item.external);\n              }}/>\n\n  return (\n    <UserMenuWrapper onClick={onHideUserMenu}\n                     className={show ? 'show' : ''}\n                     role=\"menu\"\n                     aria-labelledby=\"UserMenuButton\">\n      <UserMenuScrollContainer>\n        <UserSection>\n          <UserSectionAvatar>\n            <ProfileButton onClick={() => {\n            }}\n                           tabIndex={-1}\n                           initials={user.firstName[0] + user.lastName[0]}/>\n          </UserSectionAvatar>\n          <UserSectionInfo>\n            <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n            <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n            {\n              user.link &&\n              <HyperLink variant={'default'}\n                         href={user.link.href}\n                         target={user.link.target}\n                         id={user.link.id}\n                         onClick={user.link.onClick}>\n                <UserSectionInfoLink>\n                  <span>\n                    {user.link.label}\n                  </span>\n                  {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n                </UserSectionInfoLink>\n              </HyperLink>\n            }\n          </UserSectionInfo>\n        </UserSection>\n        {\n          sections.filter(a => !a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n      </UserMenuScrollContainer>\n      <UserMenuPinnedContainer>\n        {\n          sections.filter(a => !!a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n        {\n          signOut &&\n          <SignOutActionWrapper>\n            <Button width={'272px'}\n                    variant=\"secondary\"\n                    icon={<SystemIcons.Logout/>}\n                    size={Size.Large}\n                    onClick={e => {\n                      e.preventDefault();\n                      signOut?.action();\n                    }}>\n              {signOut?.label}\n            </Button>\n          </SignOutActionWrapper>\n        }\n      </UserMenuPinnedContainer>\n    </UserMenuWrapper>\n  );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.cjs"}
+{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"names":["UserMenuScrollContainer","styled","div","UserMenuPinnedContainer","UserMenuWrapper","COLORS","white","Z_INDEXES","off_canvas","Breakpoints","MEDIUM","flowDown","BOXSHADOWS","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","ComponentTextStyle","Bold","neutral_500","MenuSectionList","UserMenuSectionListStyling","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","React","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Size","Large","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n  BOXSHADOWS,\n  COLORS,\n  ComponentLStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n  flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n  margin: 0;\n  background-color: ${COLORS.white};\n  box-sizing: border-box;\n  display: none;\n  width: 320px;\n\n  position: absolute;\n\n  &.show {\n    display: block;\n  }\n\n  top: 0;\n  right: 0;\n  z-index: ${Z_INDEXES.off_canvas};\n  height: 100%;\n  flex-flow: column;\n\n\n  ${Breakpoints.MEDIUM} {\n    flex-flow: initial;\n    top: initial;\n    right: initial;\n    height: initial;\n    animation: ${flowDown} 0.2s ease-in-out;\n    box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n    border-radius: 8px;\n    border: 1px solid ${COLORS.neutral_200};\n    z-index: ${Z_INDEXES.fixed_menu};\n    padding: 24px 0;\n  }\n`;\n\n\nconst MenuSection = styled.div`\n  padding: 4px 0;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ${COLORS.neutral_200};\n  }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n  align-items: center;\n  justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n  display: flex;\n  align-items: center;\n  padding: 8px 24px 4px 24px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ${COLORS.neutral_20};\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n  margin: 0;\n  padding: 0;\n\n  ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n  pointer-events: none;\n\n  button {\n    padding: 0 !important;\n  }\n\n  button > div {\n    width: 48px !important;\n    height: 48px !important;\n    border-radius: 50% !important;\n  }\n`;\n\nconst UserSectionInfo = styled.div`\n  padding: 2px 0;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n  ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n  word-break: break-all;\n  ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n  padding: 2px 0;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n  svg {\n    width: 16px;\n    height: 16px;\n  }\n`;\n\nconst UserSection = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 0 24px 8px 24px;\n  gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n  show?: boolean;\n  onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n  const {navigate, isActiveRoute} = useNavigationHelper();\n\n  React.useEffect(() => {\n    if (!onHideUserMenu) return;\n\n    function handleKeyPress(e: any) {\n      if (e.key === 'Escape' || e.key === 'Esc') {\n        onHideUserMenu();\n      }\n    }\n\n    document.addEventListener('keydown', handleKeyPress, false);\n    return () => {\n      document.removeEventListener('keydown', handleKeyPress, false);\n    };\n  }, [onHideUserMenu]);\n\n  const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n    <MenuItem key={index}\n              id={`profile_${index}`}\n              active={!item.external && isActiveRoute(item.to, !!item.exact)}\n              item={{\n                value: item.to,\n                disabled: item.disabled,\n                icon: item.icon,\n                displayLabel: item.label,\n              }}\n              onClickHandler={(e) => {\n                item.action && item.action(e);\n                navigate(item.to, !!item.external);\n              }}/>\n\n  return (\n    <UserMenuWrapper onClick={onHideUserMenu}\n                     className={show ? 'show' : ''}\n                     role=\"menu\"\n                     aria-labelledby=\"UserMenuButton\">\n      <UserMenuScrollContainer>\n        <UserSection>\n          <UserSectionAvatar>\n            <ProfileButton onClick={() => {\n            }}\n                           tabIndex={-1}\n                           initials={user.firstName[0] + user.lastName[0]}/>\n          </UserSectionAvatar>\n          <UserSectionInfo>\n            <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n            <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n            {\n              user.link &&\n              <HyperLink variant={'default'}\n                         href={user.link.href}\n                         target={user.link.target}\n                         id={user.link.id}\n                         onClick={user.link.onClick}>\n                <UserSectionInfoLink>\n                  <span>\n                    {user.link.label}\n                  </span>\n                  {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n                </UserSectionInfoLink>\n              </HyperLink>\n            }\n          </UserSectionInfo>\n        </UserSection>\n        {\n          sections.filter(a => !a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n      </UserMenuScrollContainer>\n      <UserMenuPinnedContainer>\n        {\n          sections.filter(a => !!a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n        {\n          signOut &&\n          <SignOutActionWrapper>\n            <Button width={'272px'}\n                    variant=\"secondary\"\n                    icon={<SystemIcons.Logout/>}\n                    size={Size.Large}\n                    onClick={e => {\n                      e.preventDefault();\n                      signOut?.action();\n                    }}>\n              {signOut?.label}\n            </Button>\n          </SignOutActionWrapper>\n        }\n      </UserMenuPinnedContainer>\n    </UserMenuWrapper>\n  );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.cjs"}

package/dist/GlobalNavigationBar/desktop/UserMenu.js

@@ -13,7 +13,7 @@ import { SystemIcons } from '../../icons';
 import { HyperLink } from '../../HyperLink';
 import Breakpoints from '../../styles/breakpoints';
 import { MenuItem } from '../../MenuItem';
-import { useNavigationHelper } from '../NavigationHelper';
+import { useNavigationHelper } from '../../common/NavigationHelper';
 import { ProfileButton } from '../../ProfileButton';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -68,8 +68,8 @@ var UserMenu = function UserMenu(_ref) {
         icon: item.icon,
         displayLabel: item.label
       },
-      onClickHandler: function onClickHandler() {
-        item.action && item.action();
+      onClickHandler: function onClickHandler(e) {
+        item.action && item.action(e);
         navigate(item.to, !!item.external);
       }
     }, index);

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"names":["React","styled","Button","BOXSHADOWS","COLORS","ComponentLStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","Size","flowDown","UserMenuSectionListStyling","SystemIcons","HyperLink","Breakpoints","MenuItem","useNavigationHelper","ProfileButton","UserMenuScrollContainer","div","UserMenuPinnedContainer","UserMenuWrapper","white","off_canvas","MEDIUM","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","Bold","neutral_500","MenuSectionList","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Large","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n  BOXSHADOWS,\n  COLORS,\n  ComponentLStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n  flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n  margin: 0;\n  background-color: ${COLORS.white};\n  box-sizing: border-box;\n  display: none;\n  width: 320px;\n\n  position: absolute;\n\n  &.show {\n    display: block;\n  }\n\n  top: 0;\n  right: 0;\n  z-index: ${Z_INDEXES.off_canvas};\n  height: 100%;\n  flex-flow: column;\n\n\n  ${Breakpoints.MEDIUM} {\n    flex-flow: initial;\n    top: initial;\n    right: initial;\n    height: initial;\n    animation: ${flowDown} 0.2s ease-in-out;\n    box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n    border-radius: 8px;\n    border: 1px solid ${COLORS.neutral_200};\n    z-index: ${Z_INDEXES.fixed_menu};\n    padding: 24px 0;\n  }\n`;\n\n\nconst MenuSection = styled.div`\n  padding: 4px 0;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ${COLORS.neutral_200};\n  }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n  align-items: center;\n  justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n  display: flex;\n  align-items: center;\n  padding: 8px 24px 4px 24px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ${COLORS.neutral_20};\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n  margin: 0;\n  padding: 0;\n\n  ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n  pointer-events: none;\n\n  button {\n    padding: 0 !important;\n  }\n\n  button > div {\n    width: 48px !important;\n    height: 48px !important;\n    border-radius: 50% !important;\n  }\n`;\n\nconst UserSectionInfo = styled.div`\n  padding: 2px 0;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n  ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n  word-break: break-all;\n  ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n  padding: 2px 0;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n  svg {\n    width: 16px;\n    height: 16px;\n  }\n`;\n\nconst UserSection = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 0 24px 8px 24px;\n  gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n  show?: boolean;\n  onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n  const {navigate, isActiveRoute} = useNavigationHelper();\n\n  React.useEffect(() => {\n    if (!onHideUserMenu) return;\n\n    function handleKeyPress(e: any) {\n      if (e.key === 'Escape' || e.key === 'Esc') {\n        onHideUserMenu();\n      }\n    }\n\n    document.addEventListener('keydown', handleKeyPress, false);\n    return () => {\n      document.removeEventListener('keydown', handleKeyPress, false);\n    };\n  }, [onHideUserMenu]);\n\n  const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n    <MenuItem key={index}\n              id={`profile_${index}`}\n              active={!item.external && isActiveRoute(item.to, !!item.exact)}\n              item={{\n                value: item.to,\n                disabled: item.disabled,\n                icon: item.icon,\n                displayLabel: item.label,\n              }}\n              onClickHandler={() => {\n                item.action && item.action();\n                navigate(item.to, !!item.external);\n              }}/>\n\n  return (\n    <UserMenuWrapper onClick={onHideUserMenu}\n                     className={show ? 'show' : ''}\n                     role=\"menu\"\n                     aria-labelledby=\"UserMenuButton\">\n      <UserMenuScrollContainer>\n        <UserSection>\n          <UserSectionAvatar>\n            <ProfileButton onClick={() => {\n            }}\n                           tabIndex={-1}\n                           initials={user.firstName[0] + user.lastName[0]}/>\n          </UserSectionAvatar>\n          <UserSectionInfo>\n            <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n            <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n            {\n              user.link &&\n              <HyperLink variant={'default'}\n                         href={user.link.href}\n                         target={user.link.target}\n                         id={user.link.id}\n                         onClick={user.link.onClick}>\n                <UserSectionInfoLink>\n                  <span>\n                    {user.link.label}\n                  </span>\n                  {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n                </UserSectionInfoLink>\n              </HyperLink>\n            }\n          </UserSectionInfo>\n        </UserSection>\n        {\n          sections.filter(a => !a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n      </UserMenuScrollContainer>\n      <UserMenuPinnedContainer>\n        {\n          sections.filter(a => !!a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n        {\n          signOut &&\n          <SignOutActionWrapper>\n            <Button width={'272px'}\n                    variant=\"secondary\"\n                    icon={<SystemIcons.Logout/>}\n                    size={Size.Large}\n                    onClick={e => {\n                      e.preventDefault();\n                      signOut?.action();\n                    }}>\n              {signOut?.label}\n            </Button>\n          </SignOutActionWrapper>\n        }\n      </UserMenuPinnedContainer>\n    </UserMenuWrapper>\n  );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.js"}
+{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"names":["React","styled","Button","BOXSHADOWS","COLORS","ComponentLStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","Size","flowDown","UserMenuSectionListStyling","SystemIcons","HyperLink","Breakpoints","MenuItem","useNavigationHelper","ProfileButton","UserMenuScrollContainer","div","UserMenuPinnedContainer","UserMenuWrapper","white","off_canvas","MEDIUM","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","Bold","neutral_500","MenuSectionList","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Large","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n  BOXSHADOWS,\n  COLORS,\n  ComponentLStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n  flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n  margin: 0;\n  background-color: ${COLORS.white};\n  box-sizing: border-box;\n  display: none;\n  width: 320px;\n\n  position: absolute;\n\n  &.show {\n    display: block;\n  }\n\n  top: 0;\n  right: 0;\n  z-index: ${Z_INDEXES.off_canvas};\n  height: 100%;\n  flex-flow: column;\n\n\n  ${Breakpoints.MEDIUM} {\n    flex-flow: initial;\n    top: initial;\n    right: initial;\n    height: initial;\n    animation: ${flowDown} 0.2s ease-in-out;\n    box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n    border-radius: 8px;\n    border: 1px solid ${COLORS.neutral_200};\n    z-index: ${Z_INDEXES.fixed_menu};\n    padding: 24px 0;\n  }\n`;\n\n\nconst MenuSection = styled.div`\n  padding: 4px 0;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ${COLORS.neutral_200};\n  }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n  align-items: center;\n  justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n  display: flex;\n  align-items: center;\n  padding: 8px 24px 4px 24px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ${COLORS.neutral_20};\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n  margin: 0;\n  padding: 0;\n\n  ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n  pointer-events: none;\n\n  button {\n    padding: 0 !important;\n  }\n\n  button > div {\n    width: 48px !important;\n    height: 48px !important;\n    border-radius: 50% !important;\n  }\n`;\n\nconst UserSectionInfo = styled.div`\n  padding: 2px 0;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n  ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n  word-break: break-all;\n  ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n  padding: 2px 0;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n  svg {\n    width: 16px;\n    height: 16px;\n  }\n`;\n\nconst UserSection = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 0 24px 8px 24px;\n  gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n  show?: boolean;\n  onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n  const {navigate, isActiveRoute} = useNavigationHelper();\n\n  React.useEffect(() => {\n    if (!onHideUserMenu) return;\n\n    function handleKeyPress(e: any) {\n      if (e.key === 'Escape' || e.key === 'Esc') {\n        onHideUserMenu();\n      }\n    }\n\n    document.addEventListener('keydown', handleKeyPress, false);\n    return () => {\n      document.removeEventListener('keydown', handleKeyPress, false);\n    };\n  }, [onHideUserMenu]);\n\n  const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n    <MenuItem key={index}\n              id={`profile_${index}`}\n              active={!item.external && isActiveRoute(item.to, !!item.exact)}\n              item={{\n                value: item.to,\n                disabled: item.disabled,\n                icon: item.icon,\n                displayLabel: item.label,\n              }}\n              onClickHandler={(e) => {\n                item.action && item.action(e);\n                navigate(item.to, !!item.external);\n              }}/>\n\n  return (\n    <UserMenuWrapper onClick={onHideUserMenu}\n                     className={show ? 'show' : ''}\n                     role=\"menu\"\n                     aria-labelledby=\"UserMenuButton\">\n      <UserMenuScrollContainer>\n        <UserSection>\n          <UserSectionAvatar>\n            <ProfileButton onClick={() => {\n            }}\n                           tabIndex={-1}\n                           initials={user.firstName[0] + user.lastName[0]}/>\n          </UserSectionAvatar>\n          <UserSectionInfo>\n            <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n            <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n            {\n              user.link &&\n              <HyperLink variant={'default'}\n                         href={user.link.href}\n                         target={user.link.target}\n                         id={user.link.id}\n                         onClick={user.link.onClick}>\n                <UserSectionInfoLink>\n                  <span>\n                    {user.link.label}\n                  </span>\n                  {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n                </UserSectionInfoLink>\n              </HyperLink>\n            }\n          </UserSectionInfo>\n        </UserSection>\n        {\n          sections.filter(a => !a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n      </UserMenuScrollContainer>\n      <UserMenuPinnedContainer>\n        {\n          sections.filter(a => !!a.pinned).map((section, index) =>\n            <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n              {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n              <MenuSectionList key={index}>\n                {section.items.map((item, index) => renderItem(item, section, index))}\n              </MenuSectionList>\n            </MenuSection>\n          )\n        }\n        {\n          signOut &&\n          <SignOutActionWrapper>\n            <Button width={'272px'}\n                    variant=\"secondary\"\n                    icon={<SystemIcons.Logout/>}\n                    size={Size.Large}\n                    onClick={e => {\n                      e.preventDefault();\n                      signOut?.action();\n                    }}>\n              {signOut?.label}\n            </Button>\n          </SignOutActionWrapper>\n        }\n      </UserMenuPinnedContainer>\n    </UserMenuWrapper>\n  );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.js"}

package/dist/GlobalNavigationBar/mobile/MobileMenuContent.cjs

@@ -27,7 +27,7 @@ var _reactResponsive = require("react-responsive");
 
 var _Button = require("../../Button");
 
-var _NavigationHelper = require("../NavigationHelper");
+var _NavigationHelper = require("../../common/NavigationHelper");
 
 var _MenuItem = require("../../MenuItem");
 
@@ -149,8 +149,8 @@ var MobileMenuContent = function MobileMenuContent(_ref) {
             displayLabel: item.label,
             noteLabel: item.note
           },
-          onClickHandler: function onClickHandler() {
-            item.action && item.action();
+          onClickHandler: function onClickHandler(e) {
+            item.action && item.action(e);
             navigate(item.to, !!item.external);
           }
         }, index);

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuContent.tsx"],"names":["HeaderText","styled","div","ComponentTextStyle","Bold","COLORS","neutral_600","BREAKPOINTS","SMALL","HeaderNote","ParagraphTextStyle","Regular","HeaderContainer","neutral_200","ScrollableContainer","Size","Small","MenuItemsContainer","MenuSectionContainer","MenuSectionHeader","neutral_20","neutral_500","MenuSectionList","PinnedContainer","FooterText","FooterNote","FooterLink","FooterContainer","ActionContainer","Wrapper","MobileMenuContent","header","items","footer","action","onSubMenuOpen","isSmallScreen","query","replace","navigate","isActiveRoute","React","useState","scrollable","setScrollable","updateOnResize","scrollContainerRef","dimensions","node","useEffect","clientHeight","scrollHeight","renderItem","item","index","type","label","map","Medium","value","disabled","icon","displayLabel","noteLabel","note","e","nativeEvent","stopImmediatePropagation","external","to","exact","filter","a","pinned","some","link","id","target","onClick","href"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {\n  MenuButton,\n  MenuGroupFooter,\n  MenuGroupHeader,\n  MenuNavigationItemTypeGroup,\n  MenuNavigationItemTypeItem,\n  MenuNavigationItemTypeSection\n} from '../types';\nimport styled from 'styled-components';\nimport {\n  BREAKPOINTS,\n  COLORS,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  ParagraphSStyling,\n  ParagraphTextStyle,\n  ParagraphXSStyling,\n  scrollBarStyling\n} from '../../styles';\nimport {Size} from '../../types';\nimport {HyperLink} from '../../HyperLink';\nimport {useMediaQuery} from 'react-responsive';\nimport {Button} from '../../Button';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {MenuItem} from '../../MenuItem';\nimport {SystemIcons} from '../../icons';\nimport {useDimensionsRef} from 'rooks';\n\n\nconst HeaderText = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\nconst HeaderNote = styled.div`\n  word-break: break-all;\n  ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderContainer = styled.div`\n  margin: 0 24px;\n  padding-bottom: 8px;\n  box-sizing: border-box;\n  border-bottom: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n`;\n\n\nconst ScrollableContainer = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n  max-height: 100%;\n\n  &.scrollable {\n    margin-right: 6px;\n    padding-right: 10px;\n  }\n\n  ${scrollBarStyling(Size.Small)}\n\n  ::-webkit-scrollbar-track {\n    margin: 8px;\n  }\n\n`;\n\nconst MenuItemsContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  padding: 8px;\n`;\n\nconst MenuSectionContainer = styled.div`\n  padding-bottom: 8px;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ${COLORS.neutral_200};\n  }\n`;\n\nconst MenuSectionHeader = styled.div`\n  display: flex;\n  align-items: center;\n  padding: 8px 16px 4px 16px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ${COLORS.neutral_20};\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n  display: flex;\n  flex-direction: column;\n`;\n\n\nconst PinnedContainer = styled.div`\n  border-top: 1px solid ${COLORS.neutral_200};\n`;\n\nconst FooterText = styled.div`\n  ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\nconst FooterNote = styled.div`\n  ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ParagraphSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n  }\n`;\nconst FooterLink = styled.div`\n  a {\n    ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n    ${BREAKPOINTS.SMALL} {\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n    }\n  }\n`;\n\nconst FooterContainer = styled.div`\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n  background: ${COLORS.neutral_20};\n\n  ${BREAKPOINTS.SMALL} {\n    padding: 16px;\n  }\n`;\n\nconst ActionContainer = styled.div`\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n\n  ${BREAKPOINTS.SMALL} {\n    padding: 16px;\n  }\n`;\n\nconst Wrapper = 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\ninterface MobileMenuContentProps {\n  header?: MenuGroupHeader;\n  items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n  footer?: MenuGroupFooter;\n  action?: MenuButton;\n\n  onSubMenuOpen?: (item: MenuNavigationItemTypeGroup) => void;\n}\n\nconst MobileMenuContent: React.FunctionComponent<MobileMenuContentProps> = ({\n                                                                              header,\n                                                                              items,\n                                                                              footer,\n                                                                              action,\n                                                                              onSubMenuOpen\n                                                                            }) => {\n\n  const isSmallScreen = useMediaQuery({query: BREAKPOINTS.SMALL.replace('@media ', '')});\n\n  const {navigate, isActiveRoute} = useNavigationHelper();\n\n  const [scrollable, setScrollable] = React.useState(false);\n\n  const [scrollContainerRef, dimensions, node] = useDimensionsRef({updateOnResize: true});\n\n  React.useEffect(() => {\n    const clientHeight = node?.clientHeight ?? 0;\n    const scrollHeight = node?.scrollHeight ?? 0;\n    setScrollable(scrollHeight > clientHeight);\n  }, [header, dimensions, node, footer, action, items]);\n\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection, index: number) => {\n    switch (item.type) {\n      case 'section':\n        return (\n          <MenuSectionContainer key={index}>\n            {item.label && <MenuSectionHeader>{item.label}</MenuSectionHeader>}\n            <MenuSectionList>\n              {item.items.map((item, index) => renderItem(item, index))}\n            </MenuSectionList>\n          </MenuSectionContainer>\n        );\n      case 'group':\n        return <MenuItem key={index}\n                         id={'menu-item-' + index}\n                         size={isSmallScreen ? Size.Medium : Size.Small}\n                         active={false}\n                         item={{\n                           value: item.label,\n                           disabled: item.disabled,\n                           icon: item.icon,\n                           displayLabel: item.label,\n                           noteLabel: item.note,\n                         }}\n                         iconRight={<SystemIcons.ArrowDropRight/>}\n                         onClickHandler={(e) => {\n                           e.nativeEvent.stopImmediatePropagation();\n                           onSubMenuOpen && onSubMenuOpen(item);\n                         }}/>\n      case 'item':\n      default:\n        return (\n          <MenuItem key={index}\n                    id={'menu-item-' + index}\n                    active={!item.external && isActiveRoute(item.to, !!item.exact)}\n                    size={isSmallScreen ? Size.Medium : Size.Small}\n                    item={{\n                      value: item.to,\n                      disabled: item.disabled,\n                      icon: item.icon,\n                      displayLabel: item.label,\n                      noteLabel: item.note,\n                    }}\n                    onClickHandler={() => {\n                      item.action && item.action();\n                      navigate(item.to, !!item.external);\n                    }}/>\n        );\n    }\n  }\n\n  return (\n    <Wrapper>\n      <ScrollableContainer ref={scrollContainerRef as any} className={scrollable ? 'scrollable' : ''}>\n        {\n          !!header &&\n          <HeaderContainer>\n            <HeaderText>{header.header}</HeaderText>\n            {header.note && <HeaderNote>{header.note}</HeaderNote>}\n          </HeaderContainer>\n        }\n        <MenuItemsContainer>\n          {items?.filter(a => !a.pinned).map((item, index) => renderItem(item, index))}\n        </MenuItemsContainer>\n      </ScrollableContainer>\n      {\n        items?.some(a => a.pinned) &&\n        <PinnedContainer>\n          <MenuItemsContainer>\n            {items?.filter(a => !!a.pinned).map((item, index) => renderItem(item, index))}\n          </MenuItemsContainer>\n        </PinnedContainer>\n\n      }\n      {\n        footer &&\n        <FooterContainer>\n          <FooterText>{footer.header}</FooterText>\n          {footer.note && <FooterNote>{footer.note}</FooterNote>}\n          {footer.link &&\n            <FooterLink>\n              <HyperLink variant={'default'}\n                         id={footer.link.id}\n                         target={footer.link.target}\n                         onClick={footer.link.onClick}\n                         href={footer.link.href}>\n                {footer.link.label}\n              </HyperLink>\n            </FooterLink>\n          }\n        </FooterContainer>\n      }\n      {\n        action &&\n        <ActionContainer>\n          <Button variant={'secondary'}\n                  size={isSmallScreen ? Size.Medium : Size.Small}\n                  disabled={action.disabled}\n                  icon={action.icon}\n                  onClick={action.action}>\n            {action.label}\n          </Button>\n        </ActionContainer>\n      }\n    </Wrapper>\n  )\n};\n\nexport default MobileMenuContent;\n"],"file":"MobileMenuContent.cjs"}
+{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuContent.tsx"],"names":["HeaderText","styled","div","ComponentTextStyle","Bold","COLORS","neutral_600","BREAKPOINTS","SMALL","HeaderNote","ParagraphTextStyle","Regular","HeaderContainer","neutral_200","ScrollableContainer","Size","Small","MenuItemsContainer","MenuSectionContainer","MenuSectionHeader","neutral_20","neutral_500","MenuSectionList","PinnedContainer","FooterText","FooterNote","FooterLink","FooterContainer","ActionContainer","Wrapper","MobileMenuContent","header","items","footer","action","onSubMenuOpen","isSmallScreen","query","replace","navigate","isActiveRoute","React","useState","scrollable","setScrollable","updateOnResize","scrollContainerRef","dimensions","node","useEffect","clientHeight","scrollHeight","renderItem","item","index","type","label","map","Medium","value","disabled","icon","displayLabel","noteLabel","note","e","nativeEvent","stopImmediatePropagation","external","to","exact","filter","a","pinned","some","link","id","target","onClick","href"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {\n  MenuButton,\n  MenuGroupFooter,\n  MenuGroupHeader,\n  MenuNavigationItemTypeGroup,\n  MenuNavigationItemTypeItem,\n  MenuNavigationItemTypeSection\n} from '../types';\nimport styled from 'styled-components';\nimport {\n  BREAKPOINTS,\n  COLORS,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  ParagraphSStyling,\n  ParagraphTextStyle,\n  ParagraphXSStyling,\n  scrollBarStyling\n} from '../../styles';\nimport {Size} from '../../types';\nimport {HyperLink} from '../../HyperLink';\nimport {useMediaQuery} from 'react-responsive';\nimport {Button} from '../../Button';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {MenuItem} from '../../MenuItem';\nimport {SystemIcons} from '../../icons';\nimport {useDimensionsRef} from 'rooks';\n\n\nconst HeaderText = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\nconst HeaderNote = styled.div`\n  word-break: break-all;\n  ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderContainer = styled.div`\n  margin: 0 24px;\n  padding-bottom: 8px;\n  box-sizing: border-box;\n  border-bottom: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n`;\n\n\nconst ScrollableContainer = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n  max-height: 100%;\n\n  &.scrollable {\n    margin-right: 6px;\n    padding-right: 10px;\n  }\n\n  ${scrollBarStyling(Size.Small)}\n\n  ::-webkit-scrollbar-track {\n    margin: 8px;\n  }\n\n`;\n\nconst MenuItemsContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  padding: 8px;\n`;\n\nconst MenuSectionContainer = styled.div`\n  padding-bottom: 8px;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ${COLORS.neutral_200};\n  }\n`;\n\nconst MenuSectionHeader = styled.div`\n  display: flex;\n  align-items: center;\n  padding: 8px 16px 4px 16px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ${COLORS.neutral_20};\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n  display: flex;\n  flex-direction: column;\n`;\n\n\nconst PinnedContainer = styled.div`\n  border-top: 1px solid ${COLORS.neutral_200};\n`;\n\nconst FooterText = styled.div`\n  ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\nconst FooterNote = styled.div`\n  ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ParagraphSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n  }\n`;\nconst FooterLink = styled.div`\n  a {\n    ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n    ${BREAKPOINTS.SMALL} {\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n    }\n  }\n`;\n\nconst FooterContainer = styled.div`\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n  background: ${COLORS.neutral_20};\n\n  ${BREAKPOINTS.SMALL} {\n    padding: 16px;\n  }\n`;\n\nconst ActionContainer = styled.div`\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n\n  ${BREAKPOINTS.SMALL} {\n    padding: 16px;\n  }\n`;\n\nconst Wrapper = 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\ninterface MobileMenuContentProps {\n  header?: MenuGroupHeader;\n  items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n  footer?: MenuGroupFooter;\n  action?: MenuButton;\n\n  onSubMenuOpen?: (item: MenuNavigationItemTypeGroup) => void;\n}\n\nconst MobileMenuContent: React.FunctionComponent<MobileMenuContentProps> = ({\n                                                                              header,\n                                                                              items,\n                                                                              footer,\n                                                                              action,\n                                                                              onSubMenuOpen\n                                                                            }) => {\n\n  const isSmallScreen = useMediaQuery({query: BREAKPOINTS.SMALL.replace('@media ', '')});\n\n  const {navigate, isActiveRoute} = useNavigationHelper();\n\n  const [scrollable, setScrollable] = React.useState(false);\n\n  const [scrollContainerRef, dimensions, node] = useDimensionsRef({updateOnResize: true});\n\n  React.useEffect(() => {\n    const clientHeight = node?.clientHeight ?? 0;\n    const scrollHeight = node?.scrollHeight ?? 0;\n    setScrollable(scrollHeight > clientHeight);\n  }, [header, dimensions, node, footer, action, items]);\n\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection, index: number) => {\n    switch (item.type) {\n      case 'section':\n        return (\n          <MenuSectionContainer key={index}>\n            {item.label && <MenuSectionHeader>{item.label}</MenuSectionHeader>}\n            <MenuSectionList>\n              {item.items.map((item, index) => renderItem(item, index))}\n            </MenuSectionList>\n          </MenuSectionContainer>\n        );\n      case 'group':\n        return <MenuItem key={index}\n                         id={'menu-item-' + index}\n                         size={isSmallScreen ? Size.Medium : Size.Small}\n                         active={false}\n                         item={{\n                           value: item.label,\n                           disabled: item.disabled,\n                           icon: item.icon,\n                           displayLabel: item.label,\n                           noteLabel: item.note,\n                         }}\n                         iconRight={<SystemIcons.ArrowDropRight/>}\n                         onClickHandler={(e) => {\n                           e.nativeEvent.stopImmediatePropagation();\n                           onSubMenuOpen && onSubMenuOpen(item);\n                         }}/>\n      case 'item':\n      default:\n        return (\n          <MenuItem key={index}\n                    id={'menu-item-' + index}\n                    active={!item.external && isActiveRoute(item.to, !!item.exact)}\n                    size={isSmallScreen ? Size.Medium : Size.Small}\n                    item={{\n                      value: item.to,\n                      disabled: item.disabled,\n                      icon: item.icon,\n                      displayLabel: item.label,\n                      noteLabel: item.note,\n                    }}\n                    onClickHandler={(e) => {\n                      item.action && item.action(e);\n                      navigate(item.to, !!item.external);\n                    }}/>\n        );\n    }\n  }\n\n  return (\n    <Wrapper>\n      <ScrollableContainer ref={scrollContainerRef as any} className={scrollable ? 'scrollable' : ''}>\n        {\n          !!header &&\n          <HeaderContainer>\n            <HeaderText>{header.header}</HeaderText>\n            {header.note && <HeaderNote>{header.note}</HeaderNote>}\n          </HeaderContainer>\n        }\n        <MenuItemsContainer>\n          {items?.filter(a => !a.pinned).map((item, index) => renderItem(item, index))}\n        </MenuItemsContainer>\n      </ScrollableContainer>\n      {\n        items?.some(a => a.pinned) &&\n        <PinnedContainer>\n          <MenuItemsContainer>\n            {items?.filter(a => !!a.pinned).map((item, index) => renderItem(item, index))}\n          </MenuItemsContainer>\n        </PinnedContainer>\n\n      }\n      {\n        footer &&\n        <FooterContainer>\n          <FooterText>{footer.header}</FooterText>\n          {footer.note && <FooterNote>{footer.note}</FooterNote>}\n          {footer.link &&\n            <FooterLink>\n              <HyperLink variant={'default'}\n                         id={footer.link.id}\n                         target={footer.link.target}\n                         onClick={footer.link.onClick}\n                         href={footer.link.href}>\n                {footer.link.label}\n              </HyperLink>\n            </FooterLink>\n          }\n        </FooterContainer>\n      }\n      {\n        action &&\n        <ActionContainer>\n          <Button variant={'secondary'}\n                  size={isSmallScreen ? Size.Medium : Size.Small}\n                  disabled={action.disabled}\n                  icon={action.icon}\n                  onClick={action.action}>\n            {action.label}\n          </Button>\n        </ActionContainer>\n      }\n    </Wrapper>\n  )\n};\n\nexport default MobileMenuContent;\n"],"file":"MobileMenuContent.cjs"}

package/dist/GlobalNavigationBar/mobile/MobileMenuContent.js

@@ -11,7 +11,7 @@ import { Size } from '../../types';
 import { HyperLink } from '../../HyperLink';
 import { useMediaQuery } from 'react-responsive';
 import { Button } from '../../Button';
-import { useNavigationHelper } from '../NavigationHelper';
+import { useNavigationHelper } from '../../common/NavigationHelper';
 import { MenuItem } from '../../MenuItem';
 import { SystemIcons } from '../../icons';
 import { useDimensionsRef } from 'rooks';
@@ -113,8 +113,8 @@ var MobileMenuContent = function MobileMenuContent(_ref) {
             displayLabel: item.label,
             noteLabel: item.note
           },
-          onClickHandler: function onClickHandler() {
-            item.action && item.action();
+          onClickHandler: function onClickHandler(e) {
+            item.action && item.action(e);
             navigate(item.to, !!item.external);
           }
         }, index);

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuContent.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","ParagraphSStyling","ParagraphTextStyle","ParagraphXSStyling","scrollBarStyling","Size","HyperLink","useMediaQuery","Button","useNavigationHelper","MenuItem","SystemIcons","useDimensionsRef","HeaderText","div","Bold","neutral_600","SMALL","HeaderNote","Regular","HeaderContainer","neutral_200","ScrollableContainer","Small","MenuItemsContainer","MenuSectionContainer","MenuSectionHeader","neutral_20","neutral_500","MenuSectionList","PinnedContainer","FooterText","FooterNote","FooterLink","FooterContainer","ActionContainer","Wrapper","MobileMenuContent","header","items","footer","action","onSubMenuOpen","isSmallScreen","query","replace","navigate","isActiveRoute","useState","scrollable","setScrollable","updateOnResize","scrollContainerRef","dimensions","node","useEffect","clientHeight","scrollHeight","renderItem","item","index","type","label","map","Medium","value","disabled","icon","displayLabel","noteLabel","note","e","nativeEvent","stopImmediatePropagation","external","to","exact","filter","a","pinned","some","link","id","target","onClick","href"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {\n  MenuButton,\n  MenuGroupFooter,\n  MenuGroupHeader,\n  MenuNavigationItemTypeGroup,\n  MenuNavigationItemTypeItem,\n  MenuNavigationItemTypeSection\n} from '../types';\nimport styled from 'styled-components';\nimport {\n  BREAKPOINTS,\n  COLORS,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  ParagraphSStyling,\n  ParagraphTextStyle,\n  ParagraphXSStyling,\n  scrollBarStyling\n} from '../../styles';\nimport {Size} from '../../types';\nimport {HyperLink} from '../../HyperLink';\nimport {useMediaQuery} from 'react-responsive';\nimport {Button} from '../../Button';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {MenuItem} from '../../MenuItem';\nimport {SystemIcons} from '../../icons';\nimport {useDimensionsRef} from 'rooks';\n\n\nconst HeaderText = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\nconst HeaderNote = styled.div`\n  word-break: break-all;\n  ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderContainer = styled.div`\n  margin: 0 24px;\n  padding-bottom: 8px;\n  box-sizing: border-box;\n  border-bottom: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n`;\n\n\nconst ScrollableContainer = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n  max-height: 100%;\n\n  &.scrollable {\n    margin-right: 6px;\n    padding-right: 10px;\n  }\n\n  ${scrollBarStyling(Size.Small)}\n\n  ::-webkit-scrollbar-track {\n    margin: 8px;\n  }\n\n`;\n\nconst MenuItemsContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  padding: 8px;\n`;\n\nconst MenuSectionContainer = styled.div`\n  padding-bottom: 8px;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ${COLORS.neutral_200};\n  }\n`;\n\nconst MenuSectionHeader = styled.div`\n  display: flex;\n  align-items: center;\n  padding: 8px 16px 4px 16px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ${COLORS.neutral_20};\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n  display: flex;\n  flex-direction: column;\n`;\n\n\nconst PinnedContainer = styled.div`\n  border-top: 1px solid ${COLORS.neutral_200};\n`;\n\nconst FooterText = styled.div`\n  ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\nconst FooterNote = styled.div`\n  ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ParagraphSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n  }\n`;\nconst FooterLink = styled.div`\n  a {\n    ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n    ${BREAKPOINTS.SMALL} {\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n    }\n  }\n`;\n\nconst FooterContainer = styled.div`\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n  background: ${COLORS.neutral_20};\n\n  ${BREAKPOINTS.SMALL} {\n    padding: 16px;\n  }\n`;\n\nconst ActionContainer = styled.div`\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n\n  ${BREAKPOINTS.SMALL} {\n    padding: 16px;\n  }\n`;\n\nconst Wrapper = 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\ninterface MobileMenuContentProps {\n  header?: MenuGroupHeader;\n  items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n  footer?: MenuGroupFooter;\n  action?: MenuButton;\n\n  onSubMenuOpen?: (item: MenuNavigationItemTypeGroup) => void;\n}\n\nconst MobileMenuContent: React.FunctionComponent<MobileMenuContentProps> = ({\n                                                                              header,\n                                                                              items,\n                                                                              footer,\n                                                                              action,\n                                                                              onSubMenuOpen\n                                                                            }) => {\n\n  const isSmallScreen = useMediaQuery({query: BREAKPOINTS.SMALL.replace('@media ', '')});\n\n  const {navigate, isActiveRoute} = useNavigationHelper();\n\n  const [scrollable, setScrollable] = React.useState(false);\n\n  const [scrollContainerRef, dimensions, node] = useDimensionsRef({updateOnResize: true});\n\n  React.useEffect(() => {\n    const clientHeight = node?.clientHeight ?? 0;\n    const scrollHeight = node?.scrollHeight ?? 0;\n    setScrollable(scrollHeight > clientHeight);\n  }, [header, dimensions, node, footer, action, items]);\n\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection, index: number) => {\n    switch (item.type) {\n      case 'section':\n        return (\n          <MenuSectionContainer key={index}>\n            {item.label && <MenuSectionHeader>{item.label}</MenuSectionHeader>}\n            <MenuSectionList>\n              {item.items.map((item, index) => renderItem(item, index))}\n            </MenuSectionList>\n          </MenuSectionContainer>\n        );\n      case 'group':\n        return <MenuItem key={index}\n                         id={'menu-item-' + index}\n                         size={isSmallScreen ? Size.Medium : Size.Small}\n                         active={false}\n                         item={{\n                           value: item.label,\n                           disabled: item.disabled,\n                           icon: item.icon,\n                           displayLabel: item.label,\n                           noteLabel: item.note,\n                         }}\n                         iconRight={<SystemIcons.ArrowDropRight/>}\n                         onClickHandler={(e) => {\n                           e.nativeEvent.stopImmediatePropagation();\n                           onSubMenuOpen && onSubMenuOpen(item);\n                         }}/>\n      case 'item':\n      default:\n        return (\n          <MenuItem key={index}\n                    id={'menu-item-' + index}\n                    active={!item.external && isActiveRoute(item.to, !!item.exact)}\n                    size={isSmallScreen ? Size.Medium : Size.Small}\n                    item={{\n                      value: item.to,\n                      disabled: item.disabled,\n                      icon: item.icon,\n                      displayLabel: item.label,\n                      noteLabel: item.note,\n                    }}\n                    onClickHandler={() => {\n                      item.action && item.action();\n                      navigate(item.to, !!item.external);\n                    }}/>\n        );\n    }\n  }\n\n  return (\n    <Wrapper>\n      <ScrollableContainer ref={scrollContainerRef as any} className={scrollable ? 'scrollable' : ''}>\n        {\n          !!header &&\n          <HeaderContainer>\n            <HeaderText>{header.header}</HeaderText>\n            {header.note && <HeaderNote>{header.note}</HeaderNote>}\n          </HeaderContainer>\n        }\n        <MenuItemsContainer>\n          {items?.filter(a => !a.pinned).map((item, index) => renderItem(item, index))}\n        </MenuItemsContainer>\n      </ScrollableContainer>\n      {\n        items?.some(a => a.pinned) &&\n        <PinnedContainer>\n          <MenuItemsContainer>\n            {items?.filter(a => !!a.pinned).map((item, index) => renderItem(item, index))}\n          </MenuItemsContainer>\n        </PinnedContainer>\n\n      }\n      {\n        footer &&\n        <FooterContainer>\n          <FooterText>{footer.header}</FooterText>\n          {footer.note && <FooterNote>{footer.note}</FooterNote>}\n          {footer.link &&\n            <FooterLink>\n              <HyperLink variant={'default'}\n                         id={footer.link.id}\n                         target={footer.link.target}\n                         onClick={footer.link.onClick}\n                         href={footer.link.href}>\n                {footer.link.label}\n              </HyperLink>\n            </FooterLink>\n          }\n        </FooterContainer>\n      }\n      {\n        action &&\n        <ActionContainer>\n          <Button variant={'secondary'}\n                  size={isSmallScreen ? Size.Medium : Size.Small}\n                  disabled={action.disabled}\n                  icon={action.icon}\n                  onClick={action.action}>\n            {action.label}\n          </Button>\n        </ActionContainer>\n      }\n    </Wrapper>\n  )\n};\n\nexport default MobileMenuContent;\n"],"file":"MobileMenuContent.js"}
+{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuContent.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","ParagraphSStyling","ParagraphTextStyle","ParagraphXSStyling","scrollBarStyling","Size","HyperLink","useMediaQuery","Button","useNavigationHelper","MenuItem","SystemIcons","useDimensionsRef","HeaderText","div","Bold","neutral_600","SMALL","HeaderNote","Regular","HeaderContainer","neutral_200","ScrollableContainer","Small","MenuItemsContainer","MenuSectionContainer","MenuSectionHeader","neutral_20","neutral_500","MenuSectionList","PinnedContainer","FooterText","FooterNote","FooterLink","FooterContainer","ActionContainer","Wrapper","MobileMenuContent","header","items","footer","action","onSubMenuOpen","isSmallScreen","query","replace","navigate","isActiveRoute","useState","scrollable","setScrollable","updateOnResize","scrollContainerRef","dimensions","node","useEffect","clientHeight","scrollHeight","renderItem","item","index","type","label","map","Medium","value","disabled","icon","displayLabel","noteLabel","note","e","nativeEvent","stopImmediatePropagation","external","to","exact","filter","a","pinned","some","link","id","target","onClick","href"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {\n  MenuButton,\n  MenuGroupFooter,\n  MenuGroupHeader,\n  MenuNavigationItemTypeGroup,\n  MenuNavigationItemTypeItem,\n  MenuNavigationItemTypeSection\n} from '../types';\nimport styled from 'styled-components';\nimport {\n  BREAKPOINTS,\n  COLORS,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentTextStyle,\n  ComponentXSStyling,\n  ParagraphSStyling,\n  ParagraphTextStyle,\n  ParagraphXSStyling,\n  scrollBarStyling\n} from '../../styles';\nimport {Size} from '../../types';\nimport {HyperLink} from '../../HyperLink';\nimport {useMediaQuery} from 'react-responsive';\nimport {Button} from '../../Button';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {MenuItem} from '../../MenuItem';\nimport {SystemIcons} from '../../icons';\nimport {useDimensionsRef} from 'rooks';\n\n\nconst HeaderText = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\nconst HeaderNote = styled.div`\n  word-break: break-all;\n  ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderContainer = styled.div`\n  margin: 0 24px;\n  padding-bottom: 8px;\n  box-sizing: border-box;\n  border-bottom: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n`;\n\n\nconst ScrollableContainer = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n  max-height: 100%;\n\n  &.scrollable {\n    margin-right: 6px;\n    padding-right: 10px;\n  }\n\n  ${scrollBarStyling(Size.Small)}\n\n  ::-webkit-scrollbar-track {\n    margin: 8px;\n  }\n\n`;\n\nconst MenuItemsContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  padding: 8px;\n`;\n\nconst MenuSectionContainer = styled.div`\n  padding-bottom: 8px;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ${COLORS.neutral_200};\n  }\n`;\n\nconst MenuSectionHeader = styled.div`\n  display: flex;\n  align-items: center;\n  padding: 8px 16px 4px 16px;\n  box-sizing: border-box;\n  min-height: 32px;\n  background-color: ${COLORS.neutral_20};\n\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n  display: flex;\n  flex-direction: column;\n`;\n\n\nconst PinnedContainer = styled.div`\n  border-top: 1px solid ${COLORS.neutral_200};\n`;\n\nconst FooterText = styled.div`\n  ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n  }\n`;\nconst FooterNote = styled.div`\n  ${ParagraphXSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n  ${BREAKPOINTS.SMALL} {\n    ${ParagraphSStyling(ParagraphTextStyle.Regular, COLORS.neutral_600)}\n  }\n`;\nconst FooterLink = styled.div`\n  a {\n    ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n    ${BREAKPOINTS.SMALL} {\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n    }\n  }\n`;\n\nconst FooterContainer = styled.div`\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n  background: ${COLORS.neutral_20};\n\n  ${BREAKPOINTS.SMALL} {\n    padding: 16px;\n  }\n`;\n\nconst ActionContainer = styled.div`\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ${COLORS.neutral_200};\n  display: flex;\n  flex-direction: column;\n\n  ${BREAKPOINTS.SMALL} {\n    padding: 16px;\n  }\n`;\n\nconst Wrapper = 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\ninterface MobileMenuContentProps {\n  header?: MenuGroupHeader;\n  items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n  footer?: MenuGroupFooter;\n  action?: MenuButton;\n\n  onSubMenuOpen?: (item: MenuNavigationItemTypeGroup) => void;\n}\n\nconst MobileMenuContent: React.FunctionComponent<MobileMenuContentProps> = ({\n                                                                              header,\n                                                                              items,\n                                                                              footer,\n                                                                              action,\n                                                                              onSubMenuOpen\n                                                                            }) => {\n\n  const isSmallScreen = useMediaQuery({query: BREAKPOINTS.SMALL.replace('@media ', '')});\n\n  const {navigate, isActiveRoute} = useNavigationHelper();\n\n  const [scrollable, setScrollable] = React.useState(false);\n\n  const [scrollContainerRef, dimensions, node] = useDimensionsRef({updateOnResize: true});\n\n  React.useEffect(() => {\n    const clientHeight = node?.clientHeight ?? 0;\n    const scrollHeight = node?.scrollHeight ?? 0;\n    setScrollable(scrollHeight > clientHeight);\n  }, [header, dimensions, node, footer, action, items]);\n\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection, index: number) => {\n    switch (item.type) {\n      case 'section':\n        return (\n          <MenuSectionContainer key={index}>\n            {item.label && <MenuSectionHeader>{item.label}</MenuSectionHeader>}\n            <MenuSectionList>\n              {item.items.map((item, index) => renderItem(item, index))}\n            </MenuSectionList>\n          </MenuSectionContainer>\n        );\n      case 'group':\n        return <MenuItem key={index}\n                         id={'menu-item-' + index}\n                         size={isSmallScreen ? Size.Medium : Size.Small}\n                         active={false}\n                         item={{\n                           value: item.label,\n                           disabled: item.disabled,\n                           icon: item.icon,\n                           displayLabel: item.label,\n                           noteLabel: item.note,\n                         }}\n                         iconRight={<SystemIcons.ArrowDropRight/>}\n                         onClickHandler={(e) => {\n                           e.nativeEvent.stopImmediatePropagation();\n                           onSubMenuOpen && onSubMenuOpen(item);\n                         }}/>\n      case 'item':\n      default:\n        return (\n          <MenuItem key={index}\n                    id={'menu-item-' + index}\n                    active={!item.external && isActiveRoute(item.to, !!item.exact)}\n                    size={isSmallScreen ? Size.Medium : Size.Small}\n                    item={{\n                      value: item.to,\n                      disabled: item.disabled,\n                      icon: item.icon,\n                      displayLabel: item.label,\n                      noteLabel: item.note,\n                    }}\n                    onClickHandler={(e) => {\n                      item.action && item.action(e);\n                      navigate(item.to, !!item.external);\n                    }}/>\n        );\n    }\n  }\n\n  return (\n    <Wrapper>\n      <ScrollableContainer ref={scrollContainerRef as any} className={scrollable ? 'scrollable' : ''}>\n        {\n          !!header &&\n          <HeaderContainer>\n            <HeaderText>{header.header}</HeaderText>\n            {header.note && <HeaderNote>{header.note}</HeaderNote>}\n          </HeaderContainer>\n        }\n        <MenuItemsContainer>\n          {items?.filter(a => !a.pinned).map((item, index) => renderItem(item, index))}\n        </MenuItemsContainer>\n      </ScrollableContainer>\n      {\n        items?.some(a => a.pinned) &&\n        <PinnedContainer>\n          <MenuItemsContainer>\n            {items?.filter(a => !!a.pinned).map((item, index) => renderItem(item, index))}\n          </MenuItemsContainer>\n        </PinnedContainer>\n\n      }\n      {\n        footer &&\n        <FooterContainer>\n          <FooterText>{footer.header}</FooterText>\n          {footer.note && <FooterNote>{footer.note}</FooterNote>}\n          {footer.link &&\n            <FooterLink>\n              <HyperLink variant={'default'}\n                         id={footer.link.id}\n                         target={footer.link.target}\n                         onClick={footer.link.onClick}\n                         href={footer.link.href}>\n                {footer.link.label}\n              </HyperLink>\n            </FooterLink>\n          }\n        </FooterContainer>\n      }\n      {\n        action &&\n        <ActionContainer>\n          <Button variant={'secondary'}\n                  size={isSmallScreen ? Size.Medium : Size.Small}\n                  disabled={action.disabled}\n                  icon={action.icon}\n                  onClick={action.action}>\n            {action.label}\n          </Button>\n        </ActionContainer>\n      }\n    </Wrapper>\n  )\n};\n\nexport default MobileMenuContent;\n"],"file":"MobileMenuContent.js"}

package/dist/GlobalNavigationBar/types.d.ts

@@ -89,7 +89,7 @@ export declare type MenuNavigationItem = {
     exact?: boolean;
     disabled?: boolean;
     external?: boolean;
-    action?: () => void;
+    action?: (e: React.MouseEvent) => void;
     label: string;
     note?: string;
     pinned?: boolean;

package/dist/InputFields/SearchBar.cjs

@@ -156,7 +156,6 @@ var SearchBar = function SearchBar(_ref) {
         })]
       }), showDropdown && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownContent, {
         id: 'search',
-        containerRef: containerRef,
         size: size,
         isButton: false,
         customizationProps: {

package/dist/InputFields/SearchBar.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/InputFields/SearchBar.tsx"],"names":["ClearIconWrapper","styled","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","searchList","addToSearchList","dropdownScrollable","containerRef","React","useRef","useState","isOpen","setIsOpen","dropdownRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","COLORS","critical_400"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {COLORS} from '../styles/index';\nimport {Search as SearchIcon, Clear as ClearIcon, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {ErrorMessage, InputWrapper, SearchIconWrapper} from './styling';\nimport {IconButton} from '../Button';\nimport SearchBarInput from './components/SearchBarInput';\nimport SearchField from './components/SearchField';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport { DropdownContent, DropdownItem } from '../Dropdown';\nimport { useClickOutsideRef } from '../common';\n\ntype SeachBarProps = {\n  id: string;\n  searchTerm?: string;\n  setSearchTerm: (term: string) => void;\n  enterSearch: (e: any) => void;\n  removeSearch: (e: any) => void;\n  placeholder?: string;\n  performSearchLabel?: string;\n  disabled?: boolean;\n  validationMessage?: string;\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  showDropdown?: boolean;\n  dropdownButtonIcon?: React.ReactNode;\n  dropdownButtonLabel?: string;\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\n  dropdownButtonAction?: () => boolean | void | undefined;\n  searchList?: DropdownItem[];\n  addToSearchList?: (e: DropdownItem) => void;\n  dropdownScrollable?: boolean;\n};\n\nconst ClearIconWrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  &.hidden {\n    display: none !important;\n  }\n`;\n\nconst SearchBar: React.FunctionComponent<SeachBarProps> = ({\n                                                             id,\n                                                             searchTerm,\n                                                             setSearchTerm,\n                                                             enterSearch,\n                                                             removeSearch,\n                                                             placeholder,\n                                                             performSearchLabel,\n                                                             disabled,\n                                                             validationMessage,\n                                                             onKeyDown,\n                                                             size,\n                                                             margin = '4px 0',\n                                                             showDropdown,\n                                                             dropdownButtonIcon,\n                                                             dropdownButtonLabel,\n                                                             dropdownButtonVariant,\n                                                             dropdownButtonAction,\n                                                             searchList=[],\n                                                             addToSearchList,\n                                                             dropdownScrollable\n                                                           }) => {\n  const containerRef = React.useRef<any>(null);\n\n  const [isOpen, setIsOpen] = React.useState(false);\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\n\n  const isPressingEnter = (e: any) => {\n    if (e.key === 'Enter') {\n      e.preventDefault();\n      e.stopPropagation();\n      return true;\n    }\n    return false;\n  };\n\n  const enteredSearchTerm = (e: any) => {\n    addToSearchList && addToSearchList({value:e.target.value});\n    enterSearch(e);\n  }\n\n  const dropdownAction = () => {\n    if(dropdownButtonAction)\n      dropdownButtonAction();    \n  }\n\n  return (\n    <>\n      <InputWrapper\n        disabled={disabled}\n        margin={margin}>\n        <SearchField id={'id'} size={size}\n                     ref={containerRef}\n                     searchTerm={searchTerm}\n                     disabled={disabled}\n                     validationMessage={validationMessage}>\n          <SearchBarInput\n            placeholder={disabled ? '' : placeholder}\n            id={id}\n            size={size}\n            disabled={disabled}\n            setSearchTerm={(term: string) => setSearchTerm(term)}\n            searchTerm={searchTerm}\n            onKeyDown={onKeyDown}\n            enterSearch={enteredSearchTerm}\n            focusParentRefs={[containerRef]}\n            onClick={()=>setIsOpen(!isOpen)}\n            ref={dropdownRef}\n          />\n          <SearchIconWrapper className={size ? size : ''} aria-label={performSearchLabel}>\n            <IconButton id={`${id}_Search`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={enterSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}>\n              <SearchIcon size=\"24px\"/>\n            </IconButton>\n          </SearchIconWrapper>\n          <ClearIconWrapper className={(size ? size : '').concat(!searchTerm ? ' hidden' : '')}>\n            <IconButton id={`${id}_Clear`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={removeSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? removeSearch(e) : null)}>\n              <ClearIcon size=\"24px\"/>\n            </IconButton>\n          </ClearIconWrapper>\n        </SearchField>\n\n      {showDropdown && <DropdownContent id={'search'}\n                                        containerRef={containerRef}\n          size={size}\n          isButton={false}\n          customizationProps={{\n            items:searchList,\n            action: dropdownAction,\n            actionLabel: dropdownButtonLabel,\n            actionIcon: dropdownButtonIcon,\n            actionVariant: dropdownButtonVariant,\n            onValueUpdate:(e)=>{},\n            scrollable: dropdownScrollable,\n            pinTopItem: true\n          }}\n          isOpen={isOpen}\n          setIsOpen={setIsOpen}\n          filter={''}\n          selectedValues={searchTerm ? [searchTerm] : []}\n          setSelectedValues={(e)=>setSearchTerm(e[0])}\n          messageOnNoResults={''}\n          focused={null}\n          setFocused={()=>{}}\n        />}\n\n      </InputWrapper>\n      {validationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"file":"SearchBar.cjs"}
+{"version":3,"sources":["../../src/InputFields/SearchBar.tsx"],"names":["ClearIconWrapper","styled","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","searchList","addToSearchList","dropdownScrollable","containerRef","React","useRef","useState","isOpen","setIsOpen","dropdownRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","COLORS","critical_400"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {COLORS} from '../styles/index';\nimport {Search as SearchIcon, Clear as ClearIcon, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {ErrorMessage, InputWrapper, SearchIconWrapper} from './styling';\nimport {IconButton} from '../Button';\nimport SearchBarInput from './components/SearchBarInput';\nimport SearchField from './components/SearchField';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport { DropdownContent, DropdownItem } from '../Dropdown';\nimport { useClickOutsideRef } from '../common';\n\ntype SeachBarProps = {\n  id: string;\n  searchTerm?: string;\n  setSearchTerm: (term: string) => void;\n  enterSearch: (e: any) => void;\n  removeSearch: (e: any) => void;\n  placeholder?: string;\n  performSearchLabel?: string;\n  disabled?: boolean;\n  validationMessage?: string;\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  showDropdown?: boolean;\n  dropdownButtonIcon?: React.ReactNode;\n  dropdownButtonLabel?: string;\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\n  dropdownButtonAction?: () => boolean | void | undefined;\n  searchList?: DropdownItem[];\n  addToSearchList?: (e: DropdownItem) => void;\n  dropdownScrollable?: boolean;\n};\n\nconst ClearIconWrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  &.hidden {\n    display: none !important;\n  }\n`;\n\nconst SearchBar: React.FunctionComponent<SeachBarProps> = ({\n                                                             id,\n                                                             searchTerm,\n                                                             setSearchTerm,\n                                                             enterSearch,\n                                                             removeSearch,\n                                                             placeholder,\n                                                             performSearchLabel,\n                                                             disabled,\n                                                             validationMessage,\n                                                             onKeyDown,\n                                                             size,\n                                                             margin = '4px 0',\n                                                             showDropdown,\n                                                             dropdownButtonIcon,\n                                                             dropdownButtonLabel,\n                                                             dropdownButtonVariant,\n                                                             dropdownButtonAction,\n                                                             searchList=[],\n                                                             addToSearchList,\n                                                             dropdownScrollable\n                                                           }) => {\n  const containerRef = React.useRef<any>(null);\n\n  const [isOpen, setIsOpen] = React.useState(false);\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\n\n  const isPressingEnter = (e: any) => {\n    if (e.key === 'Enter') {\n      e.preventDefault();\n      e.stopPropagation();\n      return true;\n    }\n    return false;\n  };\n\n  const enteredSearchTerm = (e: any) => {\n    addToSearchList && addToSearchList({value:e.target.value});\n    enterSearch(e);\n  }\n\n  const dropdownAction = () => {\n    if(dropdownButtonAction)\n      dropdownButtonAction();    \n  }\n\n  return (\n    <>\n      <InputWrapper\n        disabled={disabled}\n        margin={margin}>\n        <SearchField id={'id'} size={size}\n                     ref={containerRef}\n                     searchTerm={searchTerm}\n                     disabled={disabled}\n                     validationMessage={validationMessage}>\n          <SearchBarInput\n            placeholder={disabled ? '' : placeholder}\n            id={id}\n            size={size}\n            disabled={disabled}\n            setSearchTerm={(term: string) => setSearchTerm(term)}\n            searchTerm={searchTerm}\n            onKeyDown={onKeyDown}\n            enterSearch={enteredSearchTerm}\n            focusParentRefs={[containerRef]}\n            onClick={()=>setIsOpen(!isOpen)}\n            ref={dropdownRef}\n          />\n          <SearchIconWrapper className={size ? size : ''} aria-label={performSearchLabel}>\n            <IconButton id={`${id}_Search`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={enterSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}>\n              <SearchIcon size=\"24px\"/>\n            </IconButton>\n          </SearchIconWrapper>\n          <ClearIconWrapper className={(size ? size : '').concat(!searchTerm ? ' hidden' : '')}>\n            <IconButton id={`${id}_Clear`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={removeSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? removeSearch(e) : null)}>\n              <ClearIcon size=\"24px\"/>\n            </IconButton>\n          </ClearIconWrapper>\n        </SearchField>\n\n      {showDropdown && <DropdownContent id={'search'} \n          size={size}\n          isButton={false}\n          customizationProps={{\n            items:searchList,\n            action: dropdownAction,\n            actionLabel: dropdownButtonLabel,\n            actionIcon: dropdownButtonIcon,\n            actionVariant: dropdownButtonVariant,\n            onValueUpdate:(e)=>{},\n            scrollable: dropdownScrollable,\n            pinTopItem: true\n          }}\n          isOpen={isOpen}\n          setIsOpen={setIsOpen}\n          filter={''}\n          selectedValues={searchTerm ? [searchTerm] : []}\n          setSelectedValues={(e)=>setSearchTerm(e[0])}\n          messageOnNoResults={''}\n          focused={null}\n          setFocused={()=>{}}\n        />}\n\n      </InputWrapper>\n      {validationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"file":"SearchBar.cjs"}

package/dist/InputFields/SearchBar.js

@@ -135,7 +135,6 @@ var SearchBar = function SearchBar(_ref) {
         })]
       }), showDropdown && /*#__PURE__*/_jsx(DropdownContent, {
         id: 'search',
-        containerRef: containerRef,
         size: size,
         isButton: false,
         customizationProps: {