@laerdal/life-react-components 1.8.0 → 1.9.0-dev.1
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.
- package/dist/Breadcrumb/Breadcrumb.cjs +1 -0
- package/dist/Breadcrumb/Breadcrumb.cjs.map +1 -1
- package/dist/Breadcrumb/Breadcrumb.js +1 -0
- package/dist/Breadcrumb/Breadcrumb.js.map +1 -1
- package/dist/Button/Button.cjs +4 -4
- package/dist/Button/Button.cjs.map +1 -1
- package/dist/Button/Button.d.ts +1 -1
- package/dist/Button/Button.js +4 -4
- package/dist/Button/Button.js.map +1 -1
- package/dist/Button/DualFunctionButton.cjs +1 -1
- package/dist/Button/DualFunctionButton.cjs.map +1 -1
- package/dist/Button/DualFunctionButton.js +1 -1
- package/dist/Button/DualFunctionButton.js.map +1 -1
- package/dist/Button/Iconbutton.cjs +8 -2
- package/dist/Button/Iconbutton.cjs.map +1 -1
- package/dist/Button/Iconbutton.d.ts +3 -0
- package/dist/Button/Iconbutton.js +8 -2
- package/dist/Button/Iconbutton.js.map +1 -1
- package/dist/Chips/ChipStyles.cjs +1 -1
- package/dist/Chips/ChipStyles.cjs.map +1 -1
- package/dist/Chips/ChipStyles.js +1 -1
- package/dist/Chips/ChipStyles.js.map +1 -1
- package/dist/Chips/ChipTypes.d.ts +3 -3
- package/dist/Chips/ChoiceChips.cjs +1 -1
- package/dist/Chips/ChoiceChips.cjs.map +1 -1
- package/dist/Chips/ChoiceChips.js +1 -1
- package/dist/Chips/ChoiceChips.js.map +1 -1
- package/dist/Chips/FilterChip.cjs +2 -2
- package/dist/Chips/FilterChip.cjs.map +1 -1
- package/dist/Chips/FilterChip.js +2 -2
- package/dist/Chips/FilterChip.js.map +1 -1
- package/dist/Chips/InputChip.cjs.map +1 -1
- package/dist/Chips/InputChip.js +1 -1
- package/dist/Chips/InputChip.js.map +1 -1
- package/dist/ChipsInput/ChipDropdownInput.cjs +5 -6
- package/dist/ChipsInput/ChipDropdownInput.cjs.map +1 -1
- package/dist/ChipsInput/ChipDropdownInput.d.ts +0 -1
- package/dist/ChipsInput/ChipDropdownInput.js +6 -7
- package/dist/ChipsInput/ChipDropdownInput.js.map +1 -1
- package/dist/ChipsInput/ChipInput.cjs +0 -2
- package/dist/ChipsInput/ChipInput.cjs.map +1 -1
- package/dist/ChipsInput/ChipInput.js +0 -2
- package/dist/ChipsInput/ChipInput.js.map +1 -1
- package/dist/ChipsInput/ChipInputField.cjs +11 -18
- package/dist/ChipsInput/ChipInputField.cjs.map +1 -1
- package/dist/ChipsInput/ChipInputField.d.ts +1 -1
- package/dist/ChipsInput/ChipInputField.js +13 -20
- package/dist/ChipsInput/ChipInputField.js.map +1 -1
- package/dist/ChipsInput/ChipInputTypes.d.ts +1 -1
- package/dist/Dropdown/BasicDropdown.cjs +9 -11
- package/dist/Dropdown/BasicDropdown.cjs.map +1 -1
- package/dist/Dropdown/BasicDropdown.d.ts +2 -2
- package/dist/Dropdown/BasicDropdown.js +10 -12
- package/dist/Dropdown/BasicDropdown.js.map +1 -1
- package/dist/Dropdown/CommonStyling.cjs +25 -13
- package/dist/Dropdown/CommonStyling.cjs.map +1 -1
- package/dist/Dropdown/CommonStyling.d.ts +7 -6
- package/dist/Dropdown/CommonStyling.js +11 -11
- package/dist/Dropdown/CommonStyling.js.map +1 -1
- package/dist/Dropdown/DropdownButton.cjs +76 -18
- package/dist/Dropdown/DropdownButton.cjs.map +1 -1
- package/dist/Dropdown/DropdownButton.d.ts +1 -1
- package/dist/Dropdown/DropdownButton.js +73 -19
- package/dist/Dropdown/DropdownButton.js.map +1 -1
- package/dist/Dropdown/DropdownButtonTypes.d.ts +16 -5
- package/dist/Dropdown/DropdownFilter.cjs +93 -151
- package/dist/Dropdown/DropdownFilter.cjs.map +1 -1
- package/dist/Dropdown/DropdownFilter.d.ts +9 -15
- package/dist/Dropdown/DropdownFilter.js +94 -152
- package/dist/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs +107 -176
- package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs.map +1 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.d.ts +13 -27
- package/dist/GlobalNavigationBar/GlobalNavigationBar.js +106 -176
- package/dist/GlobalNavigationBar/GlobalNavigationBar.js.map +1 -1
- package/dist/GlobalNavigationBar/Logo.cjs +3 -5
- package/dist/GlobalNavigationBar/Logo.cjs.map +1 -1
- package/dist/GlobalNavigationBar/Logo.js +1 -1
- package/dist/GlobalNavigationBar/Logo.js.map +1 -1
- package/dist/GlobalNavigationBar/NavigationHelper.cjs +38 -0
- package/dist/GlobalNavigationBar/NavigationHelper.cjs.map +1 -0
- package/dist/GlobalNavigationBar/NavigationHelper.d.ts +4 -0
- package/dist/GlobalNavigationBar/NavigationHelper.js +27 -0
- package/dist/GlobalNavigationBar/NavigationHelper.js.map +1 -0
- package/dist/GlobalNavigationBar/desktop/DesktopActions.cjs +129 -0
- package/dist/GlobalNavigationBar/desktop/DesktopActions.cjs.map +1 -0
- package/dist/GlobalNavigationBar/desktop/DesktopActions.d.ts +15 -0
- package/dist/GlobalNavigationBar/desktop/DesktopActions.js +99 -0
- package/dist/GlobalNavigationBar/desktop/DesktopActions.js.map +1 -0
- package/dist/GlobalNavigationBar/{ExtendedMainMenu.cjs → desktop/ExtendedMainMenu.cjs} +7 -9
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.cjs.map +1 -0
- package/dist/GlobalNavigationBar/{ExtendedMainMenu.d.ts → desktop/ExtendedMainMenu.d.ts} +2 -2
- package/dist/GlobalNavigationBar/{ExtendedMainMenu.js → desktop/ExtendedMainMenu.js} +6 -6
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.js.map +1 -0
- package/dist/GlobalNavigationBar/{MainMenu.cjs → desktop/MainMenu.cjs} +17 -21
- package/dist/GlobalNavigationBar/desktop/MainMenu.cjs.map +1 -0
- package/dist/GlobalNavigationBar/desktop/MainMenu.d.ts +8 -0
- package/dist/GlobalNavigationBar/{MainMenu.js → desktop/MainMenu.js} +17 -21
- package/dist/GlobalNavigationBar/desktop/MainMenu.js.map +1 -0
- package/dist/GlobalNavigationBar/{RightSideNav.cjs → desktop/RightSideNav.cjs} +22 -26
- package/dist/GlobalNavigationBar/desktop/RightSideNav.cjs.map +1 -0
- package/dist/GlobalNavigationBar/desktop/RightSideNav.d.ts +8 -0
- package/dist/GlobalNavigationBar/desktop/RightSideNav.js +59 -0
- package/dist/GlobalNavigationBar/desktop/RightSideNav.js.map +1 -0
- package/dist/GlobalNavigationBar/desktop/UserMenu.cjs +204 -0
- package/dist/GlobalNavigationBar/desktop/UserMenu.cjs.map +1 -0
- package/dist/GlobalNavigationBar/desktop/UserMenu.d.ts +7 -0
- package/dist/GlobalNavigationBar/desktop/UserMenu.js +163 -0
- package/dist/GlobalNavigationBar/desktop/UserMenu.js.map +1 -0
- package/dist/GlobalNavigationBar/index.cjs +15 -18
- package/dist/GlobalNavigationBar/index.cjs.map +1 -1
- package/dist/GlobalNavigationBar/index.d.ts +2 -2
- package/dist/GlobalNavigationBar/index.js +2 -2
- package/dist/GlobalNavigationBar/index.js.map +1 -1
- package/dist/GlobalNavigationBar/mobile/CommonStyles.cjs +15 -21
- package/dist/GlobalNavigationBar/mobile/CommonStyles.cjs.map +1 -1
- package/dist/GlobalNavigationBar/mobile/CommonStyles.d.ts +3 -6
- package/dist/GlobalNavigationBar/mobile/CommonStyles.js +14 -15
- package/dist/GlobalNavigationBar/mobile/CommonStyles.js.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs +117 -221
- package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenu.d.ts +6 -25
- package/dist/GlobalNavigationBar/mobile/MobileMenu.js +116 -216
- package/dist/GlobalNavigationBar/mobile/MobileMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenuContent.cjs +221 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenuContent.cjs.map +1 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenuContent.d.ts +11 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenuContent.js +184 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenuContent.js.map +1 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenuHeader.cjs +160 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenuHeader.cjs.map +1 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenuHeader.d.ts +12 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenuHeader.js +139 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenuHeader.js.map +1 -0
- package/dist/GlobalNavigationBar/types.cjs +6 -0
- package/dist/GlobalNavigationBar/types.cjs.map +1 -0
- package/dist/GlobalNavigationBar/types.d.ts +120 -0
- package/dist/GlobalNavigationBar/types.js +2 -0
- package/dist/GlobalNavigationBar/types.js.map +1 -0
- package/dist/InputFields/Checkbox.cjs +10 -10
- package/dist/InputFields/Checkbox.cjs.map +1 -1
- package/dist/InputFields/Checkbox.d.ts +3 -3
- package/dist/InputFields/Checkbox.js +10 -10
- package/dist/InputFields/Checkbox.js.map +1 -1
- package/dist/InputFields/DatepickerField.cjs +26 -38
- package/dist/InputFields/DatepickerField.cjs.map +1 -1
- package/dist/InputFields/DatepickerField.d.ts +3 -3
- package/dist/InputFields/DatepickerField.js +26 -42
- package/dist/InputFields/DatepickerField.js.map +1 -1
- package/dist/InputFields/Label.cjs +24 -14
- package/dist/InputFields/Label.cjs.map +1 -1
- package/dist/InputFields/Label.js +24 -16
- package/dist/InputFields/Label.js.map +1 -1
- package/dist/InputFields/NumberField.cjs +288 -0
- package/dist/InputFields/NumberField.cjs.map +1 -0
- package/dist/InputFields/NumberField.d.ts +21 -0
- package/dist/InputFields/NumberField.js +252 -0
- package/dist/InputFields/NumberField.js.map +1 -0
- package/dist/InputFields/PasswordField.cjs +23 -18
- package/dist/InputFields/PasswordField.cjs.map +1 -1
- package/dist/InputFields/PasswordField.d.ts +2 -3
- package/dist/InputFields/PasswordField.js +21 -16
- package/dist/InputFields/PasswordField.js.map +1 -1
- package/dist/InputFields/QuickSearch.cjs +2 -3
- package/dist/InputFields/QuickSearch.cjs.map +1 -1
- package/dist/InputFields/QuickSearch.js +2 -3
- package/dist/InputFields/QuickSearch.js.map +1 -1
- package/dist/InputFields/RadioButton.cjs +5 -7
- package/dist/InputFields/RadioButton.cjs.map +1 -1
- package/dist/InputFields/RadioButton.d.ts +1 -1
- package/dist/InputFields/RadioButton.js +5 -5
- package/dist/InputFields/RadioButton.js.map +1 -1
- package/dist/InputFields/SearchBar.cjs +2 -2
- package/dist/InputFields/SearchBar.cjs.map +1 -1
- package/dist/InputFields/SearchBar.js +3 -3
- package/dist/InputFields/SearchBar.js.map +1 -1
- package/dist/InputFields/TextField.cjs +35 -40
- package/dist/InputFields/TextField.cjs.map +1 -1
- package/dist/InputFields/TextField.d.ts +6 -6
- package/dist/InputFields/TextField.js +35 -41
- package/dist/InputFields/TextField.js.map +1 -1
- package/dist/InputFields/Textarea.cjs +26 -31
- package/dist/InputFields/Textarea.cjs.map +1 -1
- package/dist/InputFields/Textarea.d.ts +1 -12
- package/dist/InputFields/Textarea.js +31 -33
- package/dist/InputFields/Textarea.js.map +1 -1
- package/dist/InputFields/components/SearchBarInput.cjs +1 -1
- package/dist/InputFields/components/SearchBarInput.cjs.map +1 -1
- package/dist/InputFields/components/SearchBarInput.js +1 -1
- package/dist/InputFields/components/SearchBarInput.js.map +1 -1
- package/dist/InputFields/components/SearchField.cjs +1 -3
- package/dist/InputFields/components/SearchField.cjs.map +1 -1
- package/dist/InputFields/components/SearchField.js +1 -2
- package/dist/InputFields/components/SearchField.js.map +1 -1
- package/dist/InputFields/index.cjs +8 -0
- package/dist/InputFields/index.cjs.map +1 -1
- package/dist/InputFields/index.d.ts +2 -1
- package/dist/InputFields/index.js +2 -1
- package/dist/InputFields/index.js.map +1 -1
- package/dist/InputFields/styling.cjs +22 -28
- package/dist/InputFields/styling.cjs.map +1 -1
- package/dist/InputFields/styling.d.ts +7 -7
- package/dist/InputFields/styling.js +19 -23
- package/dist/InputFields/styling.js.map +1 -1
- package/dist/InputFields/types.cjs +6 -0
- package/dist/InputFields/types.cjs.map +1 -0
- package/dist/InputFields/types.d.ts +38 -0
- package/dist/InputFields/types.js +2 -0
- package/dist/InputFields/types.js.map +1 -0
- package/dist/List/ListRow.cjs +1 -0
- package/dist/List/ListRow.cjs.map +1 -1
- package/dist/List/ListRow.js +1 -0
- package/dist/List/ListRow.js.map +1 -1
- package/dist/MenuItem/MenuItem.cjs +26 -11
- package/dist/MenuItem/MenuItem.cjs.map +1 -1
- package/dist/MenuItem/MenuItem.d.ts +6 -4
- package/dist/MenuItem/MenuItem.js +26 -11
- package/dist/MenuItem/MenuItem.js.map +1 -1
- package/dist/MenuItem/index.cjs.map +1 -1
- package/dist/MenuItem/index.js.map +1 -1
- package/dist/Modals/ModalNote.cjs +1 -1
- package/dist/Modals/ModalNote.cjs.map +1 -1
- package/dist/Modals/ModalNote.js +2 -2
- package/dist/Modals/ModalNote.js.map +1 -1
- package/dist/Popover/Popover.cjs +267 -0
- package/dist/Popover/Popover.cjs.map +1 -0
- package/dist/Popover/Popover.d.ts +26 -0
- package/dist/Popover/Popover.js +231 -0
- package/dist/Popover/Popover.js.map +1 -0
- package/dist/Popover/index.cjs +16 -0
- package/dist/Popover/index.cjs.map +1 -0
- package/dist/Popover/index.d.ts +1 -0
- package/dist/Popover/index.js +2 -0
- package/dist/Popover/index.js.map +1 -0
- package/dist/ProfileButton/ProfileButton.cjs +105 -0
- package/dist/ProfileButton/ProfileButton.cjs.map +1 -0
- package/dist/ProfileButton/ProfileButton.d.ts +14 -0
- package/dist/ProfileButton/ProfileButton.js +79 -0
- package/dist/ProfileButton/ProfileButton.js.map +1 -0
- package/dist/ProfileButton/index.cjs +16 -0
- package/dist/ProfileButton/index.cjs.map +1 -0
- package/dist/ProfileButton/index.d.ts +1 -0
- package/dist/ProfileButton/index.js +2 -0
- package/dist/ProfileButton/index.js.map +1 -0
- package/dist/QuizButton/QuizButton.cjs +1 -1
- package/dist/QuizButton/QuizButton.cjs.map +1 -1
- package/dist/QuizButton/QuizButton.js +1 -1
- package/dist/QuizButton/QuizButton.js.map +1 -1
- package/dist/Switcher/MobileSwitcherMenu.cjs +24 -78
- package/dist/Switcher/MobileSwitcherMenu.cjs.map +1 -1
- package/dist/Switcher/MobileSwitcherMenu.d.ts +6 -5
- package/dist/Switcher/MobileSwitcherMenu.js +26 -70
- package/dist/Switcher/MobileSwitcherMenu.js.map +1 -1
- package/dist/Table/Table.cjs +22 -22
- package/dist/Table/Table.cjs.map +1 -1
- package/dist/Table/Table.js +22 -22
- package/dist/Table/Table.js.map +1 -1
- package/dist/Table/TableBody.cjs +1 -1
- package/dist/Table/TableBody.cjs.map +1 -1
- package/dist/Table/TableBody.js +1 -1
- package/dist/Table/TableBody.js.map +1 -1
- package/dist/Table/TableFooter.cjs +12 -14
- package/dist/Table/TableFooter.cjs.map +1 -1
- package/dist/Table/TableFooter.js +13 -15
- package/dist/Table/TableFooter.js.map +1 -1
- package/dist/Table/TableHeaders.cjs +1 -0
- package/dist/Table/TableHeaders.cjs.map +1 -1
- package/dist/Table/TableHeaders.js +1 -0
- package/dist/Table/TableHeaders.js.map +1 -1
- package/dist/Tabs/TabLink.cjs +2 -3
- package/dist/Tabs/TabLink.cjs.map +1 -1
- package/dist/Tabs/TabLink.d.ts +1 -2
- package/dist/Tabs/TabLink.js +2 -3
- package/dist/Tabs/TabLink.js.map +1 -1
- package/dist/Tile/Tile.cjs +61 -0
- package/dist/Tile/Tile.cjs.map +1 -0
- package/dist/Tile/Tile.d.ts +4 -0
- package/dist/Tile/Tile.js +43 -0
- package/dist/Tile/Tile.js.map +1 -0
- package/dist/Tile/TileBody.cjs +37 -0
- package/dist/Tile/TileBody.cjs.map +1 -0
- package/dist/Tile/TileBody.d.ts +6 -0
- package/dist/Tile/TileBody.js +22 -0
- package/dist/Tile/TileBody.js.map +1 -0
- package/dist/Tile/TileCommonItems.cjs +165 -0
- package/dist/Tile/TileCommonItems.cjs.map +1 -0
- package/dist/Tile/TileCommonItems.d.ts +9 -0
- package/dist/Tile/TileCommonItems.js +126 -0
- package/dist/Tile/TileCommonItems.js.map +1 -0
- package/dist/Tile/TileFooter.cjs +48 -0
- package/dist/Tile/TileFooter.cjs.map +1 -0
- package/dist/Tile/TileFooter.d.ts +7 -0
- package/dist/Tile/TileFooter.js +32 -0
- package/dist/Tile/TileFooter.js.map +1 -0
- package/dist/Tile/TileHeader.cjs +90 -0
- package/dist/Tile/TileHeader.cjs.map +1 -0
- package/dist/Tile/TileHeader.d.ts +7 -0
- package/dist/Tile/TileHeader.js +68 -0
- package/dist/Tile/TileHeader.js.map +1 -0
- package/dist/Tile/TileTypes.cjs +6 -0
- package/dist/Tile/TileTypes.cjs.map +1 -0
- package/dist/Tile/TileTypes.d.ts +57 -0
- package/dist/Tile/TileTypes.js +2 -0
- package/dist/Tile/TileTypes.js.map +1 -0
- package/dist/Tile/index.cjs +33 -0
- package/dist/Tile/index.cjs.map +1 -0
- package/dist/Tile/index.d.ts +3 -0
- package/dist/Tile/index.js +4 -0
- package/dist/Tile/index.js.map +1 -0
- package/dist/common/StackState.cjs +47 -0
- package/dist/common/StackState.cjs.map +1 -0
- package/dist/common/StackState.d.ts +7 -0
- package/dist/common/StackState.js +30 -0
- package/dist/common/StackState.js.map +1 -0
- package/dist/hooks/useClickOutside.cjs +6 -2
- package/dist/hooks/useClickOutside.cjs.map +1 -1
- package/dist/hooks/useClickOutside.d.ts +1 -1
- package/dist/hooks/useClickOutside.js +6 -2
- package/dist/hooks/useClickOutside.js.map +1 -1
- package/dist/icons/contenticons/ContentIcons.cjs +3214 -3182
- package/dist/icons/contenticons/ContentIcons.cjs.map +1 -1
- package/dist/icons/contenticons/ContentIcons.d.ts +17 -0
- package/dist/icons/contenticons/ContentIcons.js +3341 -3365
- package/dist/icons/contenticons/ContentIcons.js.map +1 -1
- package/dist/icons/index.cjs +22 -69
- package/dist/icons/index.cjs.map +1 -1
- package/dist/icons/index.d.ts +1 -4
- package/dist/icons/index.js +19 -64
- package/dist/icons/index.js.map +1 -1
- package/dist/icons/systemicons/SystemIcons.cjs +3216 -2433
- package/dist/icons/systemicons/SystemIcons.cjs.map +1 -1
- package/dist/icons/systemicons/SystemIcons.d.ts +12 -2
- package/dist/icons/systemicons/SystemIcons.js +3016 -2267
- package/dist/icons/systemicons/SystemIcons.js.map +1 -1
- package/dist/index.cjs +56 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +4 -0
- package/dist/index.js +4 -0
- package/dist/index.js.map +1 -1
- package/dist/styles/colors.cjs +1 -0
- package/dist/styles/colors.cjs.map +1 -1
- package/dist/styles/colors.d.ts +1 -0
- package/dist/styles/colors.js +1 -0
- package/dist/styles/colors.js.map +1 -1
- package/dist/styles/z-indexes.cjs +2 -1
- package/dist/styles/z-indexes.cjs.map +1 -1
- package/dist/styles/z-indexes.d.ts +1 -0
- package/dist/styles/z-indexes.js +2 -1
- package/dist/styles/z-indexes.js.map +1 -1
- package/dist/types.cjs +20 -1
- package/dist/types.cjs.map +1 -1
- package/dist/types.d.ts +10 -31
- package/dist/types.js +17 -0
- package/dist/types.js.map +1 -1
- package/package.json +13 -9
- package/dist/GlobalNavigationBar/Actions.cjs +0 -185
- package/dist/GlobalNavigationBar/Actions.cjs.map +0 -1
- package/dist/GlobalNavigationBar/Actions.d.ts +0 -13
- package/dist/GlobalNavigationBar/Actions.js +0 -160
- package/dist/GlobalNavigationBar/Actions.js.map +0 -1
- package/dist/GlobalNavigationBar/Avatar.cjs +0 -104
- package/dist/GlobalNavigationBar/Avatar.cjs.map +0 -1
- package/dist/GlobalNavigationBar/Avatar.d.ts +0 -15
- package/dist/GlobalNavigationBar/Avatar.js +0 -77
- package/dist/GlobalNavigationBar/Avatar.js.map +0 -1
- package/dist/GlobalNavigationBar/ExtendedMainMenu.cjs.map +0 -1
- package/dist/GlobalNavigationBar/ExtendedMainMenu.js.map +0 -1
- package/dist/GlobalNavigationBar/MainMenu.cjs.map +0 -1
- package/dist/GlobalNavigationBar/MainMenu.d.ts +0 -8
- package/dist/GlobalNavigationBar/MainMenu.js.map +0 -1
- package/dist/GlobalNavigationBar/RightSideNav.cjs.map +0 -1
- package/dist/GlobalNavigationBar/RightSideNav.d.ts +0 -8
- package/dist/GlobalNavigationBar/RightSideNav.js +0 -61
- package/dist/GlobalNavigationBar/RightSideNav.js.map +0 -1
- package/dist/GlobalNavigationBar/UserMenu/MenuLink.cjs +0 -112
- package/dist/GlobalNavigationBar/UserMenu/MenuLink.cjs.map +0 -1
- package/dist/GlobalNavigationBar/UserMenu/MenuLink.d.ts +0 -11
- package/dist/GlobalNavigationBar/UserMenu/MenuLink.js +0 -86
- package/dist/GlobalNavigationBar/UserMenu/MenuLink.js.map +0 -1
- package/dist/GlobalNavigationBar/UserMenu/MobileUserMenu.cjs +0 -178
- package/dist/GlobalNavigationBar/UserMenu/MobileUserMenu.cjs.map +0 -1
- package/dist/GlobalNavigationBar/UserMenu/MobileUserMenu.d.ts +0 -16
- package/dist/GlobalNavigationBar/UserMenu/MobileUserMenu.js +0 -146
- package/dist/GlobalNavigationBar/UserMenu/MobileUserMenu.js.map +0 -1
- package/dist/GlobalNavigationBar/UserMenu/UserMenu.cjs +0 -168
- package/dist/GlobalNavigationBar/UserMenu/UserMenu.cjs.map +0 -1
- package/dist/GlobalNavigationBar/UserMenu/UserMenu.d.ts +0 -15
- package/dist/GlobalNavigationBar/UserMenu/UserMenu.js +0 -135
- package/dist/GlobalNavigationBar/UserMenu/UserMenu.js.map +0 -1
- package/dist/GlobalNavigationBar/mobile/ExitMenuButton.cjs +0 -49
- package/dist/GlobalNavigationBar/mobile/ExitMenuButton.cjs.map +0 -1
- package/dist/GlobalNavigationBar/mobile/ExitMenuButton.d.ts +0 -6
- package/dist/GlobalNavigationBar/mobile/ExitMenuButton.js +0 -27
- package/dist/GlobalNavigationBar/mobile/ExitMenuButton.js.map +0 -1
- package/dist/GlobalNavigationBar/mobile/MobileActionMenu.cjs +0 -91
- package/dist/GlobalNavigationBar/mobile/MobileActionMenu.cjs.map +0 -1
- package/dist/GlobalNavigationBar/mobile/MobileActionMenu.d.ts +0 -13
- package/dist/GlobalNavigationBar/mobile/MobileActionMenu.js +0 -70
- package/dist/GlobalNavigationBar/mobile/MobileActionMenu.js.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/UserMenu/MobileUserMenu.tsx"],"names":["Menu","styled","ul","COLORS","white","flowDown","Z_INDEXES","fixed_menu","BREAKPOINTS","SMALL","Size","Small","MenuSection","li","MenuSectionList","UserMenuSectionListStyling","Top","div","neutral_600","ComponentTextStyle","Regular","LabelLine","span","neutral_20","StyledMenulink","MenuLink","MobileUserMenu","accountMenuHeader","firstName","lastName","email","organizationName","clickMenuAction","accountSection","organizationSection","supportSection","signOut","signOutLabel","React","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","length","map","element","to","label","isExternal","display","margin","width","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, scrollBarStyling} from '../../styles';\n\nimport MenuLink from './MenuLink';\nimport {Size, UserMenuItem} from '../../types';\nimport {Button, IconButton} from '../../Button';\nimport {ArrowLineLeft, Close} from '../../icons/systemicons/SystemIcons';\nimport {flowDown, Right, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {ComponentSStyling} from '../../styles/typography';\nimport {Z_INDEXES} from '../../styles/z-indexes';\n\nconst Menu = styled.ul`\n list-style: none;\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n -webkit-animation: ${flowDown} 0.2s ease-in-out;\n animation: ${flowDown} 0.2s ease-in-out;\n position: absolute;\n border-radius: 4px;\n z-index: ${Z_INDEXES.fixed_menu};\n height: 100%;\n width: 320px;\n padding-inline-start: 0;\n overflow-y: scroll;\n ${BREAKPOINTS.SMALL} {\n min-width: 360px;\n }\n\n .open & {\n display: flex;\n flex-direction: column;\n }\n\n .signOutButton {\n height: 40px !important;\n width: 288px !important;\n\n ${BREAKPOINTS.SMALL} {\n width: 328px !important;\n }\n }\n\n ${scrollBarStyling(Size.Small)};\n`;\n\nconst MenuSection = styled.li`\n padding: 8px 0;\n position: relative;\n\n .disabled-link {\n color: #21212150;\n pointer-events: none;\n key-events: none;\n }\n`;\n\nconst MenuSectionList = styled.ul`\n list-style: none;\n margin: 0;\n overflow-y: unset !important;\n padding-inline-start: 0;\n ${UserMenuSectionListStyling};\n`;\n\nconst Top = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 22px 12px 0 12px;\n color: ${COLORS.neutral_600};\n\n h3 {\n margin-block-start: 0 !important;\n margin-block-end: 0 !important;\n margin-inline-start: 0;\n margin-inline-end: 0;\n margin-left: 24px;\n\n ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\n }\n`;\n\nconst LabelLine = styled.span`\n height: 32px;\n background-color: ${COLORS.neutral_20};\n padding-left: 24px;\n display: flex;\n line-height: 32px;\n`;\n\nconst StyledMenulink = styled(MenuLink)`\n width: 100%;\n height: 48px;\n margin: 0;\n \n & a {\n height: 100%;\n }\n`;\n\ninterface Props {\n accountMenuHeader: string;\n firstName: string;\n lastName: string;\n email: string;\n organizationName: string;\n clickMenuAction: () => void;\n accountSection?: UserMenuItem[];\n organizationSection?: UserMenuItem[];\n supportSection?: UserMenuItem[];\n signOut?: (e: any) => void;\n signOutLabel?: string;\n}\n\nconst MobileUserMenu = ({\n accountMenuHeader,\n firstName,\n lastName,\n email,\n organizationName,\n clickMenuAction,\n accountSection,\n organizationSection,\n supportSection,\n signOut,\n signOutLabel,\n}: Props) => {\n React.useEffect(() => {\n function handleKeyPress(e: any) {\n if (e.keyCode === 27) {\n clickMenuAction();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [clickMenuAction]);\n\n return (\n <Menu onClick={() => {}} role=\"menu\" aria-labelledby=\"UserMenuButton\">\n <Top key=\"MobileUserMenuTopSection\">\n <IconButton variant=\"secondary\" shape=\"circular\" action={clickMenuAction} isInMobileMenu={true}>\n <ArrowLineLeft size=\"24px\" color={COLORS.neutral_600} />\n </IconButton>\n <h3>{accountMenuHeader}</h3>\n <Right>\n <IconButton variant=\"secondary\" shape=\"circular\" action={clickMenuAction} isInMobileMenu={true}>\n <Close size=\"24px\" />\n </IconButton>\n </Right>\n </Top>\n {accountSection && accountSection?.length > 0 && (\n <MenuSection key=\"MobileAccountSection\">\n <LabelLine data-hj-suppress>{`${firstName} ${lastName}`}</LabelLine>\n <MenuSectionList>\n {accountSection?.map((element) => (\n <StyledMenulink key={element?.to} to={element?.to} menuText={element?.label} />\n ))}\n </MenuSectionList>\n </MenuSection>\n )}\n {organizationSection && organizationSection?.length > 0 && (\n <MenuSection key=\"MObileOrganizationSection\">\n <LabelLine>{organizationName || ''}</LabelLine>\n <MenuSectionList>\n {organizationSection?.map((element) => (\n <StyledMenulink key={element?.to} to={element?.to} menuText={element?.label} />\n ))}\n </MenuSectionList>\n </MenuSection>\n )}\n\n {supportSection && supportSection?.length > 0 && (\n <MenuSection key=\"MobileSupportSection\">\n <LabelLine>{''}</LabelLine>\n <MenuSectionList>\n {supportSection?.map((element) => (\n <StyledMenulink key={element?.to} isExternal={element.isExternal} to={element?.to} menuText={element?.label} />\n ))}\n </MenuSectionList>\n </MenuSection>\n )}\n {signOut && (\n <div key=\"SignoutButton\" style={{ display: 'flex', margin: 'auto 0 12px 0' }}>\n <Button\n style={{ width: '90%', margin: '0 auto' }}\n variant=\"secondary\"\n onClick={(e) => {\n e.preventDefault();\n signOut(e);\n }}>\n {signOutLabel}\n </Button>\n </div>\n )}\n </Menu>\n );\n};\n\nexport default MobileUserMenu;\n"],"file":"MobileUserMenu.cjs"}
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { UserMenuItem } from '../../types';
|
|
2
|
-
interface Props {
|
|
3
|
-
accountMenuHeader: string;
|
|
4
|
-
firstName: string;
|
|
5
|
-
lastName: string;
|
|
6
|
-
email: string;
|
|
7
|
-
organizationName: string;
|
|
8
|
-
clickMenuAction: () => void;
|
|
9
|
-
accountSection?: UserMenuItem[];
|
|
10
|
-
organizationSection?: UserMenuItem[];
|
|
11
|
-
supportSection?: UserMenuItem[];
|
|
12
|
-
signOut?: (e: any) => void;
|
|
13
|
-
signOutLabel?: string;
|
|
14
|
-
}
|
|
15
|
-
declare const MobileUserMenu: ({ accountMenuHeader, firstName, lastName, email, organizationName, clickMenuAction, accountSection, organizationSection, supportSection, signOut, signOutLabel, }: Props) => JSX.Element;
|
|
16
|
-
export default MobileUserMenu;
|
|
@@ -1,146 +0,0 @@
|
|
|
1
|
-
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
2
|
-
import _pt from "prop-types";
|
|
3
|
-
|
|
4
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
|
|
5
|
-
|
|
6
|
-
import * as React from 'react';
|
|
7
|
-
import styled from 'styled-components';
|
|
8
|
-
import { BREAKPOINTS, COLORS, ComponentTextStyle, scrollBarStyling } from '../../styles';
|
|
9
|
-
import MenuLink from './MenuLink';
|
|
10
|
-
import { Size } from '../../types';
|
|
11
|
-
import { Button, IconButton } from '../../Button';
|
|
12
|
-
import { ArrowLineLeft, Close } from '../../icons/systemicons/SystemIcons';
|
|
13
|
-
import { flowDown, Right, UserMenuSectionListStyling } from '../mobile/CommonStyles';
|
|
14
|
-
import { ComponentSStyling } from '../../styles/typography';
|
|
15
|
-
import { Z_INDEXES } from '../../styles/z-indexes';
|
|
16
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
17
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
18
|
-
var Menu = styled.ul(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n list-style: none;\n margin: 0;\n background-color: ", ";\n box-sizing: border-box;\n display: none;\n -webkit-animation: ", " 0.2s ease-in-out;\n animation: ", " 0.2s ease-in-out;\n position: absolute;\n border-radius: 4px;\n z-index: ", ";\n height: 100%;\n width: 320px;\n padding-inline-start: 0;\n overflow-y: scroll;\n ", " {\n min-width: 360px;\n }\n\n .open & {\n display: flex;\n flex-direction: column;\n }\n\n .signOutButton {\n height: 40px !important;\n width: 288px !important;\n\n ", " {\n width: 328px !important;\n }\n }\n\n ", ";\n"])), COLORS.white, flowDown, flowDown, Z_INDEXES.fixed_menu, BREAKPOINTS.SMALL, BREAKPOINTS.SMALL, scrollBarStyling(Size.Small));
|
|
19
|
-
var MenuSection = styled.li(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n padding: 8px 0;\n position: relative;\n\n .disabled-link {\n color: #21212150;\n pointer-events: none;\n key-events: none;\n }\n"])));
|
|
20
|
-
var MenuSectionList = styled.ul(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n list-style: none;\n margin: 0;\n overflow-y: unset !important;\n padding-inline-start: 0;\n ", ";\n"])), UserMenuSectionListStyling);
|
|
21
|
-
var Top = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 22px 12px 0 12px;\n color: ", ";\n\n h3 {\n margin-block-start: 0 !important;\n margin-block-end: 0 !important;\n margin-inline-start: 0;\n margin-inline-end: 0;\n margin-left: 24px;\n\n ", "\n }\n"])), COLORS.neutral_600, ComponentSStyling(ComponentTextStyle.Regular, 'inherit'));
|
|
22
|
-
var LabelLine = styled.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n height: 32px;\n background-color: ", ";\n padding-left: 24px;\n display: flex;\n line-height: 32px;\n"])), COLORS.neutral_20);
|
|
23
|
-
var StyledMenulink = styled(MenuLink)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n width: 100%;\n height: 48px;\n margin: 0;\n \n & a {\n height: 100%;\n }\n"])));
|
|
24
|
-
|
|
25
|
-
var MobileUserMenu = function MobileUserMenu(_ref) {
|
|
26
|
-
var accountMenuHeader = _ref.accountMenuHeader,
|
|
27
|
-
firstName = _ref.firstName,
|
|
28
|
-
lastName = _ref.lastName,
|
|
29
|
-
email = _ref.email,
|
|
30
|
-
organizationName = _ref.organizationName,
|
|
31
|
-
clickMenuAction = _ref.clickMenuAction,
|
|
32
|
-
accountSection = _ref.accountSection,
|
|
33
|
-
organizationSection = _ref.organizationSection,
|
|
34
|
-
supportSection = _ref.supportSection,
|
|
35
|
-
signOut = _ref.signOut,
|
|
36
|
-
signOutLabel = _ref.signOutLabel;
|
|
37
|
-
React.useEffect(function () {
|
|
38
|
-
function handleKeyPress(e) {
|
|
39
|
-
if (e.keyCode === 27) {
|
|
40
|
-
clickMenuAction();
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
document.addEventListener('keydown', handleKeyPress, false);
|
|
45
|
-
return function () {
|
|
46
|
-
document.removeEventListener('keydown', handleKeyPress, false);
|
|
47
|
-
};
|
|
48
|
-
}, [clickMenuAction]);
|
|
49
|
-
return /*#__PURE__*/_jsxs(Menu, {
|
|
50
|
-
onClick: function onClick() {},
|
|
51
|
-
role: "menu",
|
|
52
|
-
"aria-labelledby": "UserMenuButton",
|
|
53
|
-
children: [/*#__PURE__*/_jsxs(Top, {
|
|
54
|
-
children: [/*#__PURE__*/_jsx(IconButton, {
|
|
55
|
-
variant: "secondary",
|
|
56
|
-
shape: "circular",
|
|
57
|
-
action: clickMenuAction,
|
|
58
|
-
isInMobileMenu: true,
|
|
59
|
-
children: /*#__PURE__*/_jsx(ArrowLineLeft, {
|
|
60
|
-
size: "24px",
|
|
61
|
-
color: COLORS.neutral_600
|
|
62
|
-
})
|
|
63
|
-
}), /*#__PURE__*/_jsx("h3", {
|
|
64
|
-
children: accountMenuHeader
|
|
65
|
-
}), /*#__PURE__*/_jsx(Right, {
|
|
66
|
-
children: /*#__PURE__*/_jsx(IconButton, {
|
|
67
|
-
variant: "secondary",
|
|
68
|
-
shape: "circular",
|
|
69
|
-
action: clickMenuAction,
|
|
70
|
-
isInMobileMenu: true,
|
|
71
|
-
children: /*#__PURE__*/_jsx(Close, {
|
|
72
|
-
size: "24px"
|
|
73
|
-
})
|
|
74
|
-
})
|
|
75
|
-
})]
|
|
76
|
-
}, "MobileUserMenuTopSection"), accountSection && (accountSection === null || accountSection === void 0 ? void 0 : accountSection.length) > 0 && /*#__PURE__*/_jsxs(MenuSection, {
|
|
77
|
-
children: [/*#__PURE__*/_jsx(LabelLine, {
|
|
78
|
-
"data-hj-suppress": true,
|
|
79
|
-
children: "".concat(firstName, " ").concat(lastName)
|
|
80
|
-
}), /*#__PURE__*/_jsx(MenuSectionList, {
|
|
81
|
-
children: accountSection === null || accountSection === void 0 ? void 0 : accountSection.map(function (element) {
|
|
82
|
-
return /*#__PURE__*/_jsx(StyledMenulink, {
|
|
83
|
-
to: element === null || element === void 0 ? void 0 : element.to,
|
|
84
|
-
menuText: element === null || element === void 0 ? void 0 : element.label
|
|
85
|
-
}, element === null || element === void 0 ? void 0 : element.to);
|
|
86
|
-
})
|
|
87
|
-
})]
|
|
88
|
-
}, "MobileAccountSection"), organizationSection && (organizationSection === null || organizationSection === void 0 ? void 0 : organizationSection.length) > 0 && /*#__PURE__*/_jsxs(MenuSection, {
|
|
89
|
-
children: [/*#__PURE__*/_jsx(LabelLine, {
|
|
90
|
-
children: organizationName || ''
|
|
91
|
-
}), /*#__PURE__*/_jsx(MenuSectionList, {
|
|
92
|
-
children: organizationSection === null || organizationSection === void 0 ? void 0 : organizationSection.map(function (element) {
|
|
93
|
-
return /*#__PURE__*/_jsx(StyledMenulink, {
|
|
94
|
-
to: element === null || element === void 0 ? void 0 : element.to,
|
|
95
|
-
menuText: element === null || element === void 0 ? void 0 : element.label
|
|
96
|
-
}, element === null || element === void 0 ? void 0 : element.to);
|
|
97
|
-
})
|
|
98
|
-
})]
|
|
99
|
-
}, "MObileOrganizationSection"), supportSection && (supportSection === null || supportSection === void 0 ? void 0 : supportSection.length) > 0 && /*#__PURE__*/_jsxs(MenuSection, {
|
|
100
|
-
children: [/*#__PURE__*/_jsx(LabelLine, {
|
|
101
|
-
children: ''
|
|
102
|
-
}), /*#__PURE__*/_jsx(MenuSectionList, {
|
|
103
|
-
children: supportSection === null || supportSection === void 0 ? void 0 : supportSection.map(function (element) {
|
|
104
|
-
return /*#__PURE__*/_jsx(StyledMenulink, {
|
|
105
|
-
isExternal: element.isExternal,
|
|
106
|
-
to: element === null || element === void 0 ? void 0 : element.to,
|
|
107
|
-
menuText: element === null || element === void 0 ? void 0 : element.label
|
|
108
|
-
}, element === null || element === void 0 ? void 0 : element.to);
|
|
109
|
-
})
|
|
110
|
-
})]
|
|
111
|
-
}, "MobileSupportSection"), signOut && /*#__PURE__*/_jsx("div", {
|
|
112
|
-
style: {
|
|
113
|
-
display: 'flex',
|
|
114
|
-
margin: 'auto 0 12px 0'
|
|
115
|
-
},
|
|
116
|
-
children: /*#__PURE__*/_jsx(Button, {
|
|
117
|
-
style: {
|
|
118
|
-
width: '90%',
|
|
119
|
-
margin: '0 auto'
|
|
120
|
-
},
|
|
121
|
-
variant: "secondary",
|
|
122
|
-
onClick: function onClick(e) {
|
|
123
|
-
e.preventDefault();
|
|
124
|
-
signOut(e);
|
|
125
|
-
},
|
|
126
|
-
children: signOutLabel
|
|
127
|
-
})
|
|
128
|
-
}, "SignoutButton")]
|
|
129
|
-
});
|
|
130
|
-
};
|
|
131
|
-
|
|
132
|
-
MobileUserMenu.propTypes = {
|
|
133
|
-
accountMenuHeader: _pt.string.isRequired,
|
|
134
|
-
firstName: _pt.string.isRequired,
|
|
135
|
-
lastName: _pt.string.isRequired,
|
|
136
|
-
email: _pt.string.isRequired,
|
|
137
|
-
organizationName: _pt.string.isRequired,
|
|
138
|
-
clickMenuAction: _pt.func.isRequired,
|
|
139
|
-
accountSection: _pt.array,
|
|
140
|
-
organizationSection: _pt.array,
|
|
141
|
-
supportSection: _pt.array,
|
|
142
|
-
signOut: _pt.func,
|
|
143
|
-
signOutLabel: _pt.string
|
|
144
|
-
};
|
|
145
|
-
export default MobileUserMenu;
|
|
146
|
-
//# sourceMappingURL=MobileUserMenu.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/UserMenu/MobileUserMenu.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentTextStyle","scrollBarStyling","MenuLink","Size","Button","IconButton","ArrowLineLeft","Close","flowDown","Right","UserMenuSectionListStyling","ComponentSStyling","Z_INDEXES","Menu","ul","white","fixed_menu","SMALL","Small","MenuSection","li","MenuSectionList","Top","div","neutral_600","Regular","LabelLine","span","neutral_20","StyledMenulink","MobileUserMenu","accountMenuHeader","firstName","lastName","email","organizationName","clickMenuAction","accountSection","organizationSection","supportSection","signOut","signOutLabel","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","length","map","element","to","label","isExternal","display","margin","width","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, scrollBarStyling} from '../../styles';\n\nimport MenuLink from './MenuLink';\nimport {Size, UserMenuItem} from '../../types';\nimport {Button, IconButton} from '../../Button';\nimport {ArrowLineLeft, Close} from '../../icons/systemicons/SystemIcons';\nimport {flowDown, Right, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {ComponentSStyling} from '../../styles/typography';\nimport {Z_INDEXES} from '../../styles/z-indexes';\n\nconst Menu = styled.ul`\n list-style: none;\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n -webkit-animation: ${flowDown} 0.2s ease-in-out;\n animation: ${flowDown} 0.2s ease-in-out;\n position: absolute;\n border-radius: 4px;\n z-index: ${Z_INDEXES.fixed_menu};\n height: 100%;\n width: 320px;\n padding-inline-start: 0;\n overflow-y: scroll;\n ${BREAKPOINTS.SMALL} {\n min-width: 360px;\n }\n\n .open & {\n display: flex;\n flex-direction: column;\n }\n\n .signOutButton {\n height: 40px !important;\n width: 288px !important;\n\n ${BREAKPOINTS.SMALL} {\n width: 328px !important;\n }\n }\n\n ${scrollBarStyling(Size.Small)};\n`;\n\nconst MenuSection = styled.li`\n padding: 8px 0;\n position: relative;\n\n .disabled-link {\n color: #21212150;\n pointer-events: none;\n key-events: none;\n }\n`;\n\nconst MenuSectionList = styled.ul`\n list-style: none;\n margin: 0;\n overflow-y: unset !important;\n padding-inline-start: 0;\n ${UserMenuSectionListStyling};\n`;\n\nconst Top = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 22px 12px 0 12px;\n color: ${COLORS.neutral_600};\n\n h3 {\n margin-block-start: 0 !important;\n margin-block-end: 0 !important;\n margin-inline-start: 0;\n margin-inline-end: 0;\n margin-left: 24px;\n\n ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\n }\n`;\n\nconst LabelLine = styled.span`\n height: 32px;\n background-color: ${COLORS.neutral_20};\n padding-left: 24px;\n display: flex;\n line-height: 32px;\n`;\n\nconst StyledMenulink = styled(MenuLink)`\n width: 100%;\n height: 48px;\n margin: 0;\n \n & a {\n height: 100%;\n }\n`;\n\ninterface Props {\n accountMenuHeader: string;\n firstName: string;\n lastName: string;\n email: string;\n organizationName: string;\n clickMenuAction: () => void;\n accountSection?: UserMenuItem[];\n organizationSection?: UserMenuItem[];\n supportSection?: UserMenuItem[];\n signOut?: (e: any) => void;\n signOutLabel?: string;\n}\n\nconst MobileUserMenu = ({\n accountMenuHeader,\n firstName,\n lastName,\n email,\n organizationName,\n clickMenuAction,\n accountSection,\n organizationSection,\n supportSection,\n signOut,\n signOutLabel,\n}: Props) => {\n React.useEffect(() => {\n function handleKeyPress(e: any) {\n if (e.keyCode === 27) {\n clickMenuAction();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [clickMenuAction]);\n\n return (\n <Menu onClick={() => {}} role=\"menu\" aria-labelledby=\"UserMenuButton\">\n <Top key=\"MobileUserMenuTopSection\">\n <IconButton variant=\"secondary\" shape=\"circular\" action={clickMenuAction} isInMobileMenu={true}>\n <ArrowLineLeft size=\"24px\" color={COLORS.neutral_600} />\n </IconButton>\n <h3>{accountMenuHeader}</h3>\n <Right>\n <IconButton variant=\"secondary\" shape=\"circular\" action={clickMenuAction} isInMobileMenu={true}>\n <Close size=\"24px\" />\n </IconButton>\n </Right>\n </Top>\n {accountSection && accountSection?.length > 0 && (\n <MenuSection key=\"MobileAccountSection\">\n <LabelLine data-hj-suppress>{`${firstName} ${lastName}`}</LabelLine>\n <MenuSectionList>\n {accountSection?.map((element) => (\n <StyledMenulink key={element?.to} to={element?.to} menuText={element?.label} />\n ))}\n </MenuSectionList>\n </MenuSection>\n )}\n {organizationSection && organizationSection?.length > 0 && (\n <MenuSection key=\"MObileOrganizationSection\">\n <LabelLine>{organizationName || ''}</LabelLine>\n <MenuSectionList>\n {organizationSection?.map((element) => (\n <StyledMenulink key={element?.to} to={element?.to} menuText={element?.label} />\n ))}\n </MenuSectionList>\n </MenuSection>\n )}\n\n {supportSection && supportSection?.length > 0 && (\n <MenuSection key=\"MobileSupportSection\">\n <LabelLine>{''}</LabelLine>\n <MenuSectionList>\n {supportSection?.map((element) => (\n <StyledMenulink key={element?.to} isExternal={element.isExternal} to={element?.to} menuText={element?.label} />\n ))}\n </MenuSectionList>\n </MenuSection>\n )}\n {signOut && (\n <div key=\"SignoutButton\" style={{ display: 'flex', margin: 'auto 0 12px 0' }}>\n <Button\n style={{ width: '90%', margin: '0 auto' }}\n variant=\"secondary\"\n onClick={(e) => {\n e.preventDefault();\n signOut(e);\n }}>\n {signOutLabel}\n </Button>\n </div>\n )}\n </Menu>\n );\n};\n\nexport default MobileUserMenu;\n"],"file":"MobileUserMenu.js"}
|
|
@@ -1,168 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
-
|
|
7
|
-
Object.defineProperty(exports, "__esModule", {
|
|
8
|
-
value: true
|
|
9
|
-
});
|
|
10
|
-
exports.default = void 0;
|
|
11
|
-
|
|
12
|
-
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
13
|
-
|
|
14
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
15
|
-
|
|
16
|
-
var React = _interopRequireWildcard(require("react"));
|
|
17
|
-
|
|
18
|
-
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
19
|
-
|
|
20
|
-
var _Button = require("../../Button");
|
|
21
|
-
|
|
22
|
-
var _styles = require("../../styles");
|
|
23
|
-
|
|
24
|
-
var _Avatar = _interopRequireWildcard(require("../Avatar"));
|
|
25
|
-
|
|
26
|
-
var _MenuLink = _interopRequireDefault(require("./MenuLink"));
|
|
27
|
-
|
|
28
|
-
var _types = require("../../types");
|
|
29
|
-
|
|
30
|
-
var _CommonStyles = require("../mobile/CommonStyles");
|
|
31
|
-
|
|
32
|
-
var _typography = require("../../styles/typography");
|
|
33
|
-
|
|
34
|
-
var _zIndexes = require("../../styles/z-indexes");
|
|
35
|
-
|
|
36
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
37
|
-
|
|
38
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
|
|
39
|
-
|
|
40
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
41
|
-
|
|
42
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
43
|
-
|
|
44
|
-
var Menu = _styledComponents.default.ul(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n list-style: none;\n margin: 0;\n padding: 0;\n background-color: ", ";\n box-sizing: border-box;\n display: none;\n min-width: 312px;\n -webkit-animation: ", " 0.2s ease-in-out;\n animation: ", " 0.2s ease-in-out;\n position: absolute;\n box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);\n border-radius: 4px;\n border: 1px solid ", ";\n z-index: ", ";\n\n .open & {\n display: block;\n }\n \n .sign-out{\n width: 90%;\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\n margin: 8px auto 12px auto;\n }\n"])), _styles.COLORS.white, _CommonStyles.flowDown, _CommonStyles.flowDown, _styles.COLORS.neutral_200, _zIndexes.Z_INDEXES.fixed_menu);
|
|
45
|
-
|
|
46
|
-
var MenuSection = _styledComponents.default.li(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n padding: 8px 0;\n position: relative;\n\n &:not(:first-of-type)::before {\n content: '';\n position: absolute;\n background: ", ";\n height: 1px;\n top: 0;\n left: 16px;\n right: 16px;\n }\n\n .disabled-link {\n color: #21212150;\n pointer-events: none;\n key-events: none;\n }\n"])), _styles.COLORS.neutral_100);
|
|
47
|
-
|
|
48
|
-
var MenuSectionList = _styledComponents.default.ul(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n list-style: none;\n margin: 0;\n padding: 0;\n\n ", ";\n"])), _CommonStyles.UserMenuSectionListStyling);
|
|
49
|
-
|
|
50
|
-
var StyledAvatarContainer = (0, _styledComponents.default)(_Avatar.AvatarContainer)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n margin: 25px 0 0 25px;\n pointer-events: none;\n"])));
|
|
51
|
-
|
|
52
|
-
var AvatarAndName = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n\n h5 {\n margin: 28px 0 0 20px;\n ", "\n }\n span {\n margin: 0 0 0 20px;\n ", "\n }\n"])), (0, _typography.HeadlineXXSStyling)(_styles.COLORS.neutral_600), (0, _typography.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600));
|
|
53
|
-
|
|
54
|
-
var NameAndEmail = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: column;\n"])));
|
|
55
|
-
|
|
56
|
-
var OrganizationName = _styledComponents.default.span(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 25px;\n ", "\n"])), (0, _typography.ComponentXSStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.neutral_600));
|
|
57
|
-
|
|
58
|
-
var UserMenu = function UserMenu(_ref) {
|
|
59
|
-
var firstName = _ref.firstName,
|
|
60
|
-
lastName = _ref.lastName,
|
|
61
|
-
email = _ref.email,
|
|
62
|
-
organizationName = _ref.organizationName,
|
|
63
|
-
clickMenuAction = _ref.clickMenuAction,
|
|
64
|
-
accountSection = _ref.accountSection,
|
|
65
|
-
organizationSection = _ref.organizationSection,
|
|
66
|
-
supportSection = _ref.supportSection,
|
|
67
|
-
signOut = _ref.signOut,
|
|
68
|
-
signOutLabel = _ref.signOutLabel;
|
|
69
|
-
React.useEffect(function () {
|
|
70
|
-
function handleKeyPress(e) {
|
|
71
|
-
if (e.keyCode === 27) {
|
|
72
|
-
clickMenuAction();
|
|
73
|
-
}
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
document.addEventListener('keydown', handleKeyPress, false);
|
|
77
|
-
return function () {
|
|
78
|
-
document.removeEventListener('keydown', handleKeyPress, false);
|
|
79
|
-
};
|
|
80
|
-
}, [clickMenuAction]);
|
|
81
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Menu, {
|
|
82
|
-
onClick: clickMenuAction,
|
|
83
|
-
role: "menu",
|
|
84
|
-
"aria-labelledby": "UserMenuButton",
|
|
85
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(AvatarAndName, {
|
|
86
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(StyledAvatarContainer, {
|
|
87
|
-
hidePadding: true,
|
|
88
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Avatar.default, {
|
|
89
|
-
size: 48,
|
|
90
|
-
firstName: firstName,
|
|
91
|
-
lastName: lastName,
|
|
92
|
-
color: _styles.COLORS.primary_500,
|
|
93
|
-
profileMenuLink: "#TODO"
|
|
94
|
-
})
|
|
95
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(NameAndEmail, {
|
|
96
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("h5", {
|
|
97
|
-
"data-hj-suppress": true,
|
|
98
|
-
children: "".concat(firstName, " ").concat(lastName)
|
|
99
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
100
|
-
"data-hj-suppress": true,
|
|
101
|
-
children: email
|
|
102
|
-
})]
|
|
103
|
-
})]
|
|
104
|
-
}, "AvatarAndNameSection"), accountSection && (accountSection === null || accountSection === void 0 ? void 0 : accountSection.length) > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuSection, {
|
|
105
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuSectionList, {
|
|
106
|
-
children: accountSection === null || accountSection === void 0 ? void 0 : accountSection.map(function (element) {
|
|
107
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuLink.default, {
|
|
108
|
-
to: element === null || element === void 0 ? void 0 : element.to,
|
|
109
|
-
menuText: element === null || element === void 0 ? void 0 : element.label,
|
|
110
|
-
Icon: element === null || element === void 0 ? void 0 : element.icon,
|
|
111
|
-
onClick: element === null || element === void 0 ? void 0 : element.onClick
|
|
112
|
-
}, element === null || element === void 0 ? void 0 : element.to);
|
|
113
|
-
})
|
|
114
|
-
})
|
|
115
|
-
}, "MobileAccountSection"), organizationSection && (organizationSection === null || organizationSection === void 0 ? void 0 : organizationSection.length) > 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)(MenuSection, {
|
|
116
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(OrganizationName, {
|
|
117
|
-
children: organizationName || ''
|
|
118
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuSectionList, {
|
|
119
|
-
children: organizationSection === null || organizationSection === void 0 ? void 0 : organizationSection.map(function (element) {
|
|
120
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuLink.default, {
|
|
121
|
-
to: element === null || element === void 0 ? void 0 : element.to,
|
|
122
|
-
menuText: element === null || element === void 0 ? void 0 : element.label,
|
|
123
|
-
Icon: element === null || element === void 0 ? void 0 : element.icon,
|
|
124
|
-
onClick: element === null || element === void 0 ? void 0 : element.onClick
|
|
125
|
-
}, element === null || element === void 0 ? void 0 : element.to);
|
|
126
|
-
})
|
|
127
|
-
})]
|
|
128
|
-
}, "MobileOrganizationSection"), /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuSection, {
|
|
129
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(MenuSectionList, {
|
|
130
|
-
children: [supportSection === null || supportSection === void 0 ? void 0 : supportSection.map(function (element) {
|
|
131
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuLink.default, {
|
|
132
|
-
isExternal: element.isExternal,
|
|
133
|
-
to: element === null || element === void 0 ? void 0 : element.to,
|
|
134
|
-
menuText: element === null || element === void 0 ? void 0 : element.label,
|
|
135
|
-
Icon: element === null || element === void 0 ? void 0 : element.icon,
|
|
136
|
-
onClick: element === null || element === void 0 ? void 0 : element.onClick
|
|
137
|
-
}, element === null || element === void 0 ? void 0 : element.to);
|
|
138
|
-
}), signOut && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.Button, {
|
|
139
|
-
width: "90%",
|
|
140
|
-
className: "UserMenuLink sign-out",
|
|
141
|
-
variant: "secondary",
|
|
142
|
-
size: _types.Size.Large,
|
|
143
|
-
onClick: function onClick(e) {
|
|
144
|
-
e.preventDefault();
|
|
145
|
-
signOut(e);
|
|
146
|
-
},
|
|
147
|
-
children: signOutLabel
|
|
148
|
-
})]
|
|
149
|
-
})
|
|
150
|
-
}, "MobileSupportSection")]
|
|
151
|
-
});
|
|
152
|
-
};
|
|
153
|
-
|
|
154
|
-
UserMenu.propTypes = {
|
|
155
|
-
firstName: _propTypes.default.string.isRequired,
|
|
156
|
-
lastName: _propTypes.default.string.isRequired,
|
|
157
|
-
email: _propTypes.default.string.isRequired,
|
|
158
|
-
organizationName: _propTypes.default.string.isRequired,
|
|
159
|
-
clickMenuAction: _propTypes.default.func.isRequired,
|
|
160
|
-
accountSection: _propTypes.default.array,
|
|
161
|
-
organizationSection: _propTypes.default.array,
|
|
162
|
-
supportSection: _propTypes.default.array,
|
|
163
|
-
signOut: _propTypes.default.func,
|
|
164
|
-
signOutLabel: _propTypes.default.string
|
|
165
|
-
};
|
|
166
|
-
var _default = UserMenu;
|
|
167
|
-
exports.default = _default;
|
|
168
|
-
//# sourceMappingURL=UserMenu.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/UserMenu/UserMenu.tsx"],"names":["Menu","styled","ul","COLORS","white","flowDown","neutral_200","Z_INDEXES","fixed_menu","MenuSection","li","neutral_100","MenuSectionList","UserMenuSectionListStyling","StyledAvatarContainer","AvatarContainer","AvatarAndName","div","neutral_600","ComponentTextStyle","Regular","NameAndEmail","OrganizationName","span","Bold","UserMenu","firstName","lastName","email","organizationName","clickMenuAction","accountSection","organizationSection","supportSection","signOut","signOutLabel","React","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","primary_500","length","map","element","to","label","icon","onClick","isExternal","Size","Large","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {COLORS, ComponentTextStyle} from '../../styles';\nimport Avatar, {AvatarContainer} from '../Avatar';\nimport MenuLink from './MenuLink';\nimport { UserMenuItem, Size } from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {ComponentXSStyling, HeadlineXXSStyling} from '../../styles/typography';\nimport {Z_INDEXES} from '../../styles/z-indexes';\n\nconst Menu = styled.ul`\n list-style: none;\n margin: 0;\n padding: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n min-width: 312px;\n -webkit-animation: ${flowDown} 0.2s ease-in-out;\n animation: ${flowDown} 0.2s ease-in-out;\n position: absolute;\n box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);\n border-radius: 4px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n\n .open & {\n display: block;\n }\n \n .sign-out{\n width: 90%;\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\n margin: 8px auto 12px auto;\n }\n`;\n\nconst MenuSection = styled.li`\n padding: 8px 0;\n position: relative;\n\n &:not(:first-of-type)::before {\n content: '';\n position: absolute;\n background: ${COLORS.neutral_100};\n height: 1px;\n top: 0;\n left: 16px;\n right: 16px;\n }\n\n .disabled-link {\n color: #21212150;\n pointer-events: none;\n key-events: none;\n }\n`;\n\nconst MenuSectionList = styled.ul`\n list-style: none;\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\nconst StyledAvatarContainer = styled(AvatarContainer)`\n margin: 25px 0 0 25px;\n pointer-events: none;\n`;\n\nconst AvatarAndName = styled.div`\n display: flex;\n flex-direction: row;\n\n h5 {\n margin: 28px 0 0 20px;\n ${HeadlineXXSStyling(COLORS.neutral_600)}\n }\n span {\n margin: 0 0 0 20px;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n }\n`;\n\nconst NameAndEmail = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nconst OrganizationName = styled.span`\n margin-left: 25px;\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\ninterface Props {\n firstName: string;\n lastName: string;\n email: string;\n organizationName: string;\n clickMenuAction: () => void;\n accountSection?: UserMenuItem[];\n organizationSection?: UserMenuItem[];\n supportSection?: UserMenuItem[];\n signOut?: (e: any) => void;\n signOutLabel?: string;\n}\n\nconst UserMenu = ({ firstName, lastName, email, organizationName, clickMenuAction, accountSection, organizationSection, supportSection, signOut, signOutLabel }: Props) => {\n React.useEffect(() => {\n function handleKeyPress(e: any) {\n if (e.keyCode === 27) {\n clickMenuAction();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [clickMenuAction]);\n\n return (\n <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\n <AvatarAndName key=\"AvatarAndNameSection\">\n <StyledAvatarContainer hidePadding={true}>\n <Avatar size={48} firstName={firstName} lastName={lastName} color={COLORS.primary_500} profileMenuLink=\"#TODO\" />\n </StyledAvatarContainer>\n <NameAndEmail>\n <h5 data-hj-suppress>{`${firstName} ${lastName}`}</h5>\n <span data-hj-suppress>{email}</span>\n </NameAndEmail>\n </AvatarAndName>\n {accountSection && accountSection?.length > 0 && (\n <MenuSection key=\"MobileAccountSection\">\n <MenuSectionList>\n {accountSection?.map(element => (\n <MenuLink key={element?.to} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\n ))}\n </MenuSectionList>\n </MenuSection>\n )}\n\n {organizationSection && organizationSection?.length > 0 && (\n <MenuSection key=\"MobileOrganizationSection\">\n <OrganizationName>{organizationName || ''}</OrganizationName>\n <MenuSectionList>\n {organizationSection?.map(element => (\n <MenuLink key={element?.to} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\n ))}\n </MenuSectionList>\n </MenuSection>\n )}\n\n <MenuSection key=\"MobileSupportSection\">\n <MenuSectionList>\n {supportSection?.map(element => (\n <MenuLink key={element?.to} isExternal={element.isExternal} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\n ))}\n {signOut && (\n <Button\n width=\"90%\"\n className=\"UserMenuLink sign-out\"\n variant=\"secondary\"\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut(e);\n }}>\n {signOutLabel}\n </Button>\n )}\n </MenuSectionList>\n </MenuSection>\n </Menu>\n );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.cjs"}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { UserMenuItem } from '../../types';
|
|
2
|
-
interface Props {
|
|
3
|
-
firstName: string;
|
|
4
|
-
lastName: string;
|
|
5
|
-
email: string;
|
|
6
|
-
organizationName: string;
|
|
7
|
-
clickMenuAction: () => void;
|
|
8
|
-
accountSection?: UserMenuItem[];
|
|
9
|
-
organizationSection?: UserMenuItem[];
|
|
10
|
-
supportSection?: UserMenuItem[];
|
|
11
|
-
signOut?: (e: any) => void;
|
|
12
|
-
signOutLabel?: string;
|
|
13
|
-
}
|
|
14
|
-
declare const UserMenu: ({ firstName, lastName, email, organizationName, clickMenuAction, accountSection, organizationSection, supportSection, signOut, signOutLabel }: Props) => JSX.Element;
|
|
15
|
-
export default UserMenu;
|
|
@@ -1,135 +0,0 @@
|
|
|
1
|
-
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
2
|
-
import _pt from "prop-types";
|
|
3
|
-
|
|
4
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
|
|
5
|
-
|
|
6
|
-
import * as React from 'react';
|
|
7
|
-
import styled from 'styled-components';
|
|
8
|
-
import { Button } from '../../Button';
|
|
9
|
-
import { COLORS, ComponentTextStyle } from '../../styles';
|
|
10
|
-
import Avatar, { AvatarContainer } from '../Avatar';
|
|
11
|
-
import MenuLink from './MenuLink';
|
|
12
|
-
import { Size } from '../../types';
|
|
13
|
-
import { flowDown, UserMenuSectionListStyling } from '../mobile/CommonStyles';
|
|
14
|
-
import { ComponentXSStyling, HeadlineXXSStyling } from '../../styles/typography';
|
|
15
|
-
import { Z_INDEXES } from '../../styles/z-indexes';
|
|
16
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
17
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
18
|
-
var Menu = styled.ul(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n list-style: none;\n margin: 0;\n padding: 0;\n background-color: ", ";\n box-sizing: border-box;\n display: none;\n min-width: 312px;\n -webkit-animation: ", " 0.2s ease-in-out;\n animation: ", " 0.2s ease-in-out;\n position: absolute;\n box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);\n border-radius: 4px;\n border: 1px solid ", ";\n z-index: ", ";\n\n .open & {\n display: block;\n }\n \n .sign-out{\n width: 90%;\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\n margin: 8px auto 12px auto;\n }\n"])), COLORS.white, flowDown, flowDown, COLORS.neutral_200, Z_INDEXES.fixed_menu);
|
|
19
|
-
var MenuSection = styled.li(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n padding: 8px 0;\n position: relative;\n\n &:not(:first-of-type)::before {\n content: '';\n position: absolute;\n background: ", ";\n height: 1px;\n top: 0;\n left: 16px;\n right: 16px;\n }\n\n .disabled-link {\n color: #21212150;\n pointer-events: none;\n key-events: none;\n }\n"])), COLORS.neutral_100);
|
|
20
|
-
var MenuSectionList = styled.ul(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n list-style: none;\n margin: 0;\n padding: 0;\n\n ", ";\n"])), UserMenuSectionListStyling);
|
|
21
|
-
var StyledAvatarContainer = styled(AvatarContainer)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n margin: 25px 0 0 25px;\n pointer-events: none;\n"])));
|
|
22
|
-
var AvatarAndName = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n\n h5 {\n margin: 28px 0 0 20px;\n ", "\n }\n span {\n margin: 0 0 0 20px;\n ", "\n }\n"])), HeadlineXXSStyling(COLORS.neutral_600), ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600));
|
|
23
|
-
var NameAndEmail = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n"])));
|
|
24
|
-
var OrganizationName = styled.span(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n margin-left: 25px;\n ", "\n"])), ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600));
|
|
25
|
-
|
|
26
|
-
var UserMenu = function UserMenu(_ref) {
|
|
27
|
-
var firstName = _ref.firstName,
|
|
28
|
-
lastName = _ref.lastName,
|
|
29
|
-
email = _ref.email,
|
|
30
|
-
organizationName = _ref.organizationName,
|
|
31
|
-
clickMenuAction = _ref.clickMenuAction,
|
|
32
|
-
accountSection = _ref.accountSection,
|
|
33
|
-
organizationSection = _ref.organizationSection,
|
|
34
|
-
supportSection = _ref.supportSection,
|
|
35
|
-
signOut = _ref.signOut,
|
|
36
|
-
signOutLabel = _ref.signOutLabel;
|
|
37
|
-
React.useEffect(function () {
|
|
38
|
-
function handleKeyPress(e) {
|
|
39
|
-
if (e.keyCode === 27) {
|
|
40
|
-
clickMenuAction();
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
document.addEventListener('keydown', handleKeyPress, false);
|
|
45
|
-
return function () {
|
|
46
|
-
document.removeEventListener('keydown', handleKeyPress, false);
|
|
47
|
-
};
|
|
48
|
-
}, [clickMenuAction]);
|
|
49
|
-
return /*#__PURE__*/_jsxs(Menu, {
|
|
50
|
-
onClick: clickMenuAction,
|
|
51
|
-
role: "menu",
|
|
52
|
-
"aria-labelledby": "UserMenuButton",
|
|
53
|
-
children: [/*#__PURE__*/_jsxs(AvatarAndName, {
|
|
54
|
-
children: [/*#__PURE__*/_jsx(StyledAvatarContainer, {
|
|
55
|
-
hidePadding: true,
|
|
56
|
-
children: /*#__PURE__*/_jsx(Avatar, {
|
|
57
|
-
size: 48,
|
|
58
|
-
firstName: firstName,
|
|
59
|
-
lastName: lastName,
|
|
60
|
-
color: COLORS.primary_500,
|
|
61
|
-
profileMenuLink: "#TODO"
|
|
62
|
-
})
|
|
63
|
-
}), /*#__PURE__*/_jsxs(NameAndEmail, {
|
|
64
|
-
children: [/*#__PURE__*/_jsx("h5", {
|
|
65
|
-
"data-hj-suppress": true,
|
|
66
|
-
children: "".concat(firstName, " ").concat(lastName)
|
|
67
|
-
}), /*#__PURE__*/_jsx("span", {
|
|
68
|
-
"data-hj-suppress": true,
|
|
69
|
-
children: email
|
|
70
|
-
})]
|
|
71
|
-
})]
|
|
72
|
-
}, "AvatarAndNameSection"), accountSection && (accountSection === null || accountSection === void 0 ? void 0 : accountSection.length) > 0 && /*#__PURE__*/_jsx(MenuSection, {
|
|
73
|
-
children: /*#__PURE__*/_jsx(MenuSectionList, {
|
|
74
|
-
children: accountSection === null || accountSection === void 0 ? void 0 : accountSection.map(function (element) {
|
|
75
|
-
return /*#__PURE__*/_jsx(MenuLink, {
|
|
76
|
-
to: element === null || element === void 0 ? void 0 : element.to,
|
|
77
|
-
menuText: element === null || element === void 0 ? void 0 : element.label,
|
|
78
|
-
Icon: element === null || element === void 0 ? void 0 : element.icon,
|
|
79
|
-
onClick: element === null || element === void 0 ? void 0 : element.onClick
|
|
80
|
-
}, element === null || element === void 0 ? void 0 : element.to);
|
|
81
|
-
})
|
|
82
|
-
})
|
|
83
|
-
}, "MobileAccountSection"), organizationSection && (organizationSection === null || organizationSection === void 0 ? void 0 : organizationSection.length) > 0 && /*#__PURE__*/_jsxs(MenuSection, {
|
|
84
|
-
children: [/*#__PURE__*/_jsx(OrganizationName, {
|
|
85
|
-
children: organizationName || ''
|
|
86
|
-
}), /*#__PURE__*/_jsx(MenuSectionList, {
|
|
87
|
-
children: organizationSection === null || organizationSection === void 0 ? void 0 : organizationSection.map(function (element) {
|
|
88
|
-
return /*#__PURE__*/_jsx(MenuLink, {
|
|
89
|
-
to: element === null || element === void 0 ? void 0 : element.to,
|
|
90
|
-
menuText: element === null || element === void 0 ? void 0 : element.label,
|
|
91
|
-
Icon: element === null || element === void 0 ? void 0 : element.icon,
|
|
92
|
-
onClick: element === null || element === void 0 ? void 0 : element.onClick
|
|
93
|
-
}, element === null || element === void 0 ? void 0 : element.to);
|
|
94
|
-
})
|
|
95
|
-
})]
|
|
96
|
-
}, "MobileOrganizationSection"), /*#__PURE__*/_jsx(MenuSection, {
|
|
97
|
-
children: /*#__PURE__*/_jsxs(MenuSectionList, {
|
|
98
|
-
children: [supportSection === null || supportSection === void 0 ? void 0 : supportSection.map(function (element) {
|
|
99
|
-
return /*#__PURE__*/_jsx(MenuLink, {
|
|
100
|
-
isExternal: element.isExternal,
|
|
101
|
-
to: element === null || element === void 0 ? void 0 : element.to,
|
|
102
|
-
menuText: element === null || element === void 0 ? void 0 : element.label,
|
|
103
|
-
Icon: element === null || element === void 0 ? void 0 : element.icon,
|
|
104
|
-
onClick: element === null || element === void 0 ? void 0 : element.onClick
|
|
105
|
-
}, element === null || element === void 0 ? void 0 : element.to);
|
|
106
|
-
}), signOut && /*#__PURE__*/_jsx(Button, {
|
|
107
|
-
width: "90%",
|
|
108
|
-
className: "UserMenuLink sign-out",
|
|
109
|
-
variant: "secondary",
|
|
110
|
-
size: Size.Large,
|
|
111
|
-
onClick: function onClick(e) {
|
|
112
|
-
e.preventDefault();
|
|
113
|
-
signOut(e);
|
|
114
|
-
},
|
|
115
|
-
children: signOutLabel
|
|
116
|
-
})]
|
|
117
|
-
})
|
|
118
|
-
}, "MobileSupportSection")]
|
|
119
|
-
});
|
|
120
|
-
};
|
|
121
|
-
|
|
122
|
-
UserMenu.propTypes = {
|
|
123
|
-
firstName: _pt.string.isRequired,
|
|
124
|
-
lastName: _pt.string.isRequired,
|
|
125
|
-
email: _pt.string.isRequired,
|
|
126
|
-
organizationName: _pt.string.isRequired,
|
|
127
|
-
clickMenuAction: _pt.func.isRequired,
|
|
128
|
-
accountSection: _pt.array,
|
|
129
|
-
organizationSection: _pt.array,
|
|
130
|
-
supportSection: _pt.array,
|
|
131
|
-
signOut: _pt.func,
|
|
132
|
-
signOutLabel: _pt.string
|
|
133
|
-
};
|
|
134
|
-
export default UserMenu;
|
|
135
|
-
//# sourceMappingURL=UserMenu.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/UserMenu/UserMenu.tsx"],"names":["React","styled","Button","COLORS","ComponentTextStyle","Avatar","AvatarContainer","MenuLink","Size","flowDown","UserMenuSectionListStyling","ComponentXSStyling","HeadlineXXSStyling","Z_INDEXES","Menu","ul","white","neutral_200","fixed_menu","MenuSection","li","neutral_100","MenuSectionList","StyledAvatarContainer","AvatarAndName","div","neutral_600","Regular","NameAndEmail","OrganizationName","span","Bold","UserMenu","firstName","lastName","email","organizationName","clickMenuAction","accountSection","organizationSection","supportSection","signOut","signOutLabel","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","primary_500","length","map","element","to","label","icon","onClick","isExternal","Large","preventDefault"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,MAAR,QAAqB,cAArB;AACA,SAAQC,MAAR,EAAgBC,kBAAhB,QAAyC,cAAzC;AACA,OAAOC,MAAP,IAAgBC,eAAhB,QAAsC,WAAtC;AACA,OAAOC,QAAP,MAAqB,YAArB;AACA,SAAuBC,IAAvB,QAAmC,aAAnC;AACA,SAAQC,QAAR,EAAkBC,0BAAlB,QAAmD,wBAAnD;AACA,SAAQC,kBAAR,EAA4BC,kBAA5B,QAAqD,yBAArD;AACA,SAAQC,SAAR,QAAwB,wBAAxB;;;AAEA,IAAMC,IAAI,GAAGb,MAAM,CAACc,EAAV,8oBAIYZ,MAAM,CAACa,KAJnB,EAQaP,QARb,EASKA,QATL,EAaYN,MAAM,CAACc,WAbnB,EAcGJ,SAAS,CAACK,UAdb,CAAV;AA8BA,IAAMC,WAAW,GAAGlB,MAAM,CAACmB,EAAV,sYAOCjB,MAAM,CAACkB,WAPR,CAAjB;AAqBA,IAAMC,eAAe,GAAGrB,MAAM,CAACc,EAAV,uIAKjBL,0BALiB,CAArB;AAQA,IAAMa,qBAAqB,GAAGtB,MAAM,CAACK,eAAD,CAAT,4HAA3B;AAKA,IAAMkB,aAAa,GAAGvB,MAAM,CAACwB,GAAV,2NAMbb,kBAAkB,CAACT,MAAM,CAACuB,WAAR,CANL,EAUbf,kBAAkB,CAACP,kBAAkB,CAACuB,OAApB,EAA6BxB,MAAM,CAACuB,WAApC,CAVL,CAAnB;AAcA,IAAME,YAAY,GAAG3B,MAAM,CAACwB,GAAV,sHAAlB;AAKA,IAAMI,gBAAgB,GAAG5B,MAAM,CAAC6B,IAAV,wGAElBnB,kBAAkB,CAACP,kBAAkB,CAAC2B,IAApB,EAA0B5B,MAAM,CAACuB,WAAjC,CAFA,CAAtB;;AAkBA,IAAMM,QAAQ,GAAG,SAAXA,QAAW,OAA0J;AAAA,MAAvJC,SAAuJ,QAAvJA,SAAuJ;AAAA,MAA5IC,QAA4I,QAA5IA,QAA4I;AAAA,MAAlIC,KAAkI,QAAlIA,KAAkI;AAAA,MAA3HC,gBAA2H,QAA3HA,gBAA2H;AAAA,MAAzGC,eAAyG,QAAzGA,eAAyG;AAAA,MAAxFC,cAAwF,QAAxFA,cAAwF;AAAA,MAAxEC,mBAAwE,QAAxEA,mBAAwE;AAAA,MAAnDC,cAAmD,QAAnDA,cAAmD;AAAA,MAAnCC,OAAmC,QAAnCA,OAAmC;AAAA,MAA1BC,YAA0B,QAA1BA,YAA0B;AACzK1C,EAAAA,KAAK,CAAC2C,SAAN,CAAgB,YAAM;AACpB,aAASC,cAAT,CAAwBC,CAAxB,EAAgC;AAC9B,UAAIA,CAAC,CAACC,OAAF,KAAc,EAAlB,EAAsB;AACpBT,QAAAA,eAAe;AAChB;AACF;;AAEDU,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,SAA1B,EAAqCJ,cAArC,EAAqD,KAArD;AACA,WAAO,YAAM;AACXG,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,SAA7B,EAAwCL,cAAxC,EAAwD,KAAxD;AACD,KAFD;AAGD,GAXD,EAWG,CAACP,eAAD,CAXH;AAaA,sBACE,MAAC,IAAD;AAAM,IAAA,OAAO,EAAEA,eAAf;AAAgC,IAAA,IAAI,EAAC,MAArC;AAA4C,uBAAgB,gBAA5D;AAAA,4BACE,MAAC,aAAD;AAAA,8BACE,KAAC,qBAAD;AAAuB,QAAA,WAAW,EAAE,IAApC;AAAA,+BACE,KAAC,MAAD;AAAQ,UAAA,IAAI,EAAE,EAAd;AAAkB,UAAA,SAAS,EAAEJ,SAA7B;AAAwC,UAAA,QAAQ,EAAEC,QAAlD;AAA4D,UAAA,KAAK,EAAE/B,MAAM,CAAC+C,WAA1E;AAAuF,UAAA,eAAe,EAAC;AAAvG;AADF,QADF,eAIE,MAAC,YAAD;AAAA,gCACE;AAAI,kCAAJ;AAAA,8BAAyBjB,SAAzB,cAAsCC,QAAtC;AAAA,UADF,eAEE;AAAM,kCAAN;AAAA,oBAAwBC;AAAxB,UAFF;AAAA,QAJF;AAAA,OAAmB,sBAAnB,CADF,EAUGG,cAAc,IAAI,CAAAA,cAAc,SAAd,IAAAA,cAAc,WAAd,YAAAA,cAAc,CAAEa,MAAhB,IAAyB,CAA3C,iBACC,KAAC,WAAD;AAAA,6BACE,KAAC,eAAD;AAAA,kBACGb,cADH,aACGA,cADH,uBACGA,cAAc,CAAEc,GAAhB,CAAoB,UAAAC,OAAO;AAAA,8BAC1B,KAAC,QAAD;AAA4B,YAAA,EAAE,EAAEA,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEC,EAAzC;AAA6C,YAAA,QAAQ,EAAED,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEE,KAAhE;AAAuE,YAAA,IAAI,EAAEF,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEG,IAAtF;AAA4F,YAAA,OAAO,EAAEH,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEI;AAA9G,aAAeJ,OAAf,aAAeA,OAAf,uBAAeA,OAAO,CAAEC,EAAxB,CAD0B;AAAA,SAA3B;AADH;AADF,OAAiB,sBAAjB,CAXJ,EAoBGf,mBAAmB,IAAI,CAAAA,mBAAmB,SAAnB,IAAAA,mBAAmB,WAAnB,YAAAA,mBAAmB,CAAEY,MAArB,IAA8B,CAArD,iBACC,MAAC,WAAD;AAAA,8BACE,KAAC,gBAAD;AAAA,kBAAmBf,gBAAgB,IAAI;AAAvC,QADF,eAEE,KAAC,eAAD;AAAA,kBACGG,mBADH,aACGA,mBADH,uBACGA,mBAAmB,CAAEa,GAArB,CAAyB,UAAAC,OAAO;AAAA,8BAC/B,KAAC,QAAD;AAA4B,YAAA,EAAE,EAAEA,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEC,EAAzC;AAA6C,YAAA,QAAQ,EAAED,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEE,KAAhE;AAAuE,YAAA,IAAI,EAAEF,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEG,IAAtF;AAA4F,YAAA,OAAO,EAAEH,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEI;AAA9G,aAAeJ,OAAf,aAAeA,OAAf,uBAAeA,OAAO,CAAEC,EAAxB,CAD+B;AAAA,SAAhC;AADH,QAFF;AAAA,OAAiB,2BAAjB,CArBJ,eA+BE,KAAC,WAAD;AAAA,6BACE,MAAC,eAAD;AAAA,mBACGd,cADH,aACGA,cADH,uBACGA,cAAc,CAAEY,GAAhB,CAAoB,UAAAC,OAAO;AAAA,8BAC1B,KAAC,QAAD;AAA4B,YAAA,UAAU,EAAEA,OAAO,CAACK,UAAhD;AAA4D,YAAA,EAAE,EAAEL,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEC,EAAzE;AAA6E,YAAA,QAAQ,EAAED,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEE,KAAhG;AAAuG,YAAA,IAAI,EAAEF,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEG,IAAtH;AAA4H,YAAA,OAAO,EAAEH,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEI;AAA9I,aAAeJ,OAAf,aAAeA,OAAf,uBAAeA,OAAO,CAAEC,EAAxB,CAD0B;AAAA,SAA3B,CADH,EAIGb,OAAO,iBACN,KAAC,MAAD;AACE,UAAA,KAAK,EAAC,KADR;AAEE,UAAA,SAAS,EAAC,uBAFZ;AAGE,UAAA,OAAO,EAAC,WAHV;AAIE,UAAA,IAAI,EAAEjC,IAAI,CAACmD,KAJb;AAKE,UAAA,OAAO,EAAE,iBAAAd,CAAC,EAAI;AACZA,YAAAA,CAAC,CAACe,cAAF;AACAnB,YAAAA,OAAO,CAACI,CAAD,CAAP;AACD,WARH;AAAA,oBASGH;AATH,UALJ;AAAA;AADF,OAAiB,sBAAjB,CA/BF;AAAA,IADF;AAsDD,CApED;;;AAZET,EAAAA,S;AACAC,EAAAA,Q;AACAC,EAAAA,K;AACAC,EAAAA,gB;AACAC,EAAAA,e;AACAC,EAAAA,c;AACAC,EAAAA,mB;AACAC,EAAAA,c;AACAC,EAAAA,O;AACAC,EAAAA,Y;;AAyEF,eAAeV,QAAf","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {COLORS, ComponentTextStyle} from '../../styles';\nimport Avatar, {AvatarContainer} from '../Avatar';\nimport MenuLink from './MenuLink';\nimport { UserMenuItem, Size } from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {ComponentXSStyling, HeadlineXXSStyling} from '../../styles/typography';\nimport {Z_INDEXES} from '../../styles/z-indexes';\n\nconst Menu = styled.ul`\n list-style: none;\n margin: 0;\n padding: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n min-width: 312px;\n -webkit-animation: ${flowDown} 0.2s ease-in-out;\n animation: ${flowDown} 0.2s ease-in-out;\n position: absolute;\n box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);\n border-radius: 4px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n\n .open & {\n display: block;\n }\n \n .sign-out{\n width: 90%;\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\n margin: 8px auto 12px auto;\n }\n`;\n\nconst MenuSection = styled.li`\n padding: 8px 0;\n position: relative;\n\n &:not(:first-of-type)::before {\n content: '';\n position: absolute;\n background: ${COLORS.neutral_100};\n height: 1px;\n top: 0;\n left: 16px;\n right: 16px;\n }\n\n .disabled-link {\n color: #21212150;\n pointer-events: none;\n key-events: none;\n }\n`;\n\nconst MenuSectionList = styled.ul`\n list-style: none;\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\nconst StyledAvatarContainer = styled(AvatarContainer)`\n margin: 25px 0 0 25px;\n pointer-events: none;\n`;\n\nconst AvatarAndName = styled.div`\n display: flex;\n flex-direction: row;\n\n h5 {\n margin: 28px 0 0 20px;\n ${HeadlineXXSStyling(COLORS.neutral_600)}\n }\n span {\n margin: 0 0 0 20px;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n }\n`;\n\nconst NameAndEmail = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nconst OrganizationName = styled.span`\n margin-left: 25px;\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\ninterface Props {\n firstName: string;\n lastName: string;\n email: string;\n organizationName: string;\n clickMenuAction: () => void;\n accountSection?: UserMenuItem[];\n organizationSection?: UserMenuItem[];\n supportSection?: UserMenuItem[];\n signOut?: (e: any) => void;\n signOutLabel?: string;\n}\n\nconst UserMenu = ({ firstName, lastName, email, organizationName, clickMenuAction, accountSection, organizationSection, supportSection, signOut, signOutLabel }: Props) => {\n React.useEffect(() => {\n function handleKeyPress(e: any) {\n if (e.keyCode === 27) {\n clickMenuAction();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [clickMenuAction]);\n\n return (\n <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\n <AvatarAndName key=\"AvatarAndNameSection\">\n <StyledAvatarContainer hidePadding={true}>\n <Avatar size={48} firstName={firstName} lastName={lastName} color={COLORS.primary_500} profileMenuLink=\"#TODO\" />\n </StyledAvatarContainer>\n <NameAndEmail>\n <h5 data-hj-suppress>{`${firstName} ${lastName}`}</h5>\n <span data-hj-suppress>{email}</span>\n </NameAndEmail>\n </AvatarAndName>\n {accountSection && accountSection?.length > 0 && (\n <MenuSection key=\"MobileAccountSection\">\n <MenuSectionList>\n {accountSection?.map(element => (\n <MenuLink key={element?.to} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\n ))}\n </MenuSectionList>\n </MenuSection>\n )}\n\n {organizationSection && organizationSection?.length > 0 && (\n <MenuSection key=\"MobileOrganizationSection\">\n <OrganizationName>{organizationName || ''}</OrganizationName>\n <MenuSectionList>\n {organizationSection?.map(element => (\n <MenuLink key={element?.to} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\n ))}\n </MenuSectionList>\n </MenuSection>\n )}\n\n <MenuSection key=\"MobileSupportSection\">\n <MenuSectionList>\n {supportSection?.map(element => (\n <MenuLink key={element?.to} isExternal={element.isExternal} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\n ))}\n {signOut && (\n <Button\n width=\"90%\"\n className=\"UserMenuLink sign-out\"\n variant=\"secondary\"\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut(e);\n }}>\n {signOutLabel}\n </Button>\n )}\n </MenuSectionList>\n </MenuSection>\n </Menu>\n );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.js"}
|