@laerdal/life-react-components 2.0.1-dev.10.full → 2.0.1-dev.11.full

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/dist/AuthPage/AuthPage.d.ts +1 -1
  2. package/dist/Banners/Banner.d.ts +1 -1
  3. package/dist/Banners/OverviewBanner.d.ts +1 -1
  4. package/dist/Breadcrumb/Breadcrumb.d.ts +1 -1
  5. package/dist/Card/HorizontalCard/HorizontalCardActions.d.ts +1 -1
  6. package/dist/Card/HorizontalCard/HorizontalCardBody.d.ts +1 -1
  7. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.d.ts +1 -1
  8. package/dist/Card/HorizontalCard/types.d.ts +4 -4
  9. package/dist/Chips/ChipTypes.d.ts +2 -2
  10. package/dist/Dropdown/BasicDropdown.d.ts +3 -3
  11. package/dist/Dropdown/DropdownButtonTypes.d.ts +3 -3
  12. package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs +1 -1
  13. package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs.map +1 -1
  14. package/dist/GlobalNavigationBar/GlobalNavigationBar.d.ts +1 -1
  15. package/dist/GlobalNavigationBar/GlobalNavigationBar.js +1 -1
  16. package/dist/GlobalNavigationBar/GlobalNavigationBar.js.map +1 -1
  17. package/dist/GlobalNavigationBar/Logo.d.ts +1 -1
  18. package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.d.ts +1 -1
  19. package/dist/GlobalNavigationBar/desktop/MainMenu.d.ts +1 -1
  20. package/dist/GlobalNavigationBar/desktop/RightSideNav.d.ts +1 -1
  21. package/dist/GlobalNavigationBar/desktop/UserMenu.cjs +4 -2
  22. package/dist/GlobalNavigationBar/desktop/UserMenu.cjs.map +1 -1
  23. package/dist/GlobalNavigationBar/desktop/UserMenu.js +4 -2
  24. package/dist/GlobalNavigationBar/desktop/UserMenu.js.map +1 -1
  25. package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs +3 -0
  26. package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs.map +1 -1
  27. package/dist/GlobalNavigationBar/mobile/MobileMenu.d.ts +1 -1
  28. package/dist/GlobalNavigationBar/mobile/MobileMenu.js +3 -0
  29. package/dist/GlobalNavigationBar/mobile/MobileMenu.js.map +1 -1
  30. package/dist/GlobalNavigationBar/types.d.ts +7 -7
  31. package/dist/Image/ImageWithFallbacks.d.ts +1 -1
  32. package/dist/InputFields/Label.d.ts +1 -1
  33. package/dist/InputFields/QuickSearch.d.ts +1 -1
  34. package/dist/InputFields/ResponsiveComponentWrapper.d.ts +1 -1
  35. package/dist/InputFields/SearchBar.d.ts +1 -1
  36. package/dist/InputFields/components/SearchBarInput.d.ts +1 -1
  37. package/dist/InputFields/types.d.ts +3 -3
  38. package/dist/List/ListRow.d.ts +1 -1
  39. package/dist/LoadingIndicator/LoadingIndicator.d.ts +1 -1
  40. package/dist/MiniProductCard/MiniProductCard.d.ts +1 -1
  41. package/dist/Modals/Modal.d.ts +1 -1
  42. package/dist/Modals/ModalContainer.d.ts +2 -2
  43. package/dist/Modals/ModalTypes.d.ts +1 -1
  44. package/dist/NavItem/NavItem.d.ts +1 -1
  45. package/dist/Paginator/Paginator.d.ts +1 -1
  46. package/dist/Popover/Popover.d.ts +4 -4
  47. package/dist/ProfileButton/ProfileButton.d.ts +1 -1
  48. package/dist/QuizButton/QuizButton.d.ts +1 -1
  49. package/dist/SideMenu/types.d.ts +3 -3
  50. package/dist/SkipToContent/SkipToContent.d.ts +1 -1
  51. package/dist/Table/TableTypes.d.ts +4 -4
  52. package/dist/Tabs/TabLink.d.ts +1 -1
  53. package/dist/Tabs/Tabs.d.ts +1 -1
  54. package/dist/Tag/Tag.d.ts +2 -2
  55. package/dist/Tile/TileTypes.d.ts +8 -8
  56. package/dist/Toasters/Toast.d.ts +2 -2
  57. package/dist/Toasters/ToastContext.d.ts +2 -2
  58. package/dist/assets/index.d.ts +1 -1
  59. package/dist/icons/index.d.ts +2 -2
  60. package/dist/styles/typography.d.ts +2 -2
  61. package/package.json +10 -13
