@laerdal/life-react-components 5.0.5-dev.1 → 5.0.5-dev.3

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

@@ -1 +1 @@
-{"version":3,"file":"MobileMenu.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_icons","_styles","_reactRouterDom","_Button","_assets","_MobileMenuHeader","_MobileMenuContent","_StackState","_rooks","_jsxRuntime","_templateObject","_templateObject2","_templateObject3","_templateObject4","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Wrapper","styled","div","_taggedTemplateLiteral2","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","SwitcherLabel","MobileFooter","props","COLORS","getColor","theme","ComponentXSStyling","ComponentTextStyle","Bold","ComponentSStyling","CustomContent","MobileMenu","_ref","_current$header","_current$header$butto","show","profile","buttons","label","header","items","footer","action","onClose","_useStackState","useStackState","reset","length","push","pop","peek","isMediumScreen","useMediaMatch","LARGE","replace","location","useLocation","onSubMenuOpen","menu","type","content","customContent","custom","useEffect","setTimeout","current","switcher","find","jsxs","children","jsx","onGoBack","undefined","LaerdalLogo","height","width","Fragment","className","onClick","IconButton","variant","shape","id","SystemIcons","SwitchApp","size","propTypes","_propTypes","bool","func","isRequired","_default","exports"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {SystemIcons} from '../../icons';\r\nimport { BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, Z_INDEXES } from '../../styles';\r\nimport { useLocation } from 'react-router-dom';\r\nimport { IconButton } from '../../Button';\r\nimport { LaerdalLogo } from '../../assets';\r\nimport {\r\n  MenuAccountInfo,\r\n  MenuButton,\r\n  MenuNavigationItemTypeGroup,\r\n  MenuGroupFooter,\r\n  MenuGroupHeader,\r\n  MenuIconButton,\r\n  MenuNavigationItemTypeItem,\r\n  MobileNavigationMenuProps,\r\n  ProfileMenu,\r\n  MenuNavigationItemTypeSection,\r\n  MobileMenuButtonTypes,\r\n  MenuSwitcherButton,\r\n  MenuNavigationCustomSubMenu,\r\n} from '../types';\r\nimport MobileMenuHeader from './MobileMenuHeader';\r\nimport MobileMenuContent from './MobileMenuContent';\r\nimport { useStackState } from '../../common/StackState';\r\nimport { useMediaMatch } from 'rooks';\r\n\r\nconst Wrapper = styled.div`\r\n  width: 320px;\r\n  z-index: ${Z_INDEXES.off_canvas};\r\n  height: 100%;\r\n  box-sizing: border-box;\r\n\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 8px;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    width: 400px;\r\n  }\r\n`;\r\n\r\nconst SwitcherLabel = styled.div`\r\n  margin-left: auto;\r\n`;\r\n\r\nconst MobileFooter = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  box-sizing: border-box;\r\n  height: 48px;\r\n\r\n  padding: 0 4px 0 16px;\r\n  border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    height: 56px;\r\n    padding: 4px 8px 4px 16px;\r\n    ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\n\r\nconst CustomContent = styled.div`\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n  flex-flow: column;\r\n  display: flex;\r\n  flex: 1;\r\n  overflow: hidden;\r\n`;\r\n\r\ntype Props = MobileNavigationMenuProps & {\r\n  profile?: ProfileMenu;\r\n  show?: boolean;\r\n  onClose: () => void;\r\n};\r\n\r\ninterface MenuState {\r\n  header: {\r\n    label?: string;\r\n    buttons?: MobileMenuButtonTypes[];\r\n  };\r\n  content?: {\r\n    header?: MenuGroupHeader;\r\n    items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\r\n    footer?: MenuGroupFooter;\r\n    action?: MenuButton;\r\n  };\r\n  customContent?: () => React.ReactNode;\r\n  footer?: boolean;\r\n}\r\n\r\nconst MobileMenu = ({ show, profile, buttons, label, header, items, footer, action, onClose }: Props) => {\r\n  const { reset, length, push, pop, peek } = useStackState<MenuState>();\r\n\r\n  const isMediumScreen = useMediaMatch(BREAKPOINTS.LARGE.replace('@media ', ''));\r\n\r\n  const location = useLocation();\r\n\r\n  const onSubMenuOpen = (menu?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => {\r\n    switch (menu?.type) {\r\n      case 'group':\r\n        push({\r\n          header: {\r\n            label: menu.label,\r\n            buttons: menu.buttons,\r\n          },\r\n          content: {\r\n            header: menu.header,\r\n            items: menu.items,\r\n            footer: menu.footer,\r\n            action: menu.action,\r\n          },\r\n          footer: false,\r\n        });\r\n        break;\r\n      case 'custom':\r\n        push({\r\n          header: {\r\n            label: menu.label,\r\n            buttons: menu.buttons,\r\n          },\r\n          customContent: menu.custom,\r\n          footer: false,\r\n        });\r\n        break;\r\n      default:\r\n        break;\r\n    }\r\n  };\r\n\r\n  React.useEffect(() => {\r\n    onClose();\r\n  }, [location]);\r\n\r\n  React.useEffect(() => {\r\n    isMediumScreen && onClose();\r\n  }, [isMediumScreen]);\r\n\r\n  React.useEffect(() => {\r\n    setTimeout(() => {\r\n      reset({\r\n        footer: true,\r\n        header: {\r\n          label: label,\r\n          buttons: buttons,\r\n        },\r\n        content: {\r\n          header: header,\r\n          items: items,\r\n          footer: footer,\r\n          action: action,\r\n        },\r\n      });\r\n    }, 300);\r\n  }, [show]);\r\n\r\n  const current = peek();\r\n\r\n  const switcher = current?.header?.buttons?.find((a) => a.type === 'switcher') as MenuSwitcherButton;\r\n\r\n  return (\r\n    <Wrapper>\r\n      <MobileMenuHeader\r\n        buttons={current?.header.buttons}\r\n        onGoBack={length > 1 ? pop : undefined}\r\n        onSubMenuOpen={onSubMenuOpen}\r\n        profile={profile}\r\n        label={current?.header.label}\r\n        onClose={onClose}\r\n      />\r\n      {current?.customContent && <CustomContent>{current?.customContent()}</CustomContent>}\r\n      {current?.content && (\r\n        <MobileMenuContent\r\n          header={current?.content.header}\r\n          items={current?.content.items}\r\n          footer={current?.content.footer}\r\n          action={current?.content.action}\r\n          onSubMenuOpen={onSubMenuOpen}\r\n        />\r\n      )}\r\n\r\n      {current?.footer && (\r\n        <MobileFooter>\r\n          <LaerdalLogo height={'36px'} width={'66px'} />\r\n          {switcher && (\r\n            <>\r\n              <SwitcherLabel className={'globalNav-toggler'} onClick={() => switcher.action && switcher.action() && onClose()}>\r\n                {label || 'Switch site'}\r\n              </SwitcherLabel>\r\n              <IconButton variant={'secondary'} shape={'circular'} id=\"globalNavAppsButton\" action={() => switcher.action && switcher.action() && onClose()}>\r\n                <SystemIcons.SwitchApp size=\"24px\"/>\r\n              </IconButton>\r\n            </>\r\n          )}\r\n        </MobileFooter>\r\n      )}\r\n    </Wrapper>\r\n  );\r\n};\r\n\r\nexport default MobileMenu;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"MobileMenu.cjs","names":["Wrapper","styled","div","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","SwitcherLabel","MobileFooter","props","COLORS","getColor","theme","ComponentXSStyling","ComponentTextStyle","Bold","ComponentSStyling","CustomContent","MobileMenu","show","profile","buttons","label","header","items","footer","action","onClose","useStackState","reset","length","push","pop","peek","isMediumScreen","useMediaMatch","LARGE","replace","location","useLocation","onSubMenuOpen","menu","type","content","customContent","custom","React","useEffect","setTimeout","current","switcher","find","a","undefined"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport {SystemIcons} from '../../icons';\r\nimport { BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, Z_INDEXES } from '../../styles';\r\nimport { useLocation } from 'react-router-dom';\r\nimport { IconButton } from '../../Button';\r\nimport { LaerdalLogo } from '../../assets';\r\nimport {\r\n  MenuAccountInfo,\r\n  MenuButton,\r\n  MenuNavigationItemTypeGroup,\r\n  MenuGroupFooter,\r\n  MenuGroupHeader,\r\n  MenuIconButton,\r\n  MenuNavigationItemTypeItem,\r\n  MobileNavigationMenuProps,\r\n  ProfileMenu,\r\n  MenuNavigationItemTypeSection,\r\n  MobileMenuButtonTypes,\r\n  MenuSwitcherButton,\r\n  MenuNavigationCustomSubMenu,\r\n} from '../types';\r\nimport MobileMenuHeader from './MobileMenuHeader';\r\nimport MobileMenuContent from './MobileMenuContent';\r\nimport { useStackState } from '../../common/StackState';\r\nimport { useMediaMatch } from 'rooks';\r\n\r\nconst Wrapper = styled.div`\r\n  width: 320px;\r\n  z-index: ${Z_INDEXES.off_canvas};\r\n  height: 100%;\r\n  box-sizing: border-box;\r\n\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 8px;\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    width: 400px;\r\n  }\r\n`;\r\n\r\nconst SwitcherLabel = styled.div`\r\n  margin-left: auto;\r\n`;\r\n\r\nconst MobileFooter = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  box-sizing: border-box;\r\n  height: 48px;\r\n\r\n  padding: 0 4px 0 16px;\r\n  border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    height: 56px;\r\n    padding: 4px 8px 4px 16px;\r\n    ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\n\r\nconst CustomContent = styled.div`\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n  flex-flow: column;\r\n  display: flex;\r\n  flex: 1;\r\n  overflow: hidden;\r\n`;\r\n\r\ntype Props = MobileNavigationMenuProps & {\r\n  profile?: ProfileMenu;\r\n  show?: boolean;\r\n  onClose: () => void;\r\n};\r\n\r\ninterface MenuState {\r\n  header: {\r\n    label?: string;\r\n    buttons?: MobileMenuButtonTypes[];\r\n  };\r\n  content?: {\r\n    header?: MenuGroupHeader;\r\n    items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\r\n    footer?: MenuGroupFooter;\r\n    action?: MenuButton;\r\n  };\r\n  customContent?: () => React.ReactNode;\r\n  footer?: boolean;\r\n}\r\n\r\nconst MobileMenu = ({ show, profile, buttons, label, header, items, footer, action, onClose }: Props) => {\r\n  const { reset, length, push, pop, peek } = useStackState<MenuState>();\r\n\r\n  const isMediumScreen = useMediaMatch(BREAKPOINTS.LARGE.replace('@media ', ''));\r\n\r\n  const location = useLocation();\r\n\r\n  const onSubMenuOpen = (menu?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => {\r\n    switch (menu?.type) {\r\n      case 'group':\r\n        push({\r\n          header: {\r\n            label: menu.label,\r\n            buttons: menu.buttons,\r\n          },\r\n          content: {\r\n            header: menu.header,\r\n            items: menu.items,\r\n            footer: menu.footer,\r\n            action: menu.action,\r\n          },\r\n          footer: false,\r\n        });\r\n        break;\r\n      case 'custom':\r\n        push({\r\n          header: {\r\n            label: menu.label,\r\n            buttons: menu.buttons,\r\n          },\r\n          customContent: menu.custom,\r\n          footer: false,\r\n        });\r\n        break;\r\n      default:\r\n        break;\r\n    }\r\n  };\r\n\r\n  React.useEffect(() => {\r\n    onClose();\r\n  }, [location]);\r\n\r\n  React.useEffect(() => {\r\n    isMediumScreen && onClose();\r\n  }, [isMediumScreen]);\r\n\r\n  React.useEffect(() => {\r\n    setTimeout(() => {\r\n      reset({\r\n        footer: true,\r\n        header: {\r\n          label: label,\r\n          buttons: buttons,\r\n        },\r\n        content: {\r\n          header: header,\r\n          items: items,\r\n          footer: footer,\r\n          action: action,\r\n        },\r\n      });\r\n    }, 300);\r\n  }, [show]);\r\n\r\n  const current = peek();\r\n\r\n  const switcher = current?.header?.buttons?.find((a) => a.type === 'switcher') as MenuSwitcherButton;\r\n\r\n  return (\r\n    <Wrapper>\r\n      <MobileMenuHeader\r\n        buttons={current?.header.buttons}\r\n        onGoBack={length > 1 ? pop : undefined}\r\n        onSubMenuOpen={onSubMenuOpen}\r\n        profile={profile}\r\n        label={current?.header.label}\r\n        onClose={onClose}\r\n      />\r\n      {current?.customContent && <CustomContent>{current?.customContent()}</CustomContent>}\r\n      {current?.content && (\r\n        <MobileMenuContent\r\n          header={current?.content.header}\r\n          items={current?.content.items}\r\n          footer={current?.content.footer}\r\n          action={current?.content.action}\r\n          onSubMenuOpen={onSubMenuOpen}\r\n        />\r\n      )}\r\n\r\n      {current?.footer && (\r\n        <MobileFooter>\r\n          <LaerdalLogo height={'36px'} width={'66px'} />\r\n          {switcher && (\r\n            <>\r\n              <SwitcherLabel className={'globalNav-toggler'} onClick={() => switcher.action && switcher.action() && onClose()}>\r\n                {label || 'Switch site'}\r\n              </SwitcherLabel>\r\n              <IconButton variant={'secondary'} shape={'circular'} id=\"globalNavAppsButton\" action={() => switcher.action && switcher.action() && onClose()}>\r\n                <SystemIcons.SwitchApp size=\"24px\"/>\r\n              </IconButton>\r\n            </>\r\n          )}\r\n        </MobileFooter>\r\n      )}\r\n    </Wrapper>\r\n  );\r\n};\r\n\r\nexport default MobileMenu;\r\n"],"mappings":"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"}

package/dist/GlobalNavigationBar/mobile/MobileMenu.d.ts

@@ -1,9 +1,8 @@
-import * as React from 'react';
 import { MobileNavigationMenuProps, ProfileMenu } from '../types';
 type Props = MobileNavigationMenuProps & {
     profile?: ProfileMenu;
     show?: boolean;
     onClose: () => void;
 };
-declare const MobileMenu: ({ show, profile, buttons, label, header, items, footer, action, onClose }: Props) => React.JSX.Element;
+declare const MobileMenu: ({ show, profile, buttons, label, header, items, footer, action, onClose }: Props) => JSX.Element;
 export default MobileMenu;

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

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

package/dist/GlobalNavigationBar/mobile/MobileMenuContent.cjs

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports.default = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
@@ -23,33 +23,33 @@ var _MobileActionContainer = require("./MobileActionContainer");
 var _rooks = require("rooks");
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var MenuItemsContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  padding: 8px;\n"])));
-var MenuSectionContainer = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  padding-bottom: 8px;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ", ";\n  }\n"])), function (props) {
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var MenuItemsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  padding: 8px;\n"])));
+var MenuSectionContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  padding-bottom: 8px;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  &.divider {\n    border-top: 1px solid ", ";\n  }\n"])), function (props) {
   return _styles.COLORS.getColor('neutral_200', props.theme);
 });
-var MenuSectionHeader = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\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: ", ";\n\n  ", "\n"])), function (props) {
+var MenuSectionHeader = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\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: ", ";\n\n  ", "\n"])), function (props) {
   return _styles.COLORS.getColor('neutral_20', props.theme);
 }, function (props) {
   return (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('neutral_500', props.theme));
 });
-var MenuSectionList = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  flex-direction: column;\n"])));
-var PinnedContainer = _styledComponents["default"].div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n  border-top: 1px solid ", ";\n"])), function (props) {
+var MenuSectionList = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n"])));
+var PinnedContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  border-top: 1px solid ", ";\n"])), function (props) {
   return _styles.COLORS.getColor('neutral_200', props.theme);
 });
