@laerdal/life-react-components 2.2.1-dev.9.full → 2.3.0
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/Accordion/AccordionItem.cjs +17 -8
- package/dist/Accordion/AccordionItem.cjs.map +1 -1
- package/dist/Accordion/AccordionItem.d.ts +0 -2
- package/dist/Accordion/AccordionItem.js +18 -9
- package/dist/Accordion/AccordionItem.js.map +1 -1
- package/dist/Accordion/AccordionMenu.cjs +2 -6
- package/dist/Accordion/AccordionMenu.cjs.map +1 -1
- package/dist/Accordion/AccordionMenu.d.ts +0 -3
- package/dist/Accordion/AccordionMenu.js +2 -6
- package/dist/Accordion/AccordionMenu.js.map +1 -1
- package/dist/Accordion/styles.cjs +11 -7
- package/dist/Accordion/styles.cjs.map +1 -1
- package/dist/Accordion/styles.d.ts +4 -1
- package/dist/Accordion/styles.js +9 -6
- package/dist/Accordion/styles.js.map +1 -1
- package/dist/AuthPage/AuthPage.js +1 -1
- package/dist/Banners/Banner.cjs.map +1 -1
- package/dist/Banners/Banner.js.map +1 -1
- package/dist/Button/Button.cjs +1 -1
- package/dist/Button/Button.cjs.map +1 -1
- package/dist/Button/Button.js +2 -2
- package/dist/Button/Button.js.map +1 -1
- package/dist/Button/Iconbutton.cjs.map +1 -1
- package/dist/Button/Iconbutton.d.ts +1 -1
- package/dist/Button/Iconbutton.js.map +1 -1
- package/dist/Card/HorizontalCard/HorizontalCard.cjs +9 -12
- package/dist/Card/HorizontalCard/HorizontalCard.cjs.map +1 -1
- package/dist/Card/HorizontalCard/HorizontalCard.d.ts +0 -2
- package/dist/Card/HorizontalCard/HorizontalCard.js +8 -9
- package/dist/Card/HorizontalCard/HorizontalCard.js.map +1 -1
- package/dist/Card/HorizontalCard/HorizontalCardBody.cjs +9 -13
- package/dist/Card/HorizontalCard/HorizontalCardBody.cjs.map +1 -1
- package/dist/Card/HorizontalCard/HorizontalCardBody.d.ts +0 -4
- package/dist/Card/HorizontalCard/HorizontalCardBody.js +8 -8
- package/dist/Card/HorizontalCard/HorizontalCardBody.js.map +1 -1
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs +5 -7
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs.map +1 -1
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.d.ts +0 -2
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js +5 -5
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js.map +1 -1
- package/dist/Card/HorizontalCard/index.cjs +12 -33
- package/dist/Card/HorizontalCard/index.cjs.map +1 -1
- package/dist/Card/HorizontalCard/index.d.ts +1 -3
- package/dist/Card/HorizontalCard/index.js +1 -3
- package/dist/Card/HorizontalCard/index.js.map +1 -1
- package/dist/Card/HorizontalCard/types.cjs.map +1 -1
- package/dist/Card/HorizontalCard/types.d.ts +1 -1
- package/dist/Card/HorizontalCard/types.js.map +1 -1
- package/dist/ChipsInput/ChipInputField.cjs +1 -1
- package/dist/ChipsInput/ChipInputField.cjs.map +1 -1
- package/dist/ChipsInput/ChipInputField.js +1 -1
- package/dist/ChipsInput/ChipInputField.js.map +1 -1
- package/dist/Dropdown/BasicDropdown.cjs +21 -6
- package/dist/Dropdown/BasicDropdown.cjs.map +1 -1
- package/dist/Dropdown/BasicDropdown.d.ts +2 -0
- package/dist/Dropdown/BasicDropdown.js +22 -7
- package/dist/Dropdown/BasicDropdown.js.map +1 -1
- package/dist/Dropdown/CommonStyling.cjs +7 -4
- package/dist/Dropdown/CommonStyling.cjs.map +1 -1
- package/dist/Dropdown/CommonStyling.d.ts +3 -1
- package/dist/Dropdown/CommonStyling.js +7 -4
- package/dist/Dropdown/CommonStyling.js.map +1 -1
- package/dist/Dropdown/DropdownContent.cjs +1 -1
- package/dist/Dropdown/DropdownContent.js +1 -1
- package/dist/Dropdown/DropdownFilter.cjs +16 -3
- package/dist/Dropdown/DropdownFilter.cjs.map +1 -1
- package/dist/Dropdown/DropdownFilter.d.ts +1 -0
- package/dist/Dropdown/DropdownFilter.js +16 -3
- package/dist/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs.map +1 -1
- package/dist/Footer/Components/FooterNewsletterAndSocialSection.js.map +1 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs +3 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs.map +1 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.js +4 -2
- package/dist/GlobalNavigationBar/GlobalNavigationBar.js.map +1 -1
- package/dist/GlobalNavigationBar/Logo.cjs.map +1 -1
- package/dist/GlobalNavigationBar/Logo.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.cjs +7 -2
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.d.ts +4 -0
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.js +6 -5
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/MainMenu.cjs +178 -56
- package/dist/GlobalNavigationBar/desktop/MainMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/MainMenu.d.ts +2 -2
- package/dist/GlobalNavigationBar/desktop/MainMenu.js +178 -56
- package/dist/GlobalNavigationBar/desktop/MainMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/SubMenu.cjs +243 -0
- package/dist/GlobalNavigationBar/desktop/SubMenu.cjs.map +1 -0
- package/dist/GlobalNavigationBar/desktop/SubMenu.d.ts +18 -0
- package/dist/GlobalNavigationBar/desktop/SubMenu.js +233 -0
- package/dist/GlobalNavigationBar/desktop/SubMenu.js.map +1 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/types.cjs.map +1 -1
- package/dist/GlobalNavigationBar/types.d.ts +12 -2
- package/dist/GlobalNavigationBar/types.js.map +1 -1
- package/dist/GlobalNavigationBar/utils.cjs +17 -0
- package/dist/GlobalNavigationBar/utils.cjs.map +1 -0
- package/dist/GlobalNavigationBar/utils.d.ts +2 -0
- package/dist/GlobalNavigationBar/utils.js +10 -0
- package/dist/GlobalNavigationBar/utils.js.map +1 -0
- package/dist/Image/ImageWithFallbacks.js +1 -1
- package/dist/InputFields/DatepickerField.cjs +54 -33
- package/dist/InputFields/DatepickerField.cjs.map +1 -1
- package/dist/InputFields/DatepickerField.d.ts +1 -0
- package/dist/InputFields/DatepickerField.js +55 -34
- package/dist/InputFields/DatepickerField.js.map +1 -1
- package/dist/InputFields/DatepickerFieldHeader.cjs.map +1 -1
- package/dist/InputFields/DatepickerFieldHeader.js +1 -1
- package/dist/InputFields/DatepickerFieldHeader.js.map +1 -1
- package/dist/InputFields/Label.cjs +12 -8
- package/dist/InputFields/Label.cjs.map +1 -1
- package/dist/InputFields/Label.js +12 -8
- package/dist/InputFields/Label.js.map +1 -1
- package/dist/InputFields/NumberField.cjs +33 -14
- package/dist/InputFields/NumberField.cjs.map +1 -1
- package/dist/InputFields/NumberField.d.ts +1 -0
- package/dist/InputFields/NumberField.js +36 -17
- package/dist/InputFields/NumberField.js.map +1 -1
- package/dist/InputFields/PasswordField.cjs +50 -44
- package/dist/InputFields/PasswordField.cjs.map +1 -1
- package/dist/InputFields/PasswordField.js +51 -45
- package/dist/InputFields/PasswordField.js.map +1 -1
- package/dist/InputFields/SearchBar.cjs +2 -1
- package/dist/InputFields/SearchBar.cjs.map +1 -1
- package/dist/InputFields/SearchBar.js +3 -2
- package/dist/InputFields/SearchBar.js.map +1 -1
- package/dist/InputFields/TextField.cjs +14 -2
- package/dist/InputFields/TextField.cjs.map +1 -1
- package/dist/InputFields/TextField.d.ts +1 -0
- package/dist/InputFields/TextField.js +15 -3
- package/dist/InputFields/TextField.js.map +1 -1
- package/dist/InputFields/Textarea.cjs +3 -8
- package/dist/InputFields/Textarea.cjs.map +1 -1
- package/dist/InputFields/Textarea.d.ts +7 -3
- package/dist/InputFields/Textarea.js +6 -12
- package/dist/InputFields/Textarea.js.map +1 -1
- package/dist/InputFields/components/SearchField.cjs +1 -1
- package/dist/InputFields/components/SearchField.cjs.map +1 -1
- package/dist/InputFields/components/SearchField.js +1 -1
- package/dist/InputFields/components/SearchField.js.map +1 -1
- package/dist/InputFields/styling.cjs +11 -11
- package/dist/InputFields/styling.cjs.map +1 -1
- package/dist/InputFields/styling.d.ts +2 -3
- package/dist/InputFields/styling.js +11 -10
- package/dist/InputFields/styling.js.map +1 -1
- package/dist/InputFields/types.cjs.map +1 -1
- package/dist/InputFields/types.d.ts +8 -4
- package/dist/InputFields/types.js.map +1 -1
- package/dist/LinearProgress/LinearProgress.js +1 -1
- package/dist/NavItem/NavItem.cjs +2 -1
- package/dist/NavItem/NavItem.cjs.map +1 -1
- package/dist/NavItem/NavItem.d.ts +1 -0
- package/dist/NavItem/NavItem.js +1 -1
- package/dist/NavItem/NavItem.js.map +1 -1
- package/dist/NavItem/NestedNavItem.cjs +38 -0
- package/dist/NavItem/NestedNavItem.cjs.map +1 -0
- package/dist/NavItem/NestedNavItem.d.ts +13 -0
- package/dist/NavItem/NestedNavItem.js +28 -0
- package/dist/NavItem/NestedNavItem.js.map +1 -0
- package/dist/Paginator/Paginator.cjs.map +1 -1
- package/dist/Paginator/Paginator.js.map +1 -1
- package/dist/Table/Table.cjs +1 -2
- package/dist/Table/Table.cjs.map +1 -1
- package/dist/Table/Table.js +1 -2
- package/dist/Table/Table.js.map +1 -1
- package/dist/Table/TableFooter.cjs.map +1 -1
- package/dist/Table/TableFooter.js +1 -1
- package/dist/Table/TableFooter.js.map +1 -1
- package/dist/Table/TableStyles.cjs +4 -4
- package/dist/Table/TableStyles.cjs.map +1 -1
- package/dist/Table/TableStyles.js +4 -4
- package/dist/Table/TableStyles.js.map +1 -1
- package/dist/Table/TableTypes.cjs.map +1 -1
- package/dist/Table/TableTypes.d.ts +0 -1
- package/dist/Table/TableTypes.js.map +1 -1
- package/dist/Tabs/HorizontalTabs.cjs +12 -10
- package/dist/Tabs/HorizontalTabs.cjs.map +1 -1
- package/dist/Tabs/HorizontalTabs.d.ts +1 -2
- package/dist/Tabs/HorizontalTabs.js +14 -13
- package/dist/Tabs/HorizontalTabs.js.map +1 -1
- package/dist/Tabs/TabLink.cjs +41 -17
- package/dist/Tabs/TabLink.cjs.map +1 -1
- package/dist/Tabs/TabLink.d.ts +14 -10
- package/dist/Tabs/TabLink.js +41 -17
- package/dist/Tabs/TabLink.js.map +1 -1
- package/dist/Tabs/VerticalTabs.cjs +2 -0
- package/dist/Tabs/VerticalTabs.cjs.map +1 -1
- package/dist/Tabs/VerticalTabs.d.ts +1 -0
- package/dist/Tabs/VerticalTabs.js +2 -0
- package/dist/Tabs/VerticalTabs.js.map +1 -1
- package/dist/Toggles/ToggleSwitch.cjs +1 -11
- package/dist/Toggles/ToggleSwitch.cjs.map +1 -1
- package/dist/Toggles/ToggleSwitch.js +2 -12
- package/dist/Toggles/ToggleSwitch.js.map +1 -1
- package/dist/Toggles/TogglerStyles.cjs +1 -1
- package/dist/Toggles/TogglerStyles.cjs.map +1 -1
- package/dist/Toggles/TogglerStyles.js +1 -1
- package/dist/Toggles/TogglerStyles.js.map +1 -1
- package/dist/Tooltips/TooltipOverflow.cjs +112 -0
- package/dist/Tooltips/TooltipOverflow.cjs.map +1 -0
- package/dist/Tooltips/TooltipOverflow.d.ts +10 -0
- package/dist/Tooltips/TooltipOverflow.js +102 -0
- package/dist/Tooltips/TooltipOverflow.js.map +1 -0
- package/dist/Tooltips/TooltipStyles.cjs +8 -5
- package/dist/Tooltips/TooltipStyles.cjs.map +1 -1
- package/dist/Tooltips/TooltipStyles.d.ts +3 -1
- package/dist/Tooltips/TooltipStyles.js +8 -5
- package/dist/Tooltips/TooltipStyles.js.map +1 -1
- package/dist/Tooltips/TooltipWrapper.cjs +2 -1
- package/dist/Tooltips/TooltipWrapper.cjs.map +1 -1
- package/dist/Tooltips/TooltipWrapper.js +2 -1
- package/dist/Tooltips/TooltipWrapper.js.map +1 -1
- package/dist/assets/index.cjs.map +1 -1
- package/dist/assets/index.js.map +1 -1
- package/dist/common/ActionWithin.cjs +1 -1
- package/dist/common/ActionWithin.js +1 -1
- package/dist/common/FocusVisible.cjs +1 -1
- package/dist/common/FocusVisible.js +1 -1
- package/dist/icons/index.cjs +1 -1
- package/dist/icons/index.cjs.map +1 -1
- package/dist/icons/index.js +1 -1
- package/dist/icons/index.js.map +1 -1
- package/dist/icons/systemicons/SystemIcons.cjs.map +1 -1
- package/dist/icons/systemicons/SystemIcons.js.map +1 -1
- package/package.json +2 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SubMenu.cjs","names":["SubMenuWrapper","styled","div","Menu","props","topLevel","visible","SubMenu","React","forwardRef","ref","item","index","dropdownMenusOpenedArray","onSubMenuHidden","onSubMenuOpened","onItemStateChanged","activeItemId","nestPath","useState","forceUpdate","focusedRef","useRef","allRefs","setAllRefs","subMenuRefs","setAllSubMenuRefs","useEffect","items","map","x","type","createRef","undefined","existingRef","current","find","id","onMouseLeave","event","filter","containActiveItem","checkIfContainsItem","onMouseEnter","existingRefForId","onKeyDown","e","key","stopPropagation","preventDefault","setNewFocusedElement","length","code","focusedItem","click","newFocusedElement","oldFocusedElement","classList","remove","add","scrollIntoView","block","inline","onFocus","onBlur","Boolean","Size","Medium","entry","isGroup","to","SubItemOpened","position","value","label","state","disabled"],"sources":["../../../src/GlobalNavigationBar/desktop/SubMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { NavLink, useLocation } from 'react-router-dom';\nimport styled from 'styled-components';\n\nimport { NavItem } from '../../NavItem';\nimport { MoreHorizontal } from '../../icons/systemicons/SystemIcons';\nimport { COLORS, BREAKPOINTS } from '../../styles';\nimport ExtendedMainMenu, { Menu, MenuSection, MenuSectionList } from './ExtendedMainMenu';\nimport { IconButton } from '../../Button';\nimport { defaultOnMouseDownHandler } from '../../common';\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\nimport { DropdownContent } from '../../Dropdown';\nimport { VerticalTabEntry, VerticalTabs } from '../../Tabs';\nimport { Size } from '../../types';\nimport { SystemIcons } from '../../icons';\nimport { checkIfContainsItem } from '../utils';\nimport Tabs from '../../Tabs/Tabs';\nimport TabLink from '../../Tabs/TabLink';\nimport { MenuItem } from '../../MenuItem';\nimport { NavItemDiv } from '../../NavItem/NavItem';\n\nexport type SubMenuProps = {\n item: MenuNavigationItemTypeDesktopGroup;\n index: number;\n topLevel: boolean;\n dropdownMenusOpenedArray: React.MutableRefObject<string[]>;\n onSubMenuOpened?: (item: string) => void;\n onSubMenuHidden?: (item: string) => void;\n onItemStateChanged?: (item: string, state: boolean) => void;\n activeItemId?: string;\n nestPath?: string[];\n};\n\nexport const SubMenuWrapper = styled.div<{ topLevel: boolean; visible: boolean }>`\n ${Menu} {\n top: ${(props) => (props.topLevel ? '100%' : '0px')};\n left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\n }\n\n ${(props) => (!props.visible ? 'display: none;' : '')}\n\n button {\n padding-left: 0px;\n }\n`;\n\nexport const SubMenu = React.forwardRef<HTMLUListElement, SubMenuProps>(({\n item,\n index,\n topLevel,\n dropdownMenusOpenedArray,\n onSubMenuHidden,\n onSubMenuOpened,\n onItemStateChanged,\n activeItemId,\n nestPath,\n}: SubMenuProps, ref): React.ReactElement<SubMenuProps> => {\n const [, forceUpdate] = React.useState({});\n const focusedRef = React.useRef<{ index: number }>({ index: -1 });\n const [allRefs, setAllRefs] = React.useState<React.RefObject<HTMLButtonElement | HTMLAnchorElement>[]>([]);\n const [subMenuRefs, setAllSubMenuRefs] = React.useState<(React.RefObject<HTMLUListElement> | undefined)[]>([]);\n\n React.useEffect(() => {\n setAllRefs(item.items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLButtonElement>() : React.createRef<HTMLAnchorElement>())));\n setAllSubMenuRefs(item.items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLUListElement>() : undefined)));\n }, [item]);\n\n const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\n const onMouseLeave = (event: any, id: string) => {\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\n //just trigger rerendering\n onSubMenuHidden && onSubMenuHidden(id);\n forceUpdate({});\n };\n let containActiveItem = false;\n if (item.type == 'desktopgroup' && activeItemId) containActiveItem = checkIfContainsItem(item, activeItemId);\n\n const onMouseEnter = (event: any, id: string) => {\n const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\n if (existingRefForId == null) {\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\n //just trigger rerendering\n onSubMenuOpened && onSubMenuOpened(id);\n forceUpdate({});\n }\n };\n\n const onKeyDown = (e: React.KeyboardEvent<HTMLUListElement>) => {\n \n if (e.key === 'ArrowUp' || e.key === 'Up') {\n e.stopPropagation();\n e.preventDefault();\n if (focusedRef.current.index > 0) {\n setNewFocusedElement(focusedRef.current.index - 1);\n }\n } else if (e.key === 'ArrowDown' || e.key === 'Down') {\n e.stopPropagation();\n e.preventDefault();\n if(focusedRef.current.index < allRefs.length - 1)\n setNewFocusedElement(focusedRef.current.index + 1);\n } \n else\n if (e.key == 'Enter' || e.code == 'Space') {\n e.stopPropagation();\n if(focusedRef.current.index < 0)\n return;\n \n const focusedItem = item.items[focusedRef.current.index];\n if(focusedItem.type == 'desktopgroup')\n {\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, focusedItem.id];\n forceUpdate({});\n }\n else\n {\n allRefs[focusedRef.current.index].current?.click();\n forceUpdate({});\n }\n\n //just trigger rerendering\n \n }\n };\n\n const setNewFocusedElement = (index: number) => {\n const newFocusedElement = index >= 0 ? allRefs[index] : null;\n const oldFocusedElement = focusedRef.current.index >= 0 ? allRefs[focusedRef.current.index] : null;\n focusedRef.current.index = index;\n\n if(oldFocusedElement)\n oldFocusedElement?.current?.classList.remove('dropdown-hover');\n\n if (newFocusedElement && newFocusedElement !== oldFocusedElement) {\n newFocusedElement.current?.classList.add('dropdown-hover');\n newFocusedElement.current?.scrollIntoView({\n block: 'nearest',\n inline: 'nearest',\n });\n }\n };\n\n const onFocus = (event: React.FocusEvent<HTMLUListElement>) => {\n event.stopPropagation();\n dropdownMenusOpenedArray.current = [...(nestPath ?? [])];\n setNewFocusedElement(0);\n forceUpdate({});\n };\n\n const onBlur = (event: React.FocusEvent<HTMLUListElement>) => {\n event.stopPropagation();\n setNewFocusedElement(-1);\n };\n\n return (\n <SubMenuWrapper id={item.id} className={existingRef ? 'open' : '' } topLevel={topLevel} visible={Boolean(existingRef)}>\n <Menu role=\"menu\" ref={ref} aria-labelledby=\"UserMenuButton\" onBlur={onBlur} onFocus={onFocus} onKeyDown={(event) => onKeyDown(event)} tabIndex={0}>\n <MenuSection>\n <MenuSectionList>\n <Tabs size={Size.Medium}>\n {item.items.map((entry, index) => {\n const isGroup = entry.type == 'desktopgroup';\n const key = isGroup ? entry.id : entry.type == 'item' ? entry.to : '';\n const SubItemOpened = Boolean(dropdownMenusOpenedArray.current.find((x) => x == entry.id));\n if (isGroup) {\n return (\n <div style={{ position: 'relative' }} onMouseEnter={(event) => onMouseEnter(event, entry.id)} onMouseLeave={(event) => onMouseLeave(event, entry.id)}>\n <MenuItem\n tabIndex={-1}\n ref={allRefs[index] as React.Ref<HTMLButtonElement>}\n \n id={entry.id}\n item={{\n value: entry.label ?? '',\n }}\n iconRight={<SystemIcons.ArrowDropRight size=\"24px\" />}\n active={SubItemOpened || (Boolean(activeItemId) && activeItemId != '' && checkIfContainsItem(entry, activeItemId!))}\n onClickHandler={() => {}}\n />\n <SubMenu\n ref={subMenuRefs[index]}\n nestPath={[...(nestPath ?? []), entry.id]}\n onItemStateChanged={onItemStateChanged}\n activeItemId={activeItemId}\n dropdownMenusOpenedArray={dropdownMenusOpenedArray}\n item={entry as MenuNavigationItemTypeDesktopGroup}\n index={index + 1}\n topLevel={false}\n />\n </div>\n );\n }\n return (\n <>\n <TabLink\n tabIndex={-1}\n key={key}\n to={isGroup ? '' : key}\n ref={allRefs[index] as React.Ref<HTMLAnchorElement>}\n onActiveStateChanged={(state) => onItemStateChanged && entry.type == 'item' && onItemStateChanged(entry.to, state)}\n forceDeactivate={isGroup}\n requiredLine={entry.label ?? ''}\n optionalLine={''}\n endLineIcon={isGroup ? <SystemIcons.ArrowDropRight size=\"24px\" /> : null}\n OptionalLineIcon={''}\n disabled={entry.disabled}\n showNotificationDot={false}\n size={Size.Medium}\n variant=\"positive\"\n />\n </>\n );\n })}\n </Tabs>\n </MenuSectionList>\n </MenuSection>\n </Menu>\n </SubMenuWrapper>\n );\n});\n"],"mappings":"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"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { MenuNavigationItemTypeDesktopGroup } from '../types';
|
|
3
|
+
export type SubMenuProps = {
|
|
4
|
+
item: MenuNavigationItemTypeDesktopGroup;
|
|
5
|
+
index: number;
|
|
6
|
+
topLevel: boolean;
|
|
7
|
+
dropdownMenusOpenedArray: React.MutableRefObject<string[]>;
|
|
8
|
+
onSubMenuOpened?: (item: string) => void;
|
|
9
|
+
onSubMenuHidden?: (item: string) => void;
|
|
10
|
+
onItemStateChanged?: (item: string, state: boolean) => void;
|
|
11
|
+
activeItemId?: string;
|
|
12
|
+
nestPath?: string[];
|
|
13
|
+
};
|
|
14
|
+
export declare const SubMenuWrapper: import("styled-components").StyledComponent<"div", any, {
|
|
15
|
+
topLevel: boolean;
|
|
16
|
+
visible: boolean;
|
|
17
|
+
}, never>;
|
|
18
|
+
export declare const SubMenu: React.ForwardRefExoticComponent<SubMenuProps & React.RefAttributes<HTMLUListElement>>;
|
|
@@ -0,0 +1,233 @@
|
|
|
1
|
+
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
3
|
+
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
4
|
+
import _pt from "prop-types";
|
|
5
|
+
var _templateObject;
|
|
6
|
+
import * as React from 'react';
|
|
7
|
+
import styled from 'styled-components';
|
|
8
|
+
import { Menu, MenuSection, MenuSectionList } from './ExtendedMainMenu';
|
|
9
|
+
import { Size } from '../../types';
|
|
10
|
+
import { SystemIcons } from '../../icons';
|
|
11
|
+
import { checkIfContainsItem } from '../utils';
|
|
12
|
+
import Tabs from '../../Tabs/Tabs';
|
|
13
|
+
import TabLink from '../../Tabs/TabLink';
|
|
14
|
+
import { MenuItem } from '../../MenuItem';
|
|
15
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
16
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
17
|
+
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
18
|
+
export var SubMenuWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n ", " {\n top: ", ";\n left: ", ";\n }\n\n ", "\n\n button {\n padding-left: 0px;\n }\n"])), Menu, function (props) {
|
|
19
|
+
return props.topLevel ? '100%' : '0px';
|
|
20
|
+
}, function (props) {
|
|
21
|
+
return props.topLevel ? '0px' : 'calc(100% - 12px)';
|
|
22
|
+
}, function (props) {
|
|
23
|
+
return !props.visible ? 'display: none;' : '';
|
|
24
|
+
});
|
|
25
|
+
export var SubMenu = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
26
|
+
var item = _ref.item,
|
|
27
|
+
index = _ref.index,
|
|
28
|
+
topLevel = _ref.topLevel,
|
|
29
|
+
dropdownMenusOpenedArray = _ref.dropdownMenusOpenedArray,
|
|
30
|
+
onSubMenuHidden = _ref.onSubMenuHidden,
|
|
31
|
+
onSubMenuOpened = _ref.onSubMenuOpened,
|
|
32
|
+
onItemStateChanged = _ref.onItemStateChanged,
|
|
33
|
+
activeItemId = _ref.activeItemId,
|
|
34
|
+
nestPath = _ref.nestPath;
|
|
35
|
+
var _React$useState = React.useState({}),
|
|
36
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
37
|
+
forceUpdate = _React$useState2[1];
|
|
38
|
+
var focusedRef = React.useRef({
|
|
39
|
+
index: -1
|
|
40
|
+
});
|
|
41
|
+
var _React$useState3 = React.useState([]),
|
|
42
|
+
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
|
43
|
+
allRefs = _React$useState4[0],
|
|
44
|
+
setAllRefs = _React$useState4[1];
|
|
45
|
+
var _React$useState5 = React.useState([]),
|
|
46
|
+
_React$useState6 = _slicedToArray(_React$useState5, 2),
|
|
47
|
+
subMenuRefs = _React$useState6[0],
|
|
48
|
+
setAllSubMenuRefs = _React$useState6[1];
|
|
49
|
+
React.useEffect(function () {
|
|
50
|
+
setAllRefs(item.items.map(function (x) {
|
|
51
|
+
return x.type == 'desktopgroup' ? /*#__PURE__*/React.createRef() : /*#__PURE__*/React.createRef();
|
|
52
|
+
}));
|
|
53
|
+
setAllSubMenuRefs(item.items.map(function (x) {
|
|
54
|
+
return x.type == 'desktopgroup' ? /*#__PURE__*/React.createRef() : undefined;
|
|
55
|
+
}));
|
|
56
|
+
}, [item]);
|
|
57
|
+
var existingRef = dropdownMenusOpenedArray.current.find(function (x) {
|
|
58
|
+
return x == item.id;
|
|
59
|
+
});
|
|
60
|
+
var _onMouseLeave = function onMouseLeave(event, id) {
|
|
61
|
+
dropdownMenusOpenedArray.current = _toConsumableArray(dropdownMenusOpenedArray.current.filter(function (x) {
|
|
62
|
+
return x != id;
|
|
63
|
+
}));
|
|
64
|
+
//just trigger rerendering
|
|
65
|
+
onSubMenuHidden && onSubMenuHidden(id);
|
|
66
|
+
forceUpdate({});
|
|
67
|
+
};
|
|
68
|
+
var containActiveItem = false;
|
|
69
|
+
if (item.type == 'desktopgroup' && activeItemId) containActiveItem = checkIfContainsItem(item, activeItemId);
|
|
70
|
+
var _onMouseEnter = function onMouseEnter(event, id) {
|
|
71
|
+
var existingRefForId = dropdownMenusOpenedArray.current.find(function (x) {
|
|
72
|
+
return x == id;
|
|
73
|
+
});
|
|
74
|
+
if (existingRefForId == null) {
|
|
75
|
+
dropdownMenusOpenedArray.current = [].concat(_toConsumableArray(dropdownMenusOpenedArray.current), [id]);
|
|
76
|
+
//just trigger rerendering
|
|
77
|
+
onSubMenuOpened && onSubMenuOpened(id);
|
|
78
|
+
forceUpdate({});
|
|
79
|
+
}
|
|
80
|
+
};
|
|
81
|
+
var _onKeyDown = function onKeyDown(e) {
|
|
82
|
+
if (e.key === 'ArrowUp' || e.key === 'Up') {
|
|
83
|
+
e.stopPropagation();
|
|
84
|
+
e.preventDefault();
|
|
85
|
+
if (focusedRef.current.index > 0) {
|
|
86
|
+
setNewFocusedElement(focusedRef.current.index - 1);
|
|
87
|
+
}
|
|
88
|
+
} else if (e.key === 'ArrowDown' || e.key === 'Down') {
|
|
89
|
+
e.stopPropagation();
|
|
90
|
+
e.preventDefault();
|
|
91
|
+
if (focusedRef.current.index < allRefs.length - 1) setNewFocusedElement(focusedRef.current.index + 1);
|
|
92
|
+
} else if (e.key == 'Enter' || e.code == 'Space') {
|
|
93
|
+
e.stopPropagation();
|
|
94
|
+
if (focusedRef.current.index < 0) return;
|
|
95
|
+
var focusedItem = item.items[focusedRef.current.index];
|
|
96
|
+
if (focusedItem.type == 'desktopgroup') {
|
|
97
|
+
dropdownMenusOpenedArray.current = [].concat(_toConsumableArray(dropdownMenusOpenedArray.current), [focusedItem.id]);
|
|
98
|
+
forceUpdate({});
|
|
99
|
+
} else {
|
|
100
|
+
var _allRefs$focusedRef$c;
|
|
101
|
+
(_allRefs$focusedRef$c = allRefs[focusedRef.current.index].current) === null || _allRefs$focusedRef$c === void 0 ? void 0 : _allRefs$focusedRef$c.click();
|
|
102
|
+
forceUpdate({});
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
//just trigger rerendering
|
|
106
|
+
}
|
|
107
|
+
};
|
|
108
|
+
|
|
109
|
+
var setNewFocusedElement = function setNewFocusedElement(index) {
|
|
110
|
+
var _oldFocusedElement$cu;
|
|
111
|
+
var newFocusedElement = index >= 0 ? allRefs[index] : null;
|
|
112
|
+
var oldFocusedElement = focusedRef.current.index >= 0 ? allRefs[focusedRef.current.index] : null;
|
|
113
|
+
focusedRef.current.index = index;
|
|
114
|
+
if (oldFocusedElement) oldFocusedElement === null || oldFocusedElement === void 0 ? void 0 : (_oldFocusedElement$cu = oldFocusedElement.current) === null || _oldFocusedElement$cu === void 0 ? void 0 : _oldFocusedElement$cu.classList.remove('dropdown-hover');
|
|
115
|
+
if (newFocusedElement && newFocusedElement !== oldFocusedElement) {
|
|
116
|
+
var _newFocusedElement$cu, _newFocusedElement$cu2;
|
|
117
|
+
(_newFocusedElement$cu = newFocusedElement.current) === null || _newFocusedElement$cu === void 0 ? void 0 : _newFocusedElement$cu.classList.add('dropdown-hover');
|
|
118
|
+
(_newFocusedElement$cu2 = newFocusedElement.current) === null || _newFocusedElement$cu2 === void 0 ? void 0 : _newFocusedElement$cu2.scrollIntoView({
|
|
119
|
+
block: 'nearest',
|
|
120
|
+
inline: 'nearest'
|
|
121
|
+
});
|
|
122
|
+
}
|
|
123
|
+
};
|
|
124
|
+
var onFocus = function onFocus(event) {
|
|
125
|
+
event.stopPropagation();
|
|
126
|
+
dropdownMenusOpenedArray.current = _toConsumableArray(nestPath !== null && nestPath !== void 0 ? nestPath : []);
|
|
127
|
+
setNewFocusedElement(0);
|
|
128
|
+
forceUpdate({});
|
|
129
|
+
};
|
|
130
|
+
var onBlur = function onBlur(event) {
|
|
131
|
+
event.stopPropagation();
|
|
132
|
+
setNewFocusedElement(-1);
|
|
133
|
+
};
|
|
134
|
+
return /*#__PURE__*/_jsx(SubMenuWrapper, {
|
|
135
|
+
id: item.id,
|
|
136
|
+
className: existingRef ? 'open' : '',
|
|
137
|
+
topLevel: topLevel,
|
|
138
|
+
visible: Boolean(existingRef),
|
|
139
|
+
children: /*#__PURE__*/_jsx(Menu, {
|
|
140
|
+
role: "menu",
|
|
141
|
+
ref: ref,
|
|
142
|
+
"aria-labelledby": "UserMenuButton",
|
|
143
|
+
onBlur: onBlur,
|
|
144
|
+
onFocus: onFocus,
|
|
145
|
+
onKeyDown: function onKeyDown(event) {
|
|
146
|
+
return _onKeyDown(event);
|
|
147
|
+
},
|
|
148
|
+
tabIndex: 0,
|
|
149
|
+
children: /*#__PURE__*/_jsx(MenuSection, {
|
|
150
|
+
children: /*#__PURE__*/_jsx(MenuSectionList, {
|
|
151
|
+
children: /*#__PURE__*/_jsx(Tabs, {
|
|
152
|
+
size: Size.Medium,
|
|
153
|
+
children: item.items.map(function (entry, index) {
|
|
154
|
+
var _entry$label2;
|
|
155
|
+
var isGroup = entry.type == 'desktopgroup';
|
|
156
|
+
var key = isGroup ? entry.id : entry.type == 'item' ? entry.to : '';
|
|
157
|
+
var SubItemOpened = Boolean(dropdownMenusOpenedArray.current.find(function (x) {
|
|
158
|
+
return x == entry.id;
|
|
159
|
+
}));
|
|
160
|
+
if (isGroup) {
|
|
161
|
+
var _entry$label;
|
|
162
|
+
return /*#__PURE__*/_jsxs("div", {
|
|
163
|
+
style: {
|
|
164
|
+
position: 'relative'
|
|
165
|
+
},
|
|
166
|
+
onMouseEnter: function onMouseEnter(event) {
|
|
167
|
+
return _onMouseEnter(event, entry.id);
|
|
168
|
+
},
|
|
169
|
+
onMouseLeave: function onMouseLeave(event) {
|
|
170
|
+
return _onMouseLeave(event, entry.id);
|
|
171
|
+
},
|
|
172
|
+
children: [/*#__PURE__*/_jsx(MenuItem, {
|
|
173
|
+
tabIndex: -1,
|
|
174
|
+
ref: allRefs[index],
|
|
175
|
+
id: entry.id,
|
|
176
|
+
item: {
|
|
177
|
+
value: (_entry$label = entry.label) !== null && _entry$label !== void 0 ? _entry$label : ''
|
|
178
|
+
},
|
|
179
|
+
iconRight: /*#__PURE__*/_jsx(SystemIcons.ArrowDropRight, {
|
|
180
|
+
size: "24px"
|
|
181
|
+
}),
|
|
182
|
+
active: SubItemOpened || Boolean(activeItemId) && activeItemId != '' && checkIfContainsItem(entry, activeItemId),
|
|
183
|
+
onClickHandler: function onClickHandler() {}
|
|
184
|
+
}), /*#__PURE__*/_jsx(SubMenu, {
|
|
185
|
+
ref: subMenuRefs[index],
|
|
186
|
+
nestPath: [].concat(_toConsumableArray(nestPath !== null && nestPath !== void 0 ? nestPath : []), [entry.id]),
|
|
187
|
+
onItemStateChanged: onItemStateChanged,
|
|
188
|
+
activeItemId: activeItemId,
|
|
189
|
+
dropdownMenusOpenedArray: dropdownMenusOpenedArray,
|
|
190
|
+
item: entry,
|
|
191
|
+
index: index + 1,
|
|
192
|
+
topLevel: false
|
|
193
|
+
})]
|
|
194
|
+
});
|
|
195
|
+
}
|
|
196
|
+
return /*#__PURE__*/_jsx(_Fragment, {
|
|
197
|
+
children: /*#__PURE__*/_jsx(TabLink, {
|
|
198
|
+
tabIndex: -1,
|
|
199
|
+
to: isGroup ? '' : key,
|
|
200
|
+
ref: allRefs[index],
|
|
201
|
+
onActiveStateChanged: function onActiveStateChanged(state) {
|
|
202
|
+
return onItemStateChanged && entry.type == 'item' && onItemStateChanged(entry.to, state);
|
|
203
|
+
},
|
|
204
|
+
forceDeactivate: isGroup,
|
|
205
|
+
requiredLine: (_entry$label2 = entry.label) !== null && _entry$label2 !== void 0 ? _entry$label2 : '',
|
|
206
|
+
optionalLine: '',
|
|
207
|
+
endLineIcon: isGroup ? /*#__PURE__*/_jsx(SystemIcons.ArrowDropRight, {
|
|
208
|
+
size: "24px"
|
|
209
|
+
}) : null,
|
|
210
|
+
OptionalLineIcon: '',
|
|
211
|
+
disabled: entry.disabled,
|
|
212
|
+
showNotificationDot: false,
|
|
213
|
+
size: Size.Medium,
|
|
214
|
+
variant: "positive"
|
|
215
|
+
}, key)
|
|
216
|
+
});
|
|
217
|
+
})
|
|
218
|
+
})
|
|
219
|
+
})
|
|
220
|
+
})
|
|
221
|
+
})
|
|
222
|
+
});
|
|
223
|
+
});
|
|
224
|
+
SubMenu.propTypes = {
|
|
225
|
+
index: _pt.number.isRequired,
|
|
226
|
+
topLevel: _pt.bool.isRequired,
|
|
227
|
+
onSubMenuOpened: _pt.func,
|
|
228
|
+
onSubMenuHidden: _pt.func,
|
|
229
|
+
onItemStateChanged: _pt.func,
|
|
230
|
+
activeItemId: _pt.string,
|
|
231
|
+
nestPath: _pt.arrayOf(_pt.string)
|
|
232
|
+
};
|
|
233
|
+
//# sourceMappingURL=SubMenu.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SubMenu.js","names":["React","styled","Menu","MenuSection","MenuSectionList","Size","SystemIcons","checkIfContainsItem","Tabs","TabLink","MenuItem","SubMenuWrapper","div","props","topLevel","visible","SubMenu","forwardRef","ref","item","index","dropdownMenusOpenedArray","onSubMenuHidden","onSubMenuOpened","onItemStateChanged","activeItemId","nestPath","useState","forceUpdate","focusedRef","useRef","allRefs","setAllRefs","subMenuRefs","setAllSubMenuRefs","useEffect","items","map","x","type","createRef","undefined","existingRef","current","find","id","onMouseLeave","event","filter","containActiveItem","onMouseEnter","existingRefForId","onKeyDown","e","key","stopPropagation","preventDefault","setNewFocusedElement","length","code","focusedItem","click","newFocusedElement","oldFocusedElement","classList","remove","add","scrollIntoView","block","inline","onFocus","onBlur","Boolean","Medium","entry","isGroup","to","SubItemOpened","position","value","label","state","disabled"],"sources":["../../../src/GlobalNavigationBar/desktop/SubMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { NavLink, useLocation } from 'react-router-dom';\nimport styled from 'styled-components';\n\nimport { NavItem } from '../../NavItem';\nimport { MoreHorizontal } from '../../icons/systemicons/SystemIcons';\nimport { COLORS, BREAKPOINTS } from '../../styles';\nimport ExtendedMainMenu, { Menu, MenuSection, MenuSectionList } from './ExtendedMainMenu';\nimport { IconButton } from '../../Button';\nimport { defaultOnMouseDownHandler } from '../../common';\nimport { MenuNavigationItemTypeDesktopGroup, MenuNavigationItemTypeItem } from '../types';\nimport { DropdownContent } from '../../Dropdown';\nimport { VerticalTabEntry, VerticalTabs } from '../../Tabs';\nimport { Size } from '../../types';\nimport { SystemIcons } from '../../icons';\nimport { checkIfContainsItem } from '../utils';\nimport Tabs from '../../Tabs/Tabs';\nimport TabLink from '../../Tabs/TabLink';\nimport { MenuItem } from '../../MenuItem';\nimport { NavItemDiv } from '../../NavItem/NavItem';\n\nexport type SubMenuProps = {\n item: MenuNavigationItemTypeDesktopGroup;\n index: number;\n topLevel: boolean;\n dropdownMenusOpenedArray: React.MutableRefObject<string[]>;\n onSubMenuOpened?: (item: string) => void;\n onSubMenuHidden?: (item: string) => void;\n onItemStateChanged?: (item: string, state: boolean) => void;\n activeItemId?: string;\n nestPath?: string[];\n};\n\nexport const SubMenuWrapper = styled.div<{ topLevel: boolean; visible: boolean }>`\n ${Menu} {\n top: ${(props) => (props.topLevel ? '100%' : '0px')};\n left: ${(props) => (props.topLevel ? '0px' : 'calc(100% - 12px)')};\n }\n\n ${(props) => (!props.visible ? 'display: none;' : '')}\n\n button {\n padding-left: 0px;\n }\n`;\n\nexport const SubMenu = React.forwardRef<HTMLUListElement, SubMenuProps>(({\n item,\n index,\n topLevel,\n dropdownMenusOpenedArray,\n onSubMenuHidden,\n onSubMenuOpened,\n onItemStateChanged,\n activeItemId,\n nestPath,\n}: SubMenuProps, ref): React.ReactElement<SubMenuProps> => {\n const [, forceUpdate] = React.useState({});\n const focusedRef = React.useRef<{ index: number }>({ index: -1 });\n const [allRefs, setAllRefs] = React.useState<React.RefObject<HTMLButtonElement | HTMLAnchorElement>[]>([]);\n const [subMenuRefs, setAllSubMenuRefs] = React.useState<(React.RefObject<HTMLUListElement> | undefined)[]>([]);\n\n React.useEffect(() => {\n setAllRefs(item.items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLButtonElement>() : React.createRef<HTMLAnchorElement>())));\n setAllSubMenuRefs(item.items.map((x) => (x.type == 'desktopgroup' ? React.createRef<HTMLUListElement>() : undefined)));\n }, [item]);\n\n const existingRef = dropdownMenusOpenedArray.current.find((x) => x == item.id);\n const onMouseLeave = (event: any, id: string) => {\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current.filter((x) => x != id)];\n //just trigger rerendering\n onSubMenuHidden && onSubMenuHidden(id);\n forceUpdate({});\n };\n let containActiveItem = false;\n if (item.type == 'desktopgroup' && activeItemId) containActiveItem = checkIfContainsItem(item, activeItemId);\n\n const onMouseEnter = (event: any, id: string) => {\n const existingRefForId = dropdownMenusOpenedArray.current.find((x) => x == id);\n if (existingRefForId == null) {\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, id];\n //just trigger rerendering\n onSubMenuOpened && onSubMenuOpened(id);\n forceUpdate({});\n }\n };\n\n const onKeyDown = (e: React.KeyboardEvent<HTMLUListElement>) => {\n \n if (e.key === 'ArrowUp' || e.key === 'Up') {\n e.stopPropagation();\n e.preventDefault();\n if (focusedRef.current.index > 0) {\n setNewFocusedElement(focusedRef.current.index - 1);\n }\n } else if (e.key === 'ArrowDown' || e.key === 'Down') {\n e.stopPropagation();\n e.preventDefault();\n if(focusedRef.current.index < allRefs.length - 1)\n setNewFocusedElement(focusedRef.current.index + 1);\n } \n else\n if (e.key == 'Enter' || e.code == 'Space') {\n e.stopPropagation();\n if(focusedRef.current.index < 0)\n return;\n \n const focusedItem = item.items[focusedRef.current.index];\n if(focusedItem.type == 'desktopgroup')\n {\n dropdownMenusOpenedArray.current = [...dropdownMenusOpenedArray.current, focusedItem.id];\n forceUpdate({});\n }\n else\n {\n allRefs[focusedRef.current.index].current?.click();\n forceUpdate({});\n }\n\n //just trigger rerendering\n \n }\n };\n\n const setNewFocusedElement = (index: number) => {\n const newFocusedElement = index >= 0 ? allRefs[index] : null;\n const oldFocusedElement = focusedRef.current.index >= 0 ? allRefs[focusedRef.current.index] : null;\n focusedRef.current.index = index;\n\n if(oldFocusedElement)\n oldFocusedElement?.current?.classList.remove('dropdown-hover');\n\n if (newFocusedElement && newFocusedElement !== oldFocusedElement) {\n newFocusedElement.current?.classList.add('dropdown-hover');\n newFocusedElement.current?.scrollIntoView({\n block: 'nearest',\n inline: 'nearest',\n });\n }\n };\n\n const onFocus = (event: React.FocusEvent<HTMLUListElement>) => {\n event.stopPropagation();\n dropdownMenusOpenedArray.current = [...(nestPath ?? [])];\n setNewFocusedElement(0);\n forceUpdate({});\n };\n\n const onBlur = (event: React.FocusEvent<HTMLUListElement>) => {\n event.stopPropagation();\n setNewFocusedElement(-1);\n };\n\n return (\n <SubMenuWrapper id={item.id} className={existingRef ? 'open' : '' } topLevel={topLevel} visible={Boolean(existingRef)}>\n <Menu role=\"menu\" ref={ref} aria-labelledby=\"UserMenuButton\" onBlur={onBlur} onFocus={onFocus} onKeyDown={(event) => onKeyDown(event)} tabIndex={0}>\n <MenuSection>\n <MenuSectionList>\n <Tabs size={Size.Medium}>\n {item.items.map((entry, index) => {\n const isGroup = entry.type == 'desktopgroup';\n const key = isGroup ? entry.id : entry.type == 'item' ? entry.to : '';\n const SubItemOpened = Boolean(dropdownMenusOpenedArray.current.find((x) => x == entry.id));\n if (isGroup) {\n return (\n <div style={{ position: 'relative' }} onMouseEnter={(event) => onMouseEnter(event, entry.id)} onMouseLeave={(event) => onMouseLeave(event, entry.id)}>\n <MenuItem\n tabIndex={-1}\n ref={allRefs[index] as React.Ref<HTMLButtonElement>}\n \n id={entry.id}\n item={{\n value: entry.label ?? '',\n }}\n iconRight={<SystemIcons.ArrowDropRight size=\"24px\" />}\n active={SubItemOpened || (Boolean(activeItemId) && activeItemId != '' && checkIfContainsItem(entry, activeItemId!))}\n onClickHandler={() => {}}\n />\n <SubMenu\n ref={subMenuRefs[index]}\n nestPath={[...(nestPath ?? []), entry.id]}\n onItemStateChanged={onItemStateChanged}\n activeItemId={activeItemId}\n dropdownMenusOpenedArray={dropdownMenusOpenedArray}\n item={entry as MenuNavigationItemTypeDesktopGroup}\n index={index + 1}\n topLevel={false}\n />\n </div>\n );\n }\n return (\n <>\n <TabLink\n tabIndex={-1}\n key={key}\n to={isGroup ? '' : key}\n ref={allRefs[index] as React.Ref<HTMLAnchorElement>}\n onActiveStateChanged={(state) => onItemStateChanged && entry.type == 'item' && onItemStateChanged(entry.to, state)}\n forceDeactivate={isGroup}\n requiredLine={entry.label ?? ''}\n optionalLine={''}\n endLineIcon={isGroup ? <SystemIcons.ArrowDropRight size=\"24px\" /> : null}\n OptionalLineIcon={''}\n disabled={entry.disabled}\n showNotificationDot={false}\n size={Size.Medium}\n variant=\"positive\"\n />\n </>\n );\n })}\n </Tabs>\n </MenuSectionList>\n </MenuSection>\n </Menu>\n </SubMenuWrapper>\n );\n});\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MobileMenu.cjs","names":["Wrapper","styled","div","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","SwitcherLabel","MobileFooter","COLORS","neutral_200","ComponentXSStyling","ComponentTextStyle","Bold","neutral_600","ComponentSStyling","CustomContent","MobileMenu","show","profile","buttons","label","header","items","footer","action","onClose","useStackState","reset","length","push","pop","peek","isMediumScreen","useMediaMatch","LARGE","replace","location","useLocation","onSubMenuOpen","menu","type","content","customContent","custom","React","useEffect","setTimeout","current","switcher","find","a","undefined"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, Z_INDEXES} from '../../styles';\nimport {SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport {useLocation} from 'react-router-dom';\nimport {IconButton} from '../../Button';\nimport {LaerdalLogo} from '../../assets';\nimport {\n MenuAccountInfo,\n MenuButton,\n MenuNavigationItemTypeGroup,\n MenuGroupFooter,\n MenuGroupHeader,\n MenuIconButton,\n MenuNavigationItemTypeItem,\n MobileNavigationMenuProps,\n ProfileMenu,\n MenuNavigationItemTypeSection,\n MobileMenuButtonTypes,\n MenuSwitcherButton,\n MenuNavigationCustomSubMenu\n} from '../types';\nimport MobileMenuHeader from './MobileMenuHeader';\nimport MobileMenuContent from './MobileMenuContent';\nimport {useStackState} from '../../common/StackState';\nimport {useMediaMatch} from \"rooks\";\n\nconst Wrapper = styled.div`\n width: 320px;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n box-sizing: border-box;\n\n display: flex;\n flex-direction: column;\n gap: 8px;\n\n ${BREAKPOINTS.SMALL} {\n width: 400px;\n }\n`;\n\nconst SwitcherLabel = styled.div`\n margin-left: auto;\n`;\n\nconst MobileFooter = styled.div`\n display: flex;\n align-items: center;\n box-sizing: border-box;\n height: 48px;\n\n padding: 0 4px 0 16px;\n border-top: 1px solid ${COLORS.neutral_200};\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n padding: 4px 8px 4px 16px;\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n }\n`;\n\nconst CustomContent = styled.div`\n width: 100%;\n box-sizing: border-box;\n flex-flow: column;\n display: flex;\n flex: 1;\n overflow: hidden;\n`;\n\ntype Props = MobileNavigationMenuProps & {\n profile?: ProfileMenu;\n show?: boolean;\n onClose: () => void;\n};\n\ninterface MenuState {\n header: {\n label?: string;\n buttons?: MobileMenuButtonTypes[];\n }\n content?: {\n header?: MenuGroupHeader;\n items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n footer?: MenuGroupFooter;\n action?: MenuButton;\n },\n customContent?: () => React.ReactNode;\n footer?: boolean;\n}\n\nconst MobileMenu = ({\n show,\n profile,\n buttons,\n label,\n header,\n items,\n footer,\n action,\n onClose,\n }: Props) => {\n\n const {reset, length, push, pop, peek} = useStackState<MenuState>();\n\n const isMediumScreen = useMediaMatch(BREAKPOINTS.LARGE.replace('@media ', ''));\n\n const location = useLocation();\n\n const onSubMenuOpen = (menu?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => {\n\n switch (menu?.type) {\n case 'group':\n push({\n header: {\n label: menu.label,\n buttons: menu.buttons,\n },\n content: {\n header: menu.header,\n items: menu.items,\n footer: menu.footer,\n action: menu.action\n },\n footer: false\n });\n break;\n case 'custom':\n push({\n header: {\n label: menu.label,\n buttons: menu.buttons,\n },\n customContent: menu.custom,\n footer: false\n });\n break;\n default:\n break;\n }\n\n };\n\n React.useEffect(() => {\n onClose();\n }, [location]);\n\n React.useEffect(() => {\n isMediumScreen && onClose()\n }, [isMediumScreen]);\n\n React.useEffect(() => {\n setTimeout(() => {\n reset({\n footer: true,\n header: {\n label: label,\n buttons: buttons,\n },\n content: {\n header: header,\n items: items,\n footer: footer,\n action: action\n }\n })\n }, 300)\n }, [show])\n\n\n const current = peek();\n\n const switcher = current?.header?.buttons?.find(a => a.type === 'switcher') as MenuSwitcherButton;\n\n return (\n <Wrapper>\n <MobileMenuHeader buttons={current?.header.buttons}\n onGoBack={length > 1 ? pop : undefined}\n onSubMenuOpen={onSubMenuOpen}\n profile={profile}\n label={current?.header.label}\n onClose={onClose}/>\n {current?.customContent && <CustomContent>{current?.customContent()}</CustomContent>}\n {current?.content && <MobileMenuContent header={current?.content.header}\n items={current?.content.items}\n footer={current?.content.footer}\n action={current?.content.action}\n onSubMenuOpen={onSubMenuOpen}/>}\n\n {\n current?.footer &&\n <MobileFooter>\n <LaerdalLogo height={'36px'} width={'66px'}/>\n {switcher &&\n <>\n <SwitcherLabel className={'globalNav-toggler'} onClick={() => switcher.action && switcher.action() && onClose()}>Switch site</SwitcherLabel>\n <IconButton\n variant={'secondary'}\n shape={'circular'}\n id=\"globalNavAppsButton\"\n action={() => switcher.action && switcher.action() && onClose()}>\n <SwitchApp size=\"24px\"/>\n </IconButton>\n </>\n }\n\n </MobileFooter>\n }\n </Wrapper>\n );\n};\n\nexport default MobileMenu;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MobileMenu.cjs","names":["Wrapper","styled","div","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","SwitcherLabel","MobileFooter","COLORS","neutral_200","ComponentXSStyling","ComponentTextStyle","Bold","neutral_600","ComponentSStyling","CustomContent","MobileMenu","show","profile","buttons","label","header","items","footer","action","onClose","useStackState","reset","length","push","pop","peek","isMediumScreen","useMediaMatch","LARGE","replace","location","useLocation","onSubMenuOpen","menu","type","content","customContent","custom","React","useEffect","setTimeout","current","switcher","find","a","undefined"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, Z_INDEXES} from '../../styles';\nimport {SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport {useLocation} from 'react-router-dom';\nimport {IconButton} from '../../Button';\nimport {LaerdalLogo} from '../../assets';\nimport {\n MenuAccountInfo,\n MenuButton,\n MenuNavigationItemTypeGroup,\n MenuGroupFooter,\n MenuGroupHeader,\n MenuIconButton,\n MenuNavigationItemTypeItem,\n MobileNavigationMenuProps,\n ProfileMenu,\n MenuNavigationItemTypeSection,\n MobileMenuButtonTypes,\n MenuSwitcherButton,\n MenuNavigationCustomSubMenu\n} from '../types';\nimport MobileMenuHeader from './MobileMenuHeader';\nimport MobileMenuContent from './MobileMenuContent';\nimport {useStackState} from '../../common/StackState';\nimport {useMediaMatch} from \"rooks\";\n\nconst Wrapper = styled.div`\n width: 320px;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n box-sizing: border-box;\n\n display: flex;\n flex-direction: column;\n gap: 8px;\n\n ${BREAKPOINTS.SMALL} {\n width: 400px;\n }\n`;\n\nconst SwitcherLabel = styled.div`\n margin-left: auto;\n`;\n\nconst MobileFooter = styled.div`\n display: flex;\n align-items: center;\n box-sizing: border-box;\n height: 48px;\n\n padding: 0 4px 0 16px;\n border-top: 1px solid ${COLORS.neutral_200};\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n padding: 4px 8px 4px 16px;\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n }\n`;\n\nconst CustomContent = styled.div`\n width: 100%;\n box-sizing: border-box;\n flex-flow: column;\n display: flex;\n flex: 1;\n overflow: hidden;\n`;\n\ntype Props = MobileNavigationMenuProps & {\n profile?: ProfileMenu;\n show?: boolean;\n onClose: () => void;\n};\n\ninterface MenuState {\n header: {\n label?: string;\n buttons?: MobileMenuButtonTypes[];\n }\n content?: {\n header?: MenuGroupHeader;\n items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n footer?: MenuGroupFooter;\n action?: MenuButton;\n },\n customContent?: () => React.ReactNode;\n footer?: boolean;\n}\n\nconst MobileMenu = ({\n show,\n profile,\n buttons,\n label,\n header,\n items,\n footer,\n action,\n onClose,\n }: Props) => {\n\n const {reset, length, push, pop, peek} = useStackState<MenuState>();\n\n const isMediumScreen = useMediaMatch(BREAKPOINTS.LARGE.replace('@media ', ''));\n\n const location = useLocation();\n\n const onSubMenuOpen = (menu?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => {\n\n switch (menu?.type) {\n case 'group':\n push({\n header: {\n label: menu.label,\n buttons: menu.buttons,\n },\n content: {\n header: menu.header,\n items: menu.items,\n footer: menu.footer,\n action: menu.action\n },\n footer: false\n });\n break;\n case 'custom':\n push({\n header: {\n label: menu.label,\n buttons: menu.buttons,\n },\n customContent: menu.custom,\n footer: false\n });\n break;\n default:\n break;\n }\n\n };\n\n React.useEffect(() => {\n onClose();\n }, [location]);\n\n React.useEffect(() => {\n isMediumScreen && onClose()\n }, [isMediumScreen]);\n\n React.useEffect(() => {\n setTimeout(() => {\n reset({\n footer: true,\n header: {\n label: label,\n buttons: buttons,\n },\n content: {\n header: header,\n items: items,\n footer: footer,\n action: action\n }\n })\n }, 300)\n }, [show])\n\n\n const current = peek();\n\n const switcher = current?.header?.buttons?.find(a => a.type === 'switcher') as MenuSwitcherButton;\n\n return (\n <Wrapper>\n <MobileMenuHeader buttons={current?.header.buttons}\n onGoBack={length > 1 ? pop : undefined}\n onSubMenuOpen={onSubMenuOpen}\n profile={profile}\n label={current?.header.label}\n onClose={onClose}/>\n {current?.customContent && <CustomContent>{current?.customContent()}</CustomContent>}\n {current?.content && <MobileMenuContent header={current?.content.header}\n items={current?.content.items}\n footer={current?.content.footer}\n action={current?.content.action}\n onSubMenuOpen={onSubMenuOpen}/>}\n\n {\n current?.footer &&\n <MobileFooter>\n <LaerdalLogo height={'36px'} width={'66px'}/>\n {switcher &&\n <>\n <SwitcherLabel className={'globalNav-toggler'} onClick={() => switcher.action && switcher.action() && onClose()}>Switch site</SwitcherLabel>\n <IconButton\n variant={'secondary'}\n shape={'circular'}\n id=\"globalNavAppsButton\"\n action={() => switcher.action && switcher.action() && onClose()}>\n <SwitchApp size=\"24px\"/>\n </IconButton>\n </>\n }\n\n </MobileFooter>\n }\n </Wrapper>\n );\n};\n\nexport default MobileMenu;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MobileMenu.js","names":["React","styled","BREAKPOINTS","COLORS","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","SwitchApp","useLocation","IconButton","LaerdalLogo","MobileMenuHeader","MobileMenuContent","useStackState","useMediaMatch","Wrapper","div","off_canvas","SMALL","SwitcherLabel","MobileFooter","neutral_200","Bold","neutral_600","CustomContent","MobileMenu","show","profile","buttons","label","header","items","footer","action","onClose","reset","length","push","pop","peek","isMediumScreen","LARGE","replace","location","onSubMenuOpen","menu","type","content","customContent","custom","useEffect","setTimeout","current","switcher","find","a","undefined"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, Z_INDEXES} from '../../styles';\nimport {SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport {useLocation} from 'react-router-dom';\nimport {IconButton} from '../../Button';\nimport {LaerdalLogo} from '../../assets';\nimport {\n MenuAccountInfo,\n MenuButton,\n MenuNavigationItemTypeGroup,\n MenuGroupFooter,\n MenuGroupHeader,\n MenuIconButton,\n MenuNavigationItemTypeItem,\n MobileNavigationMenuProps,\n ProfileMenu,\n MenuNavigationItemTypeSection,\n MobileMenuButtonTypes,\n MenuSwitcherButton,\n MenuNavigationCustomSubMenu\n} from '../types';\nimport MobileMenuHeader from './MobileMenuHeader';\nimport MobileMenuContent from './MobileMenuContent';\nimport {useStackState} from '../../common/StackState';\nimport {useMediaMatch} from \"rooks\";\n\nconst Wrapper = styled.div`\n width: 320px;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n box-sizing: border-box;\n\n display: flex;\n flex-direction: column;\n gap: 8px;\n\n ${BREAKPOINTS.SMALL} {\n width: 400px;\n }\n`;\n\nconst SwitcherLabel = styled.div`\n margin-left: auto;\n`;\n\nconst MobileFooter = styled.div`\n display: flex;\n align-items: center;\n box-sizing: border-box;\n height: 48px;\n\n padding: 0 4px 0 16px;\n border-top: 1px solid ${COLORS.neutral_200};\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n padding: 4px 8px 4px 16px;\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n }\n`;\n\nconst CustomContent = styled.div`\n width: 100%;\n box-sizing: border-box;\n flex-flow: column;\n display: flex;\n flex: 1;\n overflow: hidden;\n`;\n\ntype Props = MobileNavigationMenuProps & {\n profile?: ProfileMenu;\n show?: boolean;\n onClose: () => void;\n};\n\ninterface MenuState {\n header: {\n label?: string;\n buttons?: MobileMenuButtonTypes[];\n }\n content?: {\n header?: MenuGroupHeader;\n items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n footer?: MenuGroupFooter;\n action?: MenuButton;\n },\n customContent?: () => React.ReactNode;\n footer?: boolean;\n}\n\nconst MobileMenu = ({\n show,\n profile,\n buttons,\n label,\n header,\n items,\n footer,\n action,\n onClose,\n }: Props) => {\n\n const {reset, length, push, pop, peek} = useStackState<MenuState>();\n\n const isMediumScreen = useMediaMatch(BREAKPOINTS.LARGE.replace('@media ', ''));\n\n const location = useLocation();\n\n const onSubMenuOpen = (menu?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => {\n\n switch (menu?.type) {\n case 'group':\n push({\n header: {\n label: menu.label,\n buttons: menu.buttons,\n },\n content: {\n header: menu.header,\n items: menu.items,\n footer: menu.footer,\n action: menu.action\n },\n footer: false\n });\n break;\n case 'custom':\n push({\n header: {\n label: menu.label,\n buttons: menu.buttons,\n },\n customContent: menu.custom,\n footer: false\n });\n break;\n default:\n break;\n }\n\n };\n\n React.useEffect(() => {\n onClose();\n }, [location]);\n\n React.useEffect(() => {\n isMediumScreen && onClose()\n }, [isMediumScreen]);\n\n React.useEffect(() => {\n setTimeout(() => {\n reset({\n footer: true,\n header: {\n label: label,\n buttons: buttons,\n },\n content: {\n header: header,\n items: items,\n footer: footer,\n action: action\n }\n })\n }, 300)\n }, [show])\n\n\n const current = peek();\n\n const switcher = current?.header?.buttons?.find(a => a.type === 'switcher') as MenuSwitcherButton;\n\n return (\n <Wrapper>\n <MobileMenuHeader buttons={current?.header.buttons}\n onGoBack={length > 1 ? pop : undefined}\n onSubMenuOpen={onSubMenuOpen}\n profile={profile}\n label={current?.header.label}\n onClose={onClose}/>\n {current?.customContent && <CustomContent>{current?.customContent()}</CustomContent>}\n {current?.content && <MobileMenuContent header={current?.content.header}\n items={current?.content.items}\n footer={current?.content.footer}\n action={current?.content.action}\n onSubMenuOpen={onSubMenuOpen}/>}\n\n {\n current?.footer &&\n <MobileFooter>\n <LaerdalLogo height={'36px'} width={'66px'}/>\n {switcher &&\n <>\n <SwitcherLabel className={'globalNav-toggler'} onClick={() => switcher.action && switcher.action() && onClose()}>Switch site</SwitcherLabel>\n <IconButton\n variant={'secondary'}\n shape={'circular'}\n id=\"globalNavAppsButton\"\n action={() => switcher.action && switcher.action() && onClose()}>\n <SwitchApp size=\"24px\"/>\n </IconButton>\n </>\n }\n\n </MobileFooter>\n }\n </Wrapper>\n );\n};\n\nexport default MobileMenu;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MobileMenu.js","names":["React","styled","BREAKPOINTS","COLORS","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","SwitchApp","useLocation","IconButton","LaerdalLogo","MobileMenuHeader","MobileMenuContent","useStackState","useMediaMatch","Wrapper","div","off_canvas","SMALL","SwitcherLabel","MobileFooter","neutral_200","Bold","neutral_600","CustomContent","MobileMenu","show","profile","buttons","label","header","items","footer","action","onClose","reset","length","push","pop","peek","isMediumScreen","LARGE","replace","location","onSubMenuOpen","menu","type","content","customContent","custom","useEffect","setTimeout","current","switcher","find","a","undefined"],"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentSStyling, ComponentTextStyle, ComponentXSStyling, Z_INDEXES} from '../../styles';\nimport {SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport {useLocation} from 'react-router-dom';\nimport {IconButton} from '../../Button';\nimport {LaerdalLogo} from '../../assets';\nimport {\n MenuAccountInfo,\n MenuButton,\n MenuNavigationItemTypeGroup,\n MenuGroupFooter,\n MenuGroupHeader,\n MenuIconButton,\n MenuNavigationItemTypeItem,\n MobileNavigationMenuProps,\n ProfileMenu,\n MenuNavigationItemTypeSection,\n MobileMenuButtonTypes,\n MenuSwitcherButton,\n MenuNavigationCustomSubMenu\n} from '../types';\nimport MobileMenuHeader from './MobileMenuHeader';\nimport MobileMenuContent from './MobileMenuContent';\nimport {useStackState} from '../../common/StackState';\nimport {useMediaMatch} from \"rooks\";\n\nconst Wrapper = styled.div`\n width: 320px;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n box-sizing: border-box;\n\n display: flex;\n flex-direction: column;\n gap: 8px;\n\n ${BREAKPOINTS.SMALL} {\n width: 400px;\n }\n`;\n\nconst SwitcherLabel = styled.div`\n margin-left: auto;\n`;\n\nconst MobileFooter = styled.div`\n display: flex;\n align-items: center;\n box-sizing: border-box;\n height: 48px;\n\n padding: 0 4px 0 16px;\n border-top: 1px solid ${COLORS.neutral_200};\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n padding: 4px 8px 4px 16px;\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n }\n`;\n\nconst CustomContent = styled.div`\n width: 100%;\n box-sizing: border-box;\n flex-flow: column;\n display: flex;\n flex: 1;\n overflow: hidden;\n`;\n\ntype Props = MobileNavigationMenuProps & {\n profile?: ProfileMenu;\n show?: boolean;\n onClose: () => void;\n};\n\ninterface MenuState {\n header: {\n label?: string;\n buttons?: MobileMenuButtonTypes[];\n }\n content?: {\n header?: MenuGroupHeader;\n items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection)[];\n footer?: MenuGroupFooter;\n action?: MenuButton;\n },\n customContent?: () => React.ReactNode;\n footer?: boolean;\n}\n\nconst MobileMenu = ({\n show,\n profile,\n buttons,\n label,\n header,\n items,\n footer,\n action,\n onClose,\n }: Props) => {\n\n const {reset, length, push, pop, peek} = useStackState<MenuState>();\n\n const isMediumScreen = useMediaMatch(BREAKPOINTS.LARGE.replace('@media ', ''));\n\n const location = useLocation();\n\n const onSubMenuOpen = (menu?: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu) => {\n\n switch (menu?.type) {\n case 'group':\n push({\n header: {\n label: menu.label,\n buttons: menu.buttons,\n },\n content: {\n header: menu.header,\n items: menu.items,\n footer: menu.footer,\n action: menu.action\n },\n footer: false\n });\n break;\n case 'custom':\n push({\n header: {\n label: menu.label,\n buttons: menu.buttons,\n },\n customContent: menu.custom,\n footer: false\n });\n break;\n default:\n break;\n }\n\n };\n\n React.useEffect(() => {\n onClose();\n }, [location]);\n\n React.useEffect(() => {\n isMediumScreen && onClose()\n }, [isMediumScreen]);\n\n React.useEffect(() => {\n setTimeout(() => {\n reset({\n footer: true,\n header: {\n label: label,\n buttons: buttons,\n },\n content: {\n header: header,\n items: items,\n footer: footer,\n action: action\n }\n })\n }, 300)\n }, [show])\n\n\n const current = peek();\n\n const switcher = current?.header?.buttons?.find(a => a.type === 'switcher') as MenuSwitcherButton;\n\n return (\n <Wrapper>\n <MobileMenuHeader buttons={current?.header.buttons}\n onGoBack={length > 1 ? pop : undefined}\n onSubMenuOpen={onSubMenuOpen}\n profile={profile}\n label={current?.header.label}\n onClose={onClose}/>\n {current?.customContent && <CustomContent>{current?.customContent()}</CustomContent>}\n {current?.content && <MobileMenuContent header={current?.content.header}\n items={current?.content.items}\n footer={current?.content.footer}\n action={current?.content.action}\n onSubMenuOpen={onSubMenuOpen}/>}\n\n {\n current?.footer &&\n <MobileFooter>\n <LaerdalLogo height={'36px'} width={'66px'}/>\n {switcher &&\n <>\n <SwitcherLabel className={'globalNav-toggler'} onClick={() => switcher.action && switcher.action() && onClose()}>Switch site</SwitcherLabel>\n <IconButton\n variant={'secondary'}\n shape={'circular'}\n id=\"globalNavAppsButton\"\n action={() => switcher.action && switcher.action() && onClose()}>\n <SwitchApp size=\"24px\"/>\n </IconButton>\n </>\n }\n\n </MobileFooter>\n }\n </Wrapper>\n );\n};\n\nexport default MobileMenu;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.cjs","names":[],"sources":["../../src/GlobalNavigationBar/types.tsx"],"sourcesContent":["import React from 'react';\nimport { HyperlinkProps } from '../HyperLink/HyperLink';\nimport { IconButtonProps } from '../Button/Iconbutton';\nimport { ProfileButtonProps } from '../ProfileButton/ProfileButton';\nimport { NavLinkProps } from 'react-router-dom';\nimport {ButtonProps} from \"../Button/Button\";\nimport {TooltipProps} from \"../Tooltips/TooltipTypes\";\n\nexport interface MenuHyperLinkProps extends Pick<HyperlinkProps, 'id' | 'href' | 'onClick' | 'target'> {\n label: string;\n icon?: React.ReactElement;\n}\n\nexport interface MenuButton extends Omit<ButtonProps, 'onClick' | 'children' | 'size'> {\n label: string;\n action: () => void;\n\n tooltip?: TooltipProps;\n}\n\nexport interface MenuGroupFooter {\n header: string;\n note?: string;\n link?: MenuHyperLinkProps;\n}\n\nexport interface MenuGroupHeader {\n header: string;\n note?: string;\n link?: MenuHyperLinkProps;\n}\n\nexport interface MenuAccountInfo {\n firstName: string;\n lastName: string;\n email: string;\n link?: MenuHyperLinkProps;\n}\n\nexport interface ProfileMenu {\n label?: string;\n\n user: MenuAccountInfo;\n\n sections: MenuNavigationSection[];\n\n signOut?: MenuButton;\n}\n\nexport interface MenuIconSubMenuButton\n extends Omit<\n IconButtonProps,\n | 'type'\n | 'action'\n | 'shape'\n | 'variant'\n | 'hideOnLowWidth'\n | 'flatEdge'\n | 'isInMobileMenu'\n | 'useTransparentBackground'\n | 'shouldNotInteract'\n | 'iconColor'\n | 'unsetIconSize'\n | 'borderRadius'\n | 'focusBackgroundColor'\n | 'children'\n | 'invertFocus'\n > {\n type: 'submenu';\n icon: React.ReactNode;\n menu: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu;\n placement?: 'left' | 'right';\n}\n\nexport interface MenuIconButton\n extends Omit<\n IconButtonProps,\n | 'type'\n | 'action'\n | 'shape'\n | 'variant'\n | 'hideOnLowWidth'\n | 'flatEdge'\n | 'isInMobileMenu'\n | 'useTransparentBackground'\n | 'shouldNotInteract'\n | 'iconColor'\n | 'unsetIconSize'\n | 'borderRadius'\n | 'focusBackgroundColor'\n | 'children'\n | 'invertFocus'\n > {\n type: 'action';\n icon: React.ReactNode;\n action: (button?: EventTarget) => boolean | void;\n placement?: 'left' | 'right';\n}\n\nexport interface MenuProfileButton extends Omit<ProfileButtonProps, 'type' | 'onClick' | 'initials' | 'hideOnLowWidth' | 'icon' | 'portraitSrc'> {\n type: 'profile';\n action?: (button?: EventTarget) => boolean | void;\n placement?: 'left' | 'right';\n}\n\nexport interface MenuSwitcherButton\n extends Omit<\n IconButtonProps,\n | 'id'\n | 'type'\n | 'action'\n | 'shape'\n | 'variant'\n | 'hideOnLowWidth'\n | 'flatEdge'\n | 'isInMobileMenu'\n | 'useTransparentBackground'\n | 'shouldNotInteract'\n | 'iconColor'\n | 'unsetIconSize'\n | 'borderRadius'\n | 'focusBackgroundColor'\n | 'children'\n | 'invertFocus'\n > {\n type: 'switcher';\n placement?: 'left' | 'right';\n action?: (button?: EventTarget) => boolean | void;\n}\n\nexport type DesktopMenuButtonTypes = MenuIconButton | MenuProfileButton | MenuSwitcherButton;\nexport type MobileMenuButtonTypes = MenuIconSubMenuButton | MenuIconButton | MenuProfileButton | MenuSwitcherButton;\n\nexport interface MobileNavigationMenuProps {\n label?: string;\n buttons?: MobileMenuButtonTypes[];\n\n header?: MenuGroupHeader;\n\n items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup)[];\n\n footer?: MenuGroupFooter;\n action?: MenuButton;\n}\n\nexport interface DesktopNavigationMenuProps {\n buttons?: DesktopMenuButtonTypes[];\n items: MenuNavigationItemTypeItem[];\n action?: MenuButton;\n reverseRightSideOrder?: boolean;\n}\n\n// @ts-ignore\nexport interface MenuNavigationGroup<T = MenuNavigationItem | MenuNavigationSection | MenuNavigationGroup> {\n label: string;\n note?: string;\n\n buttons?: MobileMenuButtonTypes[];\n header?: MenuGroupHeader;\n\n items: T[];\n\n footer?: MenuGroupFooter;\n action?: MenuButton;\n}\n\nexport type MenuNavigationItem = {\n icon?: React.ReactNode;\n to: string;\n exact?: boolean;\n disabled?: boolean;\n external?: boolean;\n action?: (e: React.MouseEvent) => void;\n label: string;\n note?: string;\n pinned?: boolean;\n} & Omit<NavLinkProps, 'onClick' | 'to' | 'exact' | 'onMouseDown'>;\n\nexport interface MenuNavigationSection<T = MenuNavigationItem> {\n divider?: boolean;\n pinned?: boolean;\n label?: string;\n items: T[];\n}\n\nexport type MenuNavigationItemTypeItem = MenuNavigationItem & {\n type?: 'item';\n};\n\nexport type MenuNavigationItemTypeGroup = MenuNavigationGroup<MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection> & {\n type: 'group';\n icon?: React.ReactNode;\n pinned?: boolean;\n disabled?: boolean;\n};\n\nexport type MenuNavigationItemTypeSection = MenuNavigationSection<MenuNavigationItemTypeItem> & {\n type: 'section';\n};\n\nexport type MenuNavigationCustomSubMenu = {\n type: 'custom';\n label?: string;\n buttons?: MobileMenuButtonTypes[];\n custom: () => React.ReactNode;\n};\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"types.cjs","names":[],"sources":["../../src/GlobalNavigationBar/types.tsx"],"sourcesContent":["import React from 'react';\nimport { HyperlinkProps } from '../HyperLink/HyperLink';\nimport { IconButtonProps } from '../Button/Iconbutton';\nimport { ProfileButtonProps } from '../ProfileButton/ProfileButton';\nimport { NavLinkProps } from 'react-router-dom';\nimport {ButtonProps} from \"../Button/Button\";\nimport {TooltipProps} from \"../Tooltips/TooltipTypes\";\n\nexport interface MenuHyperLinkProps extends Pick<HyperlinkProps, 'id' | 'href' | 'onClick' | 'target'> {\n label: string;\n icon?: React.ReactElement;\n}\n\nexport interface MenuButton extends Omit<ButtonProps, 'onClick' | 'children' | 'size'> {\n label: string;\n action: () => void;\n\n tooltip?: TooltipProps;\n}\n\nexport interface MenuGroupFooter {\n header: string;\n note?: string;\n link?: MenuHyperLinkProps;\n}\n\nexport interface MenuGroupHeader {\n header: string;\n note?: string;\n link?: MenuHyperLinkProps;\n}\n\nexport interface MenuAccountInfo {\n firstName: string;\n lastName: string;\n email: string;\n link?: MenuHyperLinkProps;\n}\n\nexport interface ProfileMenu {\n label?: string;\n\n user: MenuAccountInfo;\n\n sections: MenuNavigationSection[];\n\n signOut?: MenuButton;\n}\n\nexport interface MenuIconSubMenuButton\n extends Omit<\n IconButtonProps,\n | 'type'\n | 'action'\n | 'shape'\n | 'variant'\n | 'hideOnLowWidth'\n | 'flatEdge'\n | 'isInMobileMenu'\n | 'useTransparentBackground'\n | 'shouldNotInteract'\n | 'iconColor'\n | 'unsetIconSize'\n | 'borderRadius'\n | 'focusBackgroundColor'\n | 'children'\n | 'invertFocus'\n > {\n type: 'submenu';\n icon: React.ReactNode;\n menu: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu;\n placement?: 'left' | 'right';\n}\n\nexport interface MenuIconButton\n extends Omit<\n IconButtonProps,\n | 'type'\n | 'action'\n | 'shape'\n | 'variant'\n | 'hideOnLowWidth'\n | 'flatEdge'\n | 'isInMobileMenu'\n | 'useTransparentBackground'\n | 'shouldNotInteract'\n | 'iconColor'\n | 'unsetIconSize'\n | 'borderRadius'\n | 'focusBackgroundColor'\n | 'children'\n | 'invertFocus'\n > {\n type: 'action';\n icon: React.ReactNode;\n action: (button?: EventTarget) => boolean | void;\n placement?: 'left' | 'right';\n}\n\nexport interface MenuProfileButton extends Omit<ProfileButtonProps, 'type' | 'onClick' | 'initials' | 'hideOnLowWidth' | 'icon' | 'portraitSrc'> {\n type: 'profile';\n action?: (button?: EventTarget) => boolean | void;\n placement?: 'left' | 'right';\n}\n\nexport interface MenuSwitcherButton\n extends Omit<\n IconButtonProps,\n | 'id'\n | 'type'\n | 'action'\n | 'shape'\n | 'variant'\n | 'hideOnLowWidth'\n | 'flatEdge'\n | 'isInMobileMenu'\n | 'useTransparentBackground'\n | 'shouldNotInteract'\n | 'iconColor'\n | 'unsetIconSize'\n | 'borderRadius'\n | 'focusBackgroundColor'\n | 'children'\n | 'invertFocus'\n > {\n type: 'switcher';\n placement?: 'left' | 'right';\n action?: (button?: EventTarget) => boolean | void;\n}\n\nexport type DesktopMenuButtonTypes = MenuIconButton | MenuProfileButton | MenuSwitcherButton;\nexport type MobileMenuButtonTypes = MenuIconSubMenuButton | MenuIconButton | MenuProfileButton | MenuSwitcherButton;\n\nexport interface MobileNavigationMenuProps {\n label?: string;\n buttons?: MobileMenuButtonTypes[];\n\n header?: MenuGroupHeader;\n\n items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup)[];\n\n footer?: MenuGroupFooter;\n action?: MenuButton;\n}\n\nexport interface DesktopNavigationMenuProps {\n buttons?: DesktopMenuButtonTypes[];\n items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\n action?: MenuButton;\n reverseRightSideOrder?: boolean;\n}\n\n// @ts-ignore\nexport interface MenuNavigationGroup<T = MenuNavigationItemTypeDesktopGroup | MenuNavigationItem | MenuNavigationSection | MenuNavigationGroup> {\n label: string;\n note?: string;\n\n buttons?: MobileMenuButtonTypes[];\n header?: MenuGroupHeader;\n\n items: T[];\n\n footer?: MenuGroupFooter;\n action?: MenuButton;\n}\n\nexport type MenuNavigationItem = {\n icon?: React.ReactNode;\n to: string;\n exact?: boolean;\n disabled?: boolean;\n external?: boolean;\n action?: (e: React.MouseEvent) => void;\n label: string;\n note?: string;\n pinned?: boolean;\n subItems?: MenuNavigationItem[];\n} & Omit<NavLinkProps, 'onClick' | 'to' | 'exact' | 'onMouseDown'>;\n\nexport interface MenuNavigationSection<T = MenuNavigationItem> {\n divider?: boolean;\n pinned?: boolean;\n label?: string;\n items: T[];\n}\n\nexport type MenuNavigationItemTypeItem = MenuNavigationItem & {\n type?: 'item';\n};\n\nexport type MenuNavigationItemTypeDesktopGroup = {\n id: string;\n label?: string;\n disabled?: boolean;\n pinned?: boolean;\n type?: 'desktopgroup';\n expanded?: boolean;\n items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\n}\n\nexport type MenuNavigationItemTypeGroup = MenuNavigationGroup<MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection> & {\n type: 'group';\n icon?: React.ReactNode;\n pinned?: boolean;\n disabled?: boolean;\n};\n\nexport type MenuNavigationItemTypeSection = MenuNavigationSection<MenuNavigationItemTypeItem> & {\n type: 'section';\n};\n\nexport type MenuNavigationCustomSubMenu = {\n type: 'custom';\n label?: string;\n buttons?: MobileMenuButtonTypes[];\n custom: () => React.ReactNode;\n};\n"],"mappings":""}
|
|
@@ -70,11 +70,11 @@ export interface MobileNavigationMenuProps {
|
|
|
70
70
|
}
|
|
71
71
|
export interface DesktopNavigationMenuProps {
|
|
72
72
|
buttons?: DesktopMenuButtonTypes[];
|
|
73
|
-
items: MenuNavigationItemTypeItem[];
|
|
73
|
+
items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];
|
|
74
74
|
action?: MenuButton;
|
|
75
75
|
reverseRightSideOrder?: boolean;
|
|
76
76
|
}
|
|
77
|
-
export interface MenuNavigationGroup<T = MenuNavigationItem | MenuNavigationSection | MenuNavigationGroup> {
|
|
77
|
+
export interface MenuNavigationGroup<T = MenuNavigationItemTypeDesktopGroup | MenuNavigationItem | MenuNavigationSection | MenuNavigationGroup> {
|
|
78
78
|
label: string;
|
|
79
79
|
note?: string;
|
|
80
80
|
buttons?: MobileMenuButtonTypes[];
|
|
@@ -93,6 +93,7 @@ export type MenuNavigationItem = {
|
|
|
93
93
|
label: string;
|
|
94
94
|
note?: string;
|
|
95
95
|
pinned?: boolean;
|
|
96
|
+
subItems?: MenuNavigationItem[];
|
|
96
97
|
} & Omit<NavLinkProps, 'onClick' | 'to' | 'exact' | 'onMouseDown'>;
|
|
97
98
|
export interface MenuNavigationSection<T = MenuNavigationItem> {
|
|
98
99
|
divider?: boolean;
|
|
@@ -103,6 +104,15 @@ export interface MenuNavigationSection<T = MenuNavigationItem> {
|
|
|
103
104
|
export type MenuNavigationItemTypeItem = MenuNavigationItem & {
|
|
104
105
|
type?: 'item';
|
|
105
106
|
};
|
|
107
|
+
export type MenuNavigationItemTypeDesktopGroup = {
|
|
108
|
+
id: string;
|
|
109
|
+
label?: string;
|
|
110
|
+
disabled?: boolean;
|
|
111
|
+
pinned?: boolean;
|
|
112
|
+
type?: 'desktopgroup';
|
|
113
|
+
expanded?: boolean;
|
|
114
|
+
items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];
|
|
115
|
+
};
|
|
106
116
|
export type MenuNavigationItemTypeGroup = MenuNavigationGroup<MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection> & {
|
|
107
117
|
type: 'group';
|
|
108
118
|
icon?: React.ReactNode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","names":[],"sources":["../../src/GlobalNavigationBar/types.tsx"],"sourcesContent":["import React from 'react';\nimport { HyperlinkProps } from '../HyperLink/HyperLink';\nimport { IconButtonProps } from '../Button/Iconbutton';\nimport { ProfileButtonProps } from '../ProfileButton/ProfileButton';\nimport { NavLinkProps } from 'react-router-dom';\nimport {ButtonProps} from \"../Button/Button\";\nimport {TooltipProps} from \"../Tooltips/TooltipTypes\";\n\nexport interface MenuHyperLinkProps extends Pick<HyperlinkProps, 'id' | 'href' | 'onClick' | 'target'> {\n label: string;\n icon?: React.ReactElement;\n}\n\nexport interface MenuButton extends Omit<ButtonProps, 'onClick' | 'children' | 'size'> {\n label: string;\n action: () => void;\n\n tooltip?: TooltipProps;\n}\n\nexport interface MenuGroupFooter {\n header: string;\n note?: string;\n link?: MenuHyperLinkProps;\n}\n\nexport interface MenuGroupHeader {\n header: string;\n note?: string;\n link?: MenuHyperLinkProps;\n}\n\nexport interface MenuAccountInfo {\n firstName: string;\n lastName: string;\n email: string;\n link?: MenuHyperLinkProps;\n}\n\nexport interface ProfileMenu {\n label?: string;\n\n user: MenuAccountInfo;\n\n sections: MenuNavigationSection[];\n\n signOut?: MenuButton;\n}\n\nexport interface MenuIconSubMenuButton\n extends Omit<\n IconButtonProps,\n | 'type'\n | 'action'\n | 'shape'\n | 'variant'\n | 'hideOnLowWidth'\n | 'flatEdge'\n | 'isInMobileMenu'\n | 'useTransparentBackground'\n | 'shouldNotInteract'\n | 'iconColor'\n | 'unsetIconSize'\n | 'borderRadius'\n | 'focusBackgroundColor'\n | 'children'\n | 'invertFocus'\n > {\n type: 'submenu';\n icon: React.ReactNode;\n menu: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu;\n placement?: 'left' | 'right';\n}\n\nexport interface MenuIconButton\n extends Omit<\n IconButtonProps,\n | 'type'\n | 'action'\n | 'shape'\n | 'variant'\n | 'hideOnLowWidth'\n | 'flatEdge'\n | 'isInMobileMenu'\n | 'useTransparentBackground'\n | 'shouldNotInteract'\n | 'iconColor'\n | 'unsetIconSize'\n | 'borderRadius'\n | 'focusBackgroundColor'\n | 'children'\n | 'invertFocus'\n > {\n type: 'action';\n icon: React.ReactNode;\n action: (button?: EventTarget) => boolean | void;\n placement?: 'left' | 'right';\n}\n\nexport interface MenuProfileButton extends Omit<ProfileButtonProps, 'type' | 'onClick' | 'initials' | 'hideOnLowWidth' | 'icon' | 'portraitSrc'> {\n type: 'profile';\n action?: (button?: EventTarget) => boolean | void;\n placement?: 'left' | 'right';\n}\n\nexport interface MenuSwitcherButton\n extends Omit<\n IconButtonProps,\n | 'id'\n | 'type'\n | 'action'\n | 'shape'\n | 'variant'\n | 'hideOnLowWidth'\n | 'flatEdge'\n | 'isInMobileMenu'\n | 'useTransparentBackground'\n | 'shouldNotInteract'\n | 'iconColor'\n | 'unsetIconSize'\n | 'borderRadius'\n | 'focusBackgroundColor'\n | 'children'\n | 'invertFocus'\n > {\n type: 'switcher';\n placement?: 'left' | 'right';\n action?: (button?: EventTarget) => boolean | void;\n}\n\nexport type DesktopMenuButtonTypes = MenuIconButton | MenuProfileButton | MenuSwitcherButton;\nexport type MobileMenuButtonTypes = MenuIconSubMenuButton | MenuIconButton | MenuProfileButton | MenuSwitcherButton;\n\nexport interface MobileNavigationMenuProps {\n label?: string;\n buttons?: MobileMenuButtonTypes[];\n\n header?: MenuGroupHeader;\n\n items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup)[];\n\n footer?: MenuGroupFooter;\n action?: MenuButton;\n}\n\nexport interface DesktopNavigationMenuProps {\n buttons?: DesktopMenuButtonTypes[];\n items: MenuNavigationItemTypeItem[];\n action?: MenuButton;\n reverseRightSideOrder?: boolean;\n}\n\n// @ts-ignore\nexport interface MenuNavigationGroup<T = MenuNavigationItem | MenuNavigationSection | MenuNavigationGroup> {\n label: string;\n note?: string;\n\n buttons?: MobileMenuButtonTypes[];\n header?: MenuGroupHeader;\n\n items: T[];\n\n footer?: MenuGroupFooter;\n action?: MenuButton;\n}\n\nexport type MenuNavigationItem = {\n icon?: React.ReactNode;\n to: string;\n exact?: boolean;\n disabled?: boolean;\n external?: boolean;\n action?: (e: React.MouseEvent) => void;\n label: string;\n note?: string;\n pinned?: boolean;\n} & Omit<NavLinkProps, 'onClick' | 'to' | 'exact' | 'onMouseDown'>;\n\nexport interface MenuNavigationSection<T = MenuNavigationItem> {\n divider?: boolean;\n pinned?: boolean;\n label?: string;\n items: T[];\n}\n\nexport type MenuNavigationItemTypeItem = MenuNavigationItem & {\n type?: 'item';\n};\n\nexport type MenuNavigationItemTypeGroup = MenuNavigationGroup<MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection> & {\n type: 'group';\n icon?: React.ReactNode;\n pinned?: boolean;\n disabled?: boolean;\n};\n\nexport type MenuNavigationItemTypeSection = MenuNavigationSection<MenuNavigationItemTypeItem> & {\n type: 'section';\n};\n\nexport type MenuNavigationCustomSubMenu = {\n type: 'custom';\n label?: string;\n buttons?: MobileMenuButtonTypes[];\n custom: () => React.ReactNode;\n};\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"types.js","names":[],"sources":["../../src/GlobalNavigationBar/types.tsx"],"sourcesContent":["import React from 'react';\nimport { HyperlinkProps } from '../HyperLink/HyperLink';\nimport { IconButtonProps } from '../Button/Iconbutton';\nimport { ProfileButtonProps } from '../ProfileButton/ProfileButton';\nimport { NavLinkProps } from 'react-router-dom';\nimport {ButtonProps} from \"../Button/Button\";\nimport {TooltipProps} from \"../Tooltips/TooltipTypes\";\n\nexport interface MenuHyperLinkProps extends Pick<HyperlinkProps, 'id' | 'href' | 'onClick' | 'target'> {\n label: string;\n icon?: React.ReactElement;\n}\n\nexport interface MenuButton extends Omit<ButtonProps, 'onClick' | 'children' | 'size'> {\n label: string;\n action: () => void;\n\n tooltip?: TooltipProps;\n}\n\nexport interface MenuGroupFooter {\n header: string;\n note?: string;\n link?: MenuHyperLinkProps;\n}\n\nexport interface MenuGroupHeader {\n header: string;\n note?: string;\n link?: MenuHyperLinkProps;\n}\n\nexport interface MenuAccountInfo {\n firstName: string;\n lastName: string;\n email: string;\n link?: MenuHyperLinkProps;\n}\n\nexport interface ProfileMenu {\n label?: string;\n\n user: MenuAccountInfo;\n\n sections: MenuNavigationSection[];\n\n signOut?: MenuButton;\n}\n\nexport interface MenuIconSubMenuButton\n extends Omit<\n IconButtonProps,\n | 'type'\n | 'action'\n | 'shape'\n | 'variant'\n | 'hideOnLowWidth'\n | 'flatEdge'\n | 'isInMobileMenu'\n | 'useTransparentBackground'\n | 'shouldNotInteract'\n | 'iconColor'\n | 'unsetIconSize'\n | 'borderRadius'\n | 'focusBackgroundColor'\n | 'children'\n | 'invertFocus'\n > {\n type: 'submenu';\n icon: React.ReactNode;\n menu: MenuNavigationItemTypeGroup | MenuNavigationCustomSubMenu;\n placement?: 'left' | 'right';\n}\n\nexport interface MenuIconButton\n extends Omit<\n IconButtonProps,\n | 'type'\n | 'action'\n | 'shape'\n | 'variant'\n | 'hideOnLowWidth'\n | 'flatEdge'\n | 'isInMobileMenu'\n | 'useTransparentBackground'\n | 'shouldNotInteract'\n | 'iconColor'\n | 'unsetIconSize'\n | 'borderRadius'\n | 'focusBackgroundColor'\n | 'children'\n | 'invertFocus'\n > {\n type: 'action';\n icon: React.ReactNode;\n action: (button?: EventTarget) => boolean | void;\n placement?: 'left' | 'right';\n}\n\nexport interface MenuProfileButton extends Omit<ProfileButtonProps, 'type' | 'onClick' | 'initials' | 'hideOnLowWidth' | 'icon' | 'portraitSrc'> {\n type: 'profile';\n action?: (button?: EventTarget) => boolean | void;\n placement?: 'left' | 'right';\n}\n\nexport interface MenuSwitcherButton\n extends Omit<\n IconButtonProps,\n | 'id'\n | 'type'\n | 'action'\n | 'shape'\n | 'variant'\n | 'hideOnLowWidth'\n | 'flatEdge'\n | 'isInMobileMenu'\n | 'useTransparentBackground'\n | 'shouldNotInteract'\n | 'iconColor'\n | 'unsetIconSize'\n | 'borderRadius'\n | 'focusBackgroundColor'\n | 'children'\n | 'invertFocus'\n > {\n type: 'switcher';\n placement?: 'left' | 'right';\n action?: (button?: EventTarget) => boolean | void;\n}\n\nexport type DesktopMenuButtonTypes = MenuIconButton | MenuProfileButton | MenuSwitcherButton;\nexport type MobileMenuButtonTypes = MenuIconSubMenuButton | MenuIconButton | MenuProfileButton | MenuSwitcherButton;\n\nexport interface MobileNavigationMenuProps {\n label?: string;\n buttons?: MobileMenuButtonTypes[];\n\n header?: MenuGroupHeader;\n\n items?: (MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup)[];\n\n footer?: MenuGroupFooter;\n action?: MenuButton;\n}\n\nexport interface DesktopNavigationMenuProps {\n buttons?: DesktopMenuButtonTypes[];\n items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\n action?: MenuButton;\n reverseRightSideOrder?: boolean;\n}\n\n// @ts-ignore\nexport interface MenuNavigationGroup<T = MenuNavigationItemTypeDesktopGroup | MenuNavigationItem | MenuNavigationSection | MenuNavigationGroup> {\n label: string;\n note?: string;\n\n buttons?: MobileMenuButtonTypes[];\n header?: MenuGroupHeader;\n\n items: T[];\n\n footer?: MenuGroupFooter;\n action?: MenuButton;\n}\n\nexport type MenuNavigationItem = {\n icon?: React.ReactNode;\n to: string;\n exact?: boolean;\n disabled?: boolean;\n external?: boolean;\n action?: (e: React.MouseEvent) => void;\n label: string;\n note?: string;\n pinned?: boolean;\n subItems?: MenuNavigationItem[];\n} & Omit<NavLinkProps, 'onClick' | 'to' | 'exact' | 'onMouseDown'>;\n\nexport interface MenuNavigationSection<T = MenuNavigationItem> {\n divider?: boolean;\n pinned?: boolean;\n label?: string;\n items: T[];\n}\n\nexport type MenuNavigationItemTypeItem = MenuNavigationItem & {\n type?: 'item';\n};\n\nexport type MenuNavigationItemTypeDesktopGroup = {\n id: string;\n label?: string;\n disabled?: boolean;\n pinned?: boolean;\n type?: 'desktopgroup';\n expanded?: boolean;\n items: (MenuNavigationItemTypeItem | MenuNavigationItemTypeDesktopGroup)[];\n}\n\nexport type MenuNavigationItemTypeGroup = MenuNavigationGroup<MenuNavigationItemTypeItem | MenuNavigationItemTypeGroup | MenuNavigationItemTypeSection> & {\n type: 'group';\n icon?: React.ReactNode;\n pinned?: boolean;\n disabled?: boolean;\n};\n\nexport type MenuNavigationItemTypeSection = MenuNavigationSection<MenuNavigationItemTypeItem> & {\n type: 'section';\n};\n\nexport type MenuNavigationCustomSubMenu = {\n type: 'custom';\n label?: string;\n buttons?: MobileMenuButtonTypes[];\n custom: () => React.ReactNode;\n};\n"],"mappings":""}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.checkIfContainsItem = void 0;
|
|
7
|
+
var checkIfContainsItem = function checkIfContainsItem(item, activeId) {
|
|
8
|
+
if (item.id == activeId) return true;
|
|
9
|
+
if (item.items.findIndex(function (x) {
|
|
10
|
+
return x.type == 'item' && x.to == activeId;
|
|
11
|
+
}) >= 0) return true;
|
|
12
|
+
return item.items.some(function (x) {
|
|
13
|
+
return x.type == 'desktopgroup' && checkIfContainsItem(x, activeId);
|
|
14
|
+
});
|
|
15
|
+
};
|
|
16
|
+
exports.checkIfContainsItem = checkIfContainsItem;
|
|
17
|
+
//# sourceMappingURL=utils.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.cjs","names":["checkIfContainsItem","item","activeId","id","items","findIndex","x","type","to","some"],"sources":["../../src/GlobalNavigationBar/utils.tsx"],"sourcesContent":["import { MenuNavigationItemTypeDesktopGroup } from './types';\n\nexport const checkIfContainsItem = (item: MenuNavigationItemTypeDesktopGroup, activeId: string) : boolean => {\n if(item.id == activeId)\n return true;\n if(item.items.findIndex(x => x.type == 'item' && x.to == activeId) >= 0)\n return true;\n return item.items.some(x => x.type == 'desktopgroup' && checkIfContainsItem(x, activeId));\n}"],"mappings":";;;;;;AAEO,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAmB,CAAIC,IAAwC,EAAEC,QAAgB,EAAe;EACzG,IAAGD,IAAI,CAACE,EAAE,IAAID,QAAQ,EAClB,OAAO,IAAI;EACf,IAAGD,IAAI,CAACG,KAAK,CAACC,SAAS,CAAC,UAAAC,CAAC;IAAA,OAAIA,CAAC,CAACC,IAAI,IAAI,MAAM,IAAID,CAAC,CAACE,EAAE,IAAIN,QAAQ;EAAA,EAAC,IAAI,CAAC,EACnE,OAAO,IAAI;EACf,OAAOD,IAAI,CAACG,KAAK,CAACK,IAAI,CAAC,UAAAH,CAAC;IAAA,OAAIA,CAAC,CAACC,IAAI,IAAI,cAAc,IAAIP,mBAAmB,CAACM,CAAC,EAAEJ,QAAQ,CAAC;EAAA,EAAC;AAC7F,CAAC;AAAA"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export var checkIfContainsItem = function checkIfContainsItem(item, activeId) {
|
|
2
|
+
if (item.id == activeId) return true;
|
|
3
|
+
if (item.items.findIndex(function (x) {
|
|
4
|
+
return x.type == 'item' && x.to == activeId;
|
|
5
|
+
}) >= 0) return true;
|
|
6
|
+
return item.items.some(function (x) {
|
|
7
|
+
return x.type == 'desktopgroup' && checkIfContainsItem(x, activeId);
|
|
8
|
+
});
|
|
9
|
+
};
|
|
10
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.js","names":["checkIfContainsItem","item","activeId","id","items","findIndex","x","type","to","some"],"sources":["../../src/GlobalNavigationBar/utils.tsx"],"sourcesContent":["import { MenuNavigationItemTypeDesktopGroup } from './types';\n\nexport const checkIfContainsItem = (item: MenuNavigationItemTypeDesktopGroup, activeId: string) : boolean => {\n if(item.id == activeId)\n return true;\n if(item.items.findIndex(x => x.type == 'item' && x.to == activeId) >= 0)\n return true;\n return item.items.some(x => x.type == 'desktopgroup' && checkIfContainsItem(x, activeId));\n}"],"mappings":"AAEA,OAAO,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAmB,CAAIC,IAAwC,EAAEC,QAAgB,EAAe;EACzG,IAAGD,IAAI,CAACE,EAAE,IAAID,QAAQ,EAClB,OAAO,IAAI;EACf,IAAGD,IAAI,CAACG,KAAK,CAACC,SAAS,CAAC,UAAAC,CAAC;IAAA,OAAIA,CAAC,CAACC,IAAI,IAAI,MAAM,IAAID,CAAC,CAACE,EAAE,IAAIN,QAAQ;EAAA,EAAC,IAAI,CAAC,EACnE,OAAO,IAAI;EACf,OAAOD,IAAI,CAACG,KAAK,CAACK,IAAI,CAAC,UAAAH,CAAC;IAAA,OAAIA,CAAC,CAACC,IAAI,IAAI,cAAc,IAAIP,mBAAmB,CAACM,CAAC,EAAEJ,QAAQ,CAAC;EAAA,EAAC;AAC7F,CAAC"}
|
|
@@ -13,8 +13,8 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
|
|
|
13
13
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
14
14
|
import { LoadingIndicator } from '..';
|
|
15
15
|
import React from 'react';
|
|
16
|
-
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
17
16
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
17
|
+
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
18
18
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
19
19
|
var ImageWithFallbacks = /*#__PURE__*/function (_React$Component) {
|
|
20
20
|
_inherits(ImageWithFallbacks, _React$Component);
|