@@ -1,4 +1,4 @@
1
- declare type AuthPageProps = {
1
+ type AuthPageProps = {
2
2
  /** set this to 'false' to hide the left side illustration/information section */
3
3
  showInformationSection: boolean;
4
4
  /** true if 'sign-up' screen-set is showing, otherwise false.
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { Size } from '../types';
3
- declare type BannerProps = React.HTMLAttributes<HTMLDivElement> & {
3
+ type BannerProps = React.HTMLAttributes<HTMLDivElement> & {
4
4
  size?: Size.Small | Size.Medium | Size.Large;
5
5
  type?: 'warning' | 'critical' | 'positive' | 'neutral';
6
6
  link?: string;
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- declare type Props = {
2
+ type Props = {
3
3
  children: any;
4
4
  testId?: string;
5
5
  } & React.HTMLAttributes<HTMLDivElement>;
@@ -1,7 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import { Size } from '..';
3
3
  import { BreadcrumbItem } from './BreadcrumbItem';
4
- declare type BreadcrumbProps = React.HTMLAttributes<HTMLDivElement> & {
4
+ type BreadcrumbProps = React.HTMLAttributes<HTMLDivElement> & {
5
5
  homeIcon?: boolean;
6
6
  homeLabel?: string;
7
7
  homeUrl?: string;
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
2
  import { HorizontalCardProps } from './types';
3
- declare type Props = Pick<HorizontalCardProps, 'actions' | 'disabled'>;
3
+ type Props = Pick<HorizontalCardProps, 'actions' | 'disabled'>;
4
4
  export declare const HorizontalCardActions: React.ForwardRefExoticComponent<Props & React.RefAttributes<React.RefObject<HTMLButtonElement>[]>>;
5
5
  export {};
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
2
  import { HorizontalCardProps } from './types';
3
- declare type Props = Pick<HorizontalCardProps, 'title' | 'description' | 'progress' | 'tags'>;
3
+ type Props = Pick<HorizontalCardProps, 'title' | 'description' | 'progress' | 'tags'>;
4
4
  export declare const HorizontalCardBody: React.FunctionComponent<Props>;
5
5
  export {};
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
2
  import { HorizontalCardProps } from './types';
3
- declare type Props = Pick<HorizontalCardProps, 'image' | 'icon'>;
3
+ type Props = Pick<HorizontalCardProps, 'image' | 'icon'>;
4
4
  export declare const HorizontalCardThumbnail: React.FunctionComponent<Props>;
5
5
  export {};
@@ -4,14 +4,14 @@ import { ToggleButtonProps } from '../../Toggles/ToggleButton';
4
4
  import { DropdownButtonProps } from '../../Dropdown/DropdownButtonTypes';
5
5
  import { TagVariants } from '../../Tag';
6
6
  import { LinearProgressProps } from '../../LinearProgress/LinearProgress';
7
- export declare type HorizontalCardIconButton = Pick<IconButtonProps, 'action' | 'disabled'> & {
7
+ export type HorizontalCardIconButton = Pick<IconButtonProps, 'action' | 'disabled'> & {
8
8
  componentType: 'icon';
9
9
  icon: React.ReactNode;
10
10
  };
11
- export declare type HorizontalCardToggleButton = Pick<ToggleButtonProps, 'active' | 'onChange' | 'disabled' | 'defaultState' | 'activeState'> & {
11
+ export type HorizontalCardToggleButton = Pick<ToggleButtonProps, 'active' | 'onChange' | 'disabled' | 'defaultState' | 'activeState'> & {
12
12
  componentType: 'toggle';
13
13
  };
14
- export declare type HorizontalCardDropdownButton = Pick<DropdownButtonProps, 'items' | 'onClick' | 'disabled' | 'itemsType' | 'action' | 'actionIcon' | 'actionLabel' | 'actionLoading' | 'actionVariant' | 'multiSelect' | 'scrollable' | 'pinTopItem' | 'maxHeight'> & {
14
+ export type HorizontalCardDropdownButton = Pick<DropdownButtonProps, 'items' | 'onClick' | 'disabled' | 'itemsType' | 'action' | 'actionIcon' | 'actionLabel' | 'actionLoading' | 'actionVariant' | 'multiSelect' | 'scrollable' | 'pinTopItem' | 'maxHeight'> & {
15
15
  componentType: 'dropdown';
16
16
  icon: React.ReactNode;
17
17
  };
@@ -20,7 +20,7 @@ export interface HorizontalCardTag {
20
20
  icon?: React.ReactNode;
21
21
  variant?: TagVariants;
22
22
  }
23
- export declare type HorizontalCardLinearProgression = Pick<LinearProgressProps, 'max' | 'value'>;
23
+ export type HorizontalCardLinearProgression = Pick<LinearProgressProps, 'max' | 'value'>;
24
24
  export interface HorizontalCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'tabIndex' | 'onClick' | 'onKeyDown' | 'onMouseDown'> {
25
25
  variant?: 'outline' | 'elevated';
26
26
  action?: () => void;
@@ -36,5 +36,5 @@ export interface ChipValue extends Omit<React.HTMLAttributes<HTMLDivElement>, 't
36
36
  label: string;
37
37
  size?: Size;
38
38
  }
39
- export declare type ChipIcons = 'Add' | 'ArrowDropDown' | 'ArrowDropUp' | 'ArrowLineDown' | 'ArrowLineLeft' | 'ArrowLineRight' | 'ArrowLineUp' | 'ArrowStopLeft' | 'ArrowStopRight' | 'Attachment' | 'Attention' | 'BackwardsFiveSec' | 'Book' | 'BookmarkOff' | 'BookmarkOn' | 'Bullet' | 'Calendar' | 'CheckboxOff' | 'CheckboxOn' | 'CheckboxSemi' | 'CheckMark' | 'ChevronDown' | 'ChevronLeft' | 'ChevronRight' | 'ChevronUp' | 'Clear' | 'Close' | 'ClosedCaptionOn' | 'CloudAttention' | 'CloudCheck' | 'CloudDownload' | 'CloudLocked' | 'CloudNoConnection' | 'CloudSyncing' | 'CloudUpload' | 'Cloud' | 'Dashboard' | 'Delete' | 'Download' | 'DragHandle' | 'DragIndicator' | 'Edit' | 'Educator' | 'Equals' | 'EventLog' | 'ExtendTextArea' | 'Filter' | 'Forward' | 'ForwardSlash' | 'ForwardFiveSec' | 'FullscreenExit' | 'Fullscreen' | 'GearSettings' | 'GridView' | 'Group' | 'GuidedTour' | 'Help' | 'Hierarchy' | 'History' | 'Home' | 'Information' | 'Institute' | 'Language' | 'ListView' | 'LoadingMedium' | 'LoadingSmall' | 'LockedOff' | 'LockedOn' | 'Login' | 'Logout' | 'Loop' | 'Mail' | 'Manikin' | 'MapPoint' | 'Menu' | 'Minus' | 'MoreHorizontal' | 'MoreVertical' | 'NotificationNew' | 'Notification' | 'OpenFolder' | 'OpenNewWindow' | 'Pause' | 'PlayOutline' | 'Play' | 'Plus' | 'PointDown' | 'PointLeft' | 'PointRight' | 'PointUp' | 'RadioButtonOff' | 'RadioButtonOn' | 'Record' | 'Refresh' | 'Replay' | 'Rewind' | 'Save' | 'Search' | 'Share' | 'ShoppingCart' | 'StarFilled' | 'StarOutlined' | 'Stop' | 'Support' | 'Team' | 'ThumbsDown' | 'ThumbsUp' | 'TimeLimited' | 'Time' | 'Tip' | 'Upload' | 'Usb' | 'User' | 'Video' | 'VisibleOff' | 'VisibleOn' | 'VolumeDown' | 'VolumeOff' | 'VolumeUp';
40
- export declare type ChipVariant = States.Default | States.Invalid;
39
+ export type ChipIcons = 'Add' | 'ArrowDropDown' | 'ArrowDropUp' | 'ArrowLineDown' | 'ArrowLineLeft' | 'ArrowLineRight' | 'ArrowLineUp' | 'ArrowStopLeft' | 'ArrowStopRight' | 'Attachment' | 'Attention' | 'BackwardsFiveSec' | 'Book' | 'BookmarkOff' | 'BookmarkOn' | 'Bullet' | 'Calendar' | 'CheckboxOff' | 'CheckboxOn' | 'CheckboxSemi' | 'CheckMark' | 'ChevronDown' | 'ChevronLeft' | 'ChevronRight' | 'ChevronUp' | 'Clear' | 'Close' | 'ClosedCaptionOn' | 'CloudAttention' | 'CloudCheck' | 'CloudDownload' | 'CloudLocked' | 'CloudNoConnection' | 'CloudSyncing' | 'CloudUpload' | 'Cloud' | 'Dashboard' | 'Delete' | 'Download' | 'DragHandle' | 'DragIndicator' | 'Edit' | 'Educator' | 'Equals' | 'EventLog' | 'ExtendTextArea' | 'Filter' | 'Forward' | 'ForwardSlash' | 'ForwardFiveSec' | 'FullscreenExit' | 'Fullscreen' | 'GearSettings' | 'GridView' | 'Group' | 'GuidedTour' | 'Help' | 'Hierarchy' | 'History' | 'Home' | 'Information' | 'Institute' | 'Language' | 'ListView' | 'LoadingMedium' | 'LoadingSmall' | 'LockedOff' | 'LockedOn' | 'Login' | 'Logout' | 'Loop' | 'Mail' | 'Manikin' | 'MapPoint' | 'Menu' | 'Minus' | 'MoreHorizontal' | 'MoreVertical' | 'NotificationNew' | 'Notification' | 'OpenFolder' | 'OpenNewWindow' | 'Pause' | 'PlayOutline' | 'Play' | 'Plus' | 'PointDown' | 'PointLeft' | 'PointRight' | 'PointUp' | 'RadioButtonOff' | 'RadioButtonOn' | 'Record' | 'Refresh' | 'Replay' | 'Rewind' | 'Save' | 'Search' | 'Share' | 'ShoppingCart' | 'StarFilled' | 'StarOutlined' | 'Stop' | 'Support' | 'Team' | 'ThumbsDown' | 'ThumbsUp' | 'TimeLimited' | 'Time' | 'Tip' | 'Upload' | 'Usb' | 'User' | 'Video' | 'VisibleOff' | 'VisibleOn' | 'VolumeDown' | 'VolumeOff' | 'VolumeUp';
40
+ export type ChipVariant = States.Default | States.Invalid;
@@ -25,16 +25,16 @@ interface BasicDropdownCommonProps extends Omit<React.HTMLAttributes<HTMLDivElem
25
25
  margin?: string;
26
26
  minWidth?: string;
27
27
  }
28
- declare type DropdownFilterMultiSelectProps = BasicDropdownCommonProps & {
28
+ type DropdownFilterMultiSelectProps = BasicDropdownCommonProps & {
29
29
  multiSelect: true;
30
30
  value?: string[];
31
31
  onSelect: (value: string[]) => void;
32
32
  };
33
- declare type DropdownFilterSingleSelectProps = BasicDropdownCommonProps & {
33
+ type DropdownFilterSingleSelectProps = BasicDropdownCommonProps & {
34
34
  multiSelect?: false;
35
35
  value?: string;
36
36
  onSelect: (value: string) => void;
37
37
  };
38
- declare type DropdownFilterProps = DropdownFilterSingleSelectProps | DropdownFilterMultiSelectProps;
38
+ type DropdownFilterProps = DropdownFilterSingleSelectProps | DropdownFilterMultiSelectProps;
39
39
  declare const BasicDropdown: React.ForwardRefExoticComponent<DropdownFilterProps & React.RefAttributes<unknown>>;
40
40
  export default BasicDropdown;
@@ -22,13 +22,13 @@ export interface DropdownButtonBaseProps {
22
22
  width?: string;
23
23
  alignLeft?: boolean;
24
24
  }
25
- export declare type IconDropdownButtonProps = DropdownButtonBaseProps & {
25
+ export type IconDropdownButtonProps = DropdownButtonBaseProps & {
26
26
  type: 'icon';
27
27
  icon: React.ReactNode;
28
28
  };
29
- export declare type TextDropdownButtonProps = DropdownButtonBaseProps & {
29
+ export type TextDropdownButtonProps = DropdownButtonBaseProps & {
30
30
  type: 'text';
31
31
  label?: string;
32
32
  keepLabel?: boolean;
33
33
  };
34
- export declare type DropdownButtonProps = IconDropdownButtonProps | TextDropdownButtonProps;
34
+ export type DropdownButtonProps = IconDropdownButtonProps | TextDropdownButtonProps;
@@ -36,7 +36,7 @@ var HeaderWrapper = _styledComponents.default.header(_templateObject || (_templa
36
36
  var RowLayout = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: center;\n"])));
37
37
  var HamburgerButton = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n ", " button {\n height: 56px;\n }\n\n ", " {\n display: none;\n }\n"])), _styles.BREAKPOINTS.SMALL, _styles.BREAKPOINTS.LARGE);
38
38
  var RightSide = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: center;\n\n ", " {\n margin: 0 0 0 auto;\n }\n\n &.reverse {\n ", " {\n order: -1;\n }\n\n flex-direction: row-reverse;\n }\n"])), _styles.BREAKPOINTS.XSMALL, HamburgerButton);
39
- var MobileMenuBackdrop = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n background: rgba(0, 0, 0, 0.5);\n display: flex;\n position: fixed;\n left: 0;\n top: 0;\n bottom: 0;\n right: 0;\n height: 100vh;\n width: 100vw;\n overflow: hidden;\n z-index: ", ";\n visibility: hidden;\n\n\n &.open {\n visibility: visible;\n animation: ", " 0.3s ease-in-out;\n }\n\n &.closed {\n visibility: hidden;\n animation: ", " 0.3s ease-in-out;\n }\n\n ", " {\n visibility: hidden !important;\n }\n"])), _styles.Z_INDEXES.backdrop, _CommonStyles.fadeIn, _CommonStyles.fadeOut, _styles.BREAKPOINTS.LARGE);
39
+ var MobileMenuBackdrop = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n background: rgba(0, 0, 0, 0.5);\n display: flex;\n position: fixed;\n left: 0;\n top: 0;\n height: 100%;\n width: 100%;\n overflow: hidden;\n z-index: ", ";\n visibility: hidden;\n\n &.open {\n visibility: visible;\n animation: ", " 0.3s ease-in-out;\n }\n\n &.closed {\n visibility: hidden;\n animation: ", " 0.3s ease-in-out;\n }\n\n ", " {\n visibility: hidden !important;\n }\n"])), _styles.Z_INDEXES.backdrop, _CommonStyles.fadeIn, _CommonStyles.fadeOut, _styles.BREAKPOINTS.LARGE);
40
40
  var UserMenuWrapper = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n background-color: ", ";\n display: flex;\n position: absolute;\n\n ", " {\n top: 56px;\n right: ", ";\n }\n"])), _styles.COLORS.white, _styles.BREAKPOINTS.LARGE, function (props) {
41
41
  return props.offsetRight && (0, _utils.hasWindow)() ? "".concat(window.innerWidth - props.offsetRight + 296, "px") : '10%';
42
42
  });
@@ -1 +1 @@
1
- {"version":3,"file":"GlobalNavigationBar.cjs","names":["HeaderWrapper","styled","header","COLORS","neutral_200","Z_INDEXES","sticky_menu","BREAKPOINTS","SMALL","LARGE","RowLayout","div","HamburgerButton","RightSide","XSMALL","MobileMenuBackdrop","backdrop","fadeIn","fadeOut","UserMenuWrapper","white","props","offsetRight","hasWindow","window","innerWidth","GlobalNavigationBar","name","isAuthenticated","logo","profile","mobile","desktop","testId","useMaxWidth","maxWidth","React","useState","showMobileMenu","setShowMobileMenu","wasMobileMenuOpen","usePreviousImmediate","showUserMenu","setShowUserMenu","actionsRef","useRef","profileButtonRef","current","buttons","find","a","type","ref","mobileMenuButtonRef","rightSideRef","avatarRight","setAvatarRight","userMenuRef","useClickOutsideRef","mobileMenuRef","useEffect","handleResize","profileRightOffset","getBoundingClientRect","right","addEventListener","removeEventListener","showBetaTag","onClick","to","items","filter","pinned","reverseRightSideOrder","action","user","some"],"sources":["../../src/GlobalNavigationBar/GlobalNavigationBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport Logo from './Logo';\nimport MainMenu from './desktop/MainMenu';\nimport {PageWidth} from '../Layouts';\nimport {COLORS, BREAKPOINTS} from '../styles';\nimport RightSideNav from './desktop/RightSideNav';\nimport MobileMenu from './mobile/MobileMenu';\nimport {Menu} from '../icons/systemicons/SystemIcons';\nimport UserMenu from './desktop/UserMenu';\nimport {fadeIn, fadeOut, Menu as MobileMenuWrapper} from './mobile/CommonStyles';\nimport {Z_INDEXES} from '../styles';\nimport {\n DesktopNavigationMenuProps, MenuProfileButton,\n MobileNavigationMenuProps,\n ProfileMenu\n} from './types';\nimport {IconButton} from '../Button';\nimport DesktopActions, {DesktopActionsRef} from './desktop/DesktopActions';\nimport {usePreviousImmediate} from 'rooks';\nimport {useClickOutsideRef} from '../common';\nimport { hasWindow } from '../utils/utils';\n\nconst HeaderWrapper = styled.header`\n background: white;\n box-sizing: border-box;\n border-bottom: 1px solid ${COLORS.neutral_200};\n\n z-index: ${Z_INDEXES.sticky_menu};\n position: relative;\n\n height: 48px;\n\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n }\n\n ${BREAKPOINTS.LARGE} {\n height: 64px;\n }\n\n @media all and (-ms-high-contrast: none) {\n height: auto;\n }\n\n @media print {\n border-bottom: none;\n }\n`;\n\nconst RowLayout = styled.div`\n display: flex;\n align-items: center;\n`;\n\n\nconst HamburgerButton = styled.div`\n ${BREAKPOINTS.SMALL} button {\n height: 56px;\n }\n\n ${BREAKPOINTS.LARGE} {\n display: none;\n }\n`;\n\nconst RightSide = styled.div`\n display: flex;\n align-items: center;\n\n ${BREAKPOINTS.XSMALL} {\n margin: 0 0 0 auto;\n }\n\n &.reverse {\n ${HamburgerButton} {\n order: -1;\n }\n\n flex-direction: row-reverse;\n }\n`;\n\nconst MobileMenuBackdrop = styled.div`\n background: rgba(0, 0, 0, 0.5);\n display: flex;\n position: fixed;\n left: 0;\n top: 0;\n bottom: 0;\n right: 0;\n height: 100vh;\n width: 100vw;\n overflow: hidden;\n z-index: ${Z_INDEXES.backdrop};\n visibility: hidden;\n\n\n &.open {\n visibility: visible;\n animation: ${fadeIn} 0.3s ease-in-out;\n }\n\n &.closed {\n visibility: hidden;\n animation: ${fadeOut} 0.3s ease-in-out;\n }\n\n ${BREAKPOINTS.LARGE} {\n visibility: hidden !important;\n }\n`;\n\nconst UserMenuWrapper = styled.div<{ offsetRight?: number }>`\n background-color: ${COLORS.white};\n display: flex;\n position: absolute;\n\n ${BREAKPOINTS.LARGE} {\n top: 56px;\n right: ${(props) => (props.offsetRight && hasWindow() ? `${window.innerWidth - props.offsetRight + 296}px` : '10%')};\n }\n`;\n\n\ntype GlobalNavigationBarProps = {\n isAuthenticated?: boolean;\n useMaxWidth?: boolean;\n maxWidth?: number;\n\n name?: string;\n logo?: { onClick?: () => void; to?: string; showBetaTag?: boolean; };\n\n profile?: ProfileMenu;\n\n mobile?: MobileNavigationMenuProps;\n desktop?: DesktopNavigationMenuProps;\n\n testId?: string;\n};\n\n/**\n * @param props\n * @constructor\n * @description This component is a global navigation header bar\n */\nconst GlobalNavigationBar = ({\n name,\n isAuthenticated,\n logo,\n profile,\n mobile,\n desktop,\n testId,\n useMaxWidth = true,\n maxWidth,\n }: GlobalNavigationBarProps): React.ReactElement<GlobalNavigationBarProps> => {\n const [showMobileMenu, setShowMobileMenu] = React.useState(false);\n const wasMobileMenuOpen = usePreviousImmediate(showMobileMenu);\n\n const [showUserMenu, setShowUserMenu] = React.useState(false);\n\n const actionsRef = React.useRef<DesktopActionsRef>(null);\n const profileButtonRef = React.useRef<HTMLButtonElement | null>() as React.MutableRefObject<HTMLButtonElement | null | undefined>;\n profileButtonRef.current = actionsRef?.current?.buttons?.find(a => a.type === 'profile')?.ref?.current;\n\n const mobileMenuButtonRef = React.useRef<HTMLButtonElement>(null);\n\n const rightSideRef = React.useRef(null);\n const [avatarRight, setAvatarRight] = React.useState<number>(0);\n\n\n const userMenuRef = useClickOutsideRef(() => setShowUserMenu(false), [profileButtonRef]);\n const mobileMenuRef = useClickOutsideRef(() => setShowMobileMenu(false), [mobileMenuButtonRef]);\n\n React.useEffect(() => {\n if (!profileButtonRef.current) return;\n\n const handleResize = () => {\n const profileRightOffset = profileButtonRef.current?.getBoundingClientRect()?.right;\n setAvatarRight(profileRightOffset || 0);\n };\n\n handleResize();\n window.addEventListener('resize', handleResize);\n return () => window.removeEventListener('resize', handleResize);\n }, [profileButtonRef.current]);\n\n\n return (\n <>\n <HeaderWrapper data-testid={testId}>\n <PageWidth useMaxWidth={useMaxWidth} maxWidth={maxWidth}>\n <RowLayout>\n <Logo name={name || ''} showBetaTag={logo?.showBetaTag} onClick={logo?.onClick} to={logo?.to}/>\n {\n isAuthenticated &&\n <MainMenu items={desktop?.items.filter(a => !a.pinned) || []} rightSideRef={rightSideRef}/>\n }\n <RightSide className={`${desktop?.reverseRightSideOrder ? 'reverse' : ''}`}\n ref={rightSideRef}>\n <RightSideNav items={desktop?.items?.filter(a => a.pinned)} action={desktop?.action}/>\n <DesktopActions ref={actionsRef}\n buttons={desktop?.buttons}\n onShowUserMenu={() => setShowUserMenu(!showUserMenu)}\n user={profile?.user}/>\n <HamburgerButton hidden={!isAuthenticated}>\n <IconButton action={() => setShowMobileMenu(!showMobileMenu)}\n ref={mobileMenuButtonRef}\n shape={'circular'}\n variant={'secondary'}>\n <Menu size=\"24px\"/>\n </IconButton>\n </HamburgerButton>\n </RightSide>\n </RowLayout>\n </PageWidth>\n </HeaderWrapper>\n <MobileMenuBackdrop className={showMobileMenu ? 'open' : !showUserMenu && wasMobileMenuOpen ? 'closed' : ''}>\n <MobileMenuWrapper ref={mobileMenuRef}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <MobileMenu {...mobile}\n show={showMobileMenu}\n onClose={() => setShowMobileMenu(false)}\n profile={profile}/>\n </MobileMenuWrapper>\n </MobileMenuBackdrop>\n {\n desktop?.buttons?.some(a => a.type === 'profile') && !!profile &&\n <UserMenuWrapper ref={userMenuRef}\n offsetRight={avatarRight}\n data-testid=\"testUserMenuWrapper\">\n <UserMenu {...profile}\n show={showUserMenu}\n onHideUserMenu={() => setShowUserMenu(false)}/>\n </UserMenuWrapper>\n }\n </>\n );\n};\n\nexport default GlobalNavigationBar;\n"],"mappings":"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"}
1
+ {"version":3,"file":"GlobalNavigationBar.cjs","names":["HeaderWrapper","styled","header","COLORS","neutral_200","Z_INDEXES","sticky_menu","BREAKPOINTS","SMALL","LARGE","RowLayout","div","HamburgerButton","RightSide","XSMALL","MobileMenuBackdrop","backdrop","fadeIn","fadeOut","UserMenuWrapper","white","props","offsetRight","hasWindow","window","innerWidth","GlobalNavigationBar","name","isAuthenticated","logo","profile","mobile","desktop","testId","useMaxWidth","maxWidth","React","useState","showMobileMenu","setShowMobileMenu","wasMobileMenuOpen","usePreviousImmediate","showUserMenu","setShowUserMenu","actionsRef","useRef","profileButtonRef","current","buttons","find","a","type","ref","mobileMenuButtonRef","rightSideRef","avatarRight","setAvatarRight","userMenuRef","useClickOutsideRef","mobileMenuRef","useEffect","handleResize","profileRightOffset","getBoundingClientRect","right","addEventListener","removeEventListener","showBetaTag","onClick","to","items","filter","pinned","reverseRightSideOrder","action","user","some"],"sources":["../../src/GlobalNavigationBar/GlobalNavigationBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport Logo from './Logo';\nimport MainMenu from './desktop/MainMenu';\nimport {PageWidth} from '../Layouts';\nimport {COLORS, BREAKPOINTS} from '../styles';\nimport RightSideNav from './desktop/RightSideNav';\nimport MobileMenu from './mobile/MobileMenu';\nimport {Menu} from '../icons/systemicons/SystemIcons';\nimport UserMenu from './desktop/UserMenu';\nimport {fadeIn, fadeOut, Menu as MobileMenuWrapper} from './mobile/CommonStyles';\nimport {Z_INDEXES} from '../styles';\nimport {\n DesktopNavigationMenuProps, MenuProfileButton,\n MobileNavigationMenuProps,\n ProfileMenu\n} from './types';\nimport {IconButton} from '../Button';\nimport DesktopActions, {DesktopActionsRef} from './desktop/DesktopActions';\nimport {usePreviousImmediate} from 'rooks';\nimport {useClickOutsideRef} from '../common';\nimport { hasWindow } from '../utils/utils';\n\nconst HeaderWrapper = styled.header`\n background: white;\n box-sizing: border-box;\n border-bottom: 1px solid ${COLORS.neutral_200};\n\n z-index: ${Z_INDEXES.sticky_menu};\n position: relative;\n\n height: 48px;\n\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n }\n\n ${BREAKPOINTS.LARGE} {\n height: 64px;\n }\n\n @media all and (-ms-high-contrast: none) {\n height: auto;\n }\n\n @media print {\n border-bottom: none;\n }\n`;\n\nconst RowLayout = styled.div`\n display: flex;\n align-items: center;\n`;\n\n\nconst HamburgerButton = styled.div`\n ${BREAKPOINTS.SMALL} button {\n height: 56px;\n }\n\n ${BREAKPOINTS.LARGE} {\n display: none;\n }\n`;\n\nconst RightSide = styled.div`\n display: flex;\n align-items: center;\n\n ${BREAKPOINTS.XSMALL} {\n margin: 0 0 0 auto;\n }\n\n &.reverse {\n ${HamburgerButton} {\n order: -1;\n }\n\n flex-direction: row-reverse;\n }\n`;\n\nconst MobileMenuBackdrop = styled.div`\n background: rgba(0, 0, 0, 0.5);\n display: flex;\n position: fixed;\n left: 0;\n top: 0;\n height: 100%;\n width: 100%;\n overflow: hidden;\n z-index: ${Z_INDEXES.backdrop};\n visibility: hidden;\n\n &.open {\n visibility: visible;\n animation: ${fadeIn} 0.3s ease-in-out;\n }\n\n &.closed {\n visibility: hidden;\n animation: ${fadeOut} 0.3s ease-in-out;\n }\n\n ${BREAKPOINTS.LARGE} {\n visibility: hidden !important;\n }\n`;\n\nconst UserMenuWrapper = styled.div<{ offsetRight?: number }>`\n background-color: ${COLORS.white};\n display: flex;\n position: absolute;\n\n ${BREAKPOINTS.LARGE} {\n top: 56px;\n right: ${(props) => (props.offsetRight && hasWindow() ? `${window.innerWidth - props.offsetRight + 296}px` : '10%')};\n }\n`;\n\n\ntype GlobalNavigationBarProps = {\n isAuthenticated?: boolean;\n useMaxWidth?: boolean;\n maxWidth?: number;\n\n name?: string;\n logo?: { onClick?: () => void; to?: string; showBetaTag?: boolean; };\n\n profile?: ProfileMenu;\n\n mobile?: MobileNavigationMenuProps;\n desktop?: DesktopNavigationMenuProps;\n\n testId?: string;\n};\n\n/**\n * @param props\n * @constructor\n * @description This component is a global navigation header bar\n */\nconst GlobalNavigationBar = ({\n name,\n isAuthenticated,\n logo,\n profile,\n mobile,\n desktop,\n testId,\n useMaxWidth = true,\n maxWidth,\n }: GlobalNavigationBarProps): React.ReactElement<GlobalNavigationBarProps> => {\n const [showMobileMenu, setShowMobileMenu] = React.useState(false);\n const wasMobileMenuOpen = usePreviousImmediate(showMobileMenu);\n\n const [showUserMenu, setShowUserMenu] = React.useState(false);\n\n const actionsRef = React.useRef<DesktopActionsRef>(null);\n const profileButtonRef = React.useRef<HTMLButtonElement | null>() as React.MutableRefObject<HTMLButtonElement | null | undefined>;\n profileButtonRef.current = actionsRef?.current?.buttons?.find(a => a.type === 'profile')?.ref?.current;\n\n const mobileMenuButtonRef = React.useRef<HTMLButtonElement>(null);\n\n const rightSideRef = React.useRef(null);\n const [avatarRight, setAvatarRight] = React.useState<number>(0);\n\n\n const userMenuRef = useClickOutsideRef(() => setShowUserMenu(false), [profileButtonRef]);\n const mobileMenuRef = useClickOutsideRef(() => setShowMobileMenu(false), [mobileMenuButtonRef]);\n\n React.useEffect(() => {\n if (!profileButtonRef.current) return;\n\n const handleResize = () => {\n const profileRightOffset = profileButtonRef.current?.getBoundingClientRect()?.right;\n setAvatarRight(profileRightOffset || 0);\n };\n\n handleResize();\n window.addEventListener('resize', handleResize);\n return () => window.removeEventListener('resize', handleResize);\n }, [profileButtonRef.current]);\n\n\n return (\n <>\n <HeaderWrapper data-testid={testId}>\n <PageWidth useMaxWidth={useMaxWidth} maxWidth={maxWidth}>\n <RowLayout>\n <Logo name={name || ''} showBetaTag={logo?.showBetaTag} onClick={logo?.onClick} to={logo?.to}/>\n {\n isAuthenticated &&\n <MainMenu items={desktop?.items.filter(a => !a.pinned) || []} rightSideRef={rightSideRef}/>\n }\n <RightSide className={`${desktop?.reverseRightSideOrder ? 'reverse' : ''}`}\n ref={rightSideRef}>\n <RightSideNav items={desktop?.items?.filter(a => a.pinned)} action={desktop?.action}/>\n <DesktopActions ref={actionsRef}\n buttons={desktop?.buttons}\n onShowUserMenu={() => setShowUserMenu(!showUserMenu)}\n user={profile?.user}/>\n <HamburgerButton hidden={!isAuthenticated}>\n <IconButton action={() => setShowMobileMenu(!showMobileMenu)}\n ref={mobileMenuButtonRef}\n shape={'circular'}\n variant={'secondary'}>\n <Menu size=\"24px\"/>\n </IconButton>\n </HamburgerButton>\n </RightSide>\n </RowLayout>\n </PageWidth>\n </HeaderWrapper>\n <MobileMenuBackdrop className={showMobileMenu ? 'open' : !showUserMenu && wasMobileMenuOpen ? 'closed' : ''}>\n <MobileMenuWrapper ref={mobileMenuRef}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <MobileMenu {...mobile}\n show={showMobileMenu}\n onClose={() => setShowMobileMenu(false)}\n profile={profile}/>\n </MobileMenuWrapper>\n </MobileMenuBackdrop>\n {\n desktop?.buttons?.some(a => a.type === 'profile') && !!profile &&\n <UserMenuWrapper ref={userMenuRef}\n offsetRight={avatarRight}\n data-testid=\"testUserMenuWrapper\">\n <UserMenu {...profile}\n show={showUserMenu}\n onHideUserMenu={() => setShowUserMenu(false)}/>\n </UserMenuWrapper>\n }\n </>\n );\n};\n\nexport default GlobalNavigationBar;\n"],"mappings":"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"}
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { DesktopNavigationMenuProps, MobileNavigationMenuProps, ProfileMenu } from './types';
3
- declare type GlobalNavigationBarProps = {
3
+ type GlobalNavigationBarProps = {
4
4
  isAuthenticated?: boolean;
5
5
  useMaxWidth?: boolean;
6
6
  maxWidth?: number;
@@ -29,7 +29,7 @@ var HeaderWrapper = styled.header(_templateObject || (_templateObject = _taggedT
29
29
  var RowLayout = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n"])));
30
30
  var HamburgerButton = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n ", " button {\n height: 56px;\n }\n\n ", " {\n display: none;\n }\n"])), BREAKPOINTS.SMALL, BREAKPOINTS.LARGE);
31
31
  var RightSide = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n\n ", " {\n margin: 0 0 0 auto;\n }\n\n &.reverse {\n ", " {\n order: -1;\n }\n\n flex-direction: row-reverse;\n }\n"])), BREAKPOINTS.XSMALL, HamburgerButton);
32
- var MobileMenuBackdrop = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n background: rgba(0, 0, 0, 0.5);\n display: flex;\n position: fixed;\n left: 0;\n top: 0;\n bottom: 0;\n right: 0;\n height: 100vh;\n width: 100vw;\n overflow: hidden;\n z-index: ", ";\n visibility: hidden;\n\n\n &.open {\n visibility: visible;\n animation: ", " 0.3s ease-in-out;\n }\n\n &.closed {\n visibility: hidden;\n animation: ", " 0.3s ease-in-out;\n }\n\n ", " {\n visibility: hidden !important;\n }\n"])), Z_INDEXES.backdrop, fadeIn, fadeOut, BREAKPOINTS.LARGE);
32
+ var MobileMenuBackdrop = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n background: rgba(0, 0, 0, 0.5);\n display: flex;\n position: fixed;\n left: 0;\n top: 0;\n height: 100%;\n width: 100%;\n overflow: hidden;\n z-index: ", ";\n visibility: hidden;\n\n &.open {\n visibility: visible;\n animation: ", " 0.3s ease-in-out;\n }\n\n &.closed {\n visibility: hidden;\n animation: ", " 0.3s ease-in-out;\n }\n\n ", " {\n visibility: hidden !important;\n }\n"])), Z_INDEXES.backdrop, fadeIn, fadeOut, BREAKPOINTS.LARGE);
33
33
  var UserMenuWrapper = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n background-color: ", ";\n display: flex;\n position: absolute;\n\n ", " {\n top: 56px;\n right: ", ";\n }\n"])), COLORS.white, BREAKPOINTS.LARGE, function (props) {
34
34
  return props.offsetRight && hasWindow() ? "".concat(window.innerWidth - props.offsetRight + 296, "px") : '10%';
35
35
  });
@@ -1 +1 @@
1
- {"version":3,"file":"GlobalNavigationBar.js","names":["React","styled","Logo","MainMenu","PageWidth","COLORS","BREAKPOINTS","RightSideNav","MobileMenu","Menu","UserMenu","fadeIn","fadeOut","MobileMenuWrapper","Z_INDEXES","IconButton","DesktopActions","usePreviousImmediate","useClickOutsideRef","hasWindow","HeaderWrapper","header","neutral_200","sticky_menu","SMALL","LARGE","RowLayout","div","HamburgerButton","RightSide","XSMALL","MobileMenuBackdrop","backdrop","UserMenuWrapper","white","props","offsetRight","window","innerWidth","GlobalNavigationBar","name","isAuthenticated","logo","profile","mobile","desktop","testId","useMaxWidth","maxWidth","useState","showMobileMenu","setShowMobileMenu","wasMobileMenuOpen","showUserMenu","setShowUserMenu","actionsRef","useRef","profileButtonRef","current","buttons","find","a","type","ref","mobileMenuButtonRef","rightSideRef","avatarRight","setAvatarRight","userMenuRef","mobileMenuRef","useEffect","handleResize","profileRightOffset","getBoundingClientRect","right","addEventListener","removeEventListener","showBetaTag","onClick","to","items","filter","pinned","reverseRightSideOrder","action","user","some"],"sources":["../../src/GlobalNavigationBar/GlobalNavigationBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport Logo from './Logo';\nimport MainMenu from './desktop/MainMenu';\nimport {PageWidth} from '../Layouts';\nimport {COLORS, BREAKPOINTS} from '../styles';\nimport RightSideNav from './desktop/RightSideNav';\nimport MobileMenu from './mobile/MobileMenu';\nimport {Menu} from '../icons/systemicons/SystemIcons';\nimport UserMenu from './desktop/UserMenu';\nimport {fadeIn, fadeOut, Menu as MobileMenuWrapper} from './mobile/CommonStyles';\nimport {Z_INDEXES} from '../styles';\nimport {\n DesktopNavigationMenuProps, MenuProfileButton,\n MobileNavigationMenuProps,\n ProfileMenu\n} from './types';\nimport {IconButton} from '../Button';\nimport DesktopActions, {DesktopActionsRef} from './desktop/DesktopActions';\nimport {usePreviousImmediate} from 'rooks';\nimport {useClickOutsideRef} from '../common';\nimport { hasWindow } from '../utils/utils';\n\nconst HeaderWrapper = styled.header`\n background: white;\n box-sizing: border-box;\n border-bottom: 1px solid ${COLORS.neutral_200};\n\n z-index: ${Z_INDEXES.sticky_menu};\n position: relative;\n\n height: 48px;\n\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n }\n\n ${BREAKPOINTS.LARGE} {\n height: 64px;\n }\n\n @media all and (-ms-high-contrast: none) {\n height: auto;\n }\n\n @media print {\n border-bottom: none;\n }\n`;\n\nconst RowLayout = styled.div`\n display: flex;\n align-items: center;\n`;\n\n\nconst HamburgerButton = styled.div`\n ${BREAKPOINTS.SMALL} button {\n height: 56px;\n }\n\n ${BREAKPOINTS.LARGE} {\n display: none;\n }\n`;\n\nconst RightSide = styled.div`\n display: flex;\n align-items: center;\n\n ${BREAKPOINTS.XSMALL} {\n margin: 0 0 0 auto;\n }\n\n &.reverse {\n ${HamburgerButton} {\n order: -1;\n }\n\n flex-direction: row-reverse;\n }\n`;\n\nconst MobileMenuBackdrop = styled.div`\n background: rgba(0, 0, 0, 0.5);\n display: flex;\n position: fixed;\n left: 0;\n top: 0;\n bottom: 0;\n right: 0;\n height: 100vh;\n width: 100vw;\n overflow: hidden;\n z-index: ${Z_INDEXES.backdrop};\n visibility: hidden;\n\n\n &.open {\n visibility: visible;\n animation: ${fadeIn} 0.3s ease-in-out;\n }\n\n &.closed {\n visibility: hidden;\n animation: ${fadeOut} 0.3s ease-in-out;\n }\n\n ${BREAKPOINTS.LARGE} {\n visibility: hidden !important;\n }\n`;\n\nconst UserMenuWrapper = styled.div<{ offsetRight?: number }>`\n background-color: ${COLORS.white};\n display: flex;\n position: absolute;\n\n ${BREAKPOINTS.LARGE} {\n top: 56px;\n right: ${(props) => (props.offsetRight && hasWindow() ? `${window.innerWidth - props.offsetRight + 296}px` : '10%')};\n }\n`;\n\n\ntype GlobalNavigationBarProps = {\n isAuthenticated?: boolean;\n useMaxWidth?: boolean;\n maxWidth?: number;\n\n name?: string;\n logo?: { onClick?: () => void; to?: string; showBetaTag?: boolean; };\n\n profile?: ProfileMenu;\n\n mobile?: MobileNavigationMenuProps;\n desktop?: DesktopNavigationMenuProps;\n\n testId?: string;\n};\n\n/**\n * @param props\n * @constructor\n * @description This component is a global navigation header bar\n */\nconst GlobalNavigationBar = ({\n name,\n isAuthenticated,\n logo,\n profile,\n mobile,\n desktop,\n testId,\n useMaxWidth = true,\n maxWidth,\n }: GlobalNavigationBarProps): React.ReactElement<GlobalNavigationBarProps> => {\n const [showMobileMenu, setShowMobileMenu] = React.useState(false);\n const wasMobileMenuOpen = usePreviousImmediate(showMobileMenu);\n\n const [showUserMenu, setShowUserMenu] = React.useState(false);\n\n const actionsRef = React.useRef<DesktopActionsRef>(null);\n const profileButtonRef = React.useRef<HTMLButtonElement | null>() as React.MutableRefObject<HTMLButtonElement | null | undefined>;\n profileButtonRef.current = actionsRef?.current?.buttons?.find(a => a.type === 'profile')?.ref?.current;\n\n const mobileMenuButtonRef = React.useRef<HTMLButtonElement>(null);\n\n const rightSideRef = React.useRef(null);\n const [avatarRight, setAvatarRight] = React.useState<number>(0);\n\n\n const userMenuRef = useClickOutsideRef(() => setShowUserMenu(false), [profileButtonRef]);\n const mobileMenuRef = useClickOutsideRef(() => setShowMobileMenu(false), [mobileMenuButtonRef]);\n\n React.useEffect(() => {\n if (!profileButtonRef.current) return;\n\n const handleResize = () => {\n const profileRightOffset = profileButtonRef.current?.getBoundingClientRect()?.right;\n setAvatarRight(profileRightOffset || 0);\n };\n\n handleResize();\n window.addEventListener('resize', handleResize);\n return () => window.removeEventListener('resize', handleResize);\n }, [profileButtonRef.current]);\n\n\n return (\n <>\n <HeaderWrapper data-testid={testId}>\n <PageWidth useMaxWidth={useMaxWidth} maxWidth={maxWidth}>\n <RowLayout>\n <Logo name={name || ''} showBetaTag={logo?.showBetaTag} onClick={logo?.onClick} to={logo?.to}/>\n {\n isAuthenticated &&\n <MainMenu items={desktop?.items.filter(a => !a.pinned) || []} rightSideRef={rightSideRef}/>\n }\n <RightSide className={`${desktop?.reverseRightSideOrder ? 'reverse' : ''}`}\n ref={rightSideRef}>\n <RightSideNav items={desktop?.items?.filter(a => a.pinned)} action={desktop?.action}/>\n <DesktopActions ref={actionsRef}\n buttons={desktop?.buttons}\n onShowUserMenu={() => setShowUserMenu(!showUserMenu)}\n user={profile?.user}/>\n <HamburgerButton hidden={!isAuthenticated}>\n <IconButton action={() => setShowMobileMenu(!showMobileMenu)}\n ref={mobileMenuButtonRef}\n shape={'circular'}\n variant={'secondary'}>\n <Menu size=\"24px\"/>\n </IconButton>\n </HamburgerButton>\n </RightSide>\n </RowLayout>\n </PageWidth>\n </HeaderWrapper>\n <MobileMenuBackdrop className={showMobileMenu ? 'open' : !showUserMenu && wasMobileMenuOpen ? 'closed' : ''}>\n <MobileMenuWrapper ref={mobileMenuRef}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <MobileMenu {...mobile}\n show={showMobileMenu}\n onClose={() => setShowMobileMenu(false)}\n profile={profile}/>\n </MobileMenuWrapper>\n </MobileMenuBackdrop>\n {\n desktop?.buttons?.some(a => a.type === 'profile') && !!profile &&\n <UserMenuWrapper ref={userMenuRef}\n offsetRight={avatarRight}\n data-testid=\"testUserMenuWrapper\">\n <UserMenu {...profile}\n show={showUserMenu}\n onHideUserMenu={() => setShowUserMenu(false)}/>\n </UserMenuWrapper>\n }\n </>\n );\n};\n\nexport default GlobalNavigationBar;\n"],"mappings":";;;;;;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AAEtC,OAAOC,IAAI,MAAM,QAAQ;AACzB,OAAOC,QAAQ,MAAM,oBAAoB;AACzC,SAAQC,SAAS,QAAO,YAAY;AACpC,SAAQC,MAAM,EAAEC,WAAW,QAAO,WAAW;AAC7C,OAAOC,YAAY,MAAM,wBAAwB;AACjD,OAAOC,UAAU,MAAM,qBAAqB;AAC5C,SAAQC,IAAI,QAAO,kCAAkC;AACrD,OAAOC,QAAQ,MAAM,oBAAoB;AACzC,SAAQC,MAAM,EAAEC,OAAO,EAAEH,IAAI,IAAII,iBAAiB,QAAO,uBAAuB;AAChF,SAAQC,SAAS,QAAO,WAAW;AAMnC,SAAQC,UAAU,QAAO,WAAW;AACpC,OAAOC,cAAc,MAA2B,0BAA0B;AAC1E,SAAQC,oBAAoB,QAAO,OAAO;AAC1C,SAAQC,kBAAkB,QAAO,WAAW;AAC5C,SAASC,SAAS,QAAQ,gBAAgB;AAAC;AAAA;AAAA;AAE3C,IAAMC,aAAa,GAAGnB,MAAM,CAACoB,MAAM,4ZAGNhB,MAAM,CAACiB,WAAW,EAElCR,SAAS,CAACS,WAAW,EAK9BjB,WAAW,CAACkB,KAAK,EAIjBlB,WAAW,CAACmB,KAAK,CAWpB;AAED,IAAMC,SAAS,GAAGzB,MAAM,CAAC0B,GAAG,mHAG3B;AAGD,IAAMC,eAAe,GAAG3B,MAAM,CAAC0B,GAAG,wJAC9BrB,WAAW,CAACkB,KAAK,EAIjBlB,WAAW,CAACmB,KAAK,CAGpB;AAED,IAAMI,SAAS,GAAG5B,MAAM,CAAC0B,GAAG,6PAIxBrB,WAAW,CAACwB,MAAM,EAKhBF,eAAe,CAMpB;AAED,IAAMG,kBAAkB,GAAG9B,MAAM,CAAC0B,GAAG,sgBAWxBb,SAAS,CAACkB,QAAQ,EAMdrB,MAAM,EAKNC,OAAO,EAGpBN,WAAW,CAACmB,KAAK,CAGpB;AAED,IAAMQ,eAAe,GAAGhC,MAAM,CAAC0B,GAAG,iMACZtB,MAAM,CAAC6B,KAAK,EAI9B5B,WAAW,CAACmB,KAAK,EAER,UAACU,KAAK;EAAA,OAAMA,KAAK,CAACC,WAAW,IAAIjB,SAAS,EAAE,aAAMkB,MAAM,CAACC,UAAU,GAAGH,KAAK,CAACC,WAAW,GAAG,GAAG,UAAO,KAAK;AAAA,CAAC,CAEtH;AAmBD;AACA;AACA;AACA;AACA;AACA,IAAMG,mBAAmB,GAAG,SAAtBA,mBAAmB,OAUkF;EAAA;EAAA,IAT5EC,IAAI,QAAJA,IAAI;IACJC,eAAe,QAAfA,eAAe;IACfC,IAAI,QAAJA,IAAI;IACJC,OAAO,QAAPA,OAAO;IACPC,MAAM,QAANA,MAAM;IACNC,OAAO,QAAPA,OAAO;IACPC,MAAM,QAANA,MAAM;IAAA,wBACNC,WAAW;IAAXA,WAAW,iCAAG,IAAI;IAClBC,QAAQ,QAARA,QAAQ;EAErC,sBAA4ChD,KAAK,CAACiD,QAAQ,CAAC,KAAK,CAAC;IAAA;IAA1DC,cAAc;IAAEC,iBAAiB;EACxC,IAAMC,iBAAiB,GAAGnC,oBAAoB,CAACiC,cAAc,CAAC;EAE9D,uBAAwClD,KAAK,CAACiD,QAAQ,CAAC,KAAK,CAAC;IAAA;IAAtDI,YAAY;IAAEC,eAAe;EAEpC,IAAMC,UAAU,GAAGvD,KAAK,CAACwD,MAAM,CAAoB,IAAI,CAAC;EACxD,IAAMC,gBAAgB,GAAGzD,KAAK,CAACwD,MAAM,EAA4F;EACjIC,gBAAgB,CAACC,OAAO,GAAGH,UAAU,aAAVA,UAAU,8CAAVA,UAAU,CAAEG,OAAO,iFAAnB,oBAAqBC,OAAO,oFAA5B,sBAA8BC,IAAI,CAAC,UAAAC,CAAC;IAAA,OAAIA,CAAC,CAACC,IAAI,KAAK,SAAS;EAAA,EAAC,qFAA7D,uBAA+DC,GAAG,2DAAlE,uBAAoEL,OAAO;EAEtG,IAAMM,mBAAmB,GAAGhE,KAAK,CAACwD,MAAM,CAAoB,IAAI,CAAC;EAEjE,IAAMS,YAAY,GAAGjE,KAAK,CAACwD,MAAM,CAAC,IAAI,CAAC;EACvC,uBAAsCxD,KAAK,CAACiD,QAAQ,CAAS,CAAC,CAAC;IAAA;IAAxDiB,WAAW;IAAEC,cAAc;EAGlC,IAAMC,WAAW,GAAGlD,kBAAkB,CAAC;IAAA,OAAMoC,eAAe,CAAC,KAAK,CAAC;EAAA,GAAE,CAACG,gBAAgB,CAAC,CAAC;EACxF,IAAMY,aAAa,GAAGnD,kBAAkB,CAAC;IAAA,OAAMiC,iBAAiB,CAAC,KAAK,CAAC;EAAA,GAAE,CAACa,mBAAmB,CAAC,CAAC;EAE/FhE,KAAK,CAACsE,SAAS,CAAC,YAAM;IACpB,IAAI,CAACb,gBAAgB,CAACC,OAAO,EAAE;IAE/B,IAAMa,YAAY,GAAG,SAAfA,YAAY,GAAS;MAAA;MACzB,IAAMC,kBAAkB,4BAAGf,gBAAgB,CAACC,OAAO,oFAAxB,sBAA0Be,qBAAqB,EAAE,2DAAjD,uBAAmDC,KAAK;MACnFP,cAAc,CAACK,kBAAkB,IAAI,CAAC,CAAC;IACzC,CAAC;IAEDD,YAAY,EAAE;IACdlC,MAAM,CAACsC,gBAAgB,CAAC,QAAQ,EAAEJ,YAAY,CAAC;IAC/C,OAAO;MAAA,OAAMlC,MAAM,CAACuC,mBAAmB,CAAC,QAAQ,EAAEL,YAAY,CAAC;IAAA;EACjE,CAAC,EAAE,CAACd,gBAAgB,CAACC,OAAO,CAAC,CAAC;EAG9B,oBACE;IAAA,wBACE,KAAC,aAAa;MAAC,eAAaZ,MAAO;MAAA,uBACjC,KAAC,SAAS;QAAC,WAAW,EAAEC,WAAY;QAAC,QAAQ,EAAEC,QAAS;QAAA,uBACtD,MAAC,SAAS;UAAA,wBACR,KAAC,IAAI;YAAC,IAAI,EAAER,IAAI,IAAI,EAAG;YAAC,WAAW,EAAEE,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEmC,WAAY;YAAC,OAAO,EAAEnC,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEoC,OAAQ;YAAC,EAAE,EAAEpC,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEqC;UAAG,EAAE,EAE7FtC,eAAe,iBACf,KAAC,QAAQ;YAAC,KAAK,EAAE,CAAAI,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEmC,KAAK,CAACC,MAAM,CAAC,UAAApB,CAAC;cAAA,OAAI,CAACA,CAAC,CAACqB,MAAM;YAAA,EAAC,KAAI,EAAG;YAAC,YAAY,EAAEjB;UAAa,EAAE,eAE7F,MAAC,SAAS;YAAC,SAAS,YAAKpB,OAAO,aAAPA,OAAO,eAAPA,OAAO,CAAEsC,qBAAqB,GAAG,SAAS,GAAG,EAAE,CAAG;YAChE,GAAG,EAAElB,YAAa;YAAA,wBAC3B,KAAC,YAAY;cAAC,KAAK,EAAEpB,OAAO,aAAPA,OAAO,yCAAPA,OAAO,CAAEmC,KAAK,mDAAd,eAAgBC,MAAM,CAAC,UAAApB,CAAC;gBAAA,OAAIA,CAAC,CAACqB,MAAM;cAAA,EAAE;cAAC,MAAM,EAAErC,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEuC;YAAO,EAAE,eACtF,KAAC,cAAc;cAAC,GAAG,EAAE7B,UAAW;cAChB,OAAO,EAAEV,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEc,OAAQ;cAC1B,cAAc,EAAE;gBAAA,OAAML,eAAe,CAAC,CAACD,YAAY,CAAC;cAAA,CAAC;cACrD,IAAI,EAAEV,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAE0C;YAAK,EAAE,eACtC,KAAC,eAAe;cAAC,MAAM,EAAE,CAAC5C,eAAgB;cAAA,uBACxC,KAAC,UAAU;gBAAC,MAAM,EAAE;kBAAA,OAAMU,iBAAiB,CAAC,CAACD,cAAc,CAAC;gBAAA,CAAC;gBACjD,GAAG,EAAEc,mBAAoB;gBACzB,KAAK,EAAE,UAAW;gBAClB,OAAO,EAAE,WAAY;gBAAA,uBAC/B,KAAC,IAAI;kBAAC,IAAI,EAAC;gBAAM;cAAE;YACR,EACG;UAAA,EACR;QAAA;MACF;IACF,EACE,eAChB,KAAC,kBAAkB;MAAC,SAAS,EAAEd,cAAc,GAAG,MAAM,GAAG,CAACG,YAAY,IAAID,iBAAiB,GAAG,QAAQ,GAAG,EAAG;MAAA,uBAC1G,KAAC,iBAAiB;QAAC,GAAG,EAAEiB,aAAc;QACnB,IAAI,EAAC,MAAM;QACX,mBAAgB,gBAAgB;QAAA,uBACjD,KAAC,UAAU,kCAAKzB,MAAM;UACV,IAAI,EAAEM,cAAe;UACrB,OAAO,EAAE;YAAA,OAAMC,iBAAiB,CAAC,KAAK,CAAC;UAAA,CAAC;UACxC,OAAO,EAAER;QAAQ;MAAE;IACb,EACD,EAEnB,CAAAE,OAAO,aAAPA,OAAO,2CAAPA,OAAO,CAAEc,OAAO,qDAAhB,iBAAkB2B,IAAI,CAAC,UAAAzB,CAAC;MAAA,OAAIA,CAAC,CAACC,IAAI,KAAK,SAAS;IAAA,EAAC,KAAI,CAAC,CAACnB,OAAO,iBAC9D,KAAC,eAAe;MAAC,GAAG,EAAEyB,WAAY;MACjB,WAAW,EAAEF,WAAY;MACzB,eAAY,qBAAqB;MAAA,uBAChD,KAAC,QAAQ,kCAAKvB,OAAO;QACX,IAAI,EAAEU,YAAa;QACnB,cAAc,EAAE;UAAA,OAAMC,eAAe,CAAC,KAAK,CAAC;QAAA;MAAC;IAAE,EACzC;EAAA,EAEnB;AAEP,CAAC;AAAC;EAlHAb,eAAe;EACfM,WAAW;EACXC,QAAQ;EAERR,IAAI;EACJE,IAAI;IAAKoC,OAAO;IAAeC,EAAE;IAAWF,WAAW;EAAA;EAOvD/B,MAAM;AAAA;AAwGR,eAAeP,mBAAmB"}
1
+ {"version":3,"file":"GlobalNavigationBar.js","names":["React","styled","Logo","MainMenu","PageWidth","COLORS","BREAKPOINTS","RightSideNav","MobileMenu","Menu","UserMenu","fadeIn","fadeOut","MobileMenuWrapper","Z_INDEXES","IconButton","DesktopActions","usePreviousImmediate","useClickOutsideRef","hasWindow","HeaderWrapper","header","neutral_200","sticky_menu","SMALL","LARGE","RowLayout","div","HamburgerButton","RightSide","XSMALL","MobileMenuBackdrop","backdrop","UserMenuWrapper","white","props","offsetRight","window","innerWidth","GlobalNavigationBar","name","isAuthenticated","logo","profile","mobile","desktop","testId","useMaxWidth","maxWidth","useState","showMobileMenu","setShowMobileMenu","wasMobileMenuOpen","showUserMenu","setShowUserMenu","actionsRef","useRef","profileButtonRef","current","buttons","find","a","type","ref","mobileMenuButtonRef","rightSideRef","avatarRight","setAvatarRight","userMenuRef","mobileMenuRef","useEffect","handleResize","profileRightOffset","getBoundingClientRect","right","addEventListener","removeEventListener","showBetaTag","onClick","to","items","filter","pinned","reverseRightSideOrder","action","user","some"],"sources":["../../src/GlobalNavigationBar/GlobalNavigationBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport Logo from './Logo';\nimport MainMenu from './desktop/MainMenu';\nimport {PageWidth} from '../Layouts';\nimport {COLORS, BREAKPOINTS} from '../styles';\nimport RightSideNav from './desktop/RightSideNav';\nimport MobileMenu from './mobile/MobileMenu';\nimport {Menu} from '../icons/systemicons/SystemIcons';\nimport UserMenu from './desktop/UserMenu';\nimport {fadeIn, fadeOut, Menu as MobileMenuWrapper} from './mobile/CommonStyles';\nimport {Z_INDEXES} from '../styles';\nimport {\n DesktopNavigationMenuProps, MenuProfileButton,\n MobileNavigationMenuProps,\n ProfileMenu\n} from './types';\nimport {IconButton} from '../Button';\nimport DesktopActions, {DesktopActionsRef} from './desktop/DesktopActions';\nimport {usePreviousImmediate} from 'rooks';\nimport {useClickOutsideRef} from '../common';\nimport { hasWindow } from '../utils/utils';\n\nconst HeaderWrapper = styled.header`\n background: white;\n box-sizing: border-box;\n border-bottom: 1px solid ${COLORS.neutral_200};\n\n z-index: ${Z_INDEXES.sticky_menu};\n position: relative;\n\n height: 48px;\n\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n }\n\n ${BREAKPOINTS.LARGE} {\n height: 64px;\n }\n\n @media all and (-ms-high-contrast: none) {\n height: auto;\n }\n\n @media print {\n border-bottom: none;\n }\n`;\n\nconst RowLayout = styled.div`\n display: flex;\n align-items: center;\n`;\n\n\nconst HamburgerButton = styled.div`\n ${BREAKPOINTS.SMALL} button {\n height: 56px;\n }\n\n ${BREAKPOINTS.LARGE} {\n display: none;\n }\n`;\n\nconst RightSide = styled.div`\n display: flex;\n align-items: center;\n\n ${BREAKPOINTS.XSMALL} {\n margin: 0 0 0 auto;\n }\n\n &.reverse {\n ${HamburgerButton} {\n order: -1;\n }\n\n flex-direction: row-reverse;\n }\n`;\n\nconst MobileMenuBackdrop = styled.div`\n background: rgba(0, 0, 0, 0.5);\n display: flex;\n position: fixed;\n left: 0;\n top: 0;\n height: 100%;\n width: 100%;\n overflow: hidden;\n z-index: ${Z_INDEXES.backdrop};\n visibility: hidden;\n\n &.open {\n visibility: visible;\n animation: ${fadeIn} 0.3s ease-in-out;\n }\n\n &.closed {\n visibility: hidden;\n animation: ${fadeOut} 0.3s ease-in-out;\n }\n\n ${BREAKPOINTS.LARGE} {\n visibility: hidden !important;\n }\n`;\n\nconst UserMenuWrapper = styled.div<{ offsetRight?: number }>`\n background-color: ${COLORS.white};\n display: flex;\n position: absolute;\n\n ${BREAKPOINTS.LARGE} {\n top: 56px;\n right: ${(props) => (props.offsetRight && hasWindow() ? `${window.innerWidth - props.offsetRight + 296}px` : '10%')};\n }\n`;\n\n\ntype GlobalNavigationBarProps = {\n isAuthenticated?: boolean;\n useMaxWidth?: boolean;\n maxWidth?: number;\n\n name?: string;\n logo?: { onClick?: () => void; to?: string; showBetaTag?: boolean; };\n\n profile?: ProfileMenu;\n\n mobile?: MobileNavigationMenuProps;\n desktop?: DesktopNavigationMenuProps;\n\n testId?: string;\n};\n\n/**\n * @param props\n * @constructor\n * @description This component is a global navigation header bar\n */\nconst GlobalNavigationBar = ({\n name,\n isAuthenticated,\n logo,\n profile,\n mobile,\n desktop,\n testId,\n useMaxWidth = true,\n maxWidth,\n }: GlobalNavigationBarProps): React.ReactElement<GlobalNavigationBarProps> => {\n const [showMobileMenu, setShowMobileMenu] = React.useState(false);\n const wasMobileMenuOpen = usePreviousImmediate(showMobileMenu);\n\n const [showUserMenu, setShowUserMenu] = React.useState(false);\n\n const actionsRef = React.useRef<DesktopActionsRef>(null);\n const profileButtonRef = React.useRef<HTMLButtonElement | null>() as React.MutableRefObject<HTMLButtonElement | null | undefined>;\n profileButtonRef.current = actionsRef?.current?.buttons?.find(a => a.type === 'profile')?.ref?.current;\n\n const mobileMenuButtonRef = React.useRef<HTMLButtonElement>(null);\n\n const rightSideRef = React.useRef(null);\n const [avatarRight, setAvatarRight] = React.useState<number>(0);\n\n\n const userMenuRef = useClickOutsideRef(() => setShowUserMenu(false), [profileButtonRef]);\n const mobileMenuRef = useClickOutsideRef(() => setShowMobileMenu(false), [mobileMenuButtonRef]);\n\n React.useEffect(() => {\n if (!profileButtonRef.current) return;\n\n const handleResize = () => {\n const profileRightOffset = profileButtonRef.current?.getBoundingClientRect()?.right;\n setAvatarRight(profileRightOffset || 0);\n };\n\n handleResize();\n window.addEventListener('resize', handleResize);\n return () => window.removeEventListener('resize', handleResize);\n }, [profileButtonRef.current]);\n\n\n return (\n <>\n <HeaderWrapper data-testid={testId}>\n <PageWidth useMaxWidth={useMaxWidth} maxWidth={maxWidth}>\n <RowLayout>\n <Logo name={name || ''} showBetaTag={logo?.showBetaTag} onClick={logo?.onClick} to={logo?.to}/>\n {\n isAuthenticated &&\n <MainMenu items={desktop?.items.filter(a => !a.pinned) || []} rightSideRef={rightSideRef}/>\n }\n <RightSide className={`${desktop?.reverseRightSideOrder ? 'reverse' : ''}`}\n ref={rightSideRef}>\n <RightSideNav items={desktop?.items?.filter(a => a.pinned)} action={desktop?.action}/>\n <DesktopActions ref={actionsRef}\n buttons={desktop?.buttons}\n onShowUserMenu={() => setShowUserMenu(!showUserMenu)}\n user={profile?.user}/>\n <HamburgerButton hidden={!isAuthenticated}>\n <IconButton action={() => setShowMobileMenu(!showMobileMenu)}\n ref={mobileMenuButtonRef}\n shape={'circular'}\n variant={'secondary'}>\n <Menu size=\"24px\"/>\n </IconButton>\n </HamburgerButton>\n </RightSide>\n </RowLayout>\n </PageWidth>\n </HeaderWrapper>\n <MobileMenuBackdrop className={showMobileMenu ? 'open' : !showUserMenu && wasMobileMenuOpen ? 'closed' : ''}>\n <MobileMenuWrapper ref={mobileMenuRef}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <MobileMenu {...mobile}\n show={showMobileMenu}\n onClose={() => setShowMobileMenu(false)}\n profile={profile}/>\n </MobileMenuWrapper>\n </MobileMenuBackdrop>\n {\n desktop?.buttons?.some(a => a.type === 'profile') && !!profile &&\n <UserMenuWrapper ref={userMenuRef}\n offsetRight={avatarRight}\n data-testid=\"testUserMenuWrapper\">\n <UserMenu {...profile}\n show={showUserMenu}\n onHideUserMenu={() => setShowUserMenu(false)}/>\n </UserMenuWrapper>\n }\n </>\n );\n};\n\nexport default GlobalNavigationBar;\n"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- declare type LogoProps = {
2
+ type LogoProps = {
3
3
  name: string;
4
4
  showBetaTag?: boolean;
5
5
  onClick?: () => void;
@@ -1,5 +1,5 @@
1
1
  import { MenuNavigationItemTypeItem } from '../../index';
2
- declare type Props = {
2
+ type Props = {
3
3
  clickMenuAction: () => void;
4
4
  navigationOptions: MenuNavigationItemTypeItem[];
5
5
  };
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { MenuNavigationItemTypeItem } from '../types';
3
- declare type Props = {
3
+ type Props = {
4
4
  items: MenuNavigationItemTypeItem[];
5
5
  rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;
6
6
  };
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { MenuButton, MenuNavigationItemTypeItem } from '../types';
3
- declare type Props = {
3
+ type Props = {
4
4
  items?: MenuNavigationItemTypeItem[];
5
5
  action?: MenuButton;
6
6
  };
@@ -48,15 +48,17 @@ var UserMenu = function UserMenu(_ref) {
48
48
  navigate = _useNavigationHelper.navigate,
49
49
  isActiveRoute = _useNavigationHelper.isActiveRoute;
50
50
  React.useEffect(function () {
51
+ var _document;
51
52
  if (!onHideUserMenu) return;
52
53
  function handleKeyPress(e) {
53
54
  if (e.key === 'Escape' || e.key === 'Esc') {
54
55
  onHideUserMenu();
55
56
  }
56
57
  }
57
- document.addEventListener('keydown', handleKeyPress, false);
58
+ (_document = document) === null || _document === void 0 ? void 0 : _document.addEventListener('keydown', handleKeyPress, false);
58
59
  return function () {
59
- document.removeEventListener('keydown', handleKeyPress, false);
60
+ var _document2;
61
+ (_document2 = document) === null || _document2 === void 0 ? void 0 : _document2.removeEventListener('keydown', handleKeyPress, false);
60
62
  };
61
63
  }, [onHideUserMenu]);
62
64
  var renderItem = function renderItem(item, section, index) {
@@ -1 +1 @@
1
- {"version":3,"file":"UserMenu.cjs","names":["UserMenuScrollContainer","styled","div","UserMenuPinnedContainer","UserMenuWrapper","COLORS","white","Z_INDEXES","off_canvas","Breakpoints","MEDIUM","flowDown","BOXSHADOWS","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","ComponentSStyling","ComponentTextStyle","Bold","neutral_500","MenuSectionList","UserMenuSectionListStyling","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","ComponentLStyling","neutral_600","UserSectionInfoEmail","ComponentXSStyling","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","useNavigationHelper","navigate","isActiveRoute","React","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Size","Large","preventDefault"],"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n BOXSHADOWS,\n COLORS,\n ComponentLStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n width: 320px;\n\n position: absolute;\n\n &.show {\n display: block;\n }\n\n top: 0;\n right: 0;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n flex-flow: column;\n\n\n ${Breakpoints.MEDIUM} {\n flex-flow: initial;\n top: initial;\n right: initial;\n height: initial;\n animation: ${flowDown} 0.2s ease-in-out;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n padding: 24px 0;\n }\n`;\n\n\nconst MenuSection = styled.div`\n padding: 4px 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n align-items: center;\n justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 24px 4px 24px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n pointer-events: none;\n\n button {\n padding: 0 !important;\n }\n\n button > div {\n width: 48px !important;\n height: 48px !important;\n border-radius: 50% !important;\n }\n`;\n\nconst UserSectionInfo = styled.div`\n padding: 2px 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n word-break: break-all;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n svg {\n width: 16px;\n height: 16px;\n }\n`;\n\nconst UserSection = styled.div`\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n show?: boolean;\n onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n React.useEffect(() => {\n if (!onHideUserMenu) return;\n\n function handleKeyPress(e: any) {\n if (e.key === 'Escape' || e.key === 'Esc') {\n onHideUserMenu();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [onHideUserMenu]);\n\n const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n <MenuItem key={index}\n id={`profile_${index}`}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n }}\n onClickHandler={(e) => {\n item.action && item.action(e);\n navigate(item.to, !!item.external);\n }}/>\n\n return (\n <UserMenuWrapper onClick={onHideUserMenu}\n className={show ? 'show' : ''}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <UserMenuScrollContainer>\n <UserSection>\n <UserSectionAvatar>\n <ProfileButton onClick={() => {\n }}\n tabIndex={-1}\n initials={user.firstName[0] + user.lastName[0]}/>\n </UserSectionAvatar>\n <UserSectionInfo>\n <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n {\n user.link &&\n <HyperLink variant={'default'}\n href={user.link.href}\n target={user.link.target}\n id={user.link.id}\n onClick={user.link.onClick}>\n <UserSectionInfoLink>\n <span>\n {user.link.label}\n </span>\n {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n </UserSectionInfoLink>\n </HyperLink>\n }\n </UserSectionInfo>\n </UserSection>\n {\n sections.filter(a => !a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n </UserMenuScrollContainer>\n <UserMenuPinnedContainer>\n {\n sections.filter(a => !!a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n {\n signOut &&\n <SignOutActionWrapper>\n <Button width={'272px'}\n variant=\"secondary\"\n icon={<SystemIcons.Logout/>}\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut?.action();\n }}>\n {signOut?.label}\n </Button>\n </SignOutActionWrapper>\n }\n </UserMenuPinnedContainer>\n </UserMenuWrapper>\n );\n};\n\nexport default UserMenu;\n"],"mappings":"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"}
1
+ {"version":3,"file":"UserMenu.cjs","names":["UserMenuScrollContainer","styled","div","UserMenuPinnedContainer","UserMenuWrapper","COLORS","white","Z_INDEXES","off_canvas","Breakpoints","MEDIUM","flowDown","BOXSHADOWS","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","ComponentSStyling","ComponentTextStyle","Bold","neutral_500","MenuSectionList","UserMenuSectionListStyling","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","ComponentLStyling","neutral_600","UserSectionInfoEmail","ComponentXSStyling","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","useNavigationHelper","navigate","isActiveRoute","React","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Size","Large","preventDefault"],"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n BOXSHADOWS,\n COLORS,\n ComponentLStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n width: 320px;\n\n position: absolute;\n\n &.show {\n display: block;\n }\n\n top: 0;\n right: 0;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n flex-flow: column;\n\n\n ${Breakpoints.MEDIUM} {\n flex-flow: initial;\n top: initial;\n right: initial;\n height: initial;\n animation: ${flowDown} 0.2s ease-in-out;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n padding: 24px 0;\n }\n`;\n\n\nconst MenuSection = styled.div`\n padding: 4px 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n align-items: center;\n justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 24px 4px 24px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n pointer-events: none;\n\n button {\n padding: 0 !important;\n }\n\n button > div {\n width: 48px !important;\n height: 48px !important;\n border-radius: 50% !important;\n }\n`;\n\nconst UserSectionInfo = styled.div`\n padding: 2px 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n word-break: break-all;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n svg {\n width: 16px;\n height: 16px;\n }\n`;\n\nconst UserSection = styled.div`\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n show?: boolean;\n onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n React.useEffect(() => {\n if (!onHideUserMenu) return;\n\n function handleKeyPress(e: any) {\n if (e.key === 'Escape' || e.key === 'Esc') {\n onHideUserMenu();\n }\n }\n\n document?.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document?.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [onHideUserMenu]);\n\n const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n <MenuItem key={index}\n id={`profile_${index}`}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n }}\n onClickHandler={(e) => {\n item.action && item.action(e);\n navigate(item.to, !!item.external);\n }}/>\n\n return (\n <UserMenuWrapper onClick={onHideUserMenu}\n className={show ? 'show' : ''}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <UserMenuScrollContainer>\n <UserSection>\n <UserSectionAvatar>\n <ProfileButton onClick={() => {\n }}\n tabIndex={-1}\n initials={user.firstName[0] + user.lastName[0]}/>\n </UserSectionAvatar>\n <UserSectionInfo>\n <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n {\n user.link &&\n <HyperLink variant={'default'}\n href={user.link.href}\n target={user.link.target}\n id={user.link.id}\n onClick={user.link.onClick}>\n <UserSectionInfoLink>\n <span>\n {user.link.label}\n </span>\n {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n </UserSectionInfoLink>\n </HyperLink>\n }\n </UserSectionInfo>\n </UserSection>\n {\n sections.filter(a => !a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n </UserMenuScrollContainer>\n <UserMenuPinnedContainer>\n {\n sections.filter(a => !!a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n {\n signOut &&\n <SignOutActionWrapper>\n <Button width={'272px'}\n variant=\"secondary\"\n icon={<SystemIcons.Logout/>}\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut?.action();\n }}>\n {signOut?.label}\n </Button>\n </SignOutActionWrapper>\n }\n </UserMenuPinnedContainer>\n </UserMenuWrapper>\n );\n};\n\nexport default UserMenu;\n"],"mappings":"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"}
@@ -39,15 +39,17 @@ var UserMenu = function UserMenu(_ref) {
39
39
  navigate = _useNavigationHelper.navigate,
40
40
  isActiveRoute = _useNavigationHelper.isActiveRoute;
41
41
  React.useEffect(function () {
42
+ var _document;
42
43
  if (!onHideUserMenu) return;
43
44
  function handleKeyPress(e) {
44
45
  if (e.key === 'Escape' || e.key === 'Esc') {
45
46
  onHideUserMenu();
46
47
  }
47
48
  }
48
- document.addEventListener('keydown', handleKeyPress, false);
49
+ (_document = document) === null || _document === void 0 ? void 0 : _document.addEventListener('keydown', handleKeyPress, false);
49
50
  return function () {
50
- document.removeEventListener('keydown', handleKeyPress, false);
51
+ var _document2;
52
+ (_document2 = document) === null || _document2 === void 0 ? void 0 : _document2.removeEventListener('keydown', handleKeyPress, false);
51
53
  };
52
54
  }, [onHideUserMenu]);
53
55
  var renderItem = function renderItem(item, section, index) {
@@ -1 +1 @@
1
- {"version":3,"file":"UserMenu.js","names":["React","styled","Button","BOXSHADOWS","COLORS","ComponentLStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","Size","flowDown","UserMenuSectionListStyling","SystemIcons","HyperLink","Breakpoints","MenuItem","useNavigationHelper","ProfileButton","UserMenuScrollContainer","div","UserMenuPinnedContainer","UserMenuWrapper","white","off_canvas","MEDIUM","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","Bold","neutral_500","MenuSectionList","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Large","preventDefault"],"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n BOXSHADOWS,\n COLORS,\n ComponentLStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n width: 320px;\n\n position: absolute;\n\n &.show {\n display: block;\n }\n\n top: 0;\n right: 0;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n flex-flow: column;\n\n\n ${Breakpoints.MEDIUM} {\n flex-flow: initial;\n top: initial;\n right: initial;\n height: initial;\n animation: ${flowDown} 0.2s ease-in-out;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n padding: 24px 0;\n }\n`;\n\n\nconst MenuSection = styled.div`\n padding: 4px 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n align-items: center;\n justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 24px 4px 24px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n pointer-events: none;\n\n button {\n padding: 0 !important;\n }\n\n button > div {\n width: 48px !important;\n height: 48px !important;\n border-radius: 50% !important;\n }\n`;\n\nconst UserSectionInfo = styled.div`\n padding: 2px 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n word-break: break-all;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n svg {\n width: 16px;\n height: 16px;\n }\n`;\n\nconst UserSection = styled.div`\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n show?: boolean;\n onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n React.useEffect(() => {\n if (!onHideUserMenu) return;\n\n function handleKeyPress(e: any) {\n if (e.key === 'Escape' || e.key === 'Esc') {\n onHideUserMenu();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [onHideUserMenu]);\n\n const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n <MenuItem key={index}\n id={`profile_${index}`}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n }}\n onClickHandler={(e) => {\n item.action && item.action(e);\n navigate(item.to, !!item.external);\n }}/>\n\n return (\n <UserMenuWrapper onClick={onHideUserMenu}\n className={show ? 'show' : ''}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <UserMenuScrollContainer>\n <UserSection>\n <UserSectionAvatar>\n <ProfileButton onClick={() => {\n }}\n tabIndex={-1}\n initials={user.firstName[0] + user.lastName[0]}/>\n </UserSectionAvatar>\n <UserSectionInfo>\n <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n {\n user.link &&\n <HyperLink variant={'default'}\n href={user.link.href}\n target={user.link.target}\n id={user.link.id}\n onClick={user.link.onClick}>\n <UserSectionInfoLink>\n <span>\n {user.link.label}\n </span>\n {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n </UserSectionInfoLink>\n </HyperLink>\n }\n </UserSectionInfo>\n </UserSection>\n {\n sections.filter(a => !a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n </UserMenuScrollContainer>\n <UserMenuPinnedContainer>\n {\n sections.filter(a => !!a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n {\n signOut &&\n <SignOutActionWrapper>\n <Button width={'272px'}\n variant=\"secondary\"\n icon={<SystemIcons.Logout/>}\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut?.action();\n }}>\n {signOut?.label}\n </Button>\n </SignOutActionWrapper>\n }\n </UserMenuPinnedContainer>\n </UserMenuWrapper>\n );\n};\n\nexport default UserMenu;\n"],"mappings":"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"}
1
+ {"version":3,"file":"UserMenu.js","names":["React","styled","Button","BOXSHADOWS","COLORS","ComponentLStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","Size","flowDown","UserMenuSectionListStyling","SystemIcons","HyperLink","Breakpoints","MenuItem","useNavigationHelper","ProfileButton","UserMenuScrollContainer","div","UserMenuPinnedContainer","UserMenuWrapper","white","off_canvas","MEDIUM","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","Bold","neutral_500","MenuSectionList","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Large","preventDefault"],"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n BOXSHADOWS,\n COLORS,\n ComponentLStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n width: 320px;\n\n position: absolute;\n\n &.show {\n display: block;\n }\n\n top: 0;\n right: 0;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n flex-flow: column;\n\n\n ${Breakpoints.MEDIUM} {\n flex-flow: initial;\n top: initial;\n right: initial;\n height: initial;\n animation: ${flowDown} 0.2s ease-in-out;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n padding: 24px 0;\n }\n`;\n\n\nconst MenuSection = styled.div`\n padding: 4px 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n align-items: center;\n justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 24px 4px 24px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n pointer-events: none;\n\n button {\n padding: 0 !important;\n }\n\n button > div {\n width: 48px !important;\n height: 48px !important;\n border-radius: 50% !important;\n }\n`;\n\nconst UserSectionInfo = styled.div`\n padding: 2px 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n word-break: break-all;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n svg {\n width: 16px;\n height: 16px;\n }\n`;\n\nconst UserSection = styled.div`\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n show?: boolean;\n onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n React.useEffect(() => {\n if (!onHideUserMenu) return;\n\n function handleKeyPress(e: any) {\n if (e.key === 'Escape' || e.key === 'Esc') {\n onHideUserMenu();\n }\n }\n\n document?.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document?.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [onHideUserMenu]);\n\n const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n <MenuItem key={index}\n id={`profile_${index}`}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n }}\n onClickHandler={(e) => {\n item.action && item.action(e);\n navigate(item.to, !!item.external);\n }}/>\n\n return (\n <UserMenuWrapper onClick={onHideUserMenu}\n className={show ? 'show' : ''}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <UserMenuScrollContainer>\n <UserSection>\n <UserSectionAvatar>\n <ProfileButton onClick={() => {\n }}\n tabIndex={-1}\n initials={user.firstName[0] + user.lastName[0]}/>\n </UserSectionAvatar>\n <UserSectionInfo>\n <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n {\n user.link &&\n <HyperLink variant={'default'}\n href={user.link.href}\n target={user.link.target}\n id={user.link.id}\n onClick={user.link.onClick}>\n <UserSectionInfoLink>\n <span>\n {user.link.label}\n </span>\n {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n </UserSectionInfoLink>\n </HyperLink>\n }\n </UserSectionInfo>\n </UserSection>\n {\n sections.filter(a => !a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n </UserMenuScrollContainer>\n <UserMenuPinnedContainer>\n {\n sections.filter(a => !!a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n {\n signOut &&\n <SignOutActionWrapper>\n <Button width={'272px'}\n variant=\"secondary\"\n icon={<SystemIcons.Logout/>}\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut?.action();\n }}>\n {signOut?.label}\n </Button>\n </SignOutActionWrapper>\n }\n </UserMenuPinnedContainer>\n </UserMenuWrapper>\n );\n};\n\nexport default UserMenu;\n"],"mappings":"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"}
@@ -127,6 +127,9 @@ var MobileMenu = function MobileMenu(_ref) {
127
127
  }), switcher && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
128
128
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(SwitcherLabel, {
129
129
  className: 'globalNav-toggler',
130
+ onClick: function onClick() {
131
+ return switcher.action && switcher.action() && onClose();
132
+ },
130
133
  children: "Switch site"
131
134
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
132
135
  variant: 'secondary',