-var FooterText = _styledComponents["default"].div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n  ", "\n  ", " {\n    ", "\n  }\n"])), function (props) {
+var FooterText = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", " {\n    ", "\n  }\n"])), function (props) {
   return (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('neutral_600', props.theme));
 }, _styles.BREAKPOINTS.SMALL, function (props) {
   return (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('neutral_600', props.theme));
 });
-var FooterNote = _styledComponents["default"].div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["\n  ", "\n  ", " {\n    ", "\n  }\n"])), function (props) {
+var FooterNote = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", " {\n    ", "\n  }\n"])), function (props) {
   return (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('neutral_600', props.theme));
 }, _styles.BREAKPOINTS.SMALL, function (props) {
   return (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('neutral_600', props.theme));
 });
-var FooterLink = _styledComponents["default"].div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["\n  a {\n    ", "\n    ", " {\n      ", "\n    }\n  }\n"])), (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Bold, null), _styles.BREAKPOINTS.SMALL, (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, null));
-var FooterContainer = _styledComponents["default"].div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n  background: ", ";\n\n  ", " {\n    padding: 16px;\n  }\n"])), function (props) {
+var FooterLink = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  a {\n    ", "\n    ", " {\n      ", "\n    }\n  }\n"])), (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Bold, null), _styles.BREAKPOINTS.SMALL, (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, null));
+var FooterContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  padding: 8px 16px;\n  box-sizing: border-box;\n  border-top: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n  background: ", ";\n\n  ", " {\n    padding: 16px;\n  }\n"])), function (props) {
   return _styles.COLORS.getColor('neutral_200', props.theme);
 }, function (props) {
   return _styles.COLORS.getColor('neutral_20', props.theme);
@@ -65,7 +65,7 @@ var MobileMenuContent = function MobileMenuContent(_ref) {
     navigate = _useNavigationHelper.navigate,
     isActiveRoute = _useNavigationHelper.isActiveRoute;
   var _useScrollableContain = (0, _ScrollableContainer.useScrollableContainer)([header, footer, action, items]),
-    _useScrollableContain2 = (0, _slicedToArray2["default"])(_useScrollableContain, 2),
+    _useScrollableContain2 = (0, _slicedToArray2.default)(_useScrollableContain, 2),
     scrollContainerRef = _useScrollableContain2[0],
     scrollable = _useScrollableContain2[1];
   var renderItem = function renderItem(item, index) {
@@ -164,9 +164,9 @@ var MobileMenuContent = function MobileMenuContent(_ref) {
   });
 };
 MobileMenuContent.propTypes = {
-  items: _propTypes["default"].array,
-  onSubMenuOpen: _propTypes["default"].func
+  items: _propTypes.default.array,
+  onSubMenuOpen: _propTypes.default.func
 };
 var _default = MobileMenuContent;
-exports["default"] = _default;
+exports.default = _default;
 //# sourceMappingURL=MobileMenuContent.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"MobileMenuContent.cjs","names":["_react","_interopRequireDefault","require","_styledComponents","_styles","_types","_HyperLink","_NavigationHelper","_MenuItem","_icons","_CommonStyles","_ScrollableContainer","_MobileActionContainer","_rooks","_jsxRuntime","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","_templateObject9","ownKeys","e","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","defineProperty","MenuItemsContainer","styled","div","_taggedTemplateLiteral2","MenuSectionContainer","props","COLORS","getColor","theme","MenuSectionHeader","ComponentSStyling","ComponentTextStyle","Bold","MenuSectionList","PinnedContainer","FooterText","ComponentXSStyling","BREAKPOINTS","SMALL","FooterNote","Regular","FooterLink","FooterContainer","MobileMenuContent","_ref","header","items","footer","action","onSubMenuOpen","isSmallScreen","useMediaMatch","replace","_useNavigationHelper","useNavigationHelper","navigate","isActiveRoute","_useScrollableContain","useScrollableContainer","_useScrollableContain2","_slicedToArray2","scrollContainerRef","scrollable","renderItem","item","index","type","jsxs","children","label","jsx","map","MenuItem","id","size","Size","Medium","Small","active","value","disabled","icon","displayLabel","noteLabel","note","iconRight","SystemIcons","ArrowDropRight","onClickHandler","nativeEvent","stopImmediatePropagation","external","to","exact","MobileMenuWrapper","ScrollableContainer","ref","className","MobileHeaderContainer","MobileHeaderText","MobileHeaderNote","a","pinned","some","link","HyperLink","variant","target","onClick","href","MobileActionContainer","propTypes","_propTypes","array","func","_default","exports"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuContent.tsx"],"sourcesContent":["import React from 'react';\r\nimport { MenuButton, MenuGroupFooter, MenuGroupHeader, MenuNavigationItemTypeGroup, MenuNavigationItemTypeItem, MenuNavigationItemTypeSection } from '../types';\r\nimport styled from 'styled-components';\r\nimport {\r\n  BREAKPOINTS,\r\n  COLORS,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n} from '../../styles';\r\nimport { Size } from '../../types';\r\nimport { HyperLink } from '../../HyperLink';\r\nimport { useNavigationHelper } from '../../common/NavigationHelper';\r\nimport { MenuItem } from '../../MenuItem';\r\nimport { SystemIcons } from '../../icons';\r\nimport { MobileHeaderContainer, MobileHeaderNote, MobileHeaderText, MobileMenuWrapper, ScrollableContainer } from './CommonStyles';\r\nimport { useScrollableContainer } from '../../common/ScrollableContainer';\r\nimport { MobileActionContainer } from './MobileActionContainer';\r\nimport {useMediaMatch} from \"rooks\";\r\n\r\nconst MenuItemsContainer = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n  padding: 8px;\r\n`;\r\n\r\nconst MenuSectionContainer = styled.div`\r\n  padding-bottom: 8px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  width: 100%;\r\n\r\n  &.divider {\r\n    border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n  }\r\n`;\r\n\r\nconst MenuSectionHeader = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 8px 16px 4px 16px;\r\n  box-sizing: border-box;\r\n  min-height: 32px;\r\n  background-color: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n\r\n  ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_500', props.theme))}\r\n`;\r\n\r\nconst MenuSectionList = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n`;\r\n\r\nconst PinnedContainer = styled.div`\r\n  border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n`;\r\n\r\nconst FooterText = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\nconst FooterNote = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\nconst FooterLink = styled.div`\r\n  a {\r\n    ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\r\n    ${BREAKPOINTS.SMALL} {\r\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\r\n    }\r\n  }\r\n`;\r\n\r\nconst FooterContainer = styled.div`\r\n  padding: 8px 16px;\r\n  box-sizing: border-box;\r\n  border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n  display: flex;\r\n  flex-direction: column;\r\n  background: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    padding: 16px;\r\n  }\r\n`;\r\n\r\ninterface MobileMenuContentProps {\r\n  header?: MenuGroupHeader;\r\n  items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\r\n  footer?: MenuGroupFooter;\r\n  action?: MenuButton;\r\n\r\n  onSubMenuOpen?: (item: MenuNavigationItemTypeGroup) => void;\r\n}\r\n\r\nconst MobileMenuContent: React.FunctionComponent<MobileMenuContentProps> = ({ header, items, footer, action, onSubMenuOpen }) => {\r\n  const isSmallScreen = useMediaMatch(BREAKPOINTS.SMALL.replace('@media ', ''));\r\n\r\n  const { navigate, isActiveRoute } = useNavigationHelper();\r\n\r\n  const [scrollContainerRef, scrollable] = useScrollableContainer([header, footer, action, items]);\r\n\r\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection, index: number) => {\r\n    switch (item.type) {\r\n      case 'section':\r\n        return (\r\n          <MenuSectionContainer key={index}>\r\n            {item.label && <MenuSectionHeader>{item.label}</MenuSectionHeader>}\r\n            <MenuSectionList>{item.items.map((item, index) => renderItem(item, index))}</MenuSectionList>\r\n          </MenuSectionContainer>\r\n        );\r\n      case 'group':\r\n        return (\r\n          <MenuItem\r\n            key={index}\r\n            id={'menu-item-' + index}\r\n            size={isSmallScreen ? Size.Medium : Size.Small}\r\n            active={false}\r\n            item={{\r\n              value: item.label,\r\n              disabled: item.disabled,\r\n              icon: item.icon,\r\n              displayLabel: item.label,\r\n              noteLabel: item.note,\r\n            }}\r\n            iconRight={<SystemIcons.ArrowDropRight />}\r\n            onClickHandler={(e) => {\r\n              e.nativeEvent.stopImmediatePropagation();\r\n              onSubMenuOpen && onSubMenuOpen(item);\r\n            }}\r\n          />\r\n        );\r\n      case 'item':\r\n      default:\r\n        return (\r\n          <MenuItem\r\n            key={index}\r\n            id={'menu-item-' + index}\r\n            active={!item.external && isActiveRoute(item.to, !!item.exact)}\r\n            size={isSmallScreen ? Size.Medium : Size.Small}\r\n            item={{\r\n              value: item.to,\r\n              disabled: item.disabled,\r\n              icon: item.icon,\r\n              displayLabel: item.label,\r\n              noteLabel: item.note,\r\n            }}\r\n            onClickHandler={(e) => {\r\n              item.action && item.action(e);\r\n              navigate(item.to, !!item.external);\r\n            }}\r\n          />\r\n        );\r\n    }\r\n  };\r\n\r\n  return (\r\n    <MobileMenuWrapper>\r\n      <ScrollableContainer ref={scrollContainerRef as any} className={scrollable ? 'scrollable' : ''}>\r\n        {!!header && (\r\n          <MobileHeaderContainer>\r\n            <MobileHeaderText>{header.header}</MobileHeaderText>\r\n            {header.note && <MobileHeaderNote>{header.note}</MobileHeaderNote>}\r\n          </MobileHeaderContainer>\r\n        )}\r\n        <MenuItemsContainer>{items?.filter((a) => !a.pinned).map((item, index) => renderItem(item, index))}</MenuItemsContainer>\r\n      </ScrollableContainer>\r\n      {items?.some((a) => a.pinned) && (\r\n        <PinnedContainer>\r\n          <MenuItemsContainer>{items?.filter((a) => !!a.pinned).map((item, index) => renderItem(item, index))}</MenuItemsContainer>\r\n        </PinnedContainer>\r\n      )}\r\n      {footer && (\r\n        <FooterContainer>\r\n          <FooterText>{footer.header}</FooterText>\r\n          {footer.note && <FooterNote>{footer.note}</FooterNote>}\r\n          {footer.link && (\r\n            <FooterLink>\r\n              <HyperLink variant={'default'} id={footer.link.id} target={footer.link.target} onClick={footer.link.onClick} href={footer.link.href}>\r\n                {footer.link.label}\r\n              </HyperLink>\r\n            </FooterLink>\r\n          )}\r\n        </FooterContainer>\r\n      )}\r\n      {action && <MobileActionContainer {...action} />}\r\n    </MobileMenuWrapper>\r\n  );\r\n};\r\n\r\nexport default MobileMenuContent;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"MobileMenuContent.cjs","names":["MenuItemsContainer","styled","div","MenuSectionContainer","props","COLORS","getColor","theme","MenuSectionHeader","ComponentSStyling","ComponentTextStyle","Bold","MenuSectionList","PinnedContainer","FooterText","ComponentXSStyling","BREAKPOINTS","SMALL","FooterNote","Regular","FooterLink","FooterContainer","MobileMenuContent","header","items","footer","action","onSubMenuOpen","isSmallScreen","useMediaMatch","replace","useNavigationHelper","navigate","isActiveRoute","useScrollableContainer","scrollContainerRef","scrollable","renderItem","item","index","type","label","map","Size","Medium","Small","value","disabled","icon","displayLabel","noteLabel","note","e","nativeEvent","stopImmediatePropagation","external","to","exact","filter","a","pinned","some","link","id","target","onClick","href"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuContent.tsx"],"sourcesContent":["import React from 'react';\r\nimport { MenuButton, MenuGroupFooter, MenuGroupHeader, MenuNavigationItemTypeGroup, MenuNavigationItemTypeItem, MenuNavigationItemTypeSection } from '../types';\r\nimport styled from 'styled-components';\r\nimport {\r\n  BREAKPOINTS,\r\n  COLORS,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n} from '../../styles';\r\nimport { Size } from '../../types';\r\nimport { HyperLink } from '../../HyperLink';\r\nimport { useNavigationHelper } from '../../common/NavigationHelper';\r\nimport { MenuItem } from '../../MenuItem';\r\nimport { SystemIcons } from '../../icons';\r\nimport { MobileHeaderContainer, MobileHeaderNote, MobileHeaderText, MobileMenuWrapper, ScrollableContainer } from './CommonStyles';\r\nimport { useScrollableContainer } from '../../common/ScrollableContainer';\r\nimport { MobileActionContainer } from './MobileActionContainer';\r\nimport {useMediaMatch} from \"rooks\";\r\n\r\nconst MenuItemsContainer = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n  padding: 8px;\r\n`;\r\n\r\nconst MenuSectionContainer = styled.div`\r\n  padding-bottom: 8px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  width: 100%;\r\n\r\n  &.divider {\r\n    border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n  }\r\n`;\r\n\r\nconst MenuSectionHeader = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 8px 16px 4px 16px;\r\n  box-sizing: border-box;\r\n  min-height: 32px;\r\n  background-color: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n\r\n  ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_500', props.theme))}\r\n`;\r\n\r\nconst MenuSectionList = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n`;\r\n\r\nconst PinnedContainer = styled.div`\r\n  border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n`;\r\n\r\nconst FooterText = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\nconst FooterNote = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\nconst FooterLink = styled.div`\r\n  a {\r\n    ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\r\n    ${BREAKPOINTS.SMALL} {\r\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\r\n    }\r\n  }\r\n`;\r\n\r\nconst FooterContainer = styled.div`\r\n  padding: 8px 16px;\r\n  box-sizing: border-box;\r\n  border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n  display: flex;\r\n  flex-direction: column;\r\n  background: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    padding: 16px;\r\n  }\r\n`;\r\n\r\ninterface MobileMenuContentProps {\r\n  header?: MenuGroupHeader;\r\n  items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\r\n  footer?: MenuGroupFooter;\r\n  action?: MenuButton;\r\n\r\n  onSubMenuOpen?: (item: MenuNavigationItemTypeGroup) => void;\r\n}\r\n\r\nconst MobileMenuContent: React.FunctionComponent<MobileMenuContentProps> = ({ header, items, footer, action, onSubMenuOpen }) => {\r\n  const isSmallScreen = useMediaMatch(BREAKPOINTS.SMALL.replace('@media ', ''));\r\n\r\n  const { navigate, isActiveRoute } = useNavigationHelper();\r\n\r\n  const [scrollContainerRef, scrollable] = useScrollableContainer([header, footer, action, items]);\r\n\r\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection, index: number) => {\r\n    switch (item.type) {\r\n      case 'section':\r\n        return (\r\n          <MenuSectionContainer key={index}>\r\n            {item.label && <MenuSectionHeader>{item.label}</MenuSectionHeader>}\r\n            <MenuSectionList>{item.items.map((item, index) => renderItem(item, index))}</MenuSectionList>\r\n          </MenuSectionContainer>\r\n        );\r\n      case 'group':\r\n        return (\r\n          <MenuItem\r\n            key={index}\r\n            id={'menu-item-' + index}\r\n            size={isSmallScreen ? Size.Medium : Size.Small}\r\n            active={false}\r\n            item={{\r\n              value: item.label,\r\n              disabled: item.disabled,\r\n              icon: item.icon,\r\n              displayLabel: item.label,\r\n              noteLabel: item.note,\r\n            }}\r\n            iconRight={<SystemIcons.ArrowDropRight />}\r\n            onClickHandler={(e) => {\r\n              e.nativeEvent.stopImmediatePropagation();\r\n              onSubMenuOpen && onSubMenuOpen(item);\r\n            }}\r\n          />\r\n        );\r\n      case 'item':\r\n      default:\r\n        return (\r\n          <MenuItem\r\n            key={index}\r\n            id={'menu-item-' + index}\r\n            active={!item.external && isActiveRoute(item.to, !!item.exact)}\r\n            size={isSmallScreen ? Size.Medium : Size.Small}\r\n            item={{\r\n              value: item.to,\r\n              disabled: item.disabled,\r\n              icon: item.icon,\r\n              displayLabel: item.label,\r\n              noteLabel: item.note,\r\n            }}\r\n            onClickHandler={(e) => {\r\n              item.action && item.action(e);\r\n              navigate(item.to, !!item.external);\r\n            }}\r\n          />\r\n        );\r\n    }\r\n  };\r\n\r\n  return (\r\n    <MobileMenuWrapper>\r\n      <ScrollableContainer ref={scrollContainerRef as any} className={scrollable ? 'scrollable' : ''}>\r\n        {!!header && (\r\n          <MobileHeaderContainer>\r\n            <MobileHeaderText>{header.header}</MobileHeaderText>\r\n            {header.note && <MobileHeaderNote>{header.note}</MobileHeaderNote>}\r\n          </MobileHeaderContainer>\r\n        )}\r\n        <MenuItemsContainer>{items?.filter((a) => !a.pinned).map((item, index) => renderItem(item, index))}</MenuItemsContainer>\r\n      </ScrollableContainer>\r\n      {items?.some((a) => a.pinned) && (\r\n        <PinnedContainer>\r\n          <MenuItemsContainer>{items?.filter((a) => !!a.pinned).map((item, index) => renderItem(item, index))}</MenuItemsContainer>\r\n        </PinnedContainer>\r\n      )}\r\n      {footer && (\r\n        <FooterContainer>\r\n          <FooterText>{footer.header}</FooterText>\r\n          {footer.note && <FooterNote>{footer.note}</FooterNote>}\r\n          {footer.link && (\r\n            <FooterLink>\r\n              <HyperLink variant={'default'} id={footer.link.id} target={footer.link.target} onClick={footer.link.onClick} href={footer.link.href}>\r\n                {footer.link.label}\r\n              </HyperLink>\r\n            </FooterLink>\r\n          )}\r\n        </FooterContainer>\r\n      )}\r\n      {action && <MobileActionContainer {...action} />}\r\n    </MobileMenuWrapper>\r\n  );\r\n};\r\n\r\nexport default MobileMenuContent;\r\n"],"mappings":"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"}

package/dist/GlobalNavigationBar/mobile/MobileMenuContent.js

@@ -3,8 +3,8 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
 import _pt from "prop-types";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React from 'react';
 import styled from 'styled-components';
 import { BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling } from '../../styles';

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

@@ -1 +1 @@
-{"version":3,"file":"MobileMenuContent.js","names":["React","styled","BREAKPOINTS","COLORS","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Size","HyperLink","useNavigationHelper","MenuItem","SystemIcons","MobileHeaderContainer","MobileHeaderNote","MobileHeaderText","MobileMenuWrapper","ScrollableContainer","useScrollableContainer","MobileActionContainer","useMediaMatch","jsx","_jsx","jsxs","_jsxs","MenuItemsContainer","div","_templateObject","_taggedTemplateLiteral","MenuSectionContainer","_templateObject2","props","getColor","theme","MenuSectionHeader","_templateObject3","Bold","MenuSectionList","_templateObject4","PinnedContainer","_templateObject5","FooterText","_templateObject6","SMALL","FooterNote","_templateObject7","Regular","FooterLink","_templateObject8","FooterContainer","_templateObject9","MobileMenuContent","_ref","header","items","footer","action","onSubMenuOpen","isSmallScreen","replace","_useNavigationHelper","navigate","isActiveRoute","_useScrollableContain","_useScrollableContain2","_slicedToArray","scrollContainerRef","scrollable","renderItem","item","index","type","children","label","map","id","size","Medium","Small","active","value","disabled","icon","displayLabel","noteLabel","note","iconRight","ArrowDropRight","onClickHandler","e","nativeEvent","stopImmediatePropagation","external","to","exact","ref","className","filter","a","pinned","some","link","variant","target","onClick","href","_objectSpread","propTypes","_pt","array","func"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuContent.tsx"],"sourcesContent":["import React from 'react';\r\nimport { MenuButton, MenuGroupFooter, MenuGroupHeader, MenuNavigationItemTypeGroup, MenuNavigationItemTypeItem, MenuNavigationItemTypeSection } from '../types';\r\nimport styled from 'styled-components';\r\nimport {\r\n  BREAKPOINTS,\r\n  COLORS,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n} from '../../styles';\r\nimport { Size } from '../../types';\r\nimport { HyperLink } from '../../HyperLink';\r\nimport { useNavigationHelper } from '../../common/NavigationHelper';\r\nimport { MenuItem } from '../../MenuItem';\r\nimport { SystemIcons } from '../../icons';\r\nimport { MobileHeaderContainer, MobileHeaderNote, MobileHeaderText, MobileMenuWrapper, ScrollableContainer } from './CommonStyles';\r\nimport { useScrollableContainer } from '../../common/ScrollableContainer';\r\nimport { MobileActionContainer } from './MobileActionContainer';\r\nimport {useMediaMatch} from \"rooks\";\r\n\r\nconst MenuItemsContainer = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n  padding: 8px;\r\n`;\r\n\r\nconst MenuSectionContainer = styled.div`\r\n  padding-bottom: 8px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  width: 100%;\r\n\r\n  &.divider {\r\n    border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n  }\r\n`;\r\n\r\nconst MenuSectionHeader = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 8px 16px 4px 16px;\r\n  box-sizing: border-box;\r\n  min-height: 32px;\r\n  background-color: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n\r\n  ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_500', props.theme))}\r\n`;\r\n\r\nconst MenuSectionList = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n`;\r\n\r\nconst PinnedContainer = styled.div`\r\n  border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n`;\r\n\r\nconst FooterText = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\nconst FooterNote = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\nconst FooterLink = styled.div`\r\n  a {\r\n    ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\r\n    ${BREAKPOINTS.SMALL} {\r\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\r\n    }\r\n  }\r\n`;\r\n\r\nconst FooterContainer = styled.div`\r\n  padding: 8px 16px;\r\n  box-sizing: border-box;\r\n  border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n  display: flex;\r\n  flex-direction: column;\r\n  background: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    padding: 16px;\r\n  }\r\n`;\r\n\r\ninterface MobileMenuContentProps {\r\n  header?: MenuGroupHeader;\r\n  items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\r\n  footer?: MenuGroupFooter;\r\n  action?: MenuButton;\r\n\r\n  onSubMenuOpen?: (item: MenuNavigationItemTypeGroup) => void;\r\n}\r\n\r\nconst MobileMenuContent: React.FunctionComponent<MobileMenuContentProps> = ({ header, items, footer, action, onSubMenuOpen }) => {\r\n  const isSmallScreen = useMediaMatch(BREAKPOINTS.SMALL.replace('@media ', ''));\r\n\r\n  const { navigate, isActiveRoute } = useNavigationHelper();\r\n\r\n  const [scrollContainerRef, scrollable] = useScrollableContainer([header, footer, action, items]);\r\n\r\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection, index: number) => {\r\n    switch (item.type) {\r\n      case 'section':\r\n        return (\r\n          <MenuSectionContainer key={index}>\r\n            {item.label && <MenuSectionHeader>{item.label}</MenuSectionHeader>}\r\n            <MenuSectionList>{item.items.map((item, index) => renderItem(item, index))}</MenuSectionList>\r\n          </MenuSectionContainer>\r\n        );\r\n      case 'group':\r\n        return (\r\n          <MenuItem\r\n            key={index}\r\n            id={'menu-item-' + index}\r\n            size={isSmallScreen ? Size.Medium : Size.Small}\r\n            active={false}\r\n            item={{\r\n              value: item.label,\r\n              disabled: item.disabled,\r\n              icon: item.icon,\r\n              displayLabel: item.label,\r\n              noteLabel: item.note,\r\n            }}\r\n            iconRight={<SystemIcons.ArrowDropRight />}\r\n            onClickHandler={(e) => {\r\n              e.nativeEvent.stopImmediatePropagation();\r\n              onSubMenuOpen && onSubMenuOpen(item);\r\n            }}\r\n          />\r\n        );\r\n      case 'item':\r\n      default:\r\n        return (\r\n          <MenuItem\r\n            key={index}\r\n            id={'menu-item-' + index}\r\n            active={!item.external && isActiveRoute(item.to, !!item.exact)}\r\n            size={isSmallScreen ? Size.Medium : Size.Small}\r\n            item={{\r\n              value: item.to,\r\n              disabled: item.disabled,\r\n              icon: item.icon,\r\n              displayLabel: item.label,\r\n              noteLabel: item.note,\r\n            }}\r\n            onClickHandler={(e) => {\r\n              item.action && item.action(e);\r\n              navigate(item.to, !!item.external);\r\n            }}\r\n          />\r\n        );\r\n    }\r\n  };\r\n\r\n  return (\r\n    <MobileMenuWrapper>\r\n      <ScrollableContainer ref={scrollContainerRef as any} className={scrollable ? 'scrollable' : ''}>\r\n        {!!header && (\r\n          <MobileHeaderContainer>\r\n            <MobileHeaderText>{header.header}</MobileHeaderText>\r\n            {header.note && <MobileHeaderNote>{header.note}</MobileHeaderNote>}\r\n          </MobileHeaderContainer>\r\n        )}\r\n        <MenuItemsContainer>{items?.filter((a) => !a.pinned).map((item, index) => renderItem(item, index))}</MenuItemsContainer>\r\n      </ScrollableContainer>\r\n      {items?.some((a) => a.pinned) && (\r\n        <PinnedContainer>\r\n          <MenuItemsContainer>{items?.filter((a) => !!a.pinned).map((item, index) => renderItem(item, index))}</MenuItemsContainer>\r\n        </PinnedContainer>\r\n      )}\r\n      {footer && (\r\n        <FooterContainer>\r\n          <FooterText>{footer.header}</FooterText>\r\n          {footer.note && <FooterNote>{footer.note}</FooterNote>}\r\n          {footer.link && (\r\n            <FooterLink>\r\n              <HyperLink variant={'default'} id={footer.link.id} target={footer.link.target} onClick={footer.link.onClick} href={footer.link.href}>\r\n                {footer.link.label}\r\n              </HyperLink>\r\n            </FooterLink>\r\n          )}\r\n        </FooterContainer>\r\n      )}\r\n      {action && <MobileActionContainer {...action} />}\r\n    </MobileMenuWrapper>\r\n  );\r\n};\r\n\r\nexport default MobileMenuContent;\r\n"],"mappings":";;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SACEC,WAAW,EACXC,MAAM,EACNC,iBAAiB,EACjBC,kBAAkB,EAClBC,kBAAkB,QACb,cAAc;AACrB,SAASC,IAAI,QAAQ,aAAa;AAClC,SAASC,SAAS,QAAQ,iBAAiB;AAC3C,SAASC,mBAAmB,QAAQ,+BAA+B;AACnE,SAASC,QAAQ,QAAQ,gBAAgB;AACzC,SAASC,WAAW,QAAQ,aAAa;AACzC,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,gBAAgB,EAAEC,iBAAiB,EAAEC,mBAAmB,QAAQ,gBAAgB;AAClI,SAASC,sBAAsB,QAAQ,kCAAkC;AACzE,SAASC,qBAAqB,QAAQ,yBAAyB;AAC/D,SAAQC,aAAa,QAAO,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAEpC,IAAMC,kBAAkB,GAAGvB,MAAM,CAACwB,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,mGAKpC;AAED,IAAMC,oBAAoB,GAAG3B,MAAM,CAACwB,GAAG,CAAAI,gBAAA,KAAAA,gBAAA,GAAAF,sBAAA,uJAOX,UAAAG,KAAK;EAAA,OAAI3B,MAAM,CAAC4B,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AAAA,EAE/E;AAED,IAAMC,iBAAiB,GAAGhC,MAAM,CAACwB,GAAG,CAAAS,gBAAA,KAAAA,gBAAA,GAAAP,sBAAA,yKAMd,UAAAG,KAAK;EAAA,OAAI3B,MAAM,CAAC4B,QAAQ,CAAC,YAAY,EAAED,KAAK,CAACE,KAAK,CAAC;AAAA,GAErE,UAAAF,KAAK;EAAA,OAAI1B,iBAAiB,CAACC,kBAAkB,CAAC8B,IAAI,EAAEhC,MAAM,CAAC4B,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC,CAAC;AAAA,EACnG;AAED,IAAMI,eAAe,GAAGnC,MAAM,CAACwB,GAAG,CAAAY,gBAAA,KAAAA,gBAAA,GAAAV,sBAAA,uDAGjC;AAED,IAAMW,eAAe,GAAGrC,MAAM,CAACwB,GAAG,CAAAc,gBAAA,KAAAA,gBAAA,GAAAZ,sBAAA,0CACR,UAAAG,KAAK;EAAA,OAAI3B,MAAM,CAAC4B,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AAAA,EAC7E;AAED,IAAMQ,UAAU,GAAGvC,MAAM,CAACwB,GAAG,CAAAgB,gBAAA,KAAAA,gBAAA,GAAAd,sBAAA,4CACzB,UAAAG,KAAK;EAAA,OAAIxB,kBAAkB,CAACD,kBAAkB,CAAC8B,IAAI,EAAEhC,MAAM,CAAC4B,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC,CAAC;AAAA,GACjG9B,WAAW,CAACwC,KAAK,EACf,UAAAZ,KAAK;EAAA,OAAI1B,iBAAiB,CAACC,kBAAkB,CAAC8B,IAAI,EAAEhC,MAAM,CAAC4B,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC,CAAC;AAAA,EAErG;AACD,IAAMW,UAAU,GAAG1C,MAAM,CAACwB,GAAG,CAAAmB,gBAAA,KAAAA,gBAAA,GAAAjB,sBAAA,4CACzB,UAAAG,KAAK;EAAA,OAAIxB,kBAAkB,CAACD,kBAAkB,CAACwC,OAAO,EAAE1C,MAAM,CAAC4B,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC,CAAC;AAAA,GACpG9B,WAAW,CAACwC,KAAK,EACf,UAAAZ,KAAK;EAAA,OAAI1B,iBAAiB,CAACC,kBAAkB,CAACwC,OAAO,EAAE1C,MAAM,CAAC4B,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC,CAAC;AAAA,EAExG;AACD,IAAMc,UAAU,GAAG7C,MAAM,CAACwB,GAAG,CAAAsB,gBAAA,KAAAA,gBAAA,GAAApB,sBAAA,gEAEvBrB,kBAAkB,CAACD,kBAAkB,CAAC8B,IAAI,EAAE,IAAI,CAAC,EACjDjC,WAAW,CAACwC,KAAK,EACftC,iBAAiB,CAACC,kBAAkB,CAAC8B,IAAI,EAAE,IAAI,CAAC,CAGvD;AAED,IAAMa,eAAe,GAAG/C,MAAM,CAACwB,GAAG,CAAAwB,gBAAA,KAAAA,gBAAA,GAAAtB,sBAAA,kMAGR,UAAAG,KAAK;EAAA,OAAI3B,MAAM,CAAC4B,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AAAA,GAG9D,UAAAF,KAAK;EAAA,OAAI3B,MAAM,CAAC4B,QAAQ,CAAC,YAAY,EAAED,KAAK,CAACE,KAAK,CAAC;AAAA,GAE/D9B,WAAW,CAACwC,KAAK,CAGpB;AAWD,IAAMQ,iBAAkE,GAAG,SAArEA,iBAAkEA,CAAAC,IAAA,EAAyD;EAAA,IAAnDC,MAAM,GAAAD,IAAA,CAANC,MAAM;IAAEC,KAAK,GAAAF,IAAA,CAALE,KAAK;IAAEC,MAAM,GAAAH,IAAA,CAANG,MAAM;IAAEC,MAAM,GAAAJ,IAAA,CAANI,MAAM;IAAEC,aAAa,GAAAL,IAAA,CAAbK,aAAa;EACxH,IAAMC,aAAa,GAAGtC,aAAa,CAACjB,WAAW,CAACwC,KAAK,CAACgB,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;EAE7E,IAAAC,oBAAA,GAAoClD,mBAAmB,CAAC,CAAC;IAAjDmD,QAAQ,GAAAD,oBAAA,CAARC,QAAQ;IAAEC,aAAa,GAAAF,oBAAA,CAAbE,aAAa;EAE/B,IAAAC,qBAAA,GAAyC7C,sBAAsB,CAAC,CAACmC,MAAM,EAAEE,MAAM,EAAEC,MAAM,EAAEF,KAAK,CAAC,CAAC;IAAAU,sBAAA,GAAAC,cAAA,CAAAF,qBAAA;IAAzFG,kBAAkB,GAAAF,sBAAA;IAAEG,UAAU,GAAAH,sBAAA;EAErC,IAAMI,UAAU,GAAG,SAAbA,UAAUA,CAAIC,IAA8F,EAAEC,KAAa,EAAK;IACpI,QAAQD,IAAI,CAACE,IAAI;MACf,KAAK,SAAS;QACZ,oBACE/C,KAAA,CAACK,oBAAoB;UAAA2C,QAAA,GAClBH,IAAI,CAACI,KAAK,iBAAInD,IAAA,CAACY,iBAAiB;YAAAsC,QAAA,EAAEH,IAAI,CAACI;UAAK,CAAoB,CAAC,eAClEnD,IAAA,CAACe,eAAe;YAAAmC,QAAA,EAAEH,IAAI,CAACf,KAAK,CAACoB,GAAG,CAAC,UAACL,IAAI,EAAEC,KAAK;cAAA,OAAKF,UAAU,CAACC,IAAI,EAAEC,KAAK,CAAC;YAAA;UAAC,CAAkB,CAAC;QAAA,GAFpEA,KAGL,CAAC;MAE3B,KAAK,OAAO;QACV,oBACEhD,IAAA,CAACX,QAAQ;UAEPgE,EAAE,EAAE,YAAY,GAAGL,KAAM;UACzBM,IAAI,EAAElB,aAAa,GAAGlD,IAAI,CAACqE,MAAM,GAAGrE,IAAI,CAACsE,KAAM;UAC/CC,MAAM,EAAE,KAAM;UACdV,IAAI,EAAE;YACJW,KAAK,EAAEX,IAAI,CAACI,KAAK;YACjBQ,QAAQ,EAAEZ,IAAI,CAACY,QAAQ;YACvBC,IAAI,EAAEb,IAAI,CAACa,IAAI;YACfC,YAAY,EAAEd,IAAI,CAACI,KAAK;YACxBW,SAAS,EAAEf,IAAI,CAACgB;UAClB,CAAE;UACFC,SAAS,eAAEhE,IAAA,CAACV,WAAW,CAAC2E,cAAc,IAAE,CAAE;UAC1CC,cAAc,EAAE,SAAAA,eAACC,CAAC,EAAK;YACrBA,CAAC,CAACC,WAAW,CAACC,wBAAwB,CAAC,CAAC;YACxClC,aAAa,IAAIA,aAAa,CAACY,IAAI,CAAC;UACtC;QAAE,GAfGC,KAgBN,CAAC;MAEN,KAAK,MAAM;MACX;QACE,oBACEhD,IAAA,CAACX,QAAQ;UAEPgE,EAAE,EAAE,YAAY,GAAGL,KAAM;UACzBS,MAAM,EAAE,CAACV,IAAI,CAACuB,QAAQ,IAAI9B,aAAa,CAACO,IAAI,CAACwB,EAAE,EAAE,CAAC,CAACxB,IAAI,CAACyB,KAAK,CAAE;UAC/DlB,IAAI,EAAElB,aAAa,GAAGlD,IAAI,CAACqE,MAAM,GAAGrE,IAAI,CAACsE,KAAM;UAC/CT,IAAI,EAAE;YACJW,KAAK,EAAEX,IAAI,CAACwB,EAAE;YACdZ,QAAQ,EAAEZ,IAAI,CAACY,QAAQ;YACvBC,IAAI,EAAEb,IAAI,CAACa,IAAI;YACfC,YAAY,EAAEd,IAAI,CAACI,KAAK;YACxBW,SAAS,EAAEf,IAAI,CAACgB;UAClB,CAAE;UACFG,cAAc,EAAE,SAAAA,eAACC,CAAC,EAAK;YACrBpB,IAAI,CAACb,MAAM,IAAIa,IAAI,CAACb,MAAM,CAACiC,CAAC,CAAC;YAC7B5B,QAAQ,CAACQ,IAAI,CAACwB,EAAE,EAAE,CAAC,CAACxB,IAAI,CAACuB,QAAQ,CAAC;UACpC;QAAE,GAdGtB,KAeN,CAAC;IAER;EACF,CAAC;EAED,oBACE9C,KAAA,CAACR,iBAAiB;IAAAwD,QAAA,gBAChBhD,KAAA,CAACP,mBAAmB;MAAC8E,GAAG,EAAE7B,kBAA0B;MAAC8B,SAAS,EAAE7B,UAAU,GAAG,YAAY,GAAG,EAAG;MAAAK,QAAA,GAC5F,CAAC,CAACnB,MAAM,iBACP7B,KAAA,CAACX,qBAAqB;QAAA2D,QAAA,gBACpBlD,IAAA,CAACP,gBAAgB;UAAAyD,QAAA,EAAEnB,MAAM,CAACA;QAAM,CAAmB,CAAC,EACnDA,MAAM,CAACgC,IAAI,iBAAI/D,IAAA,CAACR,gBAAgB;UAAA0D,QAAA,EAAEnB,MAAM,CAACgC;QAAI,CAAmB,CAAC;MAAA,CAC7C,CACxB,eACD/D,IAAA,CAACG,kBAAkB;QAAA+C,QAAA,EAAElB,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAE2C,MAAM,CAAC,UAACC,CAAC;UAAA,OAAK,CAACA,CAAC,CAACC,MAAM;QAAA,EAAC,CAACzB,GAAG,CAAC,UAACL,IAAI,EAAEC,KAAK;UAAA,OAAKF,UAAU,CAACC,IAAI,EAAEC,KAAK,CAAC;QAAA;MAAC,CAAqB,CAAC;IAAA,CACrG,CAAC,EACrB,CAAAhB,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAE8C,IAAI,CAAC,UAACF,CAAC;MAAA,OAAKA,CAAC,CAACC,MAAM;IAAA,EAAC,kBAC3B7E,IAAA,CAACiB,eAAe;MAAAiC,QAAA,eACdlD,IAAA,CAACG,kBAAkB;QAAA+C,QAAA,EAAElB,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAE2C,MAAM,CAAC,UAACC,CAAC;UAAA,OAAK,CAAC,CAACA,CAAC,CAACC,MAAM;QAAA,EAAC,CAACzB,GAAG,CAAC,UAACL,IAAI,EAAEC,KAAK;UAAA,OAAKF,UAAU,CAACC,IAAI,EAAEC,KAAK,CAAC;QAAA;MAAC,CAAqB;IAAC,CAC1G,CAClB,EACAf,MAAM,iBACL/B,KAAA,CAACyB,eAAe;MAAAuB,QAAA,gBACdlD,IAAA,CAACmB,UAAU;QAAA+B,QAAA,EAAEjB,MAAM,CAACF;MAAM,CAAa,CAAC,EACvCE,MAAM,CAAC8B,IAAI,iBAAI/D,IAAA,CAACsB,UAAU;QAAA4B,QAAA,EAAEjB,MAAM,CAAC8B;MAAI,CAAa,CAAC,EACrD9B,MAAM,CAAC8C,IAAI,iBACV/E,IAAA,CAACyB,UAAU;QAAAyB,QAAA,eACTlD,IAAA,CAACb,SAAS;UAAC6F,OAAO,EAAE,SAAU;UAAC3B,EAAE,EAAEpB,MAAM,CAAC8C,IAAI,CAAC1B,EAAG;UAAC4B,MAAM,EAAEhD,MAAM,CAAC8C,IAAI,CAACE,MAAO;UAACC,OAAO,EAAEjD,MAAM,CAAC8C,IAAI,CAACG,OAAQ;UAACC,IAAI,EAAElD,MAAM,CAAC8C,IAAI,CAACI,IAAK;UAAAjC,QAAA,EACjIjB,MAAM,CAAC8C,IAAI,CAAC5B;QAAK,CACT;MAAC,CACF,CACb;IAAA,CACc,CAClB,EACAjB,MAAM,iBAAIlC,IAAA,CAACH,qBAAqB,EAAAuF,aAAA,KAAKlD,MAAM,CAAG,CAAC;EAAA,CAC/B,CAAC;AAExB,CAAC;AAACL,iBAAA,CAAAwD,SAAA;EApGArD,KAAK,EAAAsD,GAAA,CAAAC,KAAA;EAILpD,aAAa,EAAAmD,GAAA,CAAAE;AAAA;AAkGf,eAAe3D,iBAAiB","ignoreList":[]}
+{"version":3,"file":"MobileMenuContent.js","names":["React","styled","BREAKPOINTS","COLORS","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Size","HyperLink","useNavigationHelper","MenuItem","SystemIcons","MobileHeaderContainer","MobileHeaderNote","MobileHeaderText","MobileMenuWrapper","ScrollableContainer","useScrollableContainer","MobileActionContainer","useMediaMatch","MenuItemsContainer","div","MenuSectionContainer","props","getColor","theme","MenuSectionHeader","Bold","MenuSectionList","PinnedContainer","FooterText","SMALL","FooterNote","Regular","FooterLink","FooterContainer","MobileMenuContent","header","items","footer","action","onSubMenuOpen","isSmallScreen","replace","navigate","isActiveRoute","scrollContainerRef","scrollable","renderItem","item","index","type","label","map","Medium","Small","value","disabled","icon","displayLabel","noteLabel","note","e","nativeEvent","stopImmediatePropagation","external","to","exact","filter","a","pinned","some","link","id","target","onClick","href"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuContent.tsx"],"sourcesContent":["import React from 'react';\r\nimport { MenuButton, MenuGroupFooter, MenuGroupHeader, MenuNavigationItemTypeGroup, MenuNavigationItemTypeItem, MenuNavigationItemTypeSection } from '../types';\r\nimport styled from 'styled-components';\r\nimport {\r\n  BREAKPOINTS,\r\n  COLORS,\r\n  ComponentSStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n} from '../../styles';\r\nimport { Size } from '../../types';\r\nimport { HyperLink } from '../../HyperLink';\r\nimport { useNavigationHelper } from '../../common/NavigationHelper';\r\nimport { MenuItem } from '../../MenuItem';\r\nimport { SystemIcons } from '../../icons';\r\nimport { MobileHeaderContainer, MobileHeaderNote, MobileHeaderText, MobileMenuWrapper, ScrollableContainer } from './CommonStyles';\r\nimport { useScrollableContainer } from '../../common/ScrollableContainer';\r\nimport { MobileActionContainer } from './MobileActionContainer';\r\nimport {useMediaMatch} from \"rooks\";\r\n\r\nconst MenuItemsContainer = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-sizing: border-box;\r\n  padding: 8px;\r\n`;\r\n\r\nconst MenuSectionContainer = styled.div`\r\n  padding-bottom: 8px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  width: 100%;\r\n\r\n  &.divider {\r\n    border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n  }\r\n`;\r\n\r\nconst MenuSectionHeader = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 8px 16px 4px 16px;\r\n  box-sizing: border-box;\r\n  min-height: 32px;\r\n  background-color: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n\r\n  ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_500', props.theme))}\r\n`;\r\n\r\nconst MenuSectionList = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n`;\r\n\r\nconst PinnedContainer = styled.div`\r\n  border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n`;\r\n\r\nconst FooterText = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\nconst FooterNote = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\nconst FooterLink = styled.div`\r\n  a {\r\n    ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\r\n    ${BREAKPOINTS.SMALL} {\r\n      ${ComponentSStyling(ComponentTextStyle.Bold, null)}\r\n    }\r\n  }\r\n`;\r\n\r\nconst FooterContainer = styled.div`\r\n  padding: 8px 16px;\r\n  box-sizing: border-box;\r\n  border-top: 1px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n  display: flex;\r\n  flex-direction: column;\r\n  background: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n\r\n  ${BREAKPOINTS.SMALL} {\r\n    padding: 16px;\r\n  }\r\n`;\r\n\r\ninterface MobileMenuContentProps {\r\n  header?: MenuGroupHeader;\r\n  items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\r\n  footer?: MenuGroupFooter;\r\n  action?: MenuButton;\r\n\r\n  onSubMenuOpen?: (item: MenuNavigationItemTypeGroup) => void;\r\n}\r\n\r\nconst MobileMenuContent: React.FunctionComponent<MobileMenuContentProps> = ({ header, items, footer, action, onSubMenuOpen }) => {\r\n  const isSmallScreen = useMediaMatch(BREAKPOINTS.SMALL.replace('@media ', ''));\r\n\r\n  const { navigate, isActiveRoute } = useNavigationHelper();\r\n\r\n  const [scrollContainerRef, scrollable] = useScrollableContainer([header, footer, action, items]);\r\n\r\n  const renderItem = (item: MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection, index: number) => {\r\n    switch (item.type) {\r\n      case 'section':\r\n        return (\r\n          <MenuSectionContainer key={index}>\r\n            {item.label && <MenuSectionHeader>{item.label}</MenuSectionHeader>}\r\n            <MenuSectionList>{item.items.map((item, index) => renderItem(item, index))}</MenuSectionList>\r\n          </MenuSectionContainer>\r\n        );\r\n      case 'group':\r\n        return (\r\n          <MenuItem\r\n            key={index}\r\n            id={'menu-item-' + index}\r\n            size={isSmallScreen ? Size.Medium : Size.Small}\r\n            active={false}\r\n            item={{\r\n              value: item.label,\r\n              disabled: item.disabled,\r\n              icon: item.icon,\r\n              displayLabel: item.label,\r\n              noteLabel: item.note,\r\n            }}\r\n            iconRight={<SystemIcons.ArrowDropRight />}\r\n            onClickHandler={(e) => {\r\n              e.nativeEvent.stopImmediatePropagation();\r\n              onSubMenuOpen && onSubMenuOpen(item);\r\n            }}\r\n          />\r\n        );\r\n      case 'item':\r\n      default:\r\n        return (\r\n          <MenuItem\r\n            key={index}\r\n            id={'menu-item-' + index}\r\n            active={!item.external && isActiveRoute(item.to, !!item.exact)}\r\n            size={isSmallScreen ? Size.Medium : Size.Small}\r\n            item={{\r\n              value: item.to,\r\n              disabled: item.disabled,\r\n              icon: item.icon,\r\n              displayLabel: item.label,\r\n              noteLabel: item.note,\r\n            }}\r\n            onClickHandler={(e) => {\r\n              item.action && item.action(e);\r\n              navigate(item.to, !!item.external);\r\n            }}\r\n          />\r\n        );\r\n    }\r\n  };\r\n\r\n  return (\r\n    <MobileMenuWrapper>\r\n      <ScrollableContainer ref={scrollContainerRef as any} className={scrollable ? 'scrollable' : ''}>\r\n        {!!header && (\r\n          <MobileHeaderContainer>\r\n            <MobileHeaderText>{header.header}</MobileHeaderText>\r\n            {header.note && <MobileHeaderNote>{header.note}</MobileHeaderNote>}\r\n          </MobileHeaderContainer>\r\n        )}\r\n        <MenuItemsContainer>{items?.filter((a) => !a.pinned).map((item, index) => renderItem(item, index))}</MenuItemsContainer>\r\n      </ScrollableContainer>\r\n      {items?.some((a) => a.pinned) && (\r\n        <PinnedContainer>\r\n          <MenuItemsContainer>{items?.filter((a) => !!a.pinned).map((item, index) => renderItem(item, index))}</MenuItemsContainer>\r\n        </PinnedContainer>\r\n      )}\r\n      {footer && (\r\n        <FooterContainer>\r\n          <FooterText>{footer.header}</FooterText>\r\n          {footer.note && <FooterNote>{footer.note}</FooterNote>}\r\n          {footer.link && (\r\n            <FooterLink>\r\n              <HyperLink variant={'default'} id={footer.link.id} target={footer.link.target} onClick={footer.link.onClick} href={footer.link.href}>\r\n                {footer.link.label}\r\n              </HyperLink>\r\n            </FooterLink>\r\n          )}\r\n        </FooterContainer>\r\n      )}\r\n      {action && <MobileActionContainer {...action} />}\r\n    </MobileMenuWrapper>\r\n  );\r\n};\r\n\r\nexport default MobileMenuContent;\r\n"],"mappings":"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"}

package/dist/GlobalNavigationBar/mobile/MobileMenuHeader.cjs

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.MobileMenuHeaderWrapper = exports.MobileMenuHeaderActions = void 0;
+exports.default = exports.MobileMenuHeaderWrapper = exports.MobileMenuHeaderActions = void 0;
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
@@ -21,16 +21,16 @@ var _excluded = ["placement", "type", "action"],
   _excluded2 = ["placement", "type", "icon", "menu"],
   _excluded3 = ["placement", "type", "icon", "action"];
 var _templateObject, _templateObject2, _templateObject3;
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var MobileMenuHeaderActions = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  flex: 1;\n  justify-content: flex-end;\n  display: flex;\n  flex-direction: row;\n"])));
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var MobileMenuHeaderActions = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1;\n  justify-content: flex-end;\n  display: flex;\n  flex-direction: row;\n"])));
 exports.MobileMenuHeaderActions = MobileMenuHeaderActions;
-var MobileMenuHeaderLabel = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  ", "\n  ", " {\n    ", "\n  }\n"])), function (props) {
+var MobileMenuHeaderLabel = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", " {\n    ", "\n  }\n"])), function (props) {
   return (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('neutral_600', props.theme));
 }, _styles.BREAKPOINTS.SMALL, function (props) {
   return (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('neutral_600', props.theme));
 });
