@laerdal/life-react-components 1.10.3-dev.9.full → 1.11.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/Banners/Banner.cjs +58 -45
- package/dist/Banners/Banner.cjs.map +1 -1
- package/dist/Banners/Banner.d.ts +2 -1
- package/dist/Banners/Banner.js +56 -44
- package/dist/Banners/Banner.js.map +1 -1
- package/dist/Button/DualFunctionButton.cjs +1 -0
- package/dist/Button/DualFunctionButton.cjs.map +1 -1
- package/dist/Button/DualFunctionButton.js +1 -0
- package/dist/Button/DualFunctionButton.js.map +1 -1
- package/dist/Button/Iconbutton.cjs +0 -5
- package/dist/Button/Iconbutton.cjs.map +1 -1
- package/dist/Button/Iconbutton.d.ts +1 -7
- package/dist/Button/Iconbutton.js +0 -5
- package/dist/Button/Iconbutton.js.map +1 -1
- package/dist/ChipsInput/ChipDropdownInput.cjs +2 -1
- package/dist/ChipsInput/ChipDropdownInput.cjs.map +1 -1
- package/dist/ChipsInput/ChipDropdownInput.js +2 -1
- package/dist/ChipsInput/ChipDropdownInput.js.map +1 -1
- package/dist/Dropdown/BasicDropdown.cjs +9 -4
- package/dist/Dropdown/BasicDropdown.cjs.map +1 -1
- package/dist/Dropdown/BasicDropdown.d.ts +2 -2
- package/dist/Dropdown/BasicDropdown.js +9 -4
- package/dist/Dropdown/BasicDropdown.js.map +1 -1
- package/dist/Dropdown/CommonStyling.cjs +2 -2
- package/dist/Dropdown/CommonStyling.cjs.map +1 -1
- package/dist/Dropdown/CommonStyling.js +2 -2
- package/dist/Dropdown/CommonStyling.js.map +1 -1
- package/dist/Dropdown/DropdownButton.cjs +8 -4
- package/dist/Dropdown/DropdownButton.cjs.map +1 -1
- package/dist/Dropdown/DropdownButton.js +8 -4
- package/dist/Dropdown/DropdownButton.js.map +1 -1
- package/dist/Dropdown/DropdownContent.cjs +95 -54
- package/dist/Dropdown/DropdownContent.cjs.map +1 -1
- package/dist/Dropdown/DropdownContent.d.ts +3 -1
- package/dist/Dropdown/DropdownContent.js +93 -54
- package/dist/Dropdown/DropdownContent.js.map +1 -1
- package/dist/Dropdown/DropdownFilter.cjs +1 -1
- package/dist/Dropdown/DropdownFilter.cjs.map +1 -1
- package/dist/Dropdown/DropdownFilter.js +1 -1
- package/dist/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/Footer/Components/FooterNavSection.cjs +7 -2
- package/dist/Footer/Components/FooterNavSection.cjs.map +1 -1
- package/dist/Footer/Components/FooterNavSection.js +6 -2
- package/dist/Footer/Components/FooterNavSection.js.map +1 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs +17 -14
- package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs.map +1 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.d.ts +2 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.js +15 -13
- package/dist/GlobalNavigationBar/GlobalNavigationBar.js.map +1 -1
- package/dist/GlobalNavigationBar/Logo.cjs +4 -4
- package/dist/GlobalNavigationBar/Logo.cjs.map +1 -1
- package/dist/GlobalNavigationBar/Logo.js +4 -4
- package/dist/GlobalNavigationBar/Logo.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/DesktopActions.cjs +70 -36
- package/dist/GlobalNavigationBar/desktop/DesktopActions.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/DesktopActions.js +68 -36
- package/dist/GlobalNavigationBar/desktop/DesktopActions.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/MainMenu.cjs +48 -23
- package/dist/GlobalNavigationBar/desktop/MainMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/MainMenu.js +47 -23
- package/dist/GlobalNavigationBar/desktop/MainMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/RightSideNav.cjs +3 -3
- package/dist/GlobalNavigationBar/desktop/RightSideNav.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/RightSideNav.js +3 -3
- package/dist/GlobalNavigationBar/desktop/RightSideNav.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/UserMenu.cjs +3 -3
- package/dist/GlobalNavigationBar/desktop/UserMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/UserMenu.js +3 -3
- package/dist/GlobalNavigationBar/desktop/UserMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenu.js +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenuContent.cjs +3 -3
- package/dist/GlobalNavigationBar/mobile/MobileMenuContent.cjs.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenuContent.js +3 -3
- package/dist/GlobalNavigationBar/mobile/MobileMenuContent.js.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenuHeader.cjs +60 -31
- package/dist/GlobalNavigationBar/mobile/MobileMenuHeader.cjs.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenuHeader.js +59 -31
- package/dist/GlobalNavigationBar/mobile/MobileMenuHeader.js.map +1 -1
- package/dist/GlobalNavigationBar/types.d.ts +9 -10
- package/dist/InputFields/Label.cjs +16 -14
- package/dist/InputFields/Label.cjs.map +1 -1
- package/dist/InputFields/Label.d.ts +1 -0
- package/dist/InputFields/Label.js +15 -13
- package/dist/InputFields/Label.js.map +1 -1
- package/dist/InputFields/QuickSearch.cjs +1 -1
- package/dist/InputFields/QuickSearch.cjs.map +1 -1
- package/dist/InputFields/QuickSearch.js +1 -1
- package/dist/InputFields/QuickSearch.js.map +1 -1
- package/dist/InputFields/ResponsiveComponentWrapper.cjs +3 -3
- package/dist/InputFields/ResponsiveComponentWrapper.cjs.map +1 -1
- package/dist/InputFields/ResponsiveComponentWrapper.js +3 -3
- package/dist/InputFields/ResponsiveComponentWrapper.js.map +1 -1
- package/dist/InputFields/SearchBar.cjs +1 -0
- package/dist/InputFields/SearchBar.cjs.map +1 -1
- package/dist/InputFields/SearchBar.js +1 -0
- package/dist/InputFields/SearchBar.js.map +1 -1
- package/dist/List/ListRow.cjs +1 -1
- package/dist/List/ListRow.cjs.map +1 -1
- package/dist/List/ListRow.js +1 -1
- package/dist/List/ListRow.js.map +1 -1
- package/dist/MenuItem/MenuItem.cjs +4 -2
- package/dist/MenuItem/MenuItem.cjs.map +1 -1
- package/dist/MenuItem/MenuItem.js +4 -2
- package/dist/MenuItem/MenuItem.js.map +1 -1
- package/dist/Modals/ModalContainer.cjs +3 -3
- package/dist/Modals/ModalContainer.cjs.map +1 -1
- package/dist/Modals/ModalContainer.js +3 -3
- package/dist/Modals/ModalContainer.js.map +1 -1
- package/dist/Modals/ModalDialog.cjs +3 -5
- package/dist/Modals/ModalDialog.cjs.map +1 -1
- package/dist/Modals/ModalDialog.js +3 -6
- package/dist/Modals/ModalDialog.js.map +1 -1
- package/dist/Modals/ModalStyles.cjs +3 -3
- package/dist/Modals/ModalStyles.cjs.map +1 -1
- package/dist/Modals/ModalStyles.js +3 -3
- package/dist/Modals/ModalStyles.js.map +1 -1
- package/dist/ProfileButton/ProfileButton.cjs.map +1 -1
- package/dist/ProfileButton/ProfileButton.d.ts +8 -0
- package/dist/ProfileButton/ProfileButton.js.map +1 -1
- package/dist/Switcher/SwitcherMenuItem.cjs +4 -1
- package/dist/Switcher/SwitcherMenuItem.cjs.map +1 -1
- package/dist/Switcher/SwitcherMenuItem.js +3 -1
- package/dist/Switcher/SwitcherMenuItem.js.map +1 -1
- package/dist/Tabs/TabLink.cjs +2 -2
- package/dist/Tabs/TabLink.cjs.map +1 -1
- package/dist/Tabs/TabLink.d.ts +1 -1
- package/dist/Tabs/TabLink.js +2 -2
- package/dist/Tabs/TabLink.js.map +1 -1
- package/dist/Tabs/VerticalTabs.cjs +2 -2
- package/dist/Tabs/VerticalTabs.cjs.map +1 -1
- package/dist/Tabs/VerticalTabs.d.ts +1 -1
- package/dist/Tabs/VerticalTabs.js +2 -2
- package/dist/Tabs/VerticalTabs.js.map +1 -1
- package/dist/Toasters/Toast.cjs +1 -0
- package/dist/Toasters/Toast.cjs.map +1 -1
- package/dist/Toasters/Toast.js +1 -0
- package/dist/Toasters/Toast.js.map +1 -1
- package/dist/common/ClickOutside.cjs +1 -1
- package/dist/common/ClickOutside.cjs.map +1 -1
- package/dist/common/ClickOutside.js +1 -1
- package/dist/common/ClickOutside.js.map +1 -1
- package/dist/{GlobalNavigationBar → common}/NavigationHelper.cjs +0 -0
- package/dist/common/NavigationHelper.cjs.map +1 -0
- package/dist/{GlobalNavigationBar → common}/NavigationHelper.d.ts +0 -0
- package/dist/{GlobalNavigationBar → common}/NavigationHelper.js +0 -0
- package/dist/common/NavigationHelper.js.map +1 -0
- package/dist/styles/typography.cjs +3 -1
- package/dist/styles/typography.cjs.map +1 -1
- package/dist/styles/typography.js +3 -1
- package/dist/styles/typography.js.map +1 -1
- package/dist/utils/utils.cjs +13 -0
- package/dist/utils/utils.cjs.map +1 -0
- package/dist/utils/utils.d.ts +1 -0
- package/dist/utils/utils.js +4 -0
- package/dist/utils/utils.js.map +1 -0
- package/package.json +1 -1
- package/dist/GlobalNavigationBar/NavigationHelper.cjs.map +0 -1
- package/dist/GlobalNavigationBar/NavigationHelper.js.map +0 -1
- package/dist/hooks/useClickOutside.cjs +0 -39
- package/dist/hooks/useClickOutside.cjs.map +0 -1
- package/dist/hooks/useClickOutside.d.ts +0 -5
- package/dist/hooks/useClickOutside.js +0 -26
- package/dist/hooks/useClickOutside.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/GlobalNavigationBar/Logo.tsx"],"names":["StyledLink","Link","props","$color","BREAKPOINTS","MEDIUM","LogoContainer","styled","div","focusStyles","invertedFocusStyles","Name","span","COLORS","black","noSizeChangeOnMobile","ComponentTextStyle","Regular","BetaTag","backgroundColor","accent2_500","UppercaseBold","white","Logo","name","showBetaTag","onClick","to","color","betaTagBackgroundColor","betaTagColor","inverted","defaultOnMouseDownHandler"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAEA;;;;;;;;;;AAEA,IAAMA,UAAU,GAAG,+BAAOC,oBAAP,CAAH,+VAWH,UAACC,KAAD;AAAA,SAAWA,KAAK,CAACC,MAAjB;AAAA,CAXG,EAYVC,oBAAYC,MAZF,CAAhB;;AAmBA,IAAMC,aAAa,GAAGC,0BAAOC,GAAV,
|
|
1
|
+
{"version":3,"sources":["../../src/GlobalNavigationBar/Logo.tsx"],"names":["StyledLink","Link","props","$color","BREAKPOINTS","MEDIUM","LogoContainer","styled","div","LARGE","focusStyles","invertedFocusStyles","Name","span","COLORS","black","SMALL","noSizeChangeOnMobile","ComponentTextStyle","Regular","BetaTag","backgroundColor","accent2_500","UppercaseBold","white","Logo","name","showBetaTag","onClick","to","color","betaTagBackgroundColor","betaTagColor","inverted","defaultOnMouseDownHandler"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Link } from 'react-router-dom';\nimport styled from 'styled-components';\nimport { LaerdalLogo, LaerdalWhiteLogo } from '../assets';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles, invertedFocusStyles} from '../styles';\nimport { ComponentMStyling, ComponentXSStyling } from '../styles';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst StyledLink = styled(Link)<{ $color?: string }>`\n text-align: center;\n text-decoration: none;\n display: flex;\n align-items: center;\n &:focus-within {\n outline: none;\n }\n svg {\n width: 66px;\n height: 36px;\n color: ${(props) => props.$color};\n ${BREAKPOINTS.MEDIUM} {\n width: 88px;\n height: 48px;\n }\n }\n`;\n\nconst LogoContainer = styled.div`\n display: flex;\n max-width: calc(100% - 48px);\n overflow: hidden;\n align-items: center;\n height: 40px;\n margin-right: 16px;\n box-sizing: border-box;\n padding: 24px 0;\n\n ${BREAKPOINTS.LARGE} {\n margin-top: 8px;\n margin-bottom: 7px;\n }\n\n &:focus-within {\n ${focusStyles}\n }\n\n &.inverted:focus-within {\n ${invertedFocusStyles}\n }\n`;\n\nconst Name = styled.span<{ $color?: string; noSizeChangeOnMobile: boolean }>`\n margin-left: 8px;\n padding-left: 8px;\n border-left: 1px solid ${(props) => props.$color || COLORS.black};\n letter-spacing: -0.02em;\n max-width: 168px;\n ${BREAKPOINTS.SMALL} {\n max-width: 200px;\n }\n \n white-space: nowrap;\n overflow: hidden;\n\n ${(props) =>\n props.noSizeChangeOnMobile\n ? ComponentMStyling(ComponentTextStyle.Regular, props.$color || COLORS.black)\n : ComponentXSStyling(ComponentTextStyle.Regular, props.$color || COLORS.black)}\n\n font-weight: 300 !important;\n line-height: 24px !important;\n\n ${BREAKPOINTS.MEDIUM} {\n ${(props) => ComponentMStyling(ComponentTextStyle.Regular, props.$color || COLORS.black)};\n }\n\n ${BREAKPOINTS.LARGE} {\n margin-left: 12px;\n padding-left: 12px;\n }\n`;\n\nconst BetaTag = styled.span<{ backgroundColor?: string; $color?: string }>`\n background-color: ${(props) => props.backgroundColor || COLORS.accent2_500};\n padding: 4px 8px;\n margin-left: 8px;\n margin-top: 2px;\n border-left: none;\n border-radius: 2px;\n\n ${(props) => ComponentXSStyling(ComponentTextStyle.UppercaseBold, props.$color || COLORS.white)}\n`;\n\ntype LogoProps = {\n name: string;\n showBetaTag?: boolean;\n onClick?: () => void;\n to?: string;\n color?: string;\n noSizeChangeOnMobile?: boolean;\n betaTagBackgroundColor?: string;\n betaTagColor?: string;\n inverted?: boolean;\n};\n\nconst Logo = ({ name, showBetaTag, onClick, to, color, noSizeChangeOnMobile, betaTagBackgroundColor, betaTagColor, inverted }: LogoProps): React.ReactElement<LogoProps> => {\n return (\n <LogoContainer className={inverted ? 'inverted' : ''}>\n <StyledLink\n to={to || '/'}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => {\n if (onClick) {\n onClick();\n }\n }}\n $color={color}>\n {color === COLORS.white ? <LaerdalWhiteLogo /> : <LaerdalLogo />}\n <Name $color={color} noSizeChangeOnMobile={noSizeChangeOnMobile || false}>\n {name}\n </Name>\n {showBetaTag && (\n <BetaTag backgroundColor={betaTagBackgroundColor} $color={betaTagColor}>\n BETA\n </BetaTag>\n )}\n </StyledLink>\n </LogoContainer>\n );\n};\n\nexport default Logo;\n"],"file":"Logo.cjs"}
|
|
@@ -15,14 +15,14 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
15
15
|
var StyledLink = styled(Link)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n text-align: center;\n text-decoration: none;\n display: flex;\n align-items: center;\n &:focus-within {\n outline: none;\n }\n svg {\n width: 66px;\n height: 36px;\n color: ", ";\n ", " {\n width: 88px;\n height: 48px;\n }\n }\n"])), function (props) {
|
|
16
16
|
return props.$color;
|
|
17
17
|
}, BREAKPOINTS.MEDIUM);
|
|
18
|
-
var LogoContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n height: 40px;\n margin-right: 16px;\n box-sizing: border-box;\n padding: 24px 0;\n\n ", " {\n margin-top: 8px;\n margin-bottom: 7px;\n }\n\n &:focus-within {\n ", "\n }\n\n &.inverted:focus-within {\n ", "\n }\n"])), BREAKPOINTS.
|
|
19
|
-
var Name = styled.span(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n margin-left: 8px;\n padding-left: 8px;\n border-left: 1px solid ", ";\n letter-spacing: -0.02em;\n\n ", "\n\n font-weight: 300 !important;\n line-height: 24px !important;\n\n ", " {\n margin-left: 12px;\n padding-left: 12px;\n
|
|
18
|
+
var LogoContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n max-width: calc(100% - 48px);\n overflow: hidden;\n align-items: center;\n height: 40px;\n margin-right: 16px;\n box-sizing: border-box;\n padding: 24px 0;\n\n ", " {\n margin-top: 8px;\n margin-bottom: 7px;\n }\n\n &:focus-within {\n ", "\n }\n\n &.inverted:focus-within {\n ", "\n }\n"])), BREAKPOINTS.LARGE, focusStyles, invertedFocusStyles);
|
|
19
|
+
var Name = styled.span(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n margin-left: 8px;\n padding-left: 8px;\n border-left: 1px solid ", ";\n letter-spacing: -0.02em;\n max-width: 168px;\n ", " {\n max-width: 200px;\n }\n \n white-space: nowrap;\n overflow: hidden;\n\n ", "\n\n font-weight: 300 !important;\n line-height: 24px !important;\n\n ", " {\n ", ";\n }\n\n ", " {\n margin-left: 12px;\n padding-left: 12px;\n }\n"])), function (props) {
|
|
20
20
|
return props.$color || COLORS.black;
|
|
21
|
-
}, function (props) {
|
|
21
|
+
}, BREAKPOINTS.SMALL, function (props) {
|
|
22
22
|
return props.noSizeChangeOnMobile ? ComponentMStyling(ComponentTextStyle.Regular, props.$color || COLORS.black) : ComponentXSStyling(ComponentTextStyle.Regular, props.$color || COLORS.black);
|
|
23
23
|
}, BREAKPOINTS.MEDIUM, function (props) {
|
|
24
24
|
return ComponentMStyling(ComponentTextStyle.Regular, props.$color || COLORS.black);
|
|
25
|
-
});
|
|
25
|
+
}, BREAKPOINTS.LARGE);
|
|
26
26
|
var BetaTag = styled.span(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n background-color: ", ";\n padding: 4px 8px;\n margin-left: 8px;\n margin-top: 2px;\n border-left: none;\n border-radius: 2px;\n\n ", "\n"])), function (props) {
|
|
27
27
|
return props.backgroundColor || COLORS.accent2_500;
|
|
28
28
|
}, function (props) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/GlobalNavigationBar/Logo.tsx"],"names":["React","Link","styled","LaerdalLogo","LaerdalWhiteLogo","BREAKPOINTS","COLORS","ComponentTextStyle","focusStyles","invertedFocusStyles","ComponentMStyling","ComponentXSStyling","defaultOnMouseDownHandler","StyledLink","props","$color","MEDIUM","LogoContainer","div","Name","span","black","noSizeChangeOnMobile","Regular","BetaTag","backgroundColor","accent2_500","UppercaseBold","white","Logo","name","showBetaTag","onClick","to","color","betaTagBackgroundColor","betaTagColor","inverted"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,IAAT,QAAqB,kBAArB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAASC,WAAT,EAAsBC,gBAAtB,QAA8C,WAA9C;AACA,SAAQC,WAAR,EAAqBC,MAArB,EAA6BC,kBAA7B,EAAiDC,WAAjD,EAA8DC,mBAA9D,QAAwF,WAAxF;AACA,SAASC,iBAAT,EAA4BC,kBAA5B,QAAsD,WAAtD;AACA,SAAQC,yBAAR,QAAwC,WAAxC;;;AAEA,IAAMC,UAAU,GAAGX,MAAM,CAACD,IAAD,CAAT,iVAWH,UAACa,KAAD;AAAA,SAAWA,KAAK,CAACC,MAAjB;AAAA,CAXG,EAYVV,WAAW,CAACW,MAZF,CAAhB;AAmBA,IAAMC,aAAa,GAAGf,MAAM,CAACgB,GAAV,
|
|
1
|
+
{"version":3,"sources":["../../src/GlobalNavigationBar/Logo.tsx"],"names":["React","Link","styled","LaerdalLogo","LaerdalWhiteLogo","BREAKPOINTS","COLORS","ComponentTextStyle","focusStyles","invertedFocusStyles","ComponentMStyling","ComponentXSStyling","defaultOnMouseDownHandler","StyledLink","props","$color","MEDIUM","LogoContainer","div","LARGE","Name","span","black","SMALL","noSizeChangeOnMobile","Regular","BetaTag","backgroundColor","accent2_500","UppercaseBold","white","Logo","name","showBetaTag","onClick","to","color","betaTagBackgroundColor","betaTagColor","inverted"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Link } from 'react-router-dom';\nimport styled from 'styled-components';\nimport { LaerdalLogo, LaerdalWhiteLogo } from '../assets';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles, invertedFocusStyles} from '../styles';\nimport { ComponentMStyling, ComponentXSStyling } from '../styles';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst StyledLink = styled(Link)<{ $color?: string }>`\n text-align: center;\n text-decoration: none;\n display: flex;\n align-items: center;\n &:focus-within {\n outline: none;\n }\n svg {\n width: 66px;\n height: 36px;\n color: ${(props) => props.$color};\n ${BREAKPOINTS.MEDIUM} {\n width: 88px;\n height: 48px;\n }\n }\n`;\n\nconst LogoContainer = styled.div`\n display: flex;\n max-width: calc(100% - 48px);\n overflow: hidden;\n align-items: center;\n height: 40px;\n margin-right: 16px;\n box-sizing: border-box;\n padding: 24px 0;\n\n ${BREAKPOINTS.LARGE} {\n margin-top: 8px;\n margin-bottom: 7px;\n }\n\n &:focus-within {\n ${focusStyles}\n }\n\n &.inverted:focus-within {\n ${invertedFocusStyles}\n }\n`;\n\nconst Name = styled.span<{ $color?: string; noSizeChangeOnMobile: boolean }>`\n margin-left: 8px;\n padding-left: 8px;\n border-left: 1px solid ${(props) => props.$color || COLORS.black};\n letter-spacing: -0.02em;\n max-width: 168px;\n ${BREAKPOINTS.SMALL} {\n max-width: 200px;\n }\n \n white-space: nowrap;\n overflow: hidden;\n\n ${(props) =>\n props.noSizeChangeOnMobile\n ? ComponentMStyling(ComponentTextStyle.Regular, props.$color || COLORS.black)\n : ComponentXSStyling(ComponentTextStyle.Regular, props.$color || COLORS.black)}\n\n font-weight: 300 !important;\n line-height: 24px !important;\n\n ${BREAKPOINTS.MEDIUM} {\n ${(props) => ComponentMStyling(ComponentTextStyle.Regular, props.$color || COLORS.black)};\n }\n\n ${BREAKPOINTS.LARGE} {\n margin-left: 12px;\n padding-left: 12px;\n }\n`;\n\nconst BetaTag = styled.span<{ backgroundColor?: string; $color?: string }>`\n background-color: ${(props) => props.backgroundColor || COLORS.accent2_500};\n padding: 4px 8px;\n margin-left: 8px;\n margin-top: 2px;\n border-left: none;\n border-radius: 2px;\n\n ${(props) => ComponentXSStyling(ComponentTextStyle.UppercaseBold, props.$color || COLORS.white)}\n`;\n\ntype LogoProps = {\n name: string;\n showBetaTag?: boolean;\n onClick?: () => void;\n to?: string;\n color?: string;\n noSizeChangeOnMobile?: boolean;\n betaTagBackgroundColor?: string;\n betaTagColor?: string;\n inverted?: boolean;\n};\n\nconst Logo = ({ name, showBetaTag, onClick, to, color, noSizeChangeOnMobile, betaTagBackgroundColor, betaTagColor, inverted }: LogoProps): React.ReactElement<LogoProps> => {\n return (\n <LogoContainer className={inverted ? 'inverted' : ''}>\n <StyledLink\n to={to || '/'}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => {\n if (onClick) {\n onClick();\n }\n }}\n $color={color}>\n {color === COLORS.white ? <LaerdalWhiteLogo /> : <LaerdalLogo />}\n <Name $color={color} noSizeChangeOnMobile={noSizeChangeOnMobile || false}>\n {name}\n </Name>\n {showBetaTag && (\n <BetaTag backgroundColor={betaTagBackgroundColor} $color={betaTagColor}>\n BETA\n </BetaTag>\n )}\n </StyledLink>\n </LogoContainer>\n );\n};\n\nexport default Logo;\n"],"file":"Logo.js"}
|
|
@@ -7,6 +7,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
});
|
|
8
8
|
exports.default = void 0;
|
|
9
9
|
|
|
10
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
+
|
|
12
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
13
|
+
|
|
10
14
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
11
15
|
|
|
12
16
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
@@ -29,9 +33,17 @@ var _styles = require("../../styles");
|
|
|
29
33
|
|
|
30
34
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
31
35
|
|
|
36
|
+
var _excluded = ["placement", "type", "action"],
|
|
37
|
+
_excluded2 = ["placement", "type", "icon", "action"],
|
|
38
|
+
_excluded3 = ["placement", "type", "action"];
|
|
39
|
+
|
|
32
40
|
var _templateObject;
|
|
33
41
|
|
|
34
|
-
var
|
|
42
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
43
|
+
|
|
44
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
45
|
+
|
|
46
|
+
var Wrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n align-items: center;\n\n display: none;\n\n ", " {\n display: flex;\n }\n"])), _styles.BREAKPOINTS.LARGE);
|
|
35
47
|
|
|
36
48
|
var DesktopActions = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
37
49
|
var buttons = _ref.buttons,
|
|
@@ -65,47 +77,69 @@ var DesktopActions = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref)
|
|
|
65
77
|
}, [elRefs, buttons]);
|
|
66
78
|
|
|
67
79
|
var renderItem = function renderItem(item, index) {
|
|
68
|
-
var _user$firstName$charA, _user$firstName, _user$lastName$charAt, _user$lastName;
|
|
69
|
-
|
|
70
80
|
switch (item.type) {
|
|
71
81
|
case 'profile':
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
82
|
+
{
|
|
83
|
+
var _user$firstName$charA, _user$firstName, _user$lastName$charAt, _user$lastName;
|
|
84
|
+
|
|
85
|
+
var placement = item.placement,
|
|
86
|
+
type = item.type,
|
|
87
|
+
action = item.action,
|
|
88
|
+
rest = (0, _objectWithoutProperties2.default)(item, _excluded);
|
|
89
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProfileButton.ProfileButton, _objectSpread({
|
|
90
|
+
ref: elRefs[index],
|
|
91
|
+
hideOnLowWidth: true,
|
|
92
|
+
onClick: function onClick(e) {
|
|
93
|
+
item.action ? item.action(e === null || e === void 0 ? void 0 : e.target) : onShowUserMenu();
|
|
94
|
+
},
|
|
95
|
+
icon: !user && /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.User, {}),
|
|
96
|
+
initials: ((_user$firstName$charA = user === null || user === void 0 ? void 0 : (_user$firstName = user.firstName) === null || _user$firstName === void 0 ? void 0 : _user$firstName.charAt(0)) !== null && _user$firstName$charA !== void 0 ? _user$firstName$charA : '') + ((_user$lastName$charAt = user === null || user === void 0 ? void 0 : (_user$lastName = user.lastName) === null || _user$lastName === void 0 ? void 0 : _user$lastName.charAt(0)) !== null && _user$lastName$charAt !== void 0 ? _user$lastName$charAt : '')
|
|
97
|
+
}, rest), index);
|
|
98
|
+
}
|
|
81
99
|
|
|
82
100
|
case 'action':
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
101
|
+
{
|
|
102
|
+
var _placement = item.placement,
|
|
103
|
+
_type = item.type,
|
|
104
|
+
icon = item.icon,
|
|
105
|
+
_action = item.action,
|
|
106
|
+
_rest = (0, _objectWithoutProperties2.default)(item, _excluded2);
|
|
107
|
+
|
|
108
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, _objectSpread(_objectSpread({
|
|
109
|
+
ref: elRefs[index],
|
|
110
|
+
variant: 'secondary',
|
|
111
|
+
shape: 'circular',
|
|
112
|
+
hideOnLowWidth: true,
|
|
113
|
+
action: function action(e) {
|
|
114
|
+
return item.action && item.action(e === null || e === void 0 ? void 0 : e.target);
|
|
115
|
+
}
|
|
116
|
+
}, _rest), {}, {
|
|
117
|
+
children: item.icon
|
|
118
|
+
}), index);
|
|
119
|
+
}
|
|
94
120
|
|
|
95
121
|
case 'switcher':
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
122
|
+
{
|
|
123
|
+
var _placement2 = item.placement,
|
|
124
|
+
_type2 = item.type,
|
|
125
|
+
_action2 = item.action,
|
|
126
|
+
_rest2 = (0, _objectWithoutProperties2.default)(item, _excluded3);
|
|
127
|
+
|
|
128
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, _objectSpread(_objectSpread({
|
|
129
|
+
ref: elRefs[index],
|
|
130
|
+
variant: 'secondary',
|
|
131
|
+
shape: 'circular',
|
|
132
|
+
hideOnLowWidth: true,
|
|
133
|
+
id: "globalNavAppsButton",
|
|
134
|
+
action: function action(e) {
|
|
135
|
+
return item.action && item.action(e === null || e === void 0 ? void 0 : e.target);
|
|
136
|
+
}
|
|
137
|
+
}, _rest2), {}, {
|
|
138
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SystemIcons.SwitchApp, {
|
|
139
|
+
size: "24px"
|
|
140
|
+
})
|
|
141
|
+
}), index);
|
|
142
|
+
}
|
|
109
143
|
}
|
|
110
144
|
};
|
|
111
145
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/DesktopActions.tsx"],"names":["Wrapper","styled","div","BREAKPOINTS","
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/DesktopActions.tsx"],"names":["Wrapper","styled","div","BREAKPOINTS","LARGE","DesktopActions","React","forwardRef","ref","buttons","user","onShowUserMenu","useState","elRefs","setElRefs","length","useEffect","Array","fill","map","createRef","useImperativeHandle","r","index","type","renderItem","item","placement","action","rest","e","target","firstName","charAt","lastName","icon"],"mappings":"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","sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport {MenuAccountInfo, MobileMenuButtonTypes, MenuIconButton, DesktopMenuButtonTypes} from '../types';\nimport {IconButton} from '../../Button';\nimport {SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport {ProfileButton} from '../../ProfileButton';\nimport {SystemIcons} from '../../icons';\nimport {BREAKPOINTS} from '../../styles';\n\nconst Wrapper = styled.div`\n align-items: center;\n\n display: none;\n\n ${BREAKPOINTS.LARGE} {\n display: flex;\n }\n`;\n\n\ninterface DesktopActionsProps {\n buttons?: DesktopMenuButtonTypes[];\n user?: MenuAccountInfo;\n onShowUserMenu: () => void;\n}\n\nexport interface DesktopActionsRef {\n buttons?: { ref: React.MutableRefObject<HTMLButtonElement | null>, type: 'profile' | 'action' | 'switcher' | undefined }[]\n}\n\nconst DesktopActions = React.forwardRef(({\n buttons,\n user,\n onShowUserMenu\n }: DesktopActionsProps, ref: React.Ref<DesktopActionsRef>) => {\n\n const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement>[]>([]);\n\n const length = buttons?.length || 0;\n\n React.useEffect(() => {\n setElRefs(Array(length || 0).fill(null).map(() => React.createRef<HTMLButtonElement>()));\n }, [length]);\n\n React.useImperativeHandle(ref, () => ({\n buttons: elRefs.map((r, index) => ({\n ref: r,\n type: buttons?.[index]?.type,\n }))\n }), [elRefs, buttons]);\n\n const renderItem = (item: MobileMenuButtonTypes, index: number) => {\n switch (item.type) {\n case 'profile': {\n const {placement, type, action, ...rest} = item;\n return <ProfileButton key={index}\n ref={elRefs[index]}\n hideOnLowWidth={true}\n onClick={e => {\n item.action ? item.action(e?.target) : onShowUserMenu()\n }}\n icon={!user && <SystemIcons.User/>}\n initials={(user?.firstName?.charAt(0) ?? '') + (user?.lastName?.charAt(0) ?? '')}\n {...rest}/>\n\n }\n case 'action': {\n const {placement, type, icon, action, ...rest} = item;\n return <IconButton key={index}\n ref={elRefs[index]}\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={true}\n action={e => item.action && item.action(e?.target)}\n {...rest}>\n {item.icon}\n </IconButton>\n }\n case 'switcher': {\n const {placement, type, action, ...rest} = item;\n return <IconButton key={index}\n ref={elRefs[index]}\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={true}\n id=\"globalNavAppsButton\"\n action={e => item.action && item.action(e?.target)}\n {...rest}>\n <SwitchApp size=\"24px\"/>\n </IconButton>\n }\n }\n }\n\n return (\n <Wrapper>\n {buttons?.map((item, index) => renderItem(item, index))}\n </Wrapper>\n )\n});\n\n\nexport default DesktopActions;\n"],"file":"DesktopActions.cjs"}
|
|
@@ -1,9 +1,18 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
1
3
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
4
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
3
5
|
import _pt from "prop-types";
|
|
6
|
+
var _excluded = ["placement", "type", "action"],
|
|
7
|
+
_excluded2 = ["placement", "type", "icon", "action"],
|
|
8
|
+
_excluded3 = ["placement", "type", "action"];
|
|
4
9
|
|
|
5
10
|
var _templateObject;
|
|
6
11
|
|
|
12
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
13
|
+
|
|
14
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
15
|
+
|
|
7
16
|
import React from 'react';
|
|
8
17
|
import styled from 'styled-components';
|
|
9
18
|
import { IconButton } from '../../Button';
|
|
@@ -12,7 +21,7 @@ import { ProfileButton } from '../../ProfileButton';
|
|
|
12
21
|
import { SystemIcons } from '../../icons';
|
|
13
22
|
import { BREAKPOINTS } from '../../styles';
|
|
14
23
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
15
|
-
var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n align-items: center;\n
|
|
24
|
+
var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n align-items: center;\n\n display: none;\n\n ", " {\n display: flex;\n }\n"])), BREAKPOINTS.LARGE);
|
|
16
25
|
var DesktopActions = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
17
26
|
var buttons = _ref.buttons,
|
|
18
27
|
user = _ref.user,
|
|
@@ -43,47 +52,70 @@ var DesktopActions = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
43
52
|
}, [elRefs, buttons]);
|
|
44
53
|
|
|
45
54
|
var renderItem = function renderItem(item, index) {
|
|
46
|
-
var _user$firstName$charA, _user$firstName, _user$lastName$charAt, _user$lastName;
|
|
47
|
-
|
|
48
55
|
switch (item.type) {
|
|
49
56
|
case 'profile':
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
57
|
+
{
|
|
58
|
+
var _user$firstName$charA, _user$firstName, _user$lastName$charAt, _user$lastName;
|
|
59
|
+
|
|
60
|
+
var placement = item.placement,
|
|
61
|
+
type = item.type,
|
|
62
|
+
action = item.action,
|
|
63
|
+
rest = _objectWithoutProperties(item, _excluded);
|
|
64
|
+
|
|
65
|
+
return /*#__PURE__*/_jsx(ProfileButton, _objectSpread({
|
|
66
|
+
ref: elRefs[index],
|
|
67
|
+
hideOnLowWidth: true,
|
|
68
|
+
onClick: function onClick(e) {
|
|
69
|
+
item.action ? item.action(e === null || e === void 0 ? void 0 : e.target) : onShowUserMenu();
|
|
70
|
+
},
|
|
71
|
+
icon: !user && /*#__PURE__*/_jsx(SystemIcons.User, {}),
|
|
72
|
+
initials: ((_user$firstName$charA = user === null || user === void 0 ? void 0 : (_user$firstName = user.firstName) === null || _user$firstName === void 0 ? void 0 : _user$firstName.charAt(0)) !== null && _user$firstName$charA !== void 0 ? _user$firstName$charA : '') + ((_user$lastName$charAt = user === null || user === void 0 ? void 0 : (_user$lastName = user.lastName) === null || _user$lastName === void 0 ? void 0 : _user$lastName.charAt(0)) !== null && _user$lastName$charAt !== void 0 ? _user$lastName$charAt : '')
|
|
73
|
+
}, rest), index);
|
|
74
|
+
}
|
|
59
75
|
|
|
60
76
|
case 'action':
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
77
|
+
{
|
|
78
|
+
var _placement = item.placement,
|
|
79
|
+
_type = item.type,
|
|
80
|
+
icon = item.icon,
|
|
81
|
+
_action = item.action,
|
|
82
|
+
_rest = _objectWithoutProperties(item, _excluded2);
|
|
83
|
+
|
|
84
|
+
return /*#__PURE__*/_jsx(IconButton, _objectSpread(_objectSpread({
|
|
85
|
+
ref: elRefs[index],
|
|
86
|
+
variant: 'secondary',
|
|
87
|
+
shape: 'circular',
|
|
88
|
+
hideOnLowWidth: true,
|
|
89
|
+
action: function action(e) {
|
|
90
|
+
return item.action && item.action(e === null || e === void 0 ? void 0 : e.target);
|
|
91
|
+
}
|
|
92
|
+
}, _rest), {}, {
|
|
93
|
+
children: item.icon
|
|
94
|
+
}), index);
|
|
95
|
+
}
|
|
72
96
|
|
|
73
97
|
case 'switcher':
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
98
|
+
{
|
|
99
|
+
var _placement2 = item.placement,
|
|
100
|
+
_type2 = item.type,
|
|
101
|
+
_action2 = item.action,
|
|
102
|
+
_rest2 = _objectWithoutProperties(item, _excluded3);
|
|
103
|
+
|
|
104
|
+
return /*#__PURE__*/_jsx(IconButton, _objectSpread(_objectSpread({
|
|
105
|
+
ref: elRefs[index],
|
|
106
|
+
variant: 'secondary',
|
|
107
|
+
shape: 'circular',
|
|
108
|
+
hideOnLowWidth: true,
|
|
109
|
+
id: "globalNavAppsButton",
|
|
110
|
+
action: function action(e) {
|
|
111
|
+
return item.action && item.action(e === null || e === void 0 ? void 0 : e.target);
|
|
112
|
+
}
|
|
113
|
+
}, _rest2), {}, {
|
|
114
|
+
children: /*#__PURE__*/_jsx(SwitchApp, {
|
|
115
|
+
size: "24px"
|
|
116
|
+
})
|
|
117
|
+
}), index);
|
|
118
|
+
}
|
|
87
119
|
}
|
|
88
120
|
};
|
|
89
121
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/DesktopActions.tsx"],"names":["React","styled","IconButton","SwitchApp","ProfileButton","SystemIcons","BREAKPOINTS","Wrapper","div","
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/DesktopActions.tsx"],"names":["React","styled","IconButton","SwitchApp","ProfileButton","SystemIcons","BREAKPOINTS","Wrapper","div","LARGE","DesktopActions","forwardRef","ref","buttons","user","onShowUserMenu","useState","elRefs","setElRefs","length","useEffect","Array","fill","map","createRef","useImperativeHandle","r","index","type","renderItem","item","placement","action","rest","e","target","firstName","charAt","lastName","icon"],"mappings":"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","sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport {MenuAccountInfo, MobileMenuButtonTypes, MenuIconButton, DesktopMenuButtonTypes} from '../types';\nimport {IconButton} from '../../Button';\nimport {SwitchApp} from '../../icons/systemicons/SystemIcons';\nimport {ProfileButton} from '../../ProfileButton';\nimport {SystemIcons} from '../../icons';\nimport {BREAKPOINTS} from '../../styles';\n\nconst Wrapper = styled.div`\n align-items: center;\n\n display: none;\n\n ${BREAKPOINTS.LARGE} {\n display: flex;\n }\n`;\n\n\ninterface DesktopActionsProps {\n buttons?: DesktopMenuButtonTypes[];\n user?: MenuAccountInfo;\n onShowUserMenu: () => void;\n}\n\nexport interface DesktopActionsRef {\n buttons?: { ref: React.MutableRefObject<HTMLButtonElement | null>, type: 'profile' | 'action' | 'switcher' | undefined }[]\n}\n\nconst DesktopActions = React.forwardRef(({\n buttons,\n user,\n onShowUserMenu\n }: DesktopActionsProps, ref: React.Ref<DesktopActionsRef>) => {\n\n const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement>[]>([]);\n\n const length = buttons?.length || 0;\n\n React.useEffect(() => {\n setElRefs(Array(length || 0).fill(null).map(() => React.createRef<HTMLButtonElement>()));\n }, [length]);\n\n React.useImperativeHandle(ref, () => ({\n buttons: elRefs.map((r, index) => ({\n ref: r,\n type: buttons?.[index]?.type,\n }))\n }), [elRefs, buttons]);\n\n const renderItem = (item: MobileMenuButtonTypes, index: number) => {\n switch (item.type) {\n case 'profile': {\n const {placement, type, action, ...rest} = item;\n return <ProfileButton key={index}\n ref={elRefs[index]}\n hideOnLowWidth={true}\n onClick={e => {\n item.action ? item.action(e?.target) : onShowUserMenu()\n }}\n icon={!user && <SystemIcons.User/>}\n initials={(user?.firstName?.charAt(0) ?? '') + (user?.lastName?.charAt(0) ?? '')}\n {...rest}/>\n\n }\n case 'action': {\n const {placement, type, icon, action, ...rest} = item;\n return <IconButton key={index}\n ref={elRefs[index]}\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={true}\n action={e => item.action && item.action(e?.target)}\n {...rest}>\n {item.icon}\n </IconButton>\n }\n case 'switcher': {\n const {placement, type, action, ...rest} = item;\n return <IconButton key={index}\n ref={elRefs[index]}\n variant={'secondary'}\n shape={'circular'}\n hideOnLowWidth={true}\n id=\"globalNavAppsButton\"\n action={e => item.action && item.action(e?.target)}\n {...rest}>\n <SwitchApp size=\"24px\"/>\n </IconButton>\n }\n }\n }\n\n return (\n <Wrapper>\n {buttons?.map((item, index) => renderItem(item, index))}\n </Wrapper>\n )\n});\n\n\nexport default DesktopActions;\n"],"file":"DesktopActions.js"}
|
|
@@ -9,6 +9,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
9
9
|
});
|
|
10
10
|
exports.default = void 0;
|
|
11
11
|
|
|
12
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
|
+
|
|
14
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
15
|
+
|
|
12
16
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
13
17
|
|
|
14
18
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
@@ -35,13 +39,19 @@ var _common = require("../../common");
|
|
|
35
39
|
|
|
36
40
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
37
41
|
|
|
42
|
+
var _excluded = ["icon", "to", "exact", "disabled", "external", "action", "label", "note", "pinned"];
|
|
43
|
+
|
|
38
44
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
39
45
|
|
|
40
46
|
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
47
|
|
|
42
48
|
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
49
|
|
|
44
|
-
var
|
|
50
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
51
|
+
|
|
52
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
53
|
+
|
|
54
|
+
var NavContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: none;\n flex-grow: 1;\n justify-content: flex-start;\n align-items: center;\n\n ", " {\n display: flex;\n }\n\n a {\n text-decoration: none;\n }\n"])), _styles.BREAKPOINTS.LARGE);
|
|
45
55
|
|
|
46
56
|
var NavButton = _styledComponents.default.button(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n background: ", ";\n border: 0;\n"])), _styles.COLORS.white);
|
|
47
57
|
|
|
@@ -69,7 +79,7 @@ var MainMenu = function MainMenu(_ref) {
|
|
|
69
79
|
numberOfItemsAllowed = _React$useState4[0],
|
|
70
80
|
setNumberOfItemsAllowed = _React$useState4[1];
|
|
71
81
|
|
|
72
|
-
var widthOfItem =
|
|
82
|
+
var widthOfItem = 120;
|
|
73
83
|
|
|
74
84
|
var recalculateNumberOfItemsAllowed = function recalculateNumberOfItemsAllowed() {
|
|
75
85
|
if (rightSideRef !== null && rightSideRef !== void 0 && rightSideRef.current && mainMenuRef !== null && mainMenuRef !== void 0 && mainMenuRef.current) {
|
|
@@ -106,31 +116,46 @@ var MainMenu = function MainMenu(_ref) {
|
|
|
106
116
|
window.removeEventListener('resize', recalculateNumberOfItemsAllowed);
|
|
107
117
|
};
|
|
108
118
|
}, []);
|
|
119
|
+
React.useEffect(function () {
|
|
120
|
+
recalculateNumberOfItemsAllowed();
|
|
121
|
+
}, [items.length]);
|
|
122
|
+
|
|
123
|
+
var renderItem = function renderItem(item, index) {
|
|
124
|
+
if (index > numberOfItemsAllowed - 2) return null;
|
|
125
|
+
var icon = item.icon,
|
|
126
|
+
to = item.to,
|
|
127
|
+
exact = item.exact,
|
|
128
|
+
disabled = item.disabled,
|
|
129
|
+
external = item.external,
|
|
130
|
+
action = item.action,
|
|
131
|
+
label = item.label,
|
|
132
|
+
note = item.note,
|
|
133
|
+
pinned = item.pinned,
|
|
134
|
+
rest = (0, _objectWithoutProperties2.default)(item, _excluded);
|
|
135
|
+
return item !== null && item !== void 0 && item.disabled ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_NavItem.NavItem, {
|
|
136
|
+
as: NavButton,
|
|
137
|
+
exact: item.exact,
|
|
138
|
+
className: "disabled",
|
|
139
|
+
onMouseDown: _common.defaultOnMouseDownHandler,
|
|
140
|
+
children: item === null || item === void 0 ? void 0 : item.label
|
|
141
|
+
}, item.label) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_NavItem.NavItem, _objectSpread(_objectSpread({
|
|
142
|
+
as: _reactRouterDom.NavLink,
|
|
143
|
+
exact: item.exact,
|
|
144
|
+
to: item.to || '',
|
|
145
|
+
onMouseDown: _common.defaultOnMouseDownHandler,
|
|
146
|
+
onClick: function onClick(e) {
|
|
147
|
+
return item.action && item.action(e);
|
|
148
|
+
}
|
|
149
|
+
}, rest), {}, {
|
|
150
|
+
children: item === null || item === void 0 ? void 0 : item.label
|
|
151
|
+
}), item.label);
|
|
152
|
+
};
|
|
153
|
+
|
|
109
154
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(NavContainer, {
|
|
110
155
|
className: "GlobalNavigationMainMenu",
|
|
111
156
|
ref: mainMenuRef,
|
|
112
157
|
open: showExtendedMenu,
|
|
113
|
-
children: [items === null || items === void 0 ? void 0 : items.map(
|
|
114
|
-
return index > numberOfItemsAllowed - 2 ? null : no !== null && no !== void 0 && no.disabled ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_NavItem.NavItem, {
|
|
115
|
-
as: NavButton,
|
|
116
|
-
exact: no.exact,
|
|
117
|
-
className: "disabled",
|
|
118
|
-
onMouseDown: _common.defaultOnMouseDownHandler,
|
|
119
|
-
onClick: function onClick() {
|
|
120
|
-
return no.action && no.action();
|
|
121
|
-
},
|
|
122
|
-
children: no === null || no === void 0 ? void 0 : no.label
|
|
123
|
-
}, no.label) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_NavItem.NavItem, {
|
|
124
|
-
as: _reactRouterDom.NavLink,
|
|
125
|
-
exact: no.exact,
|
|
126
|
-
to: no.to || '',
|
|
127
|
-
onMouseDown: _common.defaultOnMouseDownHandler,
|
|
128
|
-
onClick: function onClick() {
|
|
129
|
-
return no.action && no.action();
|
|
130
|
-
},
|
|
131
|
-
children: no === null || no === void 0 ? void 0 : no.label
|
|
132
|
-
}, no.label);
|
|
133
|
-
}), items.length + 1 > numberOfItemsAllowed && /*#__PURE__*/(0, _jsxRuntime.jsxs)(ExtendedSection, {
|
|
158
|
+
children: [items === null || items === void 0 ? void 0 : items.map(renderItem), items.length + 1 > numberOfItemsAllowed && /*#__PURE__*/(0, _jsxRuntime.jsxs)(ExtendedSection, {
|
|
134
159
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
|
|
135
160
|
ref: menuButtonRef,
|
|
136
161
|
variant: 'secondary',
|