@laerdal/life-react-components 1.10.3-dev.9.full → 1.11.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/Banners/Banner.cjs +51 -43
- package/dist/Banners/Banner.cjs.map +1 -1
- package/dist/Banners/Banner.d.ts +2 -1
- package/dist/Banners/Banner.js +50 -42
- 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 +1 -0
- package/dist/ChipsInput/ChipDropdownInput.cjs.map +1 -1
- package/dist/ChipsInput/ChipDropdownInput.js +1 -0
- 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 +94 -53
- package/dist/Dropdown/DropdownContent.cjs.map +1 -1
- package/dist/Dropdown/DropdownContent.d.ts +3 -1
- package/dist/Dropdown/DropdownContent.js +92 -53
- 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/GlobalNavigationBar/GlobalNavigationBar.cjs +14 -13
- package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs.map +1 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.d.ts +2 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.js +13 -12
- 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/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/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/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,9 +1,16 @@
|
|
|
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 = ["icon", "to", "exact", "disabled", "external", "action", "label", "note", "pinned"];
|
|
4
7
|
|
|
5
8
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
6
9
|
|
|
10
|
+
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; }
|
|
11
|
+
|
|
12
|
+
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; }
|
|
13
|
+
|
|
7
14
|
import * as React from 'react';
|
|
8
15
|
import { NavLink } from 'react-router-dom';
|
|
9
16
|
import styled from 'styled-components';
|
|
@@ -15,7 +22,7 @@ import { IconButton } from '../../Button';
|
|
|
15
22
|
import { defaultOnMouseDownHandler } from '../../common';
|
|
16
23
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
17
24
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
18
|
-
var NavContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: none;\n justify-content:
|
|
25
|
+
var NavContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\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"])), BREAKPOINTS.LARGE);
|
|
19
26
|
var NavButton = styled.button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n background: ", ";\n border: 0;\n"])), COLORS.white);
|
|
20
27
|
var ExtendedMenuWrapper = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: flex;\n margin-left: ", ";\n\n position: absolute;\n flex-direction: column;\n left: 290px;\n top: 22px;\n\n height: 0;\n width: 0;\n\n &:focus-within,\n &:hover,\n &.open {\n background: ", ";\n }\n"])), function (props) {
|
|
21
28
|
return props.floatRight ? 'auto' : 'unset';
|
|
@@ -40,7 +47,7 @@ var MainMenu = function MainMenu(_ref) {
|
|
|
40
47
|
numberOfItemsAllowed = _React$useState4[0],
|
|
41
48
|
setNumberOfItemsAllowed = _React$useState4[1];
|
|
42
49
|
|
|
43
|
-
var widthOfItem =
|
|
50
|
+
var widthOfItem = 120;
|
|
44
51
|
|
|
45
52
|
var recalculateNumberOfItemsAllowed = function recalculateNumberOfItemsAllowed() {
|
|
46
53
|
if (rightSideRef !== null && rightSideRef !== void 0 && rightSideRef.current && mainMenuRef !== null && mainMenuRef !== void 0 && mainMenuRef.current) {
|
|
@@ -77,31 +84,48 @@ var MainMenu = function MainMenu(_ref) {
|
|
|
77
84
|
window.removeEventListener('resize', recalculateNumberOfItemsAllowed);
|
|
78
85
|
};
|
|
79
86
|
}, []);
|
|
87
|
+
React.useEffect(function () {
|
|
88
|
+
recalculateNumberOfItemsAllowed();
|
|
89
|
+
}, [items.length]);
|
|
90
|
+
|
|
91
|
+
var renderItem = function renderItem(item, index) {
|
|
92
|
+
if (index > numberOfItemsAllowed - 2) return null;
|
|
93
|
+
|
|
94
|
+
var icon = item.icon,
|
|
95
|
+
to = item.to,
|
|
96
|
+
exact = item.exact,
|
|
97
|
+
disabled = item.disabled,
|
|
98
|
+
external = item.external,
|
|
99
|
+
action = item.action,
|
|
100
|
+
label = item.label,
|
|
101
|
+
note = item.note,
|
|
102
|
+
pinned = item.pinned,
|
|
103
|
+
rest = _objectWithoutProperties(item, _excluded);
|
|
104
|
+
|
|
105
|
+
return item !== null && item !== void 0 && item.disabled ? /*#__PURE__*/_jsx(NavItem, {
|
|
106
|
+
as: NavButton,
|
|
107
|
+
exact: item.exact,
|
|
108
|
+
className: "disabled",
|
|
109
|
+
onMouseDown: defaultOnMouseDownHandler,
|
|
110
|
+
children: item === null || item === void 0 ? void 0 : item.label
|
|
111
|
+
}, item.label) : /*#__PURE__*/_jsx(NavItem, _objectSpread(_objectSpread({
|
|
112
|
+
as: NavLink,
|
|
113
|
+
exact: item.exact,
|
|
114
|
+
to: item.to || '',
|
|
115
|
+
onMouseDown: defaultOnMouseDownHandler,
|
|
116
|
+
onClick: function onClick(e) {
|
|
117
|
+
return item.action && item.action(e);
|
|
118
|
+
}
|
|
119
|
+
}, rest), {}, {
|
|
120
|
+
children: item === null || item === void 0 ? void 0 : item.label
|
|
121
|
+
}), item.label);
|
|
122
|
+
};
|
|
123
|
+
|
|
80
124
|
return /*#__PURE__*/_jsxs(NavContainer, {
|
|
81
125
|
className: "GlobalNavigationMainMenu",
|
|
82
126
|
ref: mainMenuRef,
|
|
83
127
|
open: showExtendedMenu,
|
|
84
|
-
children: [items === null || items === void 0 ? void 0 : items.map(
|
|
85
|
-
return index > numberOfItemsAllowed - 2 ? null : no !== null && no !== void 0 && no.disabled ? /*#__PURE__*/_jsx(NavItem, {
|
|
86
|
-
as: NavButton,
|
|
87
|
-
exact: no.exact,
|
|
88
|
-
className: "disabled",
|
|
89
|
-
onMouseDown: defaultOnMouseDownHandler,
|
|
90
|
-
onClick: function onClick() {
|
|
91
|
-
return no.action && no.action();
|
|
92
|
-
},
|
|
93
|
-
children: no === null || no === void 0 ? void 0 : no.label
|
|
94
|
-
}, no.label) : /*#__PURE__*/_jsx(NavItem, {
|
|
95
|
-
as: NavLink,
|
|
96
|
-
exact: no.exact,
|
|
97
|
-
to: no.to || '',
|
|
98
|
-
onMouseDown: defaultOnMouseDownHandler,
|
|
99
|
-
onClick: function onClick() {
|
|
100
|
-
return no.action && no.action();
|
|
101
|
-
},
|
|
102
|
-
children: no === null || no === void 0 ? void 0 : no.label
|
|
103
|
-
}, no.label);
|
|
104
|
-
}), items.length + 1 > numberOfItemsAllowed && /*#__PURE__*/_jsxs(ExtendedSection, {
|
|
128
|
+
children: [items === null || items === void 0 ? void 0 : items.map(renderItem), items.length + 1 > numberOfItemsAllowed && /*#__PURE__*/_jsxs(ExtendedSection, {
|
|
105
129
|
children: [/*#__PURE__*/_jsx(IconButton, {
|
|
106
130
|
ref: menuButtonRef,
|
|
107
131
|
variant: 'secondary',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"names":["React","NavLink","styled","NavItem","MoreHorizontal","COLORS","BREAKPOINTS","ExtendedMainMenu","IconButton","defaultOnMouseDownHandler","NavContainer","div","MEDIUM","NavButton","button","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","MainMenu","items","rightSideRef","useState","showExtendedMenu","setShowExtendedMenu","extendedMenuRef","useRef","menuButtonRef","mainMenuRef","numberOfItemsAllowed","setNumberOfItemsAllowed","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","handleClickExtendedMenuAction","handleClickOutside","e","contains","target","useEffect","document","addEventListener","window","removeEventListener","map","no","index","disabled","exact","action","label","to","length","slice"],"mappings":";;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAAQC,OAAR,QAAsB,kBAAtB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AAEA,SAAQC,OAAR,QAAsB,eAAtB;AACA,SAAQC,cAAR,QAA6B,qCAA7B;AACA,SAAQC,MAAR,EAAgBC,WAAhB,QAAkC,cAAlC;AACA,OAAOC,gBAAP,MAA6B,oBAA7B;AACA,SAAQC,UAAR,QAAyB,cAAzB;AACA,SAAQC,yBAAR,QAAwC,cAAxC;;;AAGA,IAAMC,YAAY,GAAGR,MAAM,CAACS,GAAV,6NAKdL,WAAW,CAACM,MALE,CAAlB;AAcA,IAAMC,SAAS,GAAGX,MAAM,CAACY,MAAV,6GACCT,MAAM,CAACU,KADR,CAAf;AASA,IAAMC,mBAAmB,GAAGd,MAAM,CAACS,GAAV,0SAER,UAAAM,KAAK;AAAA,SAAKA,KAAK,CAACC,UAAN,GAAmB,MAAnB,GAA4B,OAAjC;AAAA,CAFG,EAePb,MAAM,CAACU,KAfA,CAAzB;AAmBA,IAAMI,eAAe,GAAGjB,MAAM,CAACS,GAAV,gGAArB;;AASA,IAAMS,QAAQ,GAAG,SAAXA,QAAW,OAA6D;AAAA,MAA3DC,KAA2D,QAA3DA,KAA2D;AAAA,MAApDC,YAAoD,QAApDA,YAAoD;;AAC5E,wBAAgDtB,KAAK,CAACuB,QAAN,CAAe,KAAf,CAAhD;AAAA;AAAA,MAAOC,gBAAP;AAAA,MAAyBC,mBAAzB;;AACA,MAAMC,eAAe,GAAG1B,KAAK,CAAC2B,MAAN,CAAkB,IAAlB,CAAxB;AACA,MAAMC,aAAa,GAAG5B,KAAK,CAAC2B,MAAN,CAAgC,IAAhC,CAAtB;AACA,MAAME,WAA+D,GAAG7B,KAAK,CAAC2B,MAAN,CAAa,IAAb,CAAxE;;AACA,yBAAwD3B,KAAK,CAACuB,QAAN,CAAuB,CAAvB,CAAxD;AAAA;AAAA,MAAOO,oBAAP;AAAA,MAA6BC,uBAA7B;;AAEA,MAAMC,WAAW,GAAG,GAApB;;AACA,MAAMC,+BAA+B,GAAG,SAAlCA,+BAAkC,GAAM;AAC5C,QAAIX,YAAY,SAAZ,IAAAA,YAAY,WAAZ,IAAAA,YAAY,CAAEY,OAAd,IAAyBL,WAAzB,aAAyBA,WAAzB,eAAyBA,WAAW,CAAEK,OAA1C,EAAmD;AAAA;;AACjD,UAAMC,MAAM,GAAGC,IAAI,CAACC,KAAL,CAAW,CAAC,CAAAf,YAAY,SAAZ,IAAAA,YAAY,WAAZ,qCAAAA,YAAY,CAAEY,OAAd,gFAAuBI,UAAvB,KAAoCT,WAApC,aAAoCA,WAApC,+CAAoCA,WAAW,CAAEK,OAAjD,yDAAoC,qBAAsBI,UAA1D,CAAD,IAAyEN,WAApF,CAAf;;AACA,UAAIG,MAAM,KAAKL,oBAAf,EAAqC;AACnCC,QAAAA,uBAAuB,CAACI,MAAD,CAAvB;AACD;AACF;AACF,GAPD;;AASA,MAAMI,6BAA6B,GAAG,SAAhCA,6BAAgC,GAAM;AAC1Cd,IAAAA,mBAAmB,CAAC,KAAD,CAAnB;AACD,GAFD;;AAIA,MAAMe,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,CAAD,EAAY;AAAA;;AACrC,QAAI,EAACf,eAAD,aAACA,eAAD,wCAACA,eAAe,CAAEQ,OAAlB,kDAAC,sBAA0BQ,QAA1B,CAAmCD,CAAC,CAACE,MAArC,CAAD,KAAiD,EAACf,aAAD,aAACA,aAAD,wCAACA,aAAa,CAAEM,OAAhB,kDAAC,sBAAwBQ,QAAxB,CAAiCD,CAAC,CAACE,MAAnC,CAAD,CAArD,EAAkG;AAChGlB,MAAAA,mBAAmB,CAAC,KAAD,CAAnB;AACD;AACF,GAJD;;AAMAzB,EAAAA,KAAK,CAAC4C,SAAN,CAAgB,YAAM;AACpBX,IAAAA,+BAA+B,GADX,CAEpB;;AACAY,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,OAA1B,EAAmCN,kBAAnC;AACAO,IAAAA,MAAM,CAACD,gBAAP,CAAwB,QAAxB,EAAkCb,+BAAlC;AACA,WAAO,YAAM;AACX;AACAY,MAAAA,QAAQ,CAACG,mBAAT,CAA6B,OAA7B,EAAsCR,kBAAtC;AACAO,MAAAA,MAAM,CAACC,mBAAP,CAA2B,QAA3B,EAAqCf,+BAArC;AACD,KAJD;AAKD,GAVD,EAUG,EAVH;AAYA,sBACE,MAAC,YAAD;AAAc,IAAA,SAAS,EAAC,0BAAxB;AAAmD,IAAA,GAAG,EAAEJ,WAAxD;AAAqE,IAAA,IAAI,EAAEL,gBAA3E;AAAA,eACGH,KADH,aACGA,KADH,uBACGA,KAAK,CAAE4B,GAAP,CAAW,UAACC,EAAD,EAAiCC,KAAjC;AAAA,aACVA,KAAK,GAAGrB,oBAAoB,GAAG,CAA/B,GAAmC,IAAnC,GAA0CoB,EAAE,SAAF,IAAAA,EAAE,WAAF,IAAAA,EAAE,CAAEE,QAAJ,gBACxC,KAAC,OAAD;AAAS,QAAA,EAAE,EAAEvC,SAAb;AACS,QAAA,KAAK,EAAEqC,EAAE,CAACG,KADnB;AAES,QAAA,SAAS,EAAC,UAFnB;AAIS,QAAA,WAAW,EAAE5C,yBAJtB;AAKS,QAAA,OAAO,EAAE;AAAA,iBAAMyC,EAAE,CAACI,MAAH,IAAaJ,EAAE,CAACI,MAAH,EAAnB;AAAA,SALlB;AAAA,kBAMGJ,EANH,aAMGA,EANH,uBAMGA,EAAE,CAAEK;AANP,SAGcL,EAAE,CAACK,KAHjB,CADwC,gBAUxC,KAAC,OAAD;AAAS,QAAA,EAAE,EAAEtD,OAAb;AACS,QAAA,KAAK,EAAEiD,EAAE,CAACG,KADnB;AAES,QAAA,EAAE,EAAEH,EAAE,CAACM,EAAH,IAAS,EAFtB;AAIS,QAAA,WAAW,EAAE/C,yBAJtB;AAKS,QAAA,OAAO,EAAE;AAAA,iBAAMyC,EAAE,CAACI,MAAH,IAAaJ,EAAE,CAACI,MAAH,EAAnB;AAAA,SALlB;AAAA,kBAMGJ,EANH,aAMGA,EANH,uBAMGA,EAAE,CAAEK;AANP,SAGcL,EAAE,CAACK,KAHjB,CAXQ;AAAA,KAAX,CADH,EAsBGlC,KAAK,CAACoC,MAAN,GAAe,CAAf,GAAmB3B,oBAAnB,iBACC,MAAC,eAAD;AAAA,8BACE,KAAC,UAAD;AACE,QAAA,GAAG,EAAEF,aADP;AAEE,QAAA,OAAO,EAAE,WAFX;AAGE,QAAA,KAAK,EAAE,UAHT;AAIE,QAAA,MAAM,EAAE,kBAAM;AACZH,UAAAA,mBAAmB,CAAC,CAACD,gBAAF,CAAnB;AACD,SANH;AAAA,+BAOE,KAAC,cAAD;AAAgB,UAAA,IAAI,EAAC;AAArB;AAPF,QADF,eAUE,KAAC,mBAAD;AAAqB,QAAA,GAAG,EAAEE,eAA1B;AAA2C,QAAA,SAAS,EAAEF,gBAAgB,GAAG,MAAH,GAAY,EAAlF;AAAsF,QAAA,UAAU,EAAE,KAAlG;AAAA,+BACE,KAAC,gBAAD;AAAkB,UAAA,eAAe,EAAEe,6BAAnC;AACkB,UAAA,iBAAiB,EAAElB,KAAK,CAACqC,KAAN,CAAY5B,oBAAoB,GAAG,CAAnC;AADrC;AADF,QAVF;AAAA,MAvBJ;AAAA,IADF;AA0CD,CAjFD;;;AAJET,EAAAA,K;;AAuFF,eAAeD,QAAf","sourcesContent":["import * as React from 'react';\nimport {NavLink} 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 from './ExtendedMainMenu';\nimport {IconButton} from '../../Button';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div<{ open: boolean }>`\n display: none;\n justify-content: center;\n align-items: center;\n\n ${BREAKPOINTS.MEDIUM} {\n display: flex;\n }\n\n a {\n text-decoration: none;\n }\n`;\n\nconst NavButton = styled.button`\n background: ${COLORS.white};\n border: 0;\n`;\n\ninterface ExtendedMenuWrapperProps {\n floatRight: boolean;\n}\n\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\n display: flex;\n margin-left: ${props => (props.floatRight ? 'auto' : 'unset')};\n\n position: absolute;\n flex-direction: column;\n left: 290px;\n top: 22px;\n\n height: 0;\n width: 0;\n\n &:focus-within,\n &:hover,\n &.open {\n background: ${COLORS.white};\n }\n`;\n\nconst ExtendedSection = styled.div`\n position: relative;\n`;\n\ntype Props = {\n items: MenuNavigationItemTypeItem[];\n rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;\n};\n\nconst MainMenu = ({items, rightSideRef}: Props): React.ReactElement<Props> => {\n const [showExtendedMenu, setShowExtendedMenu] = React.useState(false);\n const extendedMenuRef = React.useRef<any>(null);\n const menuButtonRef = React.useRef<HTMLButtonElement>(null);\n const mainMenuRef: React.RefObject<HTMLDivElement> | null | undefined = React.useRef(null);\n const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\n\n const widthOfItem = 150;\n const recalculateNumberOfItemsAllowed = () => {\n if (rightSideRef?.current && mainMenuRef?.current) {\n const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\n if (number !== numberOfItemsAllowed) {\n setNumberOfItemsAllowed(number);\n }\n }\n };\n\n const handleClickExtendedMenuAction = () => {\n setShowExtendedMenu(false);\n };\n\n const handleClickOutside = (e: any) => {\n if (!extendedMenuRef?.current?.contains(e.target) && !menuButtonRef?.current?.contains(e.target)) {\n setShowExtendedMenu(false);\n }\n };\n\n React.useEffect(() => {\n recalculateNumberOfItemsAllowed();\n // Bind the event listener\n document.addEventListener('click', handleClickOutside);\n window.addEventListener('resize', recalculateNumberOfItemsAllowed);\n return () => {\n // Unbind the event listener on clean up\n document.removeEventListener('click', handleClickOutside);\n window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\n };\n }, []);\n\n return (\n <NavContainer className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} open={showExtendedMenu}>\n {items?.map((no: MenuNavigationItemTypeItem, index: number) =>\n index > numberOfItemsAllowed - 2 ? null : no?.disabled ? (\n <NavItem as={NavButton}\n exact={no.exact}\n className=\"disabled\"\n key={no.label}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => no.action && no.action()}>\n {no?.label}\n </NavItem>\n ) : (\n <NavItem as={NavLink}\n exact={no.exact}\n to={no.to || ''}\n key={no.label}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => no.action && no.action()}>\n {no?.label}\n </NavItem>\n ),\n )}\n {items.length + 1 > numberOfItemsAllowed && (\n <ExtendedSection>\n <IconButton\n ref={menuButtonRef}\n variant={'secondary'}\n shape={'circular'}\n action={() => {\n setShowExtendedMenu(!showExtendedMenu)\n }}>\n <MoreHorizontal size=\"24px\"/>\n </IconButton>\n <ExtendedMenuWrapper ref={extendedMenuRef} className={showExtendedMenu ? 'open' : ''} floatRight={false}>\n <ExtendedMainMenu clickMenuAction={handleClickExtendedMenuAction}\n navigationOptions={items.slice(numberOfItemsAllowed - 1)}/>\n </ExtendedMenuWrapper>\n </ExtendedSection>\n )}\n </NavContainer>\n );\n};\n\nexport default MainMenu;\n"],"file":"MainMenu.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/MainMenu.tsx"],"names":["React","NavLink","styled","NavItem","MoreHorizontal","COLORS","BREAKPOINTS","ExtendedMainMenu","IconButton","defaultOnMouseDownHandler","NavContainer","div","LARGE","NavButton","button","white","ExtendedMenuWrapper","props","floatRight","ExtendedSection","MainMenu","items","rightSideRef","useState","showExtendedMenu","setShowExtendedMenu","extendedMenuRef","useRef","menuButtonRef","mainMenuRef","numberOfItemsAllowed","setNumberOfItemsAllowed","widthOfItem","recalculateNumberOfItemsAllowed","current","number","Math","floor","offsetLeft","handleClickExtendedMenuAction","handleClickOutside","e","contains","target","useEffect","document","addEventListener","window","removeEventListener","length","renderItem","item","index","icon","to","exact","disabled","external","action","label","note","pinned","rest","map","slice"],"mappings":";;;;;;;;;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAAQC,OAAR,QAAsB,kBAAtB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AAEA,SAAQC,OAAR,QAAsB,eAAtB;AACA,SAAQC,cAAR,QAA6B,qCAA7B;AACA,SAAQC,MAAR,EAAgBC,WAAhB,QAAkC,cAAlC;AACA,OAAOC,gBAAP,MAA6B,oBAA7B;AACA,SAAQC,UAAR,QAAyB,cAAzB;AACA,SAAQC,yBAAR,QAAwC,cAAxC;;;AAGA,IAAMC,YAAY,GAAGR,MAAM,CAACS,GAAV,kPAMdL,WAAW,CAACM,KANE,CAAlB;AAeA,IAAMC,SAAS,GAAGX,MAAM,CAACY,MAAV,6GACCT,MAAM,CAACU,KADR,CAAf;AASA,IAAMC,mBAAmB,GAAGd,MAAM,CAACS,GAAV,0SAER,UAAAM,KAAK;AAAA,SAAKA,KAAK,CAACC,UAAN,GAAmB,MAAnB,GAA4B,OAAjC;AAAA,CAFG,EAePb,MAAM,CAACU,KAfA,CAAzB;AAmBA,IAAMI,eAAe,GAAGjB,MAAM,CAACS,GAAV,gGAArB;;AASA,IAAMS,QAAQ,GAAG,SAAXA,QAAW,OAA6D;AAAA,MAA3DC,KAA2D,QAA3DA,KAA2D;AAAA,MAApDC,YAAoD,QAApDA,YAAoD;;AAC5E,wBAAgDtB,KAAK,CAACuB,QAAN,CAAe,KAAf,CAAhD;AAAA;AAAA,MAAOC,gBAAP;AAAA,MAAyBC,mBAAzB;;AACA,MAAMC,eAAe,GAAG1B,KAAK,CAAC2B,MAAN,CAAkB,IAAlB,CAAxB;AACA,MAAMC,aAAa,GAAG5B,KAAK,CAAC2B,MAAN,CAAgC,IAAhC,CAAtB;AACA,MAAME,WAA+D,GAAG7B,KAAK,CAAC2B,MAAN,CAAa,IAAb,CAAxE;;AACA,yBAAwD3B,KAAK,CAACuB,QAAN,CAAuB,CAAvB,CAAxD;AAAA;AAAA,MAAOO,oBAAP;AAAA,MAA6BC,uBAA7B;;AAEA,MAAMC,WAAW,GAAG,GAApB;;AACA,MAAMC,+BAA+B,GAAG,SAAlCA,+BAAkC,GAAM;AAC5C,QAAIX,YAAY,SAAZ,IAAAA,YAAY,WAAZ,IAAAA,YAAY,CAAEY,OAAd,IAAyBL,WAAzB,aAAyBA,WAAzB,eAAyBA,WAAW,CAAEK,OAA1C,EAAmD;AAAA;;AACjD,UAAMC,MAAM,GAAGC,IAAI,CAACC,KAAL,CAAW,CAAC,CAAAf,YAAY,SAAZ,IAAAA,YAAY,WAAZ,qCAAAA,YAAY,CAAEY,OAAd,gFAAuBI,UAAvB,KAAoCT,WAApC,aAAoCA,WAApC,+CAAoCA,WAAW,CAAEK,OAAjD,yDAAoC,qBAAsBI,UAA1D,CAAD,IAAyEN,WAApF,CAAf;;AACA,UAAIG,MAAM,KAAKL,oBAAf,EAAqC;AACnCC,QAAAA,uBAAuB,CAACI,MAAD,CAAvB;AACD;AACF;AACF,GAPD;;AASA,MAAMI,6BAA6B,GAAG,SAAhCA,6BAAgC,GAAM;AAC1Cd,IAAAA,mBAAmB,CAAC,KAAD,CAAnB;AACD,GAFD;;AAIA,MAAMe,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,CAAD,EAAY;AAAA;;AACrC,QAAI,EAACf,eAAD,aAACA,eAAD,wCAACA,eAAe,CAAEQ,OAAlB,kDAAC,sBAA0BQ,QAA1B,CAAmCD,CAAC,CAACE,MAArC,CAAD,KAAiD,EAACf,aAAD,aAACA,aAAD,wCAACA,aAAa,CAAEM,OAAhB,kDAAC,sBAAwBQ,QAAxB,CAAiCD,CAAC,CAACE,MAAnC,CAAD,CAArD,EAAkG;AAChGlB,MAAAA,mBAAmB,CAAC,KAAD,CAAnB;AACD;AACF,GAJD;;AAMAzB,EAAAA,KAAK,CAAC4C,SAAN,CAAgB,YAAM;AACpBX,IAAAA,+BAA+B,GADX,CAEpB;;AACAY,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,OAA1B,EAAmCN,kBAAnC;AACAO,IAAAA,MAAM,CAACD,gBAAP,CAAwB,QAAxB,EAAkCb,+BAAlC;AACA,WAAO,YAAM;AACX;AACAY,MAAAA,QAAQ,CAACG,mBAAT,CAA6B,OAA7B,EAAsCR,kBAAtC;AACAO,MAAAA,MAAM,CAACC,mBAAP,CAA2B,QAA3B,EAAqCf,+BAArC;AACD,KAJD;AAKD,GAVD,EAUG,EAVH;AAYAjC,EAAAA,KAAK,CAAC4C,SAAN,CAAgB,YAAM;AACpBX,IAAAA,+BAA+B;AAChC,GAFD,EAEG,CAACZ,KAAK,CAAC4B,MAAP,CAFH;;AAIA,MAAMC,UAAU,GAAG,SAAbA,UAAa,CAACC,IAAD,EAAmCC,KAAnC,EAAqD;AAEtE,QAAIA,KAAK,GAAGtB,oBAAoB,GAAG,CAAnC,EAAsC,OAAO,IAAP;;AAEtC,QAAOuB,IAAP,GAAoFF,IAApF,CAAOE,IAAP;AAAA,QAAaC,EAAb,GAAoFH,IAApF,CAAaG,EAAb;AAAA,QAAiBC,KAAjB,GAAoFJ,IAApF,CAAiBI,KAAjB;AAAA,QAAwBC,QAAxB,GAAoFL,IAApF,CAAwBK,QAAxB;AAAA,QAAkCC,QAAlC,GAAoFN,IAApF,CAAkCM,QAAlC;AAAA,QAA4CC,MAA5C,GAAoFP,IAApF,CAA4CO,MAA5C;AAAA,QAAoDC,KAApD,GAAoFR,IAApF,CAAoDQ,KAApD;AAAA,QAA2DC,IAA3D,GAAoFT,IAApF,CAA2DS,IAA3D;AAAA,QAAiEC,MAAjE,GAAoFV,IAApF,CAAiEU,MAAjE;AAAA,QAA4EC,IAA5E,4BAAoFX,IAApF;;AAEA,WAAOA,IAAI,SAAJ,IAAAA,IAAI,WAAJ,IAAAA,IAAI,CAAEK,QAAN,gBACH,KAAC,OAAD;AAAS,MAAA,EAAE,EAAE3C,SAAb;AACS,MAAA,KAAK,EAAEsC,IAAI,CAACI,KADrB;AAES,MAAA,SAAS,EAAC,UAFnB;AAIS,MAAA,WAAW,EAAE9C,yBAJtB;AAAA,gBAKC0C,IALD,aAKCA,IALD,uBAKCA,IAAI,CAAEQ;AALP,OAGcR,IAAI,CAACQ,KAHnB,CADG,gBAQH,KAAC,OAAD;AAAS,MAAA,EAAE,EAAE1D,OAAb;AACS,MAAA,KAAK,EAAEkD,IAAI,CAACI,KADrB;AAES,MAAA,EAAE,EAAEJ,IAAI,CAACG,EAAL,IAAW,EAFxB;AAIS,MAAA,WAAW,EAAE7C,yBAJtB;AAKS,MAAA,OAAO,EAAE,iBAACgC,CAAD;AAAA,eAAyBU,IAAI,CAACO,MAAL,IAAeP,IAAI,CAACO,MAAL,CAAYjB,CAAZ,CAAxC;AAAA;AALlB,OAMaqB,IANb;AAAA,gBAOCX,IAPD,aAOCA,IAPD,uBAOCA,IAAI,CAAEQ;AAPP,QAGcR,IAAI,CAACQ,KAHnB,CARJ;AAiBD,GAvBD;;AAyBA,sBACE,MAAC,YAAD;AAAc,IAAA,SAAS,EAAC,0BAAxB;AAAmD,IAAA,GAAG,EAAE9B,WAAxD;AAAqE,IAAA,IAAI,EAAEL,gBAA3E;AAAA,eACGH,KADH,aACGA,KADH,uBACGA,KAAK,CAAE0C,GAAP,CAAWb,UAAX,CADH,EAEG7B,KAAK,CAAC4B,MAAN,GAAe,CAAf,GAAmBnB,oBAAnB,iBACC,MAAC,eAAD;AAAA,8BACE,KAAC,UAAD;AACE,QAAA,GAAG,EAAEF,aADP;AAEE,QAAA,OAAO,EAAE,WAFX;AAGE,QAAA,KAAK,EAAE,UAHT;AAIE,QAAA,MAAM,EAAE,kBAAM;AACZH,UAAAA,mBAAmB,CAAC,CAACD,gBAAF,CAAnB;AACD,SANH;AAAA,+BAOE,KAAC,cAAD;AAAgB,UAAA,IAAI,EAAC;AAArB;AAPF,QADF,eAUE,KAAC,mBAAD;AAAqB,QAAA,GAAG,EAAEE,eAA1B;AAA2C,QAAA,SAAS,EAAEF,gBAAgB,GAAG,MAAH,GAAY,EAAlF;AAAsF,QAAA,UAAU,EAAE,KAAlG;AAAA,+BACE,KAAC,gBAAD;AAAkB,UAAA,eAAe,EAAEe,6BAAnC;AACkB,UAAA,iBAAiB,EAAElB,KAAK,CAAC2C,KAAN,CAAYlC,oBAAoB,GAAG,CAAnC;AADrC;AADF,QAVF;AAAA,MAHJ;AAAA,IADF;AAsBD,CA1FD;;;AAJET,EAAAA,K;;AAgGF,eAAeD,QAAf","sourcesContent":["import * as React from 'react';\nimport {NavLink} 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 from './ExtendedMainMenu';\nimport {IconButton} from '../../Button';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div<{ open: boolean }>`\n display: none;\n flex-grow: 1;\n justify-content: flex-start;\n align-items: center;\n\n ${BREAKPOINTS.LARGE} {\n display: flex;\n }\n\n a {\n text-decoration: none;\n }\n`;\n\nconst NavButton = styled.button`\n background: ${COLORS.white};\n border: 0;\n`;\n\ninterface ExtendedMenuWrapperProps {\n floatRight: boolean;\n}\n\nconst ExtendedMenuWrapper = styled.div<ExtendedMenuWrapperProps>`\n display: flex;\n margin-left: ${props => (props.floatRight ? 'auto' : 'unset')};\n\n position: absolute;\n flex-direction: column;\n left: 290px;\n top: 22px;\n\n height: 0;\n width: 0;\n\n &:focus-within,\n &:hover,\n &.open {\n background: ${COLORS.white};\n }\n`;\n\nconst ExtendedSection = styled.div`\n position: relative;\n`;\n\ntype Props = {\n items: MenuNavigationItemTypeItem[];\n rightSideRef?: React.RefObject<HTMLDivElement> | null | undefined;\n};\n\nconst MainMenu = ({items, rightSideRef}: Props): React.ReactElement<Props> => {\n const [showExtendedMenu, setShowExtendedMenu] = React.useState(false);\n const extendedMenuRef = React.useRef<any>(null);\n const menuButtonRef = React.useRef<HTMLButtonElement>(null);\n const mainMenuRef: React.RefObject<HTMLDivElement> | null | undefined = React.useRef(null);\n const [numberOfItemsAllowed, setNumberOfItemsAllowed] = React.useState<number>(1);\n\n const widthOfItem = 120;\n const recalculateNumberOfItemsAllowed = () => {\n if (rightSideRef?.current && mainMenuRef?.current) {\n const number = Math.floor((rightSideRef?.current?.offsetLeft - mainMenuRef?.current?.offsetLeft) / widthOfItem);\n if (number !== numberOfItemsAllowed) {\n setNumberOfItemsAllowed(number);\n }\n }\n };\n\n const handleClickExtendedMenuAction = () => {\n setShowExtendedMenu(false);\n };\n\n const handleClickOutside = (e: any) => {\n if (!extendedMenuRef?.current?.contains(e.target) && !menuButtonRef?.current?.contains(e.target)) {\n setShowExtendedMenu(false);\n }\n };\n\n React.useEffect(() => {\n recalculateNumberOfItemsAllowed();\n // Bind the event listener\n document.addEventListener('click', handleClickOutside);\n window.addEventListener('resize', recalculateNumberOfItemsAllowed);\n return () => {\n // Unbind the event listener on clean up\n document.removeEventListener('click', handleClickOutside);\n window.removeEventListener('resize', recalculateNumberOfItemsAllowed);\n };\n }, []);\n\n React.useEffect(() => {\n recalculateNumberOfItemsAllowed();\n }, [items.length])\n\n const renderItem = (item: MenuNavigationItemTypeItem, index: number) => {\n\n if (index > numberOfItemsAllowed - 2) return null\n\n const {icon, to, exact, disabled, external, action, label, note, pinned, ...rest} = item;\n\n return item?.disabled\n ? <NavItem as={NavButton}\n exact={item.exact}\n className=\"disabled\"\n key={item.label}\n onMouseDown={defaultOnMouseDownHandler}>\n {item?.label}\n </NavItem>\n : <NavItem as={NavLink}\n exact={item.exact}\n to={item.to || ''}\n key={item.label}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={(e: React.MouseEvent) => item.action && item.action(e)}\n {...rest}>\n {item?.label}\n </NavItem>\n }\n\n return (\n <NavContainer className=\"GlobalNavigationMainMenu\" ref={mainMenuRef} open={showExtendedMenu}>\n {items?.map(renderItem)}\n {items.length + 1 > numberOfItemsAllowed && (\n <ExtendedSection>\n <IconButton\n ref={menuButtonRef}\n variant={'secondary'}\n shape={'circular'}\n action={() => {\n setShowExtendedMenu(!showExtendedMenu)\n }}>\n <MoreHorizontal size=\"24px\"/>\n </IconButton>\n <ExtendedMenuWrapper ref={extendedMenuRef} className={showExtendedMenu ? 'open' : ''} floatRight={false}>\n <ExtendedMainMenu clickMenuAction={handleClickExtendedMenuAction}\n navigationOptions={items.slice(numberOfItemsAllowed - 1)}/>\n </ExtendedMenuWrapper>\n </ExtendedSection>\n )}\n </NavContainer>\n );\n};\n\nexport default MainMenu;\n"],"file":"MainMenu.js"}
|
|
@@ -35,7 +35,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
35
35
|
|
|
36
36
|
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; }
|
|
37
37
|
|
|
38
|
-
var NavContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin: auto 0 auto auto;\n align-items: center;\n height: 48px;\n\n a {\n text-decoration: none;\n }\n\n ", " {\n height: 56px;\n }\n\n ", " {\n height: 64px;\n }\n\n button,\n div {\n &:hover {\n cursor: pointer;\n }\n }\n"])), _styles.BREAKPOINTS.SMALL, _styles.BREAKPOINTS.
|
|
38
|
+
var NavContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin: auto 0 auto auto;\n align-items: center;\n height: 48px;\n\n a {\n text-decoration: none;\n }\n\n ", " {\n height: 56px;\n }\n\n ", " {\n height: 64px;\n }\n\n button,\n div {\n &:hover {\n cursor: pointer;\n }\n }\n"])), _styles.BREAKPOINTS.SMALL, _styles.BREAKPOINTS.LARGE);
|
|
39
39
|
|
|
40
40
|
var SecondaryButton = (0, _styledComponents.default)(_Button.Button)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n height: 40px;\n margin: 0 8px;\n\n ", "\n"])), (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Bold, 'unset'));
|
|
41
41
|
|
|
@@ -56,8 +56,8 @@ var RightSideNav = function RightSideNav(_ref) {
|
|
|
56
56
|
exact: item === null || item === void 0 ? void 0 : item.exact,
|
|
57
57
|
to: (item === null || item === void 0 ? void 0 : item.to) || '',
|
|
58
58
|
onMouseDown: _common.defaultOnMouseDownHandler,
|
|
59
|
-
onClick: function onClick() {
|
|
60
|
-
return item.action && item.action();
|
|
59
|
+
onClick: function onClick(e) {
|
|
60
|
+
return item.action && item.action(e);
|
|
61
61
|
},
|
|
62
62
|
children: item === null || item === void 0 ? void 0 : item.label
|
|
63
63
|
}, item === null || item === void 0 ? void 0 : item.label);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"names":["NavContainer","styled","div","BREAKPOINTS","SMALL","
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"names":["NavContainer","styled","div","BREAKPOINTS","SMALL","LARGE","SecondaryButton","Button","ComponentTextStyle","Bold","RightSideNav","items","action","getNavItem","item","disabled","label","NavLink","exact","to","defaultOnMouseDownHandler","e","reverse","map","no"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AAEA;;;;;;;;;;AAGA,IAAMA,YAAY,GAAGC,0BAAOC,GAAV,yWAUdC,oBAAYC,KAVE,EAcdD,oBAAYE,KAdE,CAAlB;;AA0BA,IAAMC,eAAe,GAAG,+BAAOC,cAAP,CAAH,qIAIjB,+BAAkBC,2BAAmBC,IAArC,EAA2C,OAA3C,CAJiB,CAArB;;AAYA,IAAMC,YAAY,GAAG,SAAfA,YAAe,OAAuD;AAAA,MAArDC,KAAqD,QAArDA,KAAqD;AAAA,MAA9CC,MAA8C,QAA9CA,MAA8C;;AAC1E,MAAMC,UAAU,GAAG,SAAbA,UAAa,CAACC,IAAD,EAAsC;AACvD,QAAIA,IAAJ,aAAIA,IAAJ,eAAIA,IAAI,CAAEC,QAAV,EAAoB;AAClB,0BACE,qBAAC,gBAAD;AAAS,QAAA,EAAE,EAAER,cAAb;AAAqB,QAAA,SAAS,EAAC,UAA/B;AAAA,kBACGO,IADH,aACGA,IADH,uBACGA,IAAI,CAAEE;AADT,SAA+CF,IAA/C,aAA+CA,IAA/C,uBAA+CA,IAAI,CAAEE,KAArD,CADF;AAKD,KAND,MAMO;AACL,0BACE,qBAAC,gBAAD;AACE,QAAA,EAAE,EAAEC,uBADN;AAEE,QAAA,KAAK,EAAEH,IAAF,aAAEA,IAAF,uBAAEA,IAAI,CAAEI,KAFf;AAGE,QAAA,EAAE,EAAE,CAAAJ,IAAI,SAAJ,IAAAA,IAAI,WAAJ,YAAAA,IAAI,CAAEK,EAAN,KAAY,EAHlB;AAKE,QAAA,WAAW,EAAEC,iCALf;AAME,QAAA,OAAO,EAAE,iBAACC,CAAD;AAAA,iBAAwBP,IAAI,CAACF,MAAL,IAAeE,IAAI,CAACF,MAAL,CAAYS,CAAZ,CAAvC;AAAA,SANX;AAAA,kBAOGP,IAPH,aAOGA,IAPH,uBAOGA,IAAI,CAAEE;AAPT,SAIOF,IAJP,aAIOA,IAJP,uBAIOA,IAAI,CAAEE,KAJb,CADF;AAWD;AACF,GApBD;;AAqBA,sBACE,sBAAC,YAAD;AAAA,eACGL,KADH,aACGA,KADH,uBACGA,KAAK,CAAEW,OAAP,GAAiBC,GAAjB,CAAqB,UAAAC,EAAE;AAAA,aAAIX,UAAU,CAACW,EAAD,CAAd;AAAA,KAAvB,CADH,EAIIZ,MAAM,iBACN,qBAAC,eAAD;AAAiB,MAAA,OAAO,EAAC,WAAzB;AAAqC,MAAA,OAAO,EAAEA,MAAF,aAAEA,MAAF,uBAAEA,MAAM,CAAEA,MAAtD;AAAA,gBACGA,MAAM,CAACI;AADV,MALJ;AAAA,IADF;AAYD,CAlCD;;;AAJEL,EAAAA,K;;eAwCaD,Y","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../../NavItem';\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\nimport {Button} from '../../Button';\nimport {ComponentMStyling} from '../../styles';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div`\n display: flex;\n margin: auto 0 auto auto;\n align-items: center;\n height: 48px;\n\n a {\n text-decoration: none;\n }\n\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n }\n\n ${BREAKPOINTS.LARGE} {\n height: 64px;\n }\n\n button,\n div {\n &:hover {\n cursor: pointer;\n }\n }\n`;\n\nconst SecondaryButton = styled(Button)`\n height: 40px;\n margin: 0 8px;\n\n ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n items?: MenuNavigationItemTypeItem[];\n action?: MenuButton;\n};\n\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\n const getNavItem = (item: MenuNavigationItemTypeItem) => {\n if (item?.disabled) {\n return (\n <NavItem as={Button} className=\"disabled\" key={item?.label}>\n {item?.label}\n </NavItem>\n );\n } else {\n return (\n <NavItem\n as={NavLink}\n exact={item?.exact}\n to={item?.to || ''}\n key={item?.label}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\n {item?.label}\n </NavItem>\n );\n }\n };\n return (\n <NavContainer>\n {items?.reverse().map(no => getNavItem(no))}\n\n {\n action &&\n <SecondaryButton variant=\"secondary\" onClick={action?.action}>\n {action.label}\n </SecondaryButton>\n }\n </NavContainer>\n );\n};\n\nexport default RightSideNav;\n"],"file":"RightSideNav.cjs"}
|
|
@@ -13,7 +13,7 @@ import { ComponentMStyling } from '../../styles';
|
|
|
13
13
|
import { defaultOnMouseDownHandler } from '../../common';
|
|
14
14
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
15
15
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
16
|
-
var NavContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n margin: auto 0 auto auto;\n align-items: center;\n height: 48px;\n\n a {\n text-decoration: none;\n }\n\n ", " {\n height: 56px;\n }\n\n ", " {\n height: 64px;\n }\n\n button,\n div {\n &:hover {\n cursor: pointer;\n }\n }\n"])), BREAKPOINTS.SMALL, BREAKPOINTS.
|
|
16
|
+
var NavContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n margin: auto 0 auto auto;\n align-items: center;\n height: 48px;\n\n a {\n text-decoration: none;\n }\n\n ", " {\n height: 56px;\n }\n\n ", " {\n height: 64px;\n }\n\n button,\n div {\n &:hover {\n cursor: pointer;\n }\n }\n"])), BREAKPOINTS.SMALL, BREAKPOINTS.LARGE);
|
|
17
17
|
var SecondaryButton = styled(Button)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n height: 40px;\n margin: 0 8px;\n\n ", "\n"])), ComponentMStyling(ComponentTextStyle.Bold, 'unset'));
|
|
18
18
|
|
|
19
19
|
var RightSideNav = function RightSideNav(_ref) {
|
|
@@ -33,8 +33,8 @@ var RightSideNav = function RightSideNav(_ref) {
|
|
|
33
33
|
exact: item === null || item === void 0 ? void 0 : item.exact,
|
|
34
34
|
to: (item === null || item === void 0 ? void 0 : item.to) || '',
|
|
35
35
|
onMouseDown: defaultOnMouseDownHandler,
|
|
36
|
-
onClick: function onClick() {
|
|
37
|
-
return item.action && item.action();
|
|
36
|
+
onClick: function onClick(e) {
|
|
37
|
+
return item.action && item.action(e);
|
|
38
38
|
},
|
|
39
39
|
children: item === null || item === void 0 ? void 0 : item.label
|
|
40
40
|
}, item === null || item === void 0 ? void 0 : item.label);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"names":["React","styled","NavLink","NavItem","BREAKPOINTS","ComponentTextStyle","Button","ComponentMStyling","defaultOnMouseDownHandler","NavContainer","div","SMALL","
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/RightSideNav.tsx"],"names":["React","styled","NavLink","NavItem","BREAKPOINTS","ComponentTextStyle","Button","ComponentMStyling","defaultOnMouseDownHandler","NavContainer","div","SMALL","LARGE","SecondaryButton","Bold","RightSideNav","items","action","getNavItem","item","disabled","label","exact","to","e","reverse","map","no"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,OAAR,QAAsB,kBAAtB;AAEA,SAAQC,OAAR,QAAsB,eAAtB;AACA,SAAQC,WAAR,EAAqBC,kBAArB,QAA8C,cAA9C;AACA,SAAQC,MAAR,QAAqB,cAArB;AACA,SAAQC,iBAAR,QAAgC,cAAhC;AACA,SAAQC,yBAAR,QAAwC,cAAxC;;;AAGA,IAAMC,YAAY,GAAGR,MAAM,CAACS,GAAV,2VAUdN,WAAW,CAACO,KAVE,EAcdP,WAAW,CAACQ,KAdE,CAAlB;AA0BA,IAAMC,eAAe,GAAGZ,MAAM,CAACK,MAAD,CAAT,uHAIjBC,iBAAiB,CAACF,kBAAkB,CAACS,IAApB,EAA0B,OAA1B,CAJA,CAArB;;AAYA,IAAMC,YAAY,GAAG,SAAfA,YAAe,OAAuD;AAAA,MAArDC,KAAqD,QAArDA,KAAqD;AAAA,MAA9CC,MAA8C,QAA9CA,MAA8C;;AAC1E,MAAMC,UAAU,GAAG,SAAbA,UAAa,CAACC,IAAD,EAAsC;AACvD,QAAIA,IAAJ,aAAIA,IAAJ,eAAIA,IAAI,CAAEC,QAAV,EAAoB;AAClB,0BACE,KAAC,OAAD;AAAS,QAAA,EAAE,EAAEd,MAAb;AAAqB,QAAA,SAAS,EAAC,UAA/B;AAAA,kBACGa,IADH,aACGA,IADH,uBACGA,IAAI,CAAEE;AADT,SAA+CF,IAA/C,aAA+CA,IAA/C,uBAA+CA,IAAI,CAAEE,KAArD,CADF;AAKD,KAND,MAMO;AACL,0BACE,KAAC,OAAD;AACE,QAAA,EAAE,EAAEnB,OADN;AAEE,QAAA,KAAK,EAAEiB,IAAF,aAAEA,IAAF,uBAAEA,IAAI,CAAEG,KAFf;AAGE,QAAA,EAAE,EAAE,CAAAH,IAAI,SAAJ,IAAAA,IAAI,WAAJ,YAAAA,IAAI,CAAEI,EAAN,KAAY,EAHlB;AAKE,QAAA,WAAW,EAAEf,yBALf;AAME,QAAA,OAAO,EAAE,iBAACgB,CAAD;AAAA,iBAAwBL,IAAI,CAACF,MAAL,IAAeE,IAAI,CAACF,MAAL,CAAYO,CAAZ,CAAvC;AAAA,SANX;AAAA,kBAOGL,IAPH,aAOGA,IAPH,uBAOGA,IAAI,CAAEE;AAPT,SAIOF,IAJP,aAIOA,IAJP,uBAIOA,IAAI,CAAEE,KAJb,CADF;AAWD;AACF,GApBD;;AAqBA,sBACE,MAAC,YAAD;AAAA,eACGL,KADH,aACGA,KADH,uBACGA,KAAK,CAAES,OAAP,GAAiBC,GAAjB,CAAqB,UAAAC,EAAE;AAAA,aAAIT,UAAU,CAACS,EAAD,CAAd;AAAA,KAAvB,CADH,EAIIV,MAAM,iBACN,KAAC,eAAD;AAAiB,MAAA,OAAO,EAAC,WAAzB;AAAqC,MAAA,OAAO,EAAEA,MAAF,aAAEA,MAAF,uBAAEA,MAAM,CAAEA,MAAtD;AAAA,gBACGA,MAAM,CAACI;AADV,MALJ;AAAA,IADF;AAYD,CAlCD;;;AAJEL,EAAAA,K;;AAwCF,eAAeD,YAAf","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../../NavItem';\nimport {BREAKPOINTS, ComponentTextStyle} from '../../styles';\nimport {Button} from '../../Button';\nimport {ComponentMStyling} from '../../styles';\nimport {defaultOnMouseDownHandler} from '../../common';\nimport {MenuButton, MenuNavigationItemTypeItem} from '../types';\n\nconst NavContainer = styled.div`\n display: flex;\n margin: auto 0 auto auto;\n align-items: center;\n height: 48px;\n\n a {\n text-decoration: none;\n }\n\n ${BREAKPOINTS.SMALL} {\n height: 56px;\n }\n\n ${BREAKPOINTS.LARGE} {\n height: 64px;\n }\n\n button,\n div {\n &:hover {\n cursor: pointer;\n }\n }\n`;\n\nconst SecondaryButton = styled(Button)`\n height: 40px;\n margin: 0 8px;\n\n ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n items?: MenuNavigationItemTypeItem[];\n action?: MenuButton;\n};\n\nconst RightSideNav = ({items, action}: Props): React.ReactElement<Props> => {\n const getNavItem = (item: MenuNavigationItemTypeItem) => {\n if (item?.disabled) {\n return (\n <NavItem as={Button} className=\"disabled\" key={item?.label}>\n {item?.label}\n </NavItem>\n );\n } else {\n return (\n <NavItem\n as={NavLink}\n exact={item?.exact}\n to={item?.to || ''}\n key={item?.label}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={(e:React.MouseEvent) => item.action && item.action(e)}>\n {item?.label}\n </NavItem>\n );\n }\n };\n return (\n <NavContainer>\n {items?.reverse().map(no => getNavItem(no))}\n\n {\n action &&\n <SecondaryButton variant=\"secondary\" onClick={action?.action}>\n {action.label}\n </SecondaryButton>\n }\n </NavContainer>\n );\n};\n\nexport default RightSideNav;\n"],"file":"RightSideNav.js"}
|
|
@@ -33,7 +33,7 @@ var _breakpoints = _interopRequireDefault(require("../../styles/breakpoints"));
|
|
|
33
33
|
|
|
34
34
|
var _MenuItem = require("../../MenuItem");
|
|
35
35
|
|
|
36
|
-
var _NavigationHelper = require("
|
|
36
|
+
var _NavigationHelper = require("../../common/NavigationHelper");
|
|
37
37
|
|
|
38
38
|
var _ProfileButton = require("../../ProfileButton");
|
|
39
39
|
|
|
@@ -108,8 +108,8 @@ var UserMenu = function UserMenu(_ref) {
|
|
|
108
108
|
icon: item.icon,
|
|
109
109
|
displayLabel: item.label
|
|
110
110
|
},
|
|
111
|
-
onClickHandler: function onClickHandler() {
|
|
112
|
-
item.action && item.action();
|
|
111
|
+
onClickHandler: function onClickHandler(e) {
|
|
112
|
+
item.action && item.action(e);
|
|
113
113
|
navigate(item.to, !!item.external);
|
|
114
114
|
}
|
|
115
115
|
}, index);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"names":["UserMenuScrollContainer","styled","div","UserMenuPinnedContainer","UserMenuWrapper","COLORS","white","Z_INDEXES","off_canvas","Breakpoints","MEDIUM","flowDown","BOXSHADOWS","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","ComponentTextStyle","Bold","neutral_500","MenuSectionList","UserMenuSectionListStyling","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","React","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Size","Large","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n BOXSHADOWS,\n COLORS,\n ComponentLStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n width: 320px;\n\n position: absolute;\n\n &.show {\n display: block;\n }\n\n top: 0;\n right: 0;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n flex-flow: column;\n\n\n ${Breakpoints.MEDIUM} {\n flex-flow: initial;\n top: initial;\n right: initial;\n height: initial;\n animation: ${flowDown} 0.2s ease-in-out;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n padding: 24px 0;\n }\n`;\n\n\nconst MenuSection = styled.div`\n padding: 4px 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n align-items: center;\n justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 24px 4px 24px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n pointer-events: none;\n\n button {\n padding: 0 !important;\n }\n\n button > div {\n width: 48px !important;\n height: 48px !important;\n border-radius: 50% !important;\n }\n`;\n\nconst UserSectionInfo = styled.div`\n padding: 2px 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n word-break: break-all;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n svg {\n width: 16px;\n height: 16px;\n }\n`;\n\nconst UserSection = styled.div`\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n show?: boolean;\n onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n React.useEffect(() => {\n if (!onHideUserMenu) return;\n\n function handleKeyPress(e: any) {\n if (e.key === 'Escape' || e.key === 'Esc') {\n onHideUserMenu();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [onHideUserMenu]);\n\n const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n <MenuItem key={index}\n id={`profile_${index}`}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n }}\n onClickHandler={() => {\n item.action && item.action();\n navigate(item.to, !!item.external);\n }}/>\n\n return (\n <UserMenuWrapper onClick={onHideUserMenu}\n className={show ? 'show' : ''}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <UserMenuScrollContainer>\n <UserSection>\n <UserSectionAvatar>\n <ProfileButton onClick={() => {\n }}\n tabIndex={-1}\n initials={user.firstName[0] + user.lastName[0]}/>\n </UserSectionAvatar>\n <UserSectionInfo>\n <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n {\n user.link &&\n <HyperLink variant={'default'}\n href={user.link.href}\n target={user.link.target}\n id={user.link.id}\n onClick={user.link.onClick}>\n <UserSectionInfoLink>\n <span>\n {user.link.label}\n </span>\n {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n </UserSectionInfoLink>\n </HyperLink>\n }\n </UserSectionInfo>\n </UserSection>\n {\n sections.filter(a => !a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n </UserMenuScrollContainer>\n <UserMenuPinnedContainer>\n {\n sections.filter(a => !!a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n {\n signOut &&\n <SignOutActionWrapper>\n <Button width={'272px'}\n variant=\"secondary\"\n icon={<SystemIcons.Logout/>}\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut?.action();\n }}>\n {signOut?.label}\n </Button>\n </SignOutActionWrapper>\n }\n </UserMenuPinnedContainer>\n </UserMenuWrapper>\n );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.cjs"}
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"names":["UserMenuScrollContainer","styled","div","UserMenuPinnedContainer","UserMenuWrapper","COLORS","white","Z_INDEXES","off_canvas","Breakpoints","MEDIUM","flowDown","BOXSHADOWS","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","ComponentTextStyle","Bold","neutral_500","MenuSectionList","UserMenuSectionListStyling","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","React","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Size","Large","preventDefault"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AASA;;AACA;;AACA;;AACA;;AAGA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,IAAMA,uBAAuB,GAAGC,0BAAOC,GAAV,iGAA7B;;AAIA,IAAMC,uBAAuB,GAAGF,0BAAOC,GAAV,qFAA7B;;AAGA,IAAME,eAAe,GAAGH,0BAAOC,GAAV,2lBAECG,eAAOC,KAFR,EAeRC,kBAAUC,UAfF,EAoBjBC,qBAAYC,MApBK,EAyBJC,sBAzBI,EA0BHC,mBAAWC,kBA1BR,EA4BGR,eAAOS,WA5BV,EA6BNP,kBAAUQ,UA7BJ,CAArB;;AAmCA,IAAMC,WAAW,GAAGf,0BAAOC,GAAV,+NAOWG,eAAOS,WAPlB,CAAjB;;AAWA,IAAMG,oBAAoB,GAAG,+BAAOD,WAAP,CAAH,2IAA1B;;AAKA,IAAME,iBAAiB,GAAGjB,0BAAOC,GAAV,sPAMDG,eAAOc,UANN,EAQnB,+BAAkBC,2BAAmBC,IAArC,EAA2ChB,eAAOiB,WAAlD,CARmB,CAAvB;;AAWA,IAAMC,eAAe,GAAGtB,0BAAOC,GAAV,gIAIjBsB,wCAJiB,CAArB;;AAQA,IAAMC,iBAAiB,GAAGxB,0BAAOC,GAAV,uRAAvB;;AAcA,IAAMwB,eAAe,GAAGzB,0BAAOC,GAAV,oKAArB;;AAOA,IAAMyB,mBAAmB,GAAG1B,0BAAOC,GAAV,kGACrB,+BAAkBkB,2BAAmBC,IAArC,EAA2ChB,eAAOuB,WAAlD,CADqB,CAAzB;;AAIA,IAAMC,oBAAoB,GAAG5B,0BAAOC,GAAV,4HAEtB,gCAAmBkB,2BAAmBU,OAAtC,EAA+CzB,eAAOiB,WAAtD,CAFsB,CAA1B;;AAKA,IAAMS,mBAAmB,GAAG9B,0BAAOC,GAAV,iOAMrB,gCAAmBkB,2BAAmBC,IAAtC,EAA4C,IAA5C,CANqB,CAAzB;;AAaA,IAAMW,WAAW,GAAG/B,0BAAOC,GAAV,8KAAjB;;AAYA,IAAM+B,QAAQ,GAAG,SAAXA,QAAW,OAA2E;AAAA,MAAzEC,IAAyE,QAAzEA,IAAyE;AAAA,MAAnEC,IAAmE,QAAnEA,IAAmE;AAAA,MAA7DC,cAA6D,QAA7DA,cAA6D;AAAA,MAA7CC,QAA6C,QAA7CA,QAA6C;AAAA,MAAnCC,OAAmC,QAAnCA,OAAmC;AAAA,MAA1BC,KAA0B,QAA1BA,KAA0B;;AAE1F,6BAAkC,4CAAlC;AAAA,MAAOC,QAAP,wBAAOA,QAAP;AAAA,MAAiBC,aAAjB,wBAAiBA,aAAjB;;AAEAC,EAAAA,KAAK,CAACC,SAAN,CAAgB,YAAM;AACpB,QAAI,CAACP,cAAL,EAAqB;;AAErB,aAASQ,cAAT,CAAwBC,CAAxB,EAAgC;AAC9B,UAAIA,CAAC,CAACC,GAAF,KAAU,QAAV,IAAsBD,CAAC,CAACC,GAAF,KAAU,KAApC,EAA2C;AACzCV,QAAAA,cAAc;AACf;AACF;;AAEDW,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,SAA1B,EAAqCJ,cAArC,EAAqD,KAArD;AACA,WAAO,YAAM;AACXG,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,SAA7B,EAAwCL,cAAxC,EAAwD,KAAxD;AACD,KAFD;AAGD,GAbD,EAaG,CAACR,cAAD,CAbH;;AAeA,MAAMc,UAAU,GAAG,SAAbA,UAAa,CAACC,IAAD,EAA2BC,OAA3B,EAA2DC,KAA3D;AAAA,wBACjB,qBAAC,kBAAD;AACU,MAAA,EAAE,oBAAaA,KAAb,CADZ;AAEU,MAAA,MAAM,EAAE,CAACF,IAAI,CAACG,QAAN,IAAkBb,aAAa,CAACU,IAAI,CAACI,EAAN,EAAU,CAAC,CAACJ,IAAI,CAACK,KAAjB,CAFjD;AAGU,MAAA,IAAI,EAAE;AACJC,QAAAA,KAAK,EAAEN,IAAI,CAACI,EADR;AAEJG,QAAAA,QAAQ,EAAEP,IAAI,CAACO,QAFX;AAGJC,QAAAA,IAAI,EAAER,IAAI,CAACQ,IAHP;AAIJC,QAAAA,YAAY,EAAET,IAAI,CAACZ;AAJf,OAHhB;AASU,MAAA,cAAc,EAAE,wBAACM,CAAD,EAAO;AACrBM,QAAAA,IAAI,CAACU,MAAL,IAAeV,IAAI,CAACU,MAAL,CAAYhB,CAAZ,CAAf;AACAL,QAAAA,QAAQ,CAACW,IAAI,CAACI,EAAN,EAAU,CAAC,CAACJ,IAAI,CAACG,QAAjB,CAAR;AACD;AAZX,OAAeD,KAAf,CADiB;AAAA,GAAnB;;AAeA,sBACE,sBAAC,eAAD;AAAiB,IAAA,OAAO,EAAEjB,cAA1B;AACiB,IAAA,SAAS,EAAEF,IAAI,GAAG,MAAH,GAAY,EAD5C;AAEiB,IAAA,IAAI,EAAC,MAFtB;AAGiB,uBAAgB,gBAHjC;AAAA,4BAIE,sBAAC,uBAAD;AAAA,8BACE,sBAAC,WAAD;AAAA,gCACE,qBAAC,iBAAD;AAAA,iCACE,qBAAC,4BAAD;AAAe,YAAA,OAAO,EAAE,mBAAM,CAC7B,CADD;AAEe,YAAA,QAAQ,EAAE,CAAC,CAF1B;AAGe,YAAA,QAAQ,EAAEC,IAAI,CAAC2B,SAAL,CAAe,CAAf,IAAoB3B,IAAI,CAAC4B,QAAL,CAAc,CAAd;AAH7C;AADF,UADF,eAOE,sBAAC,eAAD;AAAA,kCACE,qBAAC,mBAAD;AAAqB,oCAArB;AAAA,gCAA0C5B,IAAI,CAAC2B,SAA/C,cAA4D3B,IAAI,CAAC4B,QAAjE;AAAA,YADF,eAEE,qBAAC,oBAAD;AAAsB,oCAAtB;AAAA,sBAAwC5B,IAAI,CAAC6B;AAA7C,YAFF,EAII7B,IAAI,CAAC8B,IAAL,iBACA,qBAAC,oBAAD;AAAW,YAAA,OAAO,EAAE,SAApB;AACW,YAAA,IAAI,EAAE9B,IAAI,CAAC8B,IAAL,CAAUC,IAD3B;AAEW,YAAA,MAAM,EAAE/B,IAAI,CAAC8B,IAAL,CAAUE,MAF7B;AAGW,YAAA,EAAE,EAAEhC,IAAI,CAAC8B,IAAL,CAAUG,EAHzB;AAIW,YAAA,OAAO,EAAEjC,IAAI,CAAC8B,IAAL,CAAUI,OAJ9B;AAAA,mCAKE,sBAAC,mBAAD;AAAA,sCACE;AAAA,0BACGlC,IAAI,CAAC8B,IAAL,CAAU1B;AADb,gBADF,EAIGJ,IAAI,CAAC8B,IAAL,CAAUN,IAAV,iBAAkBjB,KAAK,CAAC4B,YAAN,CAAmBnC,IAAI,CAAC8B,IAAL,CAAUN,IAA7B,EAAmC;AAACY,gBAAAA,IAAI,EAAE;AAAP,eAAnC,CAJrB;AAAA;AALF,YALJ;AAAA,UAPF;AAAA,QADF,EA6BIlC,QAAQ,CAACmC,MAAT,CAAgB,UAAAC,CAAC;AAAA,eAAI,CAACA,CAAC,CAACC,MAAP;AAAA,OAAjB,EAAgCC,GAAhC,CAAoC,UAACvB,OAAD,EAAUC,KAAV;AAAA,4BAClC,sBAAC,WAAD;AAAyB,UAAA,SAAS,EAAED,OAAO,CAACwB,OAAR,GAAkB,SAAlB,GAA8B,EAAlE;AAAA,qBACGxB,OAAO,CAACb,KAAR,iBAAiB,qBAAC,iBAAD;AAAA,sBAAoBa,OAAO,CAACb;AAA5B,YADpB,eAEE,qBAAC,eAAD;AAAA,sBACGa,OAAO,CAACyB,KAAR,CAAcF,GAAd,CAAkB,UAACxB,IAAD,EAAOE,KAAP;AAAA,qBAAiBH,UAAU,CAACC,IAAD,EAAOC,OAAP,EAAgBC,KAAhB,CAA3B;AAAA,aAAlB;AADH,aAAsBA,KAAtB,CAFF;AAAA,WAAkBA,KAAlB,CADkC;AAAA,OAApC,CA7BJ;AAAA,MAJF,eA2CE,sBAAC,uBAAD;AAAA,iBAEIhB,QAAQ,CAACmC,MAAT,CAAgB,UAAAC,CAAC;AAAA,eAAI,CAAC,CAACA,CAAC,CAACC,MAAR;AAAA,OAAjB,EAAiCC,GAAjC,CAAqC,UAACvB,OAAD,EAAUC,KAAV;AAAA,4BACnC,sBAAC,WAAD;AAAyB,UAAA,SAAS,EAAED,OAAO,CAACwB,OAAR,IAAmBvB,KAAK,KAAK,CAA7B,GAAiC,SAAjC,GAA6C,EAAjF;AAAA,qBACGD,OAAO,CAACb,KAAR,iBAAiB,qBAAC,iBAAD;AAAA,sBAAoBa,OAAO,CAACb;AAA5B,YADpB,eAEE,qBAAC,eAAD;AAAA,sBACGa,OAAO,CAACyB,KAAR,CAAcF,GAAd,CAAkB,UAACxB,IAAD,EAAOE,KAAP;AAAA,qBAAiBH,UAAU,CAACC,IAAD,EAAOC,OAAP,EAAgBC,KAAhB,CAA3B;AAAA,aAAlB;AADH,aAAsBA,KAAtB,CAFF;AAAA,WAAkBA,KAAlB,CADmC;AAAA,OAArC,CAFJ,EAYIf,OAAO,iBACP,qBAAC,oBAAD;AAAA,+BACE,qBAAC,cAAD;AAAQ,UAAA,KAAK,EAAE,OAAf;AACQ,UAAA,OAAO,EAAC,WADhB;AAEQ,UAAA,IAAI,eAAE,qBAAC,kBAAD,CAAa,MAAb,KAFd;AAGQ,UAAA,IAAI,EAAEwC,YAAKC,KAHnB;AAIQ,UAAA,OAAO,EAAE,iBAAAlC,CAAC,EAAI;AACZA,YAAAA,CAAC,CAACmC,cAAF;AACA1C,YAAAA,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEuB,MAAT;AACD,WAPT;AAAA,oBAQGvB,OARH,aAQGA,OARH,uBAQGA,OAAO,CAAEC;AARZ;AADF,QAbJ;AAAA,MA3CF;AAAA,IADF;AAyED,CA3GD;;;AAJEL,EAAAA,I;AACAE,EAAAA,c;;eAgHaH,Q","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n BOXSHADOWS,\n COLORS,\n ComponentLStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n width: 320px;\n\n position: absolute;\n\n &.show {\n display: block;\n }\n\n top: 0;\n right: 0;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n flex-flow: column;\n\n\n ${Breakpoints.MEDIUM} {\n flex-flow: initial;\n top: initial;\n right: initial;\n height: initial;\n animation: ${flowDown} 0.2s ease-in-out;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n padding: 24px 0;\n }\n`;\n\n\nconst MenuSection = styled.div`\n padding: 4px 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n align-items: center;\n justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 24px 4px 24px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n pointer-events: none;\n\n button {\n padding: 0 !important;\n }\n\n button > div {\n width: 48px !important;\n height: 48px !important;\n border-radius: 50% !important;\n }\n`;\n\nconst UserSectionInfo = styled.div`\n padding: 2px 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n word-break: break-all;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n svg {\n width: 16px;\n height: 16px;\n }\n`;\n\nconst UserSection = styled.div`\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n show?: boolean;\n onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n React.useEffect(() => {\n if (!onHideUserMenu) return;\n\n function handleKeyPress(e: any) {\n if (e.key === 'Escape' || e.key === 'Esc') {\n onHideUserMenu();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [onHideUserMenu]);\n\n const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n <MenuItem key={index}\n id={`profile_${index}`}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n }}\n onClickHandler={(e) => {\n item.action && item.action(e);\n navigate(item.to, !!item.external);\n }}/>\n\n return (\n <UserMenuWrapper onClick={onHideUserMenu}\n className={show ? 'show' : ''}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <UserMenuScrollContainer>\n <UserSection>\n <UserSectionAvatar>\n <ProfileButton onClick={() => {\n }}\n tabIndex={-1}\n initials={user.firstName[0] + user.lastName[0]}/>\n </UserSectionAvatar>\n <UserSectionInfo>\n <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n {\n user.link &&\n <HyperLink variant={'default'}\n href={user.link.href}\n target={user.link.target}\n id={user.link.id}\n onClick={user.link.onClick}>\n <UserSectionInfoLink>\n <span>\n {user.link.label}\n </span>\n {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n </UserSectionInfoLink>\n </HyperLink>\n }\n </UserSectionInfo>\n </UserSection>\n {\n sections.filter(a => !a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n </UserMenuScrollContainer>\n <UserMenuPinnedContainer>\n {\n sections.filter(a => !!a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n {\n signOut &&\n <SignOutActionWrapper>\n <Button width={'272px'}\n variant=\"secondary\"\n icon={<SystemIcons.Logout/>}\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut?.action();\n }}>\n {signOut?.label}\n </Button>\n </SignOutActionWrapper>\n }\n </UserMenuPinnedContainer>\n </UserMenuWrapper>\n );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.cjs"}
|
|
@@ -13,7 +13,7 @@ import { SystemIcons } from '../../icons';
|
|
|
13
13
|
import { HyperLink } from '../../HyperLink';
|
|
14
14
|
import Breakpoints from '../../styles/breakpoints';
|
|
15
15
|
import { MenuItem } from '../../MenuItem';
|
|
16
|
-
import { useNavigationHelper } from '
|
|
16
|
+
import { useNavigationHelper } from '../../common/NavigationHelper';
|
|
17
17
|
import { ProfileButton } from '../../ProfileButton';
|
|
18
18
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
19
19
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
@@ -68,8 +68,8 @@ var UserMenu = function UserMenu(_ref) {
|
|
|
68
68
|
icon: item.icon,
|
|
69
69
|
displayLabel: item.label
|
|
70
70
|
},
|
|
71
|
-
onClickHandler: function onClickHandler() {
|
|
72
|
-
item.action && item.action();
|
|
71
|
+
onClickHandler: function onClickHandler(e) {
|
|
72
|
+
item.action && item.action(e);
|
|
73
73
|
navigate(item.to, !!item.external);
|
|
74
74
|
}
|
|
75
75
|
}, index);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"names":["React","styled","Button","BOXSHADOWS","COLORS","ComponentLStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","Size","flowDown","UserMenuSectionListStyling","SystemIcons","HyperLink","Breakpoints","MenuItem","useNavigationHelper","ProfileButton","UserMenuScrollContainer","div","UserMenuPinnedContainer","UserMenuWrapper","white","off_canvas","MEDIUM","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","Bold","neutral_500","MenuSectionList","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Large","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n BOXSHADOWS,\n COLORS,\n ComponentLStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n width: 320px;\n\n position: absolute;\n\n &.show {\n display: block;\n }\n\n top: 0;\n right: 0;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n flex-flow: column;\n\n\n ${Breakpoints.MEDIUM} {\n flex-flow: initial;\n top: initial;\n right: initial;\n height: initial;\n animation: ${flowDown} 0.2s ease-in-out;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n padding: 24px 0;\n }\n`;\n\n\nconst MenuSection = styled.div`\n padding: 4px 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n align-items: center;\n justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 24px 4px 24px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n pointer-events: none;\n\n button {\n padding: 0 !important;\n }\n\n button > div {\n width: 48px !important;\n height: 48px !important;\n border-radius: 50% !important;\n }\n`;\n\nconst UserSectionInfo = styled.div`\n padding: 2px 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n word-break: break-all;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n svg {\n width: 16px;\n height: 16px;\n }\n`;\n\nconst UserSection = styled.div`\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n show?: boolean;\n onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n React.useEffect(() => {\n if (!onHideUserMenu) return;\n\n function handleKeyPress(e: any) {\n if (e.key === 'Escape' || e.key === 'Esc') {\n onHideUserMenu();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [onHideUserMenu]);\n\n const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n <MenuItem key={index}\n id={`profile_${index}`}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n }}\n onClickHandler={() => {\n item.action && item.action();\n navigate(item.to, !!item.external);\n }}/>\n\n return (\n <UserMenuWrapper onClick={onHideUserMenu}\n className={show ? 'show' : ''}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <UserMenuScrollContainer>\n <UserSection>\n <UserSectionAvatar>\n <ProfileButton onClick={() => {\n }}\n tabIndex={-1}\n initials={user.firstName[0] + user.lastName[0]}/>\n </UserSectionAvatar>\n <UserSectionInfo>\n <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n {\n user.link &&\n <HyperLink variant={'default'}\n href={user.link.href}\n target={user.link.target}\n id={user.link.id}\n onClick={user.link.onClick}>\n <UserSectionInfoLink>\n <span>\n {user.link.label}\n </span>\n {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n </UserSectionInfoLink>\n </HyperLink>\n }\n </UserSectionInfo>\n </UserSection>\n {\n sections.filter(a => !a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n </UserMenuScrollContainer>\n <UserMenuPinnedContainer>\n {\n sections.filter(a => !!a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n {\n signOut &&\n <SignOutActionWrapper>\n <Button width={'272px'}\n variant=\"secondary\"\n icon={<SystemIcons.Logout/>}\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut?.action();\n }}>\n {signOut?.label}\n </Button>\n </SignOutActionWrapper>\n }\n </UserMenuPinnedContainer>\n </UserMenuWrapper>\n );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/desktop/UserMenu.tsx"],"names":["React","styled","Button","BOXSHADOWS","COLORS","ComponentLStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","Size","flowDown","UserMenuSectionListStyling","SystemIcons","HyperLink","Breakpoints","MenuItem","useNavigationHelper","ProfileButton","UserMenuScrollContainer","div","UserMenuPinnedContainer","UserMenuWrapper","white","off_canvas","MEDIUM","BOXSHADOW_CENTERED","neutral_200","fixed_menu","MenuSection","SignOutActionWrapper","MenuSectionHeader","neutral_20","Bold","neutral_500","MenuSectionList","UserSectionAvatar","UserSectionInfo","UserSectionInfoName","neutral_600","UserSectionInfoEmail","Regular","UserSectionInfoLink","UserSection","UserMenu","show","user","onHideUserMenu","sections","signOut","label","navigate","isActiveRoute","useEffect","handleKeyPress","e","key","document","addEventListener","removeEventListener","renderItem","item","section","index","external","to","exact","value","disabled","icon","displayLabel","action","firstName","lastName","email","link","href","target","id","onClick","cloneElement","size","filter","a","pinned","map","divider","items","Large","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {\n BOXSHADOWS,\n COLORS,\n ComponentLStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n Z_INDEXES\n} from '../../styles';\nimport {Size} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {SystemIcons} from '../../icons';\nimport {HyperLink} from '../../HyperLink';\nimport {MenuNavigationItem, MenuNavigationItemTypeItem, MenuNavigationSection, ProfileMenu} from '../types';\nimport MobileMenuHeader from '../mobile/MobileMenuHeader';\nimport Breakpoints from '../../styles/breakpoints';\nimport {MenuItem} from '../../MenuItem';\nimport {useNavigationHelper} from '../../common/NavigationHelper';\nimport {ProfileButton} from '../../ProfileButton';\n\nconst UserMenuScrollContainer = styled.div`\n flex: 1;\n`;\n\nconst UserMenuPinnedContainer = styled.div``;\n\n\nconst UserMenuWrapper = styled.div`\n margin: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n width: 320px;\n\n position: absolute;\n\n &.show {\n display: block;\n }\n\n top: 0;\n right: 0;\n z-index: ${Z_INDEXES.off_canvas};\n height: 100%;\n flex-flow: column;\n\n\n ${Breakpoints.MEDIUM} {\n flex-flow: initial;\n top: initial;\n right: initial;\n height: initial;\n animation: ${flowDown} 0.2s ease-in-out;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n z-index: ${Z_INDEXES.fixed_menu};\n padding: 24px 0;\n }\n`;\n\n\nconst MenuSection = styled.div`\n padding: 4px 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n\n &.divider {\n border-top: 1px solid ${COLORS.neutral_200};\n }\n`;\n\nconst SignOutActionWrapper = styled(MenuSection)`\n align-items: center;\n justify-content: center;\n`;\n\nconst MenuSectionHeader = styled.div`\n display: flex;\n align-items: center;\n padding: 8px 24px 4px 24px;\n box-sizing: border-box;\n min-height: 32px;\n background-color: ${COLORS.neutral_20};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n`;\n\nconst MenuSectionList = styled.div`\n margin: 0;\n padding: 0;\n\n ${UserMenuSectionListStyling};\n`;\n\n\nconst UserSectionAvatar = styled.div`\n pointer-events: none;\n\n button {\n padding: 0 !important;\n }\n\n button > div {\n width: 48px !important;\n height: 48px !important;\n border-radius: 50% !important;\n }\n`;\n\nconst UserSectionInfo = styled.div`\n padding: 2px 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n`;\n\nconst UserSectionInfoName = styled.div`\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst UserSectionInfoEmail = styled.div`\n word-break: break-all;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n`;\n\nconst UserSectionInfoLink = styled.div`\n padding: 2px 0;\n display: flex;\n align-items: center;\n gap: 4px;\n\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n svg {\n width: 16px;\n height: 16px;\n }\n`;\n\nconst UserSection = styled.div`\n display: flex;\n flex-direction: row;\n padding: 0 24px 8px 24px;\n gap: 16px;\n`;\n\ninterface UserMenuProps extends ProfileMenu {\n show?: boolean;\n onHideUserMenu: () => void;\n}\n\nconst UserMenu = ({show, user, onHideUserMenu, sections, signOut, label}: UserMenuProps) => {\n\n const {navigate, isActiveRoute} = useNavigationHelper();\n\n React.useEffect(() => {\n if (!onHideUserMenu) return;\n\n function handleKeyPress(e: any) {\n if (e.key === 'Escape' || e.key === 'Esc') {\n onHideUserMenu();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [onHideUserMenu]);\n\n const renderItem = (item: MenuNavigationItem, section: MenuNavigationSection, index: number) =>\n <MenuItem key={index}\n id={`profile_${index}`}\n active={!item.external && isActiveRoute(item.to, !!item.exact)}\n item={{\n value: item.to,\n disabled: item.disabled,\n icon: item.icon,\n displayLabel: item.label,\n }}\n onClickHandler={(e) => {\n item.action && item.action(e);\n navigate(item.to, !!item.external);\n }}/>\n\n return (\n <UserMenuWrapper onClick={onHideUserMenu}\n className={show ? 'show' : ''}\n role=\"menu\"\n aria-labelledby=\"UserMenuButton\">\n <UserMenuScrollContainer>\n <UserSection>\n <UserSectionAvatar>\n <ProfileButton onClick={() => {\n }}\n tabIndex={-1}\n initials={user.firstName[0] + user.lastName[0]}/>\n </UserSectionAvatar>\n <UserSectionInfo>\n <UserSectionInfoName data-hj-suppress>{`${user.firstName} ${user.lastName}`}</UserSectionInfoName>\n <UserSectionInfoEmail data-hj-suppress>{user.email}</UserSectionInfoEmail>\n {\n user.link &&\n <HyperLink variant={'default'}\n href={user.link.href}\n target={user.link.target}\n id={user.link.id}\n onClick={user.link.onClick}>\n <UserSectionInfoLink>\n <span>\n {user.link.label}\n </span>\n {user.link.icon && React.cloneElement(user.link.icon, {size: '16px'})}\n </UserSectionInfoLink>\n </HyperLink>\n }\n </UserSectionInfo>\n </UserSection>\n {\n sections.filter(a => !a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n </UserMenuScrollContainer>\n <UserMenuPinnedContainer>\n {\n sections.filter(a => !!a.pinned).map((section, index) =>\n <MenuSection key={index} className={section.divider || index === 0 ? 'divider' : ''}>\n {section.label && <MenuSectionHeader>{section.label}</MenuSectionHeader>}\n <MenuSectionList key={index}>\n {section.items.map((item, index) => renderItem(item, section, index))}\n </MenuSectionList>\n </MenuSection>\n )\n }\n {\n signOut &&\n <SignOutActionWrapper>\n <Button width={'272px'}\n variant=\"secondary\"\n icon={<SystemIcons.Logout/>}\n size={Size.Large}\n onClick={e => {\n e.preventDefault();\n signOut?.action();\n }}>\n {signOut?.label}\n </Button>\n </SignOutActionWrapper>\n }\n </UserMenuPinnedContainer>\n </UserMenuWrapper>\n );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.js"}
|
|
@@ -72,7 +72,7 @@ var MobileMenu = function MobileMenu(_ref) {
|
|
|
72
72
|
peek = _useStackState.peek;
|
|
73
73
|
|
|
74
74
|
var isMediumScreen = (0, _reactResponsive.useMediaQuery)({
|
|
75
|
-
query: _styles.BREAKPOINTS.
|
|
75
|
+
query: _styles.BREAKPOINTS.LARGE.replace('@media ', '')
|
|
76
76
|
});
|
|
77
77
|
var location = (0, _reactRouterDom.useLocation)();
|
|
78
78
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"names":["Wrapper","styled","div","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","SwitcherLabel","MobileFooter","COLORS","neutral_200","ComponentTextStyle","Bold","neutral_600","CustomContent","MobileMenu","show","profile","buttons","label","header","items","footer","action","onClose","reset","length","push","pop","peek","isMediumScreen","query","MEDIUM","replace","location","onSubMenuOpen","menu","type","content","customContent","custom","React","useEffect","setTimeout","current","switcher","find","a","undefined"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAiBA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,IAAMA,OAAO,GAAGC,0BAAOC,GAAV,qQAEAC,kBAAUC,UAFV,EAUTC,oBAAYC,KAVH,CAAb;;AAeA,IAAMC,aAAa,GAAGN,0BAAOC,GAAV,6GAAnB;;AAIA,IAAMM,YAAY,GAAGP,0BAAOC,GAAV,+TAOQO,eAAOC,WAPf,EASd,gCAAmBC,2BAAmBC,IAAtC,EAA4CH,eAAOI,WAAnD,CATc,EAUdR,oBAAYC,KAVE,EAaZ,+BAAkBK,2BAAmBC,IAArC,EAA2CH,eAAOI,WAAlD,CAbY,CAAlB;;AAiBA,IAAMC,aAAa,GAAGb,0BAAOC,GAAV,2MAAnB;;AA8BA,IAAMa,UAAU,GAAG,SAAbA,UAAa,OAUc;AAAA;;AAAA,MATXC,IASW,QATXA,IASW;AAAA,MARXC,OAQW,QARXA,OAQW;AAAA,MAPXC,OAOW,QAPXA,OAOW;AAAA,MANXC,KAMW,QANXA,KAMW;AAAA,MALXC,MAKW,QALXA,MAKW;AAAA,MAJXC,KAIW,QAJXA,KAIW;AAAA,MAHXC,MAGW,QAHXA,MAGW;AAAA,MAFXC,MAEW,QAFXA,MAEW;AAAA,MADXC,OACW,QADXA,OACW;;AAE/B,uBAAyC,gCAAzC;AAAA,MAAOC,KAAP,kBAAOA,KAAP;AAAA,MAAcC,MAAd,kBAAcA,MAAd;AAAA,MAAsBC,IAAtB,kBAAsBA,IAAtB;AAAA,MAA4BC,GAA5B,kBAA4BA,GAA5B;AAAA,MAAiCC,IAAjC,kBAAiCA,IAAjC;;AAEA,MAAMC,cAAc,GAAG,oCAAc;AAACC,IAAAA,KAAK,EAAE1B,oBAAY2B,MAAZ,CAAmBC,OAAnB,CAA2B,SAA3B,EAAsC,EAAtC;AAAR,GAAd,CAAvB;AAEA,MAAMC,QAAQ,GAAG,kCAAjB;;AAEA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,IAAD,EAAsE;AAE1F,YAAQA,IAAR,aAAQA,IAAR,uBAAQA,IAAI,CAAEC,IAAd;AACE,WAAK,OAAL;AACEV,QAAAA,IAAI,CAAC;AACHP,UAAAA,MAAM,EAAE;AACND,YAAAA,KAAK,EAAEiB,IAAI,CAACjB,KADN;AAEND,YAAAA,OAAO,EAAEkB,IAAI,CAAClB;AAFR,WADL;AAKHoB,UAAAA,OAAO,EAAE;AACPlB,YAAAA,MAAM,EAAEgB,IAAI,CAAChB,MADN;AAEPC,YAAAA,KAAK,EAAEe,IAAI,CAACf,KAFL;AAGPC,YAAAA,MAAM,EAAEc,IAAI,CAACd,MAHN;AAIPC,YAAAA,MAAM,EAAEa,IAAI,CAACb;AAJN,WALN;AAWHD,UAAAA,MAAM,EAAE;AAXL,SAAD,CAAJ;AAaA;;AACF,WAAK,QAAL;AACEK,QAAAA,IAAI,CAAC;AACHP,UAAAA,MAAM,EAAE;AACND,YAAAA,KAAK,EAAEiB,IAAI,CAACjB,KADN;AAEND,YAAAA,OAAO,EAAEkB,IAAI,CAAClB;AAFR,WADL;AAKHqB,UAAAA,aAAa,EAAEH,IAAI,CAACI,MALjB;AAMHlB,UAAAA,MAAM,EAAE;AANL,SAAD,CAAJ;AAQA;;AACF;AACE;AA3BJ;AA8BD,GAhCD;;AAkCAmB,EAAAA,KAAK,CAACC,SAAN,CAAgB,YAAM;AACpBlB,IAAAA,OAAO;AACR,GAFD,EAEG,CAACU,QAAD,CAFH;AAIAO,EAAAA,KAAK,CAACC,SAAN,CAAgB,YAAM;AACpBZ,IAAAA,cAAc,IAAIN,OAAO,EAAzB;AACD,GAFD,EAEG,CAACM,cAAD,CAFH;AAIAW,EAAAA,KAAK,CAACC,SAAN,CAAgB,YAAM;AACpBC,IAAAA,UAAU,CAAC,YAAM;AACflB,MAAAA,KAAK,CAAC;AACJH,QAAAA,MAAM,EAAE,IADJ;AAEJF,QAAAA,MAAM,EAAE;AACND,UAAAA,KAAK,EAAEA,KADD;AAEND,UAAAA,OAAO,EAAEA;AAFH,SAFJ;AAMJoB,QAAAA,OAAO,EAAE;AACPlB,UAAAA,MAAM,EAAEA,MADD;AAEPC,UAAAA,KAAK,EAAEA,KAFA;AAGPC,UAAAA,MAAM,EAAEA,MAHD;AAIPC,UAAAA,MAAM,EAAEA;AAJD;AANL,OAAD,CAAL;AAaD,KAdS,EAcP,GAdO,CAAV;AAeD,GAhBD,EAgBG,CAACP,IAAD,CAhBH;AAmBA,MAAM4B,OAAO,GAAGf,IAAI,EAApB;AAEA,MAAMgB,QAAQ,GAAGD,OAAH,aAAGA,OAAH,0CAAGA,OAAO,CAAExB,MAAZ,6EAAG,gBAAiBF,OAApB,0DAAG,sBAA0B4B,IAA1B,CAA+B,UAAAC,CAAC;AAAA,WAAIA,CAAC,CAACV,IAAF,KAAW,UAAf;AAAA,GAAhC,CAAjB;AAEA,sBACE,sBAAC,OAAD;AAAA,4BACE,qBAAC,yBAAD;AAAkB,MAAA,OAAO,EAAEO,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAExB,MAAT,CAAgBF,OAA3C;AACkB,MAAA,QAAQ,EAAEQ,MAAM,GAAG,CAAT,GAAaE,GAAb,GAAmBoB,SAD/C;AAEkB,MAAA,aAAa,EAAEb,aAFjC;AAGkB,MAAA,OAAO,EAAElB,OAH3B;AAIkB,MAAA,KAAK,EAAE2B,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAExB,MAAT,CAAgBD,KAJzC;AAKkB,MAAA,OAAO,EAAEK;AAL3B,MADF,EAOG,CAAAoB,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEL,aAAT,kBAA0B,qBAAC,aAAD;AAAA,gBAAgBK,OAAhB,aAAgBA,OAAhB,uBAAgBA,OAAO,CAAEL,aAAT;AAAhB,MAP7B,EAQG,CAAAK,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEN,OAAT,kBAAoB,qBAAC,0BAAD;AAAmB,MAAA,MAAM,EAAEM,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEN,OAAT,CAAiBlB,MAA5C;AACmB,MAAA,KAAK,EAAEwB,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEN,OAAT,CAAiBjB,KAD3C;AAEmB,MAAA,MAAM,EAAEuB,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEN,OAAT,CAAiBhB,MAF5C;AAGmB,MAAA,MAAM,EAAEsB,OAAF,aAAEA,OAAF,uBAAEA,OAAO,CAAEN,OAAT,CAAiBf,MAH5C;AAImB,MAAA,aAAa,EAAEY;AAJlC,MARvB,EAeI,CAAAS,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEtB,MAAT,kBACA,sBAAC,YAAD;AAAA,8BACE,qBAAC,mBAAD;AAAa,QAAA,MAAM,EAAE,MAArB;AAA6B,QAAA,KAAK,EAAE;AAApC,QADF,EAEGuB,QAAQ,iBACP;AAAA,gCACE,qBAAC,aAAD;AAAe,UAAA,SAAS,EAAE,mBAA1B;AAAA;AAAA,UADF,eAEE,qBAAC,kBAAD;AACE,UAAA,OAAO,EAAE,WADX;AAEE,UAAA,KAAK,EAAE,UAFT;AAGE,UAAA,EAAE,EAAC,qBAHL;AAIE,UAAA,MAAM,EAAE;AAAA,mBAAMA,QAAQ,CAACtB,MAAT,IAAmBsB,QAAQ,CAACtB,MAAT,EAAnB,IAAwCC,OAAO,EAArD;AAAA,WAJV;AAAA,iCAKE,qBAAC,sBAAD;AAAW,YAAA,IAAI,EAAC;AAAhB;AALF,UAFF;AAAA,QAHJ;AAAA,MAhBJ;AAAA,IADF;AAoCD,CAvHD;;;AAnBER,EAAAA,I;AACAQ,EAAAA,O;;eA2IaT,U","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 MenuIconSubMenuButton,\n MobileMenuButtonTypes,\n MenuSwitcherButton,\n MenuNavigationCustomSubMenu\n} from '../types';\nimport MobileMenuHeader from './MobileMenuHeader';\nimport MobileMenuContent from './MobileMenuContent';\nimport {useMediaQuery} from 'react-responsive';\nimport {useStackState} from '../../common/StackState';\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 = useMediaQuery({query: BREAKPOINTS.MEDIUM.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'}>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"],"file":"MobileMenu.cjs"}
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"names":["Wrapper","styled","div","Z_INDEXES","off_canvas","BREAKPOINTS","SMALL","SwitcherLabel","MobileFooter","COLORS","neutral_200","ComponentTextStyle","Bold","neutral_600","CustomContent","MobileMenu","show","profile","buttons","label","header","items","footer","action","onClose","reset","length","push","pop","peek","isMediumScreen","query","LARGE","replace","location","onSubMenuOpen","menu","type","content","customContent","custom","React","useEffect","setTimeout","current","switcher","find","a","undefined"],"mappings":"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","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 MenuIconSubMenuButton,\n MobileMenuButtonTypes,\n MenuSwitcherButton,\n MenuNavigationCustomSubMenu\n} from '../types';\nimport MobileMenuHeader from './MobileMenuHeader';\nimport MobileMenuContent from './MobileMenuContent';\nimport {useMediaQuery} from 'react-responsive';\nimport {useStackState} from '../../common/StackState';\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 = useMediaQuery({query: 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'}>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"],"file":"MobileMenu.cjs"}
|
|
@@ -43,7 +43,7 @@ var MobileMenu = function MobileMenu(_ref) {
|
|
|
43
43
|
peek = _useStackState.peek;
|
|
44
44
|
|
|
45
45
|
var isMediumScreen = useMediaQuery({
|
|
46
|
-
query: BREAKPOINTS.
|
|
46
|
+
query: BREAKPOINTS.LARGE.replace('@media ', '')
|
|
47
47
|
});
|
|
48
48
|
var location = useLocation();
|
|
49
49
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","SwitchApp","useLocation","IconButton","LaerdalLogo","MobileMenuHeader","MobileMenuContent","useMediaQuery","useStackState","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","query","MEDIUM","replace","location","onSubMenuOpen","menu","type","content","customContent","custom","useEffect","setTimeout","current","switcher","find","a","undefined"],"mappings":"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","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 MenuIconSubMenuButton,\n MobileMenuButtonTypes,\n MenuSwitcherButton,\n MenuNavigationCustomSubMenu\n} from '../types';\nimport MobileMenuHeader from './MobileMenuHeader';\nimport MobileMenuContent from './MobileMenuContent';\nimport {useMediaQuery} from 'react-responsive';\nimport {useStackState} from '../../common/StackState';\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 = useMediaQuery({query: BREAKPOINTS.MEDIUM.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'}>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"],"file":"MobileMenu.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/GlobalNavigationBar/mobile/MobileMenu.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","SwitchApp","useLocation","IconButton","LaerdalLogo","MobileMenuHeader","MobileMenuContent","useMediaQuery","useStackState","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","query","LARGE","replace","location","onSubMenuOpen","menu","type","content","customContent","custom","useEffect","setTimeout","current","switcher","find","a","undefined"],"mappings":"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","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 MenuIconSubMenuButton,\n MobileMenuButtonTypes,\n MenuSwitcherButton,\n MenuNavigationCustomSubMenu\n} from '../types';\nimport MobileMenuHeader from './MobileMenuHeader';\nimport MobileMenuContent from './MobileMenuContent';\nimport {useMediaQuery} from 'react-responsive';\nimport {useStackState} from '../../common/StackState';\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 = useMediaQuery({query: 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'}>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"],"file":"MobileMenu.js"}
|