-var MobileMenuHeaderWrapper = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  padding: 0 4px;\n\n  ", " {\n    padding: 4px 8px;\n  }\n\n  ", " {\n    display: none;\n  }\n"])), _breakpoints["default"].SMALL, _breakpoints["default"].LARGE);
+var MobileMenuHeaderWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  padding: 0 4px;\n\n  ", " {\n    padding: 4px 8px;\n  }\n\n  ", " {\n    display: none;\n  }\n"])), _breakpoints.default.SMALL, _breakpoints.default.LARGE);
 exports.MobileMenuHeaderWrapper = MobileMenuHeaderWrapper;
 var MobileMenuHeader = function MobileMenuHeader(_ref) {
   var onGoBack = _ref.onGoBack,
@@ -70,7 +70,7 @@ var MobileMenuHeader = function MobileMenuHeader(_ref) {
           var placement = item.placement,
             type = item.type,
             action = item.action,
-            rest = (0, _objectWithoutProperties2["default"])(item, _excluded);
+            rest = (0, _objectWithoutProperties2.default)(item, _excluded);
           if (!!profile) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProfileButton.ProfileButton, _objectSpread({
             onClick: function onClick(e) {
               e === null || e === void 0 ? void 0 : e.nativeEvent.stopImmediatePropagation();
@@ -86,7 +86,7 @@ var MobileMenuHeader = function MobileMenuHeader(_ref) {
             _type = item.type,
             icon = item.icon,
             menu = item.menu,
-            _rest = (0, _objectWithoutProperties2["default"])(item, _excluded2);
+            _rest = (0, _objectWithoutProperties2.default)(item, _excluded2);
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, _objectSpread(_objectSpread({
             variant: 'secondary',
             shape: 'circular',
@@ -104,7 +104,7 @@ var MobileMenuHeader = function MobileMenuHeader(_ref) {
             _type2 = item.type,
             _icon = item.icon,
             _action = item.action,
-            _rest2 = (0, _objectWithoutProperties2["default"])(item, _excluded3);
+            _rest2 = (0, _objectWithoutProperties2.default)(item, _excluded3);
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, _objectSpread(_objectSpread({
             disabled: item.disabled,
             variant: 'secondary',
@@ -153,12 +153,12 @@ var MobileMenuHeader = function MobileMenuHeader(_ref) {
   });
 };
 MobileMenuHeader.propTypes = {
-  onGoBack: _propTypes["default"].func,
-  onClose: _propTypes["default"].func.isRequired,
-  label: _propTypes["default"].string,
-  buttons: _propTypes["default"].array,
-  onSubMenuOpen: _propTypes["default"].func
+  onGoBack: _propTypes.default.func,
+  onClose: _propTypes.default.func.isRequired,
+  label: _propTypes.default.string,
+  buttons: _propTypes.default.array,
+  onSubMenuOpen: _propTypes.default.func
 };
 var _default = MobileMenuHeader;
-exports["default"] = _default;
+exports.default = _default;
 //# sourceMappingURL=MobileMenuHeader.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"MobileMenuHeader.cjs","names":["_react","_interopRequireDefault","require","_styledComponents","_breakpoints","_Button","_icons","_styles","_ProfileButton","_jsxRuntime","_excluded","_excluded2","_excluded3","_templateObject","_templateObject2","_templateObject3","ownKeys","e","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","defineProperty","MobileMenuHeaderActions","styled","div","_taggedTemplateLiteral2","exports","MobileMenuHeaderLabel","props","ComponentXSStyling","ComponentTextStyle","Bold","COLORS","getColor","theme","BREAKPOINTS","SMALL","ComponentSStyling","MobileMenuHeaderWrapper","Breakpoints","LARGE","MobileMenuHeader","_ref","onGoBack","onClose","label","profile","buttons","onSubMenuOpen","buildProfileSubMenu","_profile$signOut","_profile$signOut2","_profile$signOut3","_profile$signOut4","type","header","user","firstName","lastName","note","email","link","action","signOut","icon","disabled","items","sections","map","a","undefined","renderItem","item","index","_profile$user$firstNa","_profile$user","_profile$user$firstNa2","_profile$user$lastNam","_profile$user2","_profile$user2$lastNa","placement","rest","_objectWithoutProperties2","jsx","ProfileButton","onClick","nativeEvent","stopImmediatePropagation","target","SystemIcons","User","initials","charAt","Fragment","menu","IconButton","variant","shape","children","jsxs","ArrowLineLeft","style","marginLeft","Close","propTypes","_propTypes","func","isRequired","string","array","_default"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuHeader.tsx"],"sourcesContent":["import React from 'react';\r\nimport {\r\n  MobileMenuButtonTypes,\r\n  MenuNavigationItemTypeGroup,\r\n  ProfileMenu, MenuNavigationCustomSubMenu\r\n} from '../types';\r\nimport styled from 'styled-components';\r\nimport Breakpoints from '../../styles/breakpoints';\r\nimport {IconButton} from '../../Button';\r\nimport {SystemIcons} from '../../icons';\r\nimport {BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling} from '../../styles';\r\nimport {ProfileButton} from '../../ProfileButton';\r\n\r\nexport const MobileMenuHeaderActions = styled.div`\r\n  flex: 1;\r\n  justify-content: flex-end;\r\n  display: flex;\r\n  flex-direction: row;\r\n`;\r\nconst MobileMenuHeaderLabel = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\n\r\nexport const MobileMenuHeaderWrapper = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n  align-items: center;\r\n  padding: 0 4px;\r\n\r\n  ${Breakpoints.SMALL} {\r\n    padding: 4px 8px;\r\n  }\r\n\r\n  ${Breakpoints.LARGE} {\r\n    display: none;\r\n  }\r\n`\r\n\r\ninterface MobileMenuHeaderProps {\r\n  onGoBack?: () => void;\r\n  onClose: () => void;\r\n  label?: string;\r\n\r\n  profile?: ProfileMenu\r\n  buttons?: MobileMenuButtonTypes[];\r\n\r\n  onSubMenuOpen?: (item?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => void;\r\n}\r\n\r\n\r\nconst MobileMenuHeader: React.FunctionComponent<MobileMenuHeaderProps> = ({\r\n                                                                            onGoBack,\r\n                                                                            onClose,\r\n                                                                            label,\r\n                                                                            profile,\r\n                                                                            buttons,\r\n                                                                            onSubMenuOpen\r\n                                                                          }) => {\r\n\r\n  const buildProfileSubMenu = () => !!profile ? {\r\n    type: 'group',\r\n    label: profile.label,\r\n    header: {\r\n      header: profile.user.firstName + ' ' + profile.user.lastName,\r\n      note: profile.user.email,\r\n      link: profile.user.link\r\n    },\r\n    action: {\r\n      label: profile.signOut?.label,\r\n      action: profile.signOut?.action,\r\n      icon: profile.signOut?.icon,\r\n      disabled: profile.signOut?.disabled\r\n    },\r\n    items: profile.sections.map(a => ({...a, type: 'section'}))\r\n  } as MenuNavigationItemTypeGroup : undefined\r\n\r\n  const renderItem = (item: MobileMenuButtonTypes, index: number) => {\r\n    switch (item.type) {\r\n      case 'profile': {\r\n        const {placement, type, action, ...rest} = item;\r\n        if(!!profile)\r\n          return  <ProfileButton key={index}\r\n                              onClick={e => {\r\n                                e?.nativeEvent.stopImmediatePropagation();\r\n                                item.action ? item.action(e?.target) && onClose() : onSubMenuOpen && onSubMenuOpen(buildProfileSubMenu())\r\n                              }}\r\n                              icon={!profile && <SystemIcons.User/>}\r\n                              initials={(profile?.user?.firstName?.charAt(0) ?? '') + (profile?.user?.lastName?.charAt(0) ?? '')}\r\n                              {...rest}/>\r\n        else return <></>\r\n          \r\n      }\r\n      case 'submenu': {\r\n        const {placement, type, icon, menu, ...rest} = item;\r\n\r\n        return <IconButton key={index}\r\n                           variant={'secondary'}\r\n                           shape={'circular'}\r\n                           action={e => {\r\n                             e?.nativeEvent.stopImmediatePropagation();\r\n                             onSubMenuOpen && onSubMenuOpen(item.menu)\r\n                           }}\r\n                           {...rest}>\r\n          {item.icon}\r\n        </IconButton>\r\n      }\r\n      case 'action': {\r\n        const {placement, type, icon, action, ...rest} = item;\r\n        return <IconButton key={index}\r\n                           disabled={item.disabled}\r\n                           variant={'secondary'}\r\n                           shape={'circular'}\r\n                           action={e => {\r\n                             e?.nativeEvent.stopImmediatePropagation();\r\n                             item.action && item.action(e?.target) && onClose();\r\n                           }}\r\n                           {...rest}>\r\n          {item.icon}\r\n        </IconButton>\r\n      }\r\n    }\r\n  }\r\n\r\n  return (\r\n    <MobileMenuHeaderWrapper>\r\n      {\r\n        onGoBack &&\r\n        <IconButton action={e => {\r\n          e?.nativeEvent.stopImmediatePropagation();\r\n          onGoBack();\r\n        }}\r\n                    variant={'secondary'}\r\n                    shape={'circular'}>\r\n          <SystemIcons.ArrowLineLeft/>\r\n        </IconButton>\r\n      }\r\n      {\r\n        buttons?.filter(a => a.placement === 'left').map(renderItem)\r\n      }\r\n      {\r\n        label &&\r\n        <MobileMenuHeaderLabel>{label}</MobileMenuHeaderLabel>\r\n      }\r\n      <MobileMenuHeaderActions>\r\n        {\r\n          buttons?.filter(a => a.placement !== 'left').map(renderItem)\r\n        }\r\n\r\n        {\r\n          onClose &&\r\n          <div style={{marginLeft: '8px'}}>\r\n            <IconButton variant={'secondary'}\r\n                        action={e => {\r\n                          e?.nativeEvent.stopImmediatePropagation();\r\n                          onClose();\r\n                        }}\r\n                        shape={'circular'}>\r\n              <SystemIcons.Close/>\r\n            </IconButton>\r\n          </div>\r\n        }\r\n      </MobileMenuHeaderActions>\r\n\r\n    </MobileMenuHeaderWrapper>\r\n  )\r\n};\r\n\r\n\r\nexport default MobileMenuHeader;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"MobileMenuHeader.cjs","names":["MobileMenuHeaderActions","styled","div","MobileMenuHeaderLabel","props","ComponentXSStyling","ComponentTextStyle","Bold","COLORS","getColor","theme","BREAKPOINTS","SMALL","ComponentSStyling","MobileMenuHeaderWrapper","Breakpoints","LARGE","MobileMenuHeader","onGoBack","onClose","label","profile","buttons","onSubMenuOpen","buildProfileSubMenu","type","header","user","firstName","lastName","note","email","link","action","signOut","icon","disabled","items","sections","map","a","undefined","renderItem","item","index","placement","rest","e","nativeEvent","stopImmediatePropagation","target","charAt","menu","filter","marginLeft"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenuHeader.tsx"],"sourcesContent":["import React from 'react';\r\nimport {\r\n  MobileMenuButtonTypes,\r\n  MenuNavigationItemTypeGroup,\r\n  ProfileMenu, MenuNavigationCustomSubMenu\r\n} from '../types';\r\nimport styled from 'styled-components';\r\nimport Breakpoints from '../../styles/breakpoints';\r\nimport {IconButton} from '../../Button';\r\nimport {SystemIcons} from '../../icons';\r\nimport {BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling} from '../../styles';\r\nimport {ProfileButton} from '../../ProfileButton';\r\n\r\nexport const MobileMenuHeaderActions = styled.div`\r\n  flex: 1;\r\n  justify-content: flex-end;\r\n  display: flex;\r\n  flex-direction: row;\r\n`;\r\nconst MobileMenuHeaderLabel = styled.div`\r\n  ${props => ComponentXSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  ${BREAKPOINTS.SMALL} {\r\n    ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n`;\r\n\r\nexport const MobileMenuHeaderWrapper = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n  align-items: center;\r\n  padding: 0 4px;\r\n\r\n  ${Breakpoints.SMALL} {\r\n    padding: 4px 8px;\r\n  }\r\n\r\n  ${Breakpoints.LARGE} {\r\n    display: none;\r\n  }\r\n`\r\n\r\ninterface MobileMenuHeaderProps {\r\n  onGoBack?: () => void;\r\n  onClose: () => void;\r\n  label?: string;\r\n\r\n  profile?: ProfileMenu\r\n  buttons?: MobileMenuButtonTypes[];\r\n\r\n  onSubMenuOpen?: (item?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => void;\r\n}\r\n\r\n\r\nconst MobileMenuHeader: React.FunctionComponent<MobileMenuHeaderProps> = ({\r\n                                                                            onGoBack,\r\n                                                                            onClose,\r\n                                                                            label,\r\n                                                                            profile,\r\n                                                                            buttons,\r\n                                                                            onSubMenuOpen\r\n                                                                          }) => {\r\n\r\n  const buildProfileSubMenu = () => !!profile ? {\r\n    type: 'group',\r\n    label: profile.label,\r\n    header: {\r\n      header: profile.user.firstName + ' ' + profile.user.lastName,\r\n      note: profile.user.email,\r\n      link: profile.user.link\r\n    },\r\n    action: {\r\n      label: profile.signOut?.label,\r\n      action: profile.signOut?.action,\r\n      icon: profile.signOut?.icon,\r\n      disabled: profile.signOut?.disabled\r\n    },\r\n    items: profile.sections.map(a => ({...a, type: 'section'}))\r\n  } as MenuNavigationItemTypeGroup : undefined\r\n\r\n  const renderItem = (item: MobileMenuButtonTypes, index: number) => {\r\n    switch (item.type) {\r\n      case 'profile': {\r\n        const {placement, type, action, ...rest} = item;\r\n        if(!!profile)\r\n          return  <ProfileButton key={index}\r\n                              onClick={e => {\r\n                                e?.nativeEvent.stopImmediatePropagation();\r\n                                item.action ? item.action(e?.target) && onClose() : onSubMenuOpen && onSubMenuOpen(buildProfileSubMenu())\r\n                              }}\r\n                              icon={!profile && <SystemIcons.User/>}\r\n                              initials={(profile?.user?.firstName?.charAt(0) ?? '') + (profile?.user?.lastName?.charAt(0) ?? '')}\r\n                              {...rest}/>\r\n        else return <></>\r\n          \r\n      }\r\n      case 'submenu': {\r\n        const {placement, type, icon, menu, ...rest} = item;\r\n\r\n        return <IconButton key={index}\r\n                           variant={'secondary'}\r\n                           shape={'circular'}\r\n                           action={e => {\r\n                             e?.nativeEvent.stopImmediatePropagation();\r\n                             onSubMenuOpen && onSubMenuOpen(item.menu)\r\n                           }}\r\n                           {...rest}>\r\n          {item.icon}\r\n        </IconButton>\r\n      }\r\n      case 'action': {\r\n        const {placement, type, icon, action, ...rest} = item;\r\n        return <IconButton key={index}\r\n                           disabled={item.disabled}\r\n                           variant={'secondary'}\r\n                           shape={'circular'}\r\n                           action={e => {\r\n                             e?.nativeEvent.stopImmediatePropagation();\r\n                             item.action && item.action(e?.target) && onClose();\r\n                           }}\r\n                           {...rest}>\r\n          {item.icon}\r\n        </IconButton>\r\n      }\r\n    }\r\n  }\r\n\r\n  return (\r\n    <MobileMenuHeaderWrapper>\r\n      {\r\n        onGoBack &&\r\n        <IconButton action={e => {\r\n          e?.nativeEvent.stopImmediatePropagation();\r\n          onGoBack();\r\n        }}\r\n                    variant={'secondary'}\r\n                    shape={'circular'}>\r\n          <SystemIcons.ArrowLineLeft/>\r\n        </IconButton>\r\n      }\r\n      {\r\n        buttons?.filter(a => a.placement === 'left').map(renderItem)\r\n      }\r\n      {\r\n        label &&\r\n        <MobileMenuHeaderLabel>{label}</MobileMenuHeaderLabel>\r\n      }\r\n      <MobileMenuHeaderActions>\r\n        {\r\n          buttons?.filter(a => a.placement !== 'left').map(renderItem)\r\n        }\r\n\r\n        {\r\n          onClose &&\r\n          <div style={{marginLeft: '8px'}}>\r\n            <IconButton variant={'secondary'}\r\n                        action={e => {\r\n                          e?.nativeEvent.stopImmediatePropagation();\r\n                          onClose();\r\n                        }}\r\n                        shape={'circular'}>\r\n              <SystemIcons.Close/>\r\n            </IconButton>\r\n          </div>\r\n        }\r\n      </MobileMenuHeaderActions>\r\n\r\n    </MobileMenuHeaderWrapper>\r\n  )\r\n};\r\n\r\n\r\nexport default MobileMenuHeader;\r\n"],"mappings":"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"}

package/dist/GlobalNavigationBar/mobile/MobileMenuHeader.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { MobileMenuButtonTypes, MenuNavigationItemTypeGroup, ProfileMenu, MenuNavigationCustomSubMenu } from '../types';
-export declare const MobileMenuHeaderActions: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const MobileMenuHeaderWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const MobileMenuHeaderActions: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const MobileMenuHeaderWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 interface MobileMenuHeaderProps {
     onGoBack?: () => void;
     onClose: () => void;