@commercetools-frontend/application-shell 22.9.1 → 22.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.
Files changed (84) hide show
  1. package/dist/commercetools-frontend-application-shell.cjs.dev.js +2 -4
  2. package/dist/commercetools-frontend-application-shell.cjs.prod.js +2 -4
  3. package/dist/commercetools-frontend-application-shell.esm.js +2 -4
  4. package/dist/{custom-view-dev-host-621386e0.cjs.dev.js → custom-view-dev-host-1a72b8f3.cjs.dev.js} +2 -4
  5. package/dist/{custom-view-dev-host-5ce5a507.esm.js → custom-view-dev-host-c6d81824.esm.js} +2 -4
  6. package/dist/declarations/src/components/app-bar/app-bar.d.ts +0 -1
  7. package/dist/declarations/src/components/application-shell-authenticated/application-shell-authenticated.d.ts +1 -4
  8. package/dist/declarations/src/components/custom-view-shell-authenticated/custom-view-shell-authenticated.d.ts +1 -1
  9. package/dist/declarations/src/components/navbar/compiled/navbar.css.json.d.ts +3 -0
  10. package/dist/declarations/src/components/navbar/index.d.ts +1 -3
  11. package/dist/declarations/src/components/navbar/{navbar-new/menu-items.d.ts → menu-items.d.ts} +1 -1
  12. package/dist/declarations/src/components/navbar/navbar.d.ts +43 -4
  13. package/dist/declarations/src/components/navbar/use-navbar-state-manager.d.ts +0 -1
  14. package/dist/declarations/src/constants.d.ts +2 -5
  15. package/dist/{index-beeb5dbb.cjs.prod.js → index-497ae97d.cjs.prod.js} +207 -267
  16. package/dist/index-70c1623b.esm.js +1970 -0
  17. package/dist/index-cdc22735.cjs.dev.js +2030 -0
  18. package/dist/navbar-058bd4bc.esm.js +1199 -0
  19. package/dist/navbar-131d7509.cjs.dev.js +1230 -0
  20. package/dist/navbar-5b122d30.cjs.prod.js +1096 -0
  21. package/dist/{oidc-b2ac8a92.cjs.prod.js → oidc-88c678f1.cjs.prod.js} +3 -6
  22. package/dist/{oidc-0c6ca06c.cjs.dev.js → oidc-ad31a103.cjs.dev.js} +3 -6
  23. package/dist/{oidc-callback-7e6fcaff.esm.js → oidc-callback-943a79a3.esm.js} +2 -4
  24. package/dist/{oidc-callback-9d5cdf00.cjs.dev.js → oidc-callback-be76c044.cjs.dev.js} +2 -4
  25. package/dist/{oidc-callback-27fd978b.cjs.prod.js → oidc-callback-c70d87ef.cjs.prod.js} +2 -4
  26. package/dist/{oidc-95696f7b.esm.js → oidc-ffa1a7b2.esm.js} +3 -6
  27. package/dist/{project-container-b189c7a3.esm.js → project-container-6b3fd716.esm.js} +6 -8
  28. package/dist/{project-container-0ef3869c.cjs.dev.js → project-container-6d637c9b.cjs.dev.js} +6 -8
  29. package/dist/{project-container-c6fb1e4f.cjs.prod.js → project-container-a125b80c.cjs.prod.js} +6 -8
  30. package/dist/{project-expired-e2815596.cjs.dev.js → project-expired-2b8a9d75.cjs.dev.js} +3 -5
  31. package/dist/{project-expired-911e2f79.cjs.prod.js → project-expired-3210d4c1.cjs.prod.js} +3 -5
  32. package/dist/{project-expired-bd4f93bc.esm.js → project-expired-ac67215f.esm.js} +3 -5
  33. package/dist/{project-not-found-e5255cac.cjs.prod.js → project-not-found-47f8fa22.cjs.prod.js} +3 -5
  34. package/dist/{project-not-found-c0f09321.cjs.dev.js → project-not-found-9429c7d7.cjs.dev.js} +3 -5
  35. package/dist/{project-not-found-bfd9a058.esm.js → project-not-found-dc976e8c.esm.js} +3 -5
  36. package/dist/{project-not-initialized-0ed0f209.cjs.dev.js → project-not-initialized-9a3a1100.cjs.dev.js} +3 -5
  37. package/dist/{project-not-initialized-8d0cab2e.esm.js → project-not-initialized-c929db3a.esm.js} +3 -5
  38. package/dist/{project-not-initialized-2b02f3bb.cjs.prod.js → project-not-initialized-d7aa4b2f.cjs.prod.js} +3 -5
  39. package/dist/{project-suspended-cee209a6.esm.js → project-suspended-b789a67b.esm.js} +3 -5
  40. package/dist/{project-suspended-cfa2eb3b.cjs.prod.js → project-suspended-bb439496.cjs.prod.js} +3 -5
  41. package/dist/{project-suspended-94956aec.cjs.dev.js → project-suspended-d25e0da3.cjs.dev.js} +3 -5
  42. package/dist/{quick-access-1b73b555.cjs.dev.js → quick-access-463c6a6a.cjs.dev.js} +2 -4
  43. package/dist/{quick-access-232ff40f.esm.js → quick-access-86ec0b56.esm.js} +2 -4
  44. package/dist/{quick-access-ce774311.cjs.prod.js → quick-access-b1fdce23.cjs.prod.js} +2 -4
  45. package/dist/{redirect-to-login-aa538da2.cjs.dev.js → redirect-to-login-2c2678c6.cjs.dev.js} +1 -1
  46. package/dist/{redirect-to-login-ee9f3801.cjs.prod.js → redirect-to-login-2eb8c713.cjs.prod.js} +1 -1
  47. package/dist/{redirect-to-login-9535ddbc.esm.js → redirect-to-login-4e5c2292.esm.js} +1 -1
  48. package/dist/{redirect-to-logout-3a0798c1.esm.js → redirect-to-logout-23042a64.esm.js} +2 -4
  49. package/dist/{redirect-to-logout-ccdd9a48.cjs.dev.js → redirect-to-logout-b8c9ab83.cjs.dev.js} +2 -4
  50. package/dist/{redirect-to-logout-96e94d9d.cjs.prod.js → redirect-to-logout-f96ad82f.cjs.prod.js} +2 -4
  51. package/dist/{requests-in-flight-loader-8333ff01.esm.js → requests-in-flight-loader-4b2b696b.esm.js} +2 -4
  52. package/dist/{requests-in-flight-loader-b48dcc38.cjs.dev.js → requests-in-flight-loader-6dca76f3.cjs.dev.js} +2 -4
  53. package/dist/{requests-in-flight-loader-7f4804b4.cjs.prod.js → requests-in-flight-loader-d1643ea7.cjs.prod.js} +2 -4
  54. package/dist/{service-page-project-switcher-dd1d0479.esm.js → service-page-project-switcher-2676ee3d.esm.js} +1 -1
  55. package/dist/{service-page-project-switcher-ea2d1f5b.cjs.dev.js → service-page-project-switcher-5303df97.cjs.dev.js} +1 -1
  56. package/dist/{service-page-project-switcher-d656d2f0.cjs.prod.js → service-page-project-switcher-f267c53a.cjs.prod.js} +1 -1
  57. package/dist/{user-settings-menu-59dbf5d2.cjs.dev.js → user-settings-menu-2e70ac8f.cjs.dev.js} +1 -1
  58. package/dist/{user-settings-menu-70751be9.cjs.prod.js → user-settings-menu-367bc7a6.cjs.prod.js} +1 -1
  59. package/dist/{user-settings-menu-5841d422.esm.js → user-settings-menu-a2a34456.esm.js} +1 -1
  60. package/dist/{version-tracker-e862fb1a.cjs.dev.js → version-tracker-321e7b99.cjs.dev.js} +2 -4
  61. package/dist/{version-tracker-b14edb65.cjs.prod.js → version-tracker-bd652c85.cjs.prod.js} +2 -4
  62. package/dist/{version-tracker-8e09ba95.esm.js → version-tracker-cf000a87.esm.js} +2 -4
  63. package/package.json +21 -21
  64. package/ssr/dist/commercetools-frontend-application-shell-ssr.cjs.dev.js +1 -1
  65. package/ssr/dist/commercetools-frontend-application-shell-ssr.cjs.prod.js +1 -1
  66. package/ssr/dist/commercetools-frontend-application-shell-ssr.esm.js +1 -1
  67. package/dist/declarations/src/components/application-shell-authenticated/new-main-navigation-flag-wrapper.d.ts +0 -9
  68. package/dist/declarations/src/components/navbar/navbar-new/compiled/navbar.css.json.d.ts +0 -3
  69. package/dist/declarations/src/components/navbar/navbar-new/navbar.d.ts +0 -48
  70. package/dist/declarations/src/components/navbar/navbar-old/compiled/navbar.css.json.d.ts +0 -3
  71. package/dist/declarations/src/components/navbar/navbar-old/loading-navbar.d.ts +0 -5
  72. package/dist/declarations/src/components/navbar/navbar-old/menu-items.d.ts +0 -100
  73. package/dist/declarations/src/components/navbar/navbar-old/navbar.d.ts +0 -48
  74. package/dist/declarations/src/components/navbar/navbar-old/navbar.styles.d.ts +0 -7
  75. package/dist/declarations/src/components/navbar/use-loading-menu-layout-effect.d.ts +0 -2
  76. package/dist/declarations/src/feature-toggles.d.ts +0 -4
  77. package/dist/index-c0b19086.cjs.dev.js +0 -2081
  78. package/dist/index-e6cf101e.esm.js +0 -2019
  79. package/dist/navbar-1d867dcd.esm.js +0 -2006
  80. package/dist/navbar-5d636a16.cjs.dev.js +0 -2037
  81. package/dist/navbar-78f58680.cjs.prod.js +0 -1834
  82. /package/dist/declarations/src/components/navbar/{navbar-new/navbar-skeleton.d.ts → navbar-skeleton.d.ts} +0 -0
  83. /package/dist/declarations/src/components/navbar/{navbar-new/navbar-skeleton.styles.d.ts → navbar-skeleton.styles.d.ts} +0 -0
  84. /package/dist/declarations/src/components/navbar/{navbar-new/navbar.styles.d.ts → navbar.styles.d.ts} +0 -0
@@ -1,1834 +0,0 @@
1
- 'use strict';
2
-
3
- var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
4
- var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
5
- var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
6
- var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
7
- var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
8
- var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
9
- var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
10
- var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
11
- var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
12
- var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
13
- var _pt = require('prop-types');
14
- var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
15
- var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
16
- var _Array$isArray = require('@babel/runtime-corejs3/core-js-stable/array/is-array');
17
- var react = require('react');
18
- var react$1 = require('@emotion/react');
19
- var classnames = require('classnames');
20
- var snakeCase = require('lodash/snakeCase');
21
- var reactIntl = require('react-intl');
22
- var reactRouterDom = require('react-router-dom');
23
- var applicationShellConnectors = require('@commercetools-frontend/application-shell-connectors');
24
- var LogoSVG = require('@commercetools-frontend/assets/logos/commercetools_small-logo.svg');
25
- var constants = require('@commercetools-frontend/constants');
26
- var icons = require('@commercetools-uikit/icons');
27
- var oidc = require('./oidc-b2ac8a92.cjs.prod.js');
28
- var isNil = require('lodash/isNil');
29
- var throttle = require('lodash/throttle');
30
- var sentry = require('@commercetools-frontend/sentry');
31
- var useApplicationsMenu = require('./use-applications-menu-10d6d71b.cjs.prod.js');
32
- var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
33
- var _styled = require('@emotion/styled/base');
34
- var _includesInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/includes');
35
- var _everyInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/every');
36
- var _findInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/find');
37
- var _startsWithInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/starts-with');
38
- var reactBroadcast = require('@flopflip/react-broadcast');
39
- var MissingImageSvg = require('@commercetools-frontend/assets/images/diagonal-line.svg');
40
- var permissions = require('@commercetools-frontend/permissions');
41
- var InlineSvg = require('@commercetools-uikit/icons/inline-svg');
42
- var useIsServedByProxy = require('./use-is-served-by-proxy-845cace5.cjs.prod.js');
43
- var jsxRuntime = require('@emotion/react/jsx-runtime');
44
- var _keysInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/keys');
45
- var designSystem = require('@commercetools-uikit/design-system');
46
- var _Array$from = require('@babel/runtime-corejs3/core-js-stable/array/from');
47
- var dist_commercetoolsFrontendApplicationShell = require('./index-beeb5dbb.cjs.prod.js');
48
- var applicationComponents = require('@commercetools-frontend/application-components');
49
- require('@apollo/client');
50
- require('@commercetools-frontend/l10n');
51
- require('./index-6cd618cc.cjs.prod.js');
52
- require('@babel/runtime-corejs3/core-js-stable/instance/reduce');
53
- require('@babel/runtime-corejs3/core-js-stable/object/entries');
54
- require('@babel/runtime-corejs3/core-js-stable/reflect/has');
55
- require('@reduxjs/toolkit');
56
- require('lodash/mapValues');
57
- require('omit-empty-es');
58
- require('redux-thunk');
59
- require('@commercetools-frontend/notifications');
60
- require('@commercetools-frontend/sdk');
61
- require('@babel/runtime-corejs3/core-js-stable/instance/index-of');
62
- require('@babel/runtime-corejs3/core-js-stable/instance/slice');
63
- require('@commercetools-frontend/react-notifications');
64
- require('redux-logger');
65
- require('@commercetools-frontend/i18n');
66
- require('@babel/runtime-corejs3/core-js-stable/url');
67
- require('@commercetools-frontend/assets/images/logo.svg');
68
- require('@commercetools-uikit/spacings');
69
- require('@commercetools-uikit/flat-button');
70
- require('@babel/runtime-corejs3/helpers/taggedTemplateLiteral');
71
- require('memoize-one');
72
- require('@commercetools-uikit/accessible-hidden');
73
- require('@commercetools-uikit/select-input');
74
- require('@commercetools-frontend/assets/images/ct-logo.svg');
75
- require('@commercetools-uikit/loading-spinner');
76
- require('@commercetools-frontend/browser-history');
77
- require('@babel/runtime-corejs3/core-js-stable/reflect/construct');
78
- require('@babel/runtime-corejs3/helpers/classCallCheck');
79
- require('@babel/runtime-corejs3/helpers/createClass');
80
- require('@babel/runtime-corejs3/helpers/inherits');
81
- require('@babel/runtime-corejs3/helpers/possibleConstructorReturn');
82
- require('@babel/runtime-corejs3/helpers/getPrototypeOf');
83
- require('@babel/runtime-corejs3/core-js-stable/object/from-entries');
84
- require('@babel/runtime-corejs3/core-js-stable/instance/flags');
85
- require('@apollo/client/react');
86
- require('@flopflip/combine-adapters');
87
- require('@flopflip/http-adapter');
88
- require('@flopflip/launchdarkly-adapter');
89
- require('@flopflip/types');
90
- require('react-redux');
91
- require('lodash/upperFirst');
92
- require('@commercetools-uikit/design-system/materials/resets.css');
93
- require('@commercetools-frontend/application-config/ssr');
94
- require('@babel/runtime-corejs3/core-js-stable/json/stringify');
95
- require('@babel/runtime-corejs3/core-js-stable/instance/some');
96
- require('@commercetools-frontend/actions-global');
97
-
98
- function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
99
-
100
- var _Object$keys__default = /*#__PURE__*/_interopDefault(_Object$keys);
101
- var _Object$getOwnPropertySymbols__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertySymbols);
102
- var _filterInstanceProperty__default = /*#__PURE__*/_interopDefault(_filterInstanceProperty);
103
- var _Object$getOwnPropertyDescriptor__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptor);
104
- var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachInstanceProperty);
105
- var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptors);
106
- var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
107
- var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
108
- var _pt__default = /*#__PURE__*/_interopDefault(_pt);
109
- var _mapInstanceProperty__default = /*#__PURE__*/_interopDefault(_mapInstanceProperty);
110
- var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
111
- var _Array$isArray__default = /*#__PURE__*/_interopDefault(_Array$isArray);
112
- var classnames__default = /*#__PURE__*/_interopDefault(classnames);
113
- var snakeCase__default = /*#__PURE__*/_interopDefault(snakeCase);
114
- var LogoSVG__default = /*#__PURE__*/_interopDefault(LogoSVG);
115
- var isNil__default = /*#__PURE__*/_interopDefault(isNil);
116
- var throttle__default = /*#__PURE__*/_interopDefault(throttle);
117
- var _styled__default = /*#__PURE__*/_interopDefault(_styled);
118
- var _includesInstanceProperty__default = /*#__PURE__*/_interopDefault(_includesInstanceProperty);
119
- var _everyInstanceProperty__default = /*#__PURE__*/_interopDefault(_everyInstanceProperty);
120
- var _findInstanceProperty__default = /*#__PURE__*/_interopDefault(_findInstanceProperty);
121
- var _startsWithInstanceProperty__default = /*#__PURE__*/_interopDefault(_startsWithInstanceProperty);
122
- var MissingImageSvg__default = /*#__PURE__*/_interopDefault(MissingImageSvg);
123
- var InlineSvg__default = /*#__PURE__*/_interopDefault(InlineSvg);
124
- var _keysInstanceProperty__default = /*#__PURE__*/_interopDefault(_keysInstanceProperty);
125
- var _Array$from__default = /*#__PURE__*/_interopDefault(_Array$from);
126
-
127
- var messages = reactIntl.defineMessages({
128
- 'NavBar.MCSupport.title': {
129
- id: 'NavBar.MCSupport.title',
130
- defaultMessage: 'Support'
131
- }
132
- });
133
-
134
- // Type guard to help with filtering arrays for nullish elements.
135
- function nonNullable(value) {
136
- return value !== null && value !== undefined;
137
- }
138
-
139
- function ownKeys$5(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
140
- function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var _context4, _context5; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context4 = ownKeys$5(Object(t), !0)).call(_context4, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context5 = ownKeys$5(Object(t))).call(_context5, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
141
- var FetchProjectExtensionsNavbar = { kind: "Document", definitions: [{ kind: "OperationDefinition", operation: "query", name: { kind: "Name", value: "FetchProjectExtensionsNavbar" }, variableDefinitions: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "projectExtension" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "id" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "installedApplications" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "application" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "id" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "entryPointUriPath" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "icon" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "mainMenuLink" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "id" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "permissions" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "defaultLabel" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "labelAllLocales" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "locale" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "value" }, arguments: [], directives: [] }] } }] } }, { kind: "Field", name: { kind: "Name", value: "submenuLinks" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "id" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "uriPath" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "permissions" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "defaultLabel" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "labelAllLocales" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "locale" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "value" }, arguments: [], directives: [] }] } }] } }] } }] } }] } }] } }], loc: { start: 0, end: 537, source: { body: "query FetchProjectExtensionsNavbar {\n projectExtension {\n id\n installedApplications {\n application {\n id\n entryPointUriPath\n icon\n mainMenuLink {\n id\n permissions\n defaultLabel\n labelAllLocales {\n locale\n value\n }\n }\n submenuLinks {\n id\n uriPath\n permissions\n defaultLabel\n labelAllLocales {\n locale\n value\n }\n }\n }\n }\n }\n}\n", name: "GraphQL request", locationOffset: { line: 1, column: 1 } } } };
142
- const getInitialState = isForcedMenuOpen => ({
143
- isExpanderVisible: true,
144
- isMenuOpen: isNil__default["default"](isForcedMenuOpen) ? false : isForcedMenuOpen
145
- });
146
- const isForcedMenuOpenDefaultValue = false;
147
- const reducer = (state, action) => {
148
- switch (action.type) {
149
- case 'setActiveItemIndex':
150
- return _objectSpread$5(_objectSpread$5({}, state), {}, {
151
- activeItemIndex: action.payload
152
- });
153
- case 'unsetActiveItemIndex':
154
- return _objectSpread$5(_objectSpread$5({}, state), {}, {
155
- activeItemIndex: undefined
156
- });
157
- case 'setIsExpanderVisible':
158
- return _objectSpread$5(_objectSpread$5({}, state), {}, {
159
- isExpanderVisible: true
160
- });
161
- case 'toggleIsMenuOpen':
162
- return _objectSpread$5(_objectSpread$5({}, state), {}, {
163
- isMenuOpen: !state.isMenuOpen
164
- });
165
- case 'setIsMenuOpenAndMakeExpanderVisible':
166
- return _objectSpread$5(_objectSpread$5({}, state), {}, {
167
- isExpanderVisible: true,
168
- isMenuOpen: action.payload
169
- });
170
- case 'reset':
171
- return {
172
- isExpanderVisible: false,
173
- isMenuOpen: false
174
- };
175
- default:
176
- return state;
177
- }
178
- };
179
- const useNavbarStateManager = props => {
180
- var _context, _context2;
181
- const navBarNode = react.useRef(null);
182
- const applicationsNavBarMenu = useApplicationsMenu.useApplicationsMenu('navBar', {
183
- queryOptions: {
184
- onError: sentry.reportErrorToSentry
185
- },
186
- environment: props.environment
187
- });
188
- const _useMcQuery = applicationShellConnectors.useMcQuery(FetchProjectExtensionsNavbar, {
189
- skip: !props.environment.servedByProxy,
190
- context: {
191
- target: constants.GRAPHQL_TARGETS.SETTINGS_SERVICE
192
- },
193
- fetchPolicy: 'cache-and-network',
194
- onError: sentry.reportErrorToSentry
195
- }),
196
- projectExtensionsQuery = _useMcQuery.data;
197
- const allCustomApplicationsNavbarMenu = projectExtensionsQuery && projectExtensionsQuery.projectExtension && projectExtensionsQuery.projectExtension.installedApplications ? _filterInstanceProperty__default["default"](_context = _mapInstanceProperty__default["default"](_context2 = projectExtensionsQuery.projectExtension.installedApplications).call(_context2, installedApplication => {
198
- var _context3;
199
- const application = installedApplication.application;
200
- // Map the menu properties to match the one from the proxy schema.
201
- // This is to ensure that the menu object is the same from the proxy
202
- // config and the custom apps config, thus allowing them to be
203
- // concatenated and rendered the same way.
204
- return {
205
- key: application.id,
206
- uriPath: application.entryPointUriPath,
207
- labelAllLocales: application.mainMenuLink.labelAllLocales || [],
208
- icon: application.icon,
209
- permissions: application.mainMenuLink.permissions,
210
- defaultLabel: application.mainMenuLink.defaultLabel,
211
- featureToggle: undefined,
212
- menuVisibility: undefined,
213
- actionRights: undefined,
214
- dataFences: undefined,
215
- submenu: _mapInstanceProperty__default["default"](_context3 = application.submenuLinks || []).call(_context3, submenuLink => ({
216
- key: submenuLink.id,
217
- uriPath: submenuLink.uriPath,
218
- labelAllLocales: submenuLink.labelAllLocales || [],
219
- permissions: submenuLink.permissions,
220
- defaultLabel: submenuLink.defaultLabel,
221
- featureToggle: undefined,
222
- menuVisibility: undefined,
223
- actionRights: undefined,
224
- dataFences: undefined
225
- }))
226
- };
227
- })).call(_context, nonNullable) : [];
228
- const cachedIsForcedMenuOpen = window.localStorage.getItem(constants.STORAGE_KEYS.IS_FORCED_MENU_OPEN);
229
- const isForcedMenuOpen = isNil__default["default"](cachedIsForcedMenuOpen) ? isForcedMenuOpenDefaultValue : JSON.parse(cachedIsForcedMenuOpen);
230
- if (isNil__default["default"](cachedIsForcedMenuOpen)) {
231
- window.localStorage.setItem(constants.STORAGE_KEYS.IS_FORCED_MENU_OPEN, String(isForcedMenuOpen));
232
- }
233
- const _useReducer = react.useReducer(reducer, getInitialState(isForcedMenuOpen)),
234
- _useReducer2 = _slicedToArray(_useReducer, 2),
235
- state = _useReducer2[0],
236
- dispatch = _useReducer2[1];
237
- const checkSize = react.useCallback(throttle__default["default"](() => {
238
- const shouldOpen = window.innerWidth > oidc.WINDOW_SIZES.STANDARD;
239
- const canExpandMenu = window.innerWidth > (props.newNavigation ? oidc.WINDOW_SIZES.WIDE : oidc.WINDOW_SIZES.NARROW);
240
-
241
- // If the screen is small, we should always keep the menu closed,
242
- // no matter the settings.
243
- if (!canExpandMenu) {
244
- if (state.isMenuOpen || state.isExpanderVisible) {
245
- // and resets the state to avoid conflicts
246
- dispatch({
247
- type: 'reset'
248
- });
249
- }
250
- } else if (isForcedMenuOpen) {
251
- dispatch({
252
- type: 'setIsMenuOpenAndMakeExpanderVisible',
253
- payload: true
254
- });
255
- } else if (canExpandMenu && state.isExpanderVisible !== true) {
256
- dispatch({
257
- type: 'setIsExpanderVisible'
258
- });
259
- } else if (isNil__default["default"](isForcedMenuOpen) && state.isMenuOpen !== shouldOpen) {
260
- // User has no settings yet (this.props.isForcedMenuOpen === null)
261
- // We check the viewport size and:
262
- // - if screen is big, we open the menu
263
- // - if screen is small we close it
264
- dispatch({
265
- type: 'setIsMenuOpenAndMakeExpanderVisible',
266
- payload: shouldOpen
267
- });
268
- } else if (!isNil__default["default"](isForcedMenuOpen) && state.isMenuOpen !== isForcedMenuOpen) {
269
- // User has setting, we should use that and ignore the screen size.
270
- // Note: if viewport size is small, we should ignore the user settings.
271
- dispatch({
272
- type: 'setIsMenuOpenAndMakeExpanderVisible',
273
- payload: isForcedMenuOpen
274
- });
275
- }
276
- }, 100), [isForcedMenuOpen, state.isExpanderVisible, state.isMenuOpen]);
277
- const shouldCloseMenuFly = react.useCallback(event => {
278
- if (navBarNode && navBarNode.current && !navBarNode.current.contains(event.target) && !state.isMenuOpen) dispatch({
279
- type: 'unsetActiveItemIndex'
280
- });else if (event.type === 'mouseleave') dispatch({
281
- type: 'unsetActiveItemIndex'
282
- });
283
- }, [state.isMenuOpen]);
284
- react.useEffect(() => {
285
- window.addEventListener('resize', checkSize);
286
- window.addEventListener('click', shouldCloseMenuFly, true);
287
- return () => {
288
- window.removeEventListener('resize', checkSize);
289
- window.removeEventListener('click', shouldCloseMenuFly, true);
290
- };
291
- }, [checkSize, shouldCloseMenuFly]);
292
- react.useEffect(() => {
293
- checkSize();
294
- // eslint-disable-next-line react-hooks/exhaustive-deps
295
- }, []); // <-- run this only once!!
296
-
297
- react.useLayoutEffect(() => {
298
- if (state.isMenuOpen) document.body.classList.add('body__menu-open');
299
- if (!state.isMenuOpen) document.body.classList.remove('body__menu-open');
300
- }, [state.isMenuOpen]);
301
- const handleToggleItem = react.useCallback(nextActiveItemIndex => {
302
- if (state.activeItemIndex !== nextActiveItemIndex) dispatch({
303
- type: 'setActiveItemIndex',
304
- payload: nextActiveItemIndex
305
- });
306
- }, [state.activeItemIndex]);
307
- const handleToggleMenu = react.useCallback(() => {
308
- if (state.isMenuOpen && state.activeItemIndex) {
309
- dispatch({
310
- type: 'unsetActiveItemIndex'
311
- });
312
- }
313
- dispatch({
314
- type: 'toggleIsMenuOpen'
315
- });
316
- // Synchronize the menu state with local storage.
317
- window.localStorage.setItem(constants.STORAGE_KEYS.IS_FORCED_MENU_OPEN, String(!state.isMenuOpen));
318
- }, [state.activeItemIndex, state.isMenuOpen]);
319
- const allInternalApplicationsNavbarMenu = applicationsNavBarMenu || [];
320
- return _objectSpread$5(_objectSpread$5({}, state), {}, {
321
- navBarNode,
322
- handleToggleItem,
323
- handleToggleMenu,
324
- shouldCloseMenuFly,
325
- allInternalApplicationsNavbarMenu,
326
- allCustomApplicationsNavbarMenu
327
- });
328
- };
329
-
330
- const _excluded$1 = ["icon"];
331
- function ownKeys$4(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
332
- function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var _context3, _context4; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context3 = ownKeys$4(Object(t), !0)).call(_context3, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context4 = ownKeys$4(Object(t))).call(_context4, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
333
- const compiledStyles$4 = {
334
- "global": ":root {\n\n /* Left navigation */\n}\n\n@keyframes navbar-mod__visible___ifOIc {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n/* Left Nav */\n\n.navbar-mod__left-navigation___op7AX {\n display: grid;\n width: 80px;\n background: var(--color-primary);\n height: 100%;\n grid-template-rows: 56px 1fr;\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n}\n\n.navbar-mod__navigation-header___vaIOk {\n background-color: var(--color-accent-10);\n color: var(--color-surface);\n display: flex;\n justify-content: center;\n flex-direction: row;\n align-items: center;\n padding: var(--spacing-30);\n}\n\n.navbar-mod__navigation-header___vaIOk .navbar-mod__icon-container___hAbPn {\n width: auto;\n display: flex;\n justify-content: center;\n}\n\n.navbar-mod__navigation-header___vaIOk .navbar-mod__title___aTo0V {\n font-weight: 600;\n margin-left: var(--spacing-20);\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n animation: navbar-mod__visible___ifOIc 150ms cubic-bezier(1, 0, 0.58, 1);\n}\n\n.navbar-mod__navigation-header___vaIOk .navbar-mod__icon___21inq {\n width: 24px;\n height: 24px;\n}\n\n.navbar-mod__list___pouHY {\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n min-height: 0;\n flex: 1 1 0;\n}\n\n.navbar-mod__list-item___y7qYe {\n min-height: 48px;\n background: var(--color-primary);\n margin: 0;\n list-style: none;\n cursor: pointer;\n}\n\n.navbar-mod__item-link___6U2c1 {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n width: 48px;\n position: relative;\n display: block;\n}\n\n.body__menu-open .navbar-mod__item-link___6U2c1 {\n width: 100%;\n}\n\n.navbar-mod__list-item___y7qYe .navbar-mod__item-icon-text___3ZFtB {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n\n.navbar-mod__list-item___y7qYe .navbar-mod__icon___21inq {\n width: 24px;\n height: 24px;\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n}\n\n.navbar-mod__list-item___y7qYe:hover .navbar-mod__icon___21inq {\n /* 1.16 is roughly the ratio of icon-size-hover to --icon-size */\n transform: scale(1.2);\n}\n\n.navbar-mod__list-item___y7qYe .navbar-mod__icon___21inq > svg *:not([fill='none']) {\n fill: var(--color-surface);\n}\n\n.navbar-mod__list-item___y7qYe .navbar-mod__title___aTo0V {\n flex: 1;\n font-weight: 600;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n opacity: 0;\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n text-align: left;\n text-decoration: none;\n z-index: 1;\n}\n\n.navbar-mod__expander___blASx {\n display: flex;\n align-items: center;\n justify-content: center;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background: linear-gradient(\n 180deg,\n var(--color-primary) 0%,\n var(--color-primary-25) 100%\n );\n padding: var(--spacing-30) var(--spacing-25);\n}\n\n.navbar-mod__expander___blASx:hover {\n background-color: var(--color-primary-40);\n}\n\n/* divider */\n\n.navbar-mod__expander___blASx::before {\n content: '';\n position: absolute;\n top: 56px;\n height: 1px;\n background: rgba(255, 255, 255, 0.5);\n width: calc(100% - 2 * var(--spacing-30));\n}\n\n.navbar-mod__expand-icon___3A2Dk {\n height: 40px;\n width: 40px;\n border-radius: var(--border-radius-4);\n padding: var(--spacing-20);\n background: rgba(255, 255, 255, 0.2);\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.navbar-mod__expand-icon___3A2Dk:hover {\n background: rgba(255, 255, 255, 0.3);\n cursor: pointer;\n}\n\n.navbar-mod__item--bottom___Pygdy {\n position: absolute;\n bottom: 50px;\n}\n\n.navbar-mod__list-item___y7qYe:not(.navbar-mod__item_menu__active___j515K):hover {\n background-color: var(--color-primary-40);\n border-radius: var(--border-radius-8);\n}\n\n.navbar-mod__item_menu-open___NnkVM {\n height: auto !important;\n}\n\n.navbar-mod__item_menu-collapsed___1s4K0 .navbar-mod__item-link___6U2c1 {\n text-align: center;\n}\n\n.body__menu-open .navbar-mod__left-navigation___op7AX {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n box-shadow: var(--shadow-for-navbar);\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n}\n\n.body__menu-open .navbar-mod__list-item___y7qYe {\n height: auto;\n min-height: 48px;\n overflow: hidden;\n width: 100%;\n}\n\n.body__menu-open .navbar-mod__left-navigation___op7AX {\n width: 256px;\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n}\n\n.body__menu-open .navbar-mod__list-item___y7qYe .navbar-mod__title___aTo0V {\n opacity: 1;\n margin-left: var(--spacing-25);\n color: var(--color-surface);\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n animation: navbar-mod__visible___ifOIc 150ms cubic-bezier(1, 0, 0.58, 1);\n}\n\n.navbar-mod__list-item___y7qYe:hover .navbar-mod__title___aTo0V {\n margin-left: calc(var(--spacing-25) + 2px);\n}\n\n.navbar-mod__list-item___y7qYe:not(.navbar-mod__item__active___SEPWP):hover .navbar-mod__icon___21inq > svg *:not([fill='none']) {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n fill: var(--color-for-navbar-icon-when-active);\n}\n\n.navbar-mod__list-item___y7qYe:not(.navbar-mod__item__active___SEPWP):hover .navbar-mod__title___aTo0V {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n}\n\n.body__menu-open .navbar-mod__item__active___SEPWP {\n max-height: 500px;\n transition: max-height 0.25s ease-in;\n}\n\n/* Second level menu */\n\n.navbar-mod__sublist___tMZy4 {\n padding: var(--spacing-30);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar);\n left: 72px;\n z-index: -1;\n list-style: none;\n position: fixed;\n display: none;\n}\n\n/* This pseudo-element is required to enable smooth coursor movement from the main menu item to submenu items with the gap in between */\n\n.navbar-mod__sublist-expanded__active___XyUuS::before,\n.navbar-mod__sublist-collapsed__active___yWHea::before,\n.navbar-mod__sublist-collapsed__active__above___-7-Ca::before {\n content: '';\n position: absolute;\n display: block;\n width: calc(253px + var(--spacing-20));\n height: 48px;\n left: calc(-1 * var(--spacing-20));\n}\n\n.navbar-mod__sublist__inactive___5-OgH {\n /* empty block */\n}\n\n.navbar-mod__sublist-item___ZZbsF {\n display: flex;\n align-items: center;\n align-self: stretch;\n transition: padding-left 150ms ease-out;\n}\n\n.navbar-mod__sublist-item__active___O2-c- {\n border-radius: var(--border-radius-4);\n background: var(--color-accent-30);\n}\n\n.navbar-mod__sublist-item___ZZbsF:not(.navbar-mod__sublist-item__active___O2-c-):hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-hovered);\n border-radius: var(--border-radius-4);\n background: var(--color-primary-95);\n padding-left: var(--spacing-20);\n}\n\n.navbar-mod__text___3TpQt {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n width: 100%;\n height: 100%;\n}\n\n.navbar-mod__text-link___TcEn2 {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n text-decoration: none;\n display: flex;\n padding: var(--spacing-25);\n align-items: center;\n justify-content: center;\n}\n\n.body__menu-open .navbar-mod__text-link___TcEn2 {\n justify-content: start;\n}\n\n.navbar-mod__text-link-sublist-wrapper___RQinz {\n overflow: hidden;\n display: flex;\n flex-direction: column;\n position: relative;\n min-height: 0;\n}\n\n.navbar-mod__text-link-sublist___V0-tf {\n /* stylelint-disable-next-line value-no-vendor-prefix */\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n color: var(--color-solid);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-hovered);\n text-decoration: none;\n flex: 1;\n padding: var(--spacing-25) var(--spacing-25) var(--spacing-25)\n var(--spacing-30);\n}\n\n.navbar-mod__navlink-clickable-content___o-emf {\n height: 100%;\n width: 100%;\n}\n\n/* Item active */\n\n.navbar-mod__item__active___SEPWP,\n.navbar-mod__item_menu__active___j515K {\n background: var(--color-accent-30);\n border-radius: var(--border-radius-8);\n}\n\n.navbar-mod__list-item___y7qYe.navbar-mod__item__active___SEPWP .navbar-mod__item-icon-text___3ZFtB {\n justify-content: flex-start;\n}\n\n.navbar-mod__list-item___y7qYe .navbar-mod__icon-container___hAbPn {\n width: auto;\n display: flex;\n justify-content: center;\n align-self: flex-start;\n}\n\n.navbar-mod__fixed-menu___QYEJM .navbar-mod__list-item___y7qYe .navbar-mod__item-icon-text___3ZFtB {\n justify-content: center;\n display: flex;\n width: 100%;\n}\n\n.navbar-mod__support-menu___bkf5Q {\n padding: 0 var(--spacing-30) var(--spacing-20) var(--spacing-30);\n height: calc(48px + var(--spacing-20));\n}\n\n.body__menu-open .navbar-mod__list-item___y7qYe.navbar-mod__item__active___SEPWP .navbar-mod__item-icon-text___3ZFtB {\n position: relative;\n width: auto;\n}\n\n.body__menu-open .navbar-mod__list-item___y7qYe.navbar-mod__item__active___SEPWP .navbar-mod__item-icon-text___3ZFtB {\n margin-left: 0;\n}\n\n.navbar-mod__tooltip-container___gTiaE {\n position: absolute;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n height: 48px;\n visibility: visible;\n}\n\n.navbar-mod__tooltip___3PSlF {\n padding: var(--spacing-10) calc(var(--spacing-20) + var(--spacing-10));\n /* stylelint-disable-next-line value-no-vendor-prefix */\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n border-radius: var(--border-radius-4);\n background: var(--color-accent-10);\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.25);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n color: var(--color-surface);\n max-height: 48px;\n visibility: inherit;\n}\n\n.navbar-mod__sublist-expanded__active___XyUuS,\n.navbar-mod__sublist-collapsed__active___yWHea,\n.navbar-mod__sublist-collapsed__active__above___-7-Ca {\n opacity: 1;\n display: none;\n text-align: left;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar-when-active);\n}\n\n.navbar-mod__item-link___6U2c1:hover .navbar-mod__sublist-collapsed__active___yWHea,\n.navbar-mod__item-link___6U2c1:hover .navbar-mod__sublist-collapsed__active__above___-7-Ca,\n.navbar-mod__item-link___6U2c1:hover .navbar-mod__sublist-expanded__active___XyUuS {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--color-surface);\n /* TODO: add design tokens instead hard-coded values */\n min-height: 50px;\n width: 253px;\n border-radius: var(--border-radius-8);\n /* z-index value must be higher than AppBar's z-index */\n z-index: 20001;\n box-shadow: -2px 4px 25px 0 rgba(89, 89, 89, 0.5);\n}\n\n.navbar-mod__item-link___6U2c1:hover .navbar-mod__sublist-collapsed__active___yWHea.navbar-mod__sublist-collapsed__empty___mXa6R,\n.navbar-mod__item-link___6U2c1:hover .navbar-mod__sublist-collapsed__active__above___-7-Ca.navbar-mod__sublist-collapsed__empty___mXa6R {\n visibility: hidden;\n}\n\n.navbar-mod__item-link___6U2c1:hover .navbar-mod__sublist-expanded__active___XyUuS {\n left: 248px;\n}\n\n.navbar-mod__highlighted___06BoS,\n.navbar-mod__highlighted___06BoS .navbar-mod__title___aTo0V {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-active) !important;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-active);\n}\n\n.navbar-mod__hidden___-s7eh {\n display: none;\n}\n\n.navbar-mod__divider___GBOn1 {\n border-top: 1px solid var(--color-neutral-40);\n}\n\n.navbar-mod__loading-dot-container___B7sPh {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.navbar-mod__scrollable-menu___I9ci7 {\n flex: 1 1 0;\n overflow-x: hidden;\n overflow-y: hidden;\n padding: var(--spacing-30) var(--spacing-30) 48px;\n width: 80px;\n box-sizing: border-box;\n /* For Firefox */\n scrollbar-width: thin;\n scrollbar-color: var(--color-primary-40) transparent;\n}\n\n.body__menu-open .navbar-mod__scrollable-menu___I9ci7 {\n width: 256px;\n}\n\n.navbar-mod__scrollable-menu___I9ci7:hover {\n overflow-y: scroll;\n padding-right: 8px;\n}\n\n.navbar-mod__scrollable-menu___I9ci7::-webkit-scrollbar {\n width: 8px;\n}\n\n.navbar-mod__scrollable-menu___I9ci7::-webkit-scrollbar-track {\n background: transparent;\n}\n\n.navbar-mod__scrollable-menu___I9ci7::-webkit-scrollbar-thumb {\n background-color: var(--color-primary-40);\n border-radius: var(--border-radius-8);\n}\n\n.navbar-mod__fixed-menu___QYEJM {\n position: relative;\n width: 80px;\n}\n\n.body__menu-open .navbar-mod__fixed-menu___QYEJM {\n width: 256px;\n}\n",
335
- "jsonMap": {
336
- "left-navigation": "navbar-mod__left-navigation___op7AX",
337
- "navigation-header": "navbar-mod__navigation-header___vaIOk",
338
- "icon-container": "navbar-mod__icon-container___hAbPn",
339
- "title": "navbar-mod__title___aTo0V",
340
- "visible": "navbar-mod__visible___ifOIc",
341
- "icon": "navbar-mod__icon___21inq",
342
- "list": "navbar-mod__list___pouHY",
343
- "list-item": "navbar-mod__list-item___y7qYe",
344
- "item-link": "navbar-mod__item-link___6U2c1",
345
- "item-icon-text": "navbar-mod__item-icon-text___3ZFtB",
346
- "expander": "navbar-mod__expander___blASx",
347
- "expand-icon": "navbar-mod__expand-icon___3A2Dk",
348
- "item--bottom": "navbar-mod__item--bottom___Pygdy",
349
- "item_menu__active": "navbar-mod__item_menu__active___j515K",
350
- "item_menu-open": "navbar-mod__item_menu-open___NnkVM",
351
- "item_menu-collapsed": "navbar-mod__item_menu-collapsed___1s4K0",
352
- "item__active": "navbar-mod__item__active___SEPWP",
353
- "sublist": "navbar-mod__sublist___tMZy4",
354
- "sublist-expanded__active": "navbar-mod__sublist-expanded__active___XyUuS",
355
- "sublist-collapsed__active": "navbar-mod__sublist-collapsed__active___yWHea",
356
- "sublist-collapsed__active__above": "navbar-mod__sublist-collapsed__active__above___-7-Ca",
357
- "sublist__inactive": "navbar-mod__sublist__inactive___5-OgH",
358
- "sublist-item": "navbar-mod__sublist-item___ZZbsF",
359
- "sublist-item__active": "navbar-mod__sublist-item__active___O2-c-",
360
- "text": "navbar-mod__text___3TpQt",
361
- "text-link": "navbar-mod__text-link___TcEn2",
362
- "text-link-sublist-wrapper": "navbar-mod__text-link-sublist-wrapper___RQinz",
363
- "text-link-sublist": "navbar-mod__text-link-sublist___V0-tf",
364
- "navlink-clickable-content": "navbar-mod__navlink-clickable-content___o-emf",
365
- "fixed-menu": "navbar-mod__fixed-menu___QYEJM",
366
- "support-menu": "navbar-mod__support-menu___bkf5Q",
367
- "tooltip-container": "navbar-mod__tooltip-container___gTiaE",
368
- "tooltip": "navbar-mod__tooltip___3PSlF",
369
- "sublist-collapsed__empty": "navbar-mod__sublist-collapsed__empty___mXa6R",
370
- "highlighted": "navbar-mod__highlighted___06BoS",
371
- "hidden": "navbar-mod__hidden___-s7eh",
372
- "divider": "navbar-mod__divider___GBOn1",
373
- "loading-dot-container": "navbar-mod__loading-dot-container___B7sPh",
374
- "scrollable-menu": "navbar-mod__scrollable-menu___I9ci7"
375
- }
376
- };
377
- const styles$4 = compiledStyles$4.jsonMap;
378
- const HeartIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./heart-01f01038.cjs.prod.js'); }));
379
- const PaperclipIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./paperclip-fe72a70d.cjs.prod.js'); }));
380
- const PluginIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./plugin-81ae1044.cjs.prod.js'); }));
381
- const RocketIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./rocket-cb99be06.cjs.prod.js'); }));
382
- const StarIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./star-e4902bbb.cjs.prod.js'); }));
383
- const ConnectedSquareIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./connected-square-2d046cb8.cjs.prod.js'); }));
384
- const WorldIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./world-22189397.cjs.prod.js'); }));
385
- const TreeStructureIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./tree-structure-3ec98cce.cjs.prod.js'); }));
386
- const UserFilledIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./user-filled-26f333b2.cjs.prod.js'); }));
387
- const SpeedometerIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./speedometer-26f52e73.cjs.prod.js'); }));
388
- const TagMultiIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./tag-multi-1c065f61.cjs.prod.js'); }));
389
- const CartIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./cart-645074db.cjs.prod.js'); }));
390
- const BoxIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./box-09bf50e1.cjs.prod.js'); }));
391
- const GearIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./gear-4f7cde98.cjs.prod.js'); }));
392
- const ListWithSearchIcon$1 = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./list-with-search-6462447e.cjs.prod.js'); }));
393
- // The icon is expected to be the `svg` document as a string.
394
- // For backwards compatibility purposes, we still support the legacy "icon name",
395
- // which we then map to one of the pre-defined icons.
396
- // Eventually, we want to get rid of this "switch" logic.
397
- const IconSwitcher$1 = _ref4 => {
398
- let icon = _ref4.icon,
399
- iconProps = _objectWithoutProperties(_ref4, _excluded$1);
400
- if (_includesInstanceProperty__default["default"](icon).call(icon, '<svg')) {
401
- return jsxRuntime.jsx(InlineSvg__default["default"], _objectSpread$4({
402
- data: icon
403
- }, iconProps));
404
- }
405
- // Backwards compatibility for apps using the "icon name".
406
- switch (icon) {
407
- // Legacy application icons
408
- // TODO: To be removed once MC applications icons updates are published
409
- case 'TreeStructureIcon':
410
- return jsxRuntime.jsx(TreeStructureIcon$1, _objectSpread$4({}, iconProps));
411
- case 'UserFilledIcon':
412
- return jsxRuntime.jsx(UserFilledIcon$1, _objectSpread$4({}, iconProps));
413
- case 'SpeedometerIcon':
414
- return jsxRuntime.jsx(SpeedometerIcon$1, _objectSpread$4({}, iconProps));
415
- case 'TagMultiIcon':
416
- return jsxRuntime.jsx(TagMultiIcon$1, _objectSpread$4({}, iconProps));
417
- case 'CartIcon':
418
- return jsxRuntime.jsx(CartIcon$1, _objectSpread$4({}, iconProps));
419
- case 'BoxIcon':
420
- return jsxRuntime.jsx(BoxIcon$1, _objectSpread$4({}, iconProps));
421
- case 'GearIcon':
422
- return jsxRuntime.jsx(GearIcon$1, _objectSpread$4({}, iconProps));
423
- case 'ListWithSearchIcon':
424
- return jsxRuntime.jsx(ListWithSearchIcon$1, _objectSpread$4({}, iconProps));
425
-
426
- // Custom application icons set
427
- case 'HeartIcon':
428
- return jsxRuntime.jsx(HeartIcon$1, _objectSpread$4({}, iconProps));
429
- case 'PaperclipIcon':
430
- return jsxRuntime.jsx(PaperclipIcon$1, _objectSpread$4({}, iconProps));
431
- case 'PluginIcon':
432
- return jsxRuntime.jsx(PluginIcon$1, _objectSpread$4({}, iconProps));
433
- case 'RocketIcon':
434
- return jsxRuntime.jsx(RocketIcon$1, _objectSpread$4({}, iconProps));
435
- case 'StarIcon':
436
- return jsxRuntime.jsx(StarIcon$1, _objectSpread$4({}, iconProps));
437
- case 'ConnectedSquareIcon':
438
- return jsxRuntime.jsx(ConnectedSquareIcon$1, _objectSpread$4({}, iconProps));
439
- // For backwards compatibility
440
- case 'WorldIcon':
441
- return jsxRuntime.jsx(WorldIcon$1, _objectSpread$4({}, iconProps));
442
- default:
443
- return jsxRuntime.jsx("img", {
444
- src: MissingImageSvg__default["default"],
445
- alt: "missing icon"
446
- });
447
- }
448
- };
449
- IconSwitcher$1.propTypes = {};
450
- IconSwitcher$1.displayName = 'IconSwitcher';
451
- const getIcon = _ref5 => {
452
- let isMenuOpen = _ref5.isMenuOpen;
453
- const Icon = isMenuOpen ? icons.SidebarCollapseIcon : icons.SidebarExpandIcon;
454
- return jsxRuntime.jsx(Icon, {
455
- color: "surface",
456
- size: "big"
457
- });
458
- };
459
- const MenuExpander$1 = props => {
460
- return jsxRuntime.jsx("li", {
461
- className: classnames__default["default"](styles$4.expander, {
462
- [styles$4.hidden]: !props.isVisible
463
- }),
464
- children: jsxRuntime.jsx("div", {
465
- onClick: props.onClick,
466
- className: styles$4['expand-icon'],
467
- "data-testid": "menu-expander",
468
- children: getIcon(props)
469
- })
470
- }, "expander");
471
- };
472
- MenuExpander$1.propTypes = {};
473
- MenuExpander$1.displayName = 'MenuExpander';
474
- const Faded$1 = /*#__PURE__*/_styled__default["default"]("div", {
475
- target: "e10pzajx0"
476
- } )({
477
- name: "16qr508",
478
- styles: "position:absolute;top:-32px;height:32px;width:100%;background:linear-gradient(180deg, rgba(0, 153, 135, 0) 0%, #00b39e 100%);z-index:1"
479
- } );
480
- const getSubmenuPositionBasedOnMenuItemPosition = (isSubmenuAboveMenuItem, submenuVerticalPosition) => /*#__PURE__*/react$1.css(isSubmenuAboveMenuItem ? 'bottom' : 'top', ":", submenuVerticalPosition, "px;" + ("" ), "" );
481
- var _ref2 = {
482
- name: "abcix4",
483
- styles: "top:0"
484
- } ;
485
- var _ref3 = {
486
- name: "8tapst",
487
- styles: "bottom:0"
488
- } ;
489
- const getContainerPositionBasedOnMenuItemPosition = (isSubmenuAboveMenuItem, isSublistActiveWhileIsMenuExpanded, isSublistActiveWhileIsMenuCollapsed) => [isSublistActiveWhileIsMenuCollapsed && /*#__PURE__*/react$1.css(isSubmenuAboveMenuItem ? 'bottom' : 'top', ":-", oidc.DIMENSIONS.navMenuItemHeight, ";" + ("" ), "" ), isSublistActiveWhileIsMenuExpanded && isSubmenuAboveMenuItem && _ref3, isSublistActiveWhileIsMenuExpanded && !isSubmenuAboveMenuItem && _ref2];
490
- var _ref = {
491
- name: "6dhm9o",
492
- styles: "visibility:hidden"
493
- } ;
494
- const MenuGroup$1 = /*#__PURE__*/react.forwardRef((props, ref) => {
495
- if (props.isExpanded && (props.level === 2 && !props.hasSubmenu || props.level === 2 && !props.isActive)) {
496
- return null;
497
- }
498
- const isSublistActiveWhileIsMenuExpanded = props.level === 2 && props.isActive && props.isExpanded;
499
- const isSublistActiveWhileIsMenuCollapsed = props.level === 2 && props.isActive && !props.isExpanded;
500
- return jsxRuntime.jsx("ul", {
501
- ref: ref && props.level === 2 ? ref : null,
502
- css: /*#__PURE__*/react$1.css(getSubmenuPositionBasedOnMenuItemPosition(props.isSubmenuAboveMenuItem, props.submenuVerticalPosition), ";", props.submenuVerticalPosition === 0 && _ref, "::before{", getContainerPositionBasedOnMenuItemPosition(props.isSubmenuAboveMenuItem, isSublistActiveWhileIsMenuExpanded, isSublistActiveWhileIsMenuCollapsed), ";}" + ("" ), "" ),
503
- id: "group-".concat(props.id),
504
- "data-testid": "group-".concat(props.id),
505
- role: "menu",
506
- "aria-expanded": isSublistActiveWhileIsMenuExpanded || isSublistActiveWhileIsMenuCollapsed,
507
- className: classnames__default["default"]({
508
- [styles$4.list]: props.level === 1
509
- }, {
510
- [styles$4['sublist']]: props.level === 2
511
- }, {
512
- [styles$4['sublist-expanded__active']]: isSublistActiveWhileIsMenuExpanded
513
- }, {
514
- [styles$4['sublist-collapsed__empty']]: isSublistActiveWhileIsMenuCollapsed && !props.hasSubmenu
515
- }, {
516
- [styles$4['sublist-collapsed__active']]: isSublistActiveWhileIsMenuCollapsed && !props.isSubmenuAboveMenuItem
517
- }, {
518
- [styles$4['sublist-collapsed__active__above']]: isSublistActiveWhileIsMenuCollapsed && props.isSubmenuAboveMenuItem
519
- }, {
520
- [styles$4.sublist__inactive]: !isSublistActiveWhileIsMenuCollapsed
521
- }),
522
- children: props.children
523
- });
524
- });
525
- MenuGroup$1.displayName = 'MenuGroup';
526
- const MenuItem$2 = props => {
527
- var _props$isMainMenuRout;
528
- return jsxRuntime.jsx("li", {
529
- role: "menuitem",
530
- className: classnames__default["default"](styles$4['list-item'], {
531
- [styles$4.item__active]: props.isActive,
532
- [styles$4['item_menu__active']]: (_props$isMainMenuRout = props.isMainMenuRouteActive) !== null && _props$isMainMenuRout !== void 0 ? _props$isMainMenuRout : false,
533
- [styles$4['item_menu-collapsed']]: !props.isMenuOpen
534
- }),
535
- onClick: props.onClick,
536
- onMouseEnter: props.onMouseEnter,
537
- onMouseLeave: props.onMouseLeave,
538
- "data-menuitem": props.identifier,
539
- children: jsxRuntime.jsx("div", {
540
- className: styles$4['item-link'],
541
- children: props.children
542
- })
543
- });
544
- };
545
- MenuItem$2.propTypes = {};
546
- MenuItem$2.displayName = 'MenuItem';
547
- const menuItemLinkDefaultProps$1 = {
548
- exactMatch: false
549
- };
550
- const NavLinkWrapper = props => {
551
- if (props.isSubmenuLink) {
552
- return jsxRuntime.jsx("div", {
553
- className: styles$4['text-link-sublist-wrapper'],
554
- children: props.children
555
- });
556
- }
557
- return jsxRuntime.jsx(jsxRuntime.Fragment, {
558
- children: props.children
559
- });
560
- };
561
- NavLinkWrapper.propTypes = {};
562
- const NavLinkClickableContentWrapper = props => {
563
- if (props.isSubmenuLink) {
564
- return jsxRuntime.jsx("div", {
565
- className: styles$4['navlink-clickable-content'],
566
- children: props.children
567
- });
568
- }
569
- return jsxRuntime.jsx(jsxRuntime.Fragment, {
570
- children: props.children
571
- });
572
- };
573
- NavLinkClickableContentWrapper.propTypes = {};
574
- const MenuItemLink$1 = props => {
575
- const redirectTo = targetUrl => useIsServedByProxy.location.replace(targetUrl);
576
- if (props.linkTo) {
577
- return jsxRuntime.jsx(NavLinkWrapper, _objectSpread$4(_objectSpread$4({}, props), {}, {
578
- children: jsxRuntime.jsx(reactRouterDom.NavLink, {
579
- to: props.linkTo,
580
- exact: props.exactMatch,
581
- activeClassName: styles$4.highlighted,
582
- className: props.isSubmenuLink ? styles$4['text-link-sublist'] : styles$4['text-link'],
583
- onClick: event => {
584
- if (props.linkTo && props.useFullRedirectsForLinks) {
585
- event.preventDefault();
586
- redirectTo(props.linkTo);
587
- } else if (props.onClick) {
588
- event.persist();
589
- props.onClick(event);
590
- }
591
- },
592
- children: jsxRuntime.jsx(NavLinkClickableContentWrapper, _objectSpread$4(_objectSpread$4({}, props), {}, {
593
- children: props.children
594
- }))
595
- })
596
- }));
597
- }
598
- return jsxRuntime.jsx(jsxRuntime.Fragment, {
599
- children: props.children
600
- });
601
- };
602
- MenuItemLink$1.propTypes = {};
603
- MenuItemLink$1.displayName = 'MenuItemLink';
604
- MenuItemLink$1.defaultProps = menuItemLinkDefaultProps$1;
605
- const isEveryMenuVisibilitySetToHidden$1 = (menuVisibilities, namesOfMenuVisibilities) => _Array$isArray__default["default"](namesOfMenuVisibilities) && namesOfMenuVisibilities.length > 0 && _everyInstanceProperty__default["default"](namesOfMenuVisibilities).call(namesOfMenuVisibilities, nameOfMenuVisibility => menuVisibilities && menuVisibilities[nameOfMenuVisibility] === true);
606
- const restrictedMenuItemDefaultProps$1 = {
607
- permissions: []
608
- };
609
- function isLongLivedFlag$1(flag) {
610
- return typeof (flag === null || flag === void 0 ? void 0 : flag.value) === 'boolean';
611
- }
612
- const RestrictedMenuItem$1 = props => {
613
- // NOTE: Custom application are activated/deactivated while their
614
- // visibility is not controlled via a visibiility overwrite.
615
- const flagVariation = reactBroadcast.useFlagVariation(props.featureToggle);
616
- if (isEveryMenuVisibilitySetToHidden$1(props.menuVisibilities, props.namesOfMenuVisibilities)) return null;
617
- const permissionsWrapper = _Array$isArray__default["default"](props.permissions) && props.permissions.length > 0 || _Array$isArray__default["default"](props.dataFences) && props.dataFences.length > 0 ? jsxRuntime.jsx(permissions.RestrictedByPermissions, {
618
- permissions: props.permissions,
619
- actionRights: props.actionRights,
620
- dataFences: props.dataFences,
621
- selectDataFenceData: demandedDataFence => {
622
- switch (demandedDataFence.type) {
623
- case 'store':
624
- return demandedDataFence.actualDataFenceValues;
625
- default:
626
- return null;
627
- }
628
- }
629
- // Always check that some of the given permissions match.
630
- ,
631
- shouldMatchSomePermissions: true,
632
- projectPermissions: props.projectPermissions,
633
- children: props.children
634
- }) : jsxRuntime.jsx(jsxRuntime.Fragment, {
635
- children: props.children
636
- });
637
- if (props.featureToggle) {
638
- // A regular short-lived feature toggle
639
- if (flagVariation === true) return permissionsWrapper;
640
- // A long-lived feature toggle with `{ value: boolean, string: reason }`
641
- if (isLongLivedFlag$1(flagVariation) && flagVariation.value === true) return permissionsWrapper;
642
- return null;
643
- }
644
- return permissionsWrapper;
645
- };
646
- RestrictedMenuItem$1.propTypes = {};
647
- RestrictedMenuItem$1.displayName = 'RestrictedMenuItem';
648
- RestrictedMenuItem$1.defaultProps = restrictedMenuItemDefaultProps$1;
649
- const MenuLabel$1 = props => {
650
- var _context;
651
- const localizedLabel = _findInstanceProperty__default["default"](_context = props.labelAllLocales).call(_context, loc => {
652
- var _context2;
653
- return _startsWithInstanceProperty__default["default"](_context2 = props.applicationLocale).call(_context2, loc.locale);
654
- });
655
- if (localizedLabel) return jsxRuntime.jsx(jsxRuntime.Fragment, {
656
- children: localizedLabel.value
657
- });
658
- if (props.defaultLabel) return jsxRuntime.jsx(jsxRuntime.Fragment, {
659
- children: props.defaultLabel
660
- });
661
- return jsxRuntime.jsx(jsxRuntime.Fragment, {
662
- children: constants.NO_VALUE_FALLBACK
663
- });
664
- };
665
- MenuLabel$1.propTypes = {
666
- labelAllLocales: _pt__default["default"].arrayOf(_pt__default["default"].any).isRequired,
667
- defaultLabel: _pt__default["default"].string,
668
- applicationLocale: _pt__default["default"].string.isRequired
669
- };
670
- const NavBarLayout$2 = /*#__PURE__*/react.forwardRef((props, ref) => jsxRuntime.jsxs(jsxRuntime.Fragment, {
671
- children: [jsxRuntime.jsx(react$1.Global, {
672
- styles: /*#__PURE__*/react$1.css(compiledStyles$4.global, ";" + ("" ), "" )
673
- }), jsxRuntime.jsx("nav", {
674
- ref: ref,
675
- className: styles$4['left-navigation'],
676
- "data-test": "left-navigation",
677
- "data-testid": "left-navigation",
678
- children: props.children
679
- })]
680
- }));
681
- NavBarLayout$2.displayName = 'NavBarLayout';
682
- const ItemContainer = props => {
683
- return jsxRuntime.jsxs("div", {
684
- className: styles$4['item-icon-text'],
685
- children: [jsxRuntime.jsx("div", {
686
- className: styles$4['icon-container'],
687
- children: jsxRuntime.jsx("div", {
688
- className: styles$4.icon,
689
- children: jsxRuntime.jsx(IconSwitcher$1, {
690
- icon: props.icon,
691
- size: "scale"
692
- })
693
- })
694
- }), props.isMenuOpen ? jsxRuntime.jsx("div", {
695
- className: styles$4.title,
696
- children: jsxRuntime.jsx(MenuLabel$1, {
697
- labelAllLocales: props.labelAllLocales,
698
- defaultLabel: props.defaultLabel,
699
- applicationLocale: props.applicationLocale
700
- })
701
- }) : null]
702
- });
703
- };
704
- ItemContainer.propTypes = {};
705
- ItemContainer.displayName = 'ItemContainer';
706
-
707
- const NavBarLayout$1 = props => {
708
- return jsxRuntime.jsx("nav", {
709
- "aria-busy": true,
710
- css: /*#__PURE__*/react$1.css("display:flex;flex-direction:column;height:100%;width:", props.isExpanded ? '256px' : '80px', ";" + ("" ), "" ),
711
- children: props.children
712
- });
713
- };
714
- NavBarLayout$1.propTypes = {};
715
- const NavBarHeader = /*#__PURE__*/_styled__default["default"]("div", {
716
- target: "eyeet3i7"
717
- } )("display:flex;justify-content:center;align-items:center;padding:", designSystem.designTokens.spacing30, ";height:", oidc.DIMENSIONS.header, ";background:", designSystem.designTokens.colorAccent10, ";" + ("" ));
718
- const NavBarBody = /*#__PURE__*/_styled__default["default"]("div", {
719
- target: "eyeet3i6"
720
- } )("display:flex;flex:1;padding:", designSystem.designTokens.spacing30, ";flex-direction:column;align-items:flex-start;gap:", designSystem.designTokens.spacing40, ";flex-shrink:0;background:#009987;position:relative;&::after{content:'';position:absolute;bottom:0;height:36px;width:calc(100% - 2 * ", designSystem.designTokens.spacing30, ");background:linear-gradient(180deg, rgba(0, 153, 135, 0) 0%, #009987 100%);}" + ("" ));
721
- const NavBarFooter = /*#__PURE__*/_styled__default["default"]("div", {
722
- target: "eyeet3i5"
723
- } )("position:relative;display:flex;width:100%;flex-direction:column;background:linear-gradient(180deg, #009987 0%, #004d44 100%);padding:", designSystem.designTokens.spacing30, " ", props => props.isExpanded ? '58px' : '0px', ";justify-content:center;align-items:center;&::before{content:'';position:absolute;top:0;height:1px;width:calc(100% - 2 * ", designSystem.designTokens.spacing30, ");background:rgba(255, 255, 255, 0.5);}" + ("" ));
724
- const ExpandIcon = /*#__PURE__*/_styled__default["default"]("div", {
725
- target: "eyeet3i4"
726
- } )("width:40px;height:40px;border-radius:", designSystem.designTokens.borderRadius4, ";background:rgba(255, 255, 255, 0.2);" + ("" ));
727
- const MenuItemContainer = /*#__PURE__*/_styled__default["default"]("div", {
728
- target: "eyeet3i3"
729
- } )("display:flex;align-items:center;justify-content:center;gap:12px;padding:", props => props.contentWidth === 'wide' || !props.isExpanded ? '12px' : '12px 28px', ";height:48px;" + ("" ));
730
- const MenuItemIcon = /*#__PURE__*/_styled__default["default"]("div", {
731
- target: "eyeet3i2"
732
- } )("width:24px;height:24px;border-radius:", designSystem.designTokens.borderRadius4, ";background:rgba(255, 255, 255, 0.2);" + ("" ));
733
- const MenuItemTitle = /*#__PURE__*/_styled__default["default"]("div", {
734
- target: "eyeet3i1"
735
- } )("border-radius:", designSystem.designTokens.borderRadius4, ";background:rgba(255, 255, 255, 0.2);flex:1;height:18px;" + ("" ));
736
- const MenuItemGroup = /*#__PURE__*/_styled__default["default"]("div", {
737
- target: "eyeet3i0"
738
- } )({
739
- name: "1d3w5wq",
740
- styles: "width:100%"
741
- } );
742
-
743
- const MenuItem$1 = props => {
744
- return jsxRuntime.jsxs(MenuItemContainer, {
745
- isExpanded: props.isExpanded,
746
- contentWidth: props.contentWidth,
747
- children: [jsxRuntime.jsx(MenuItemIcon, {}), props.isExpanded && jsxRuntime.jsx(MenuItemTitle, {})]
748
- });
749
- };
750
- MenuItem$1.defaultProps = {
751
- contentWidth: 'wide'
752
- };
753
- const NavBarSkeleton = props => {
754
- var _context, _context2, _context3, _context4;
755
- return jsxRuntime.jsxs(NavBarLayout$1, {
756
- isExpanded: props.isExpanded,
757
- children: [jsxRuntime.jsx(NavBarHeader, {
758
- children: jsxRuntime.jsx(MenuItemGroup, {
759
- children: jsxRuntime.jsx(MenuItem$1, {
760
- contentWidth: "narrow",
761
- isExpanded: props.isExpanded
762
- })
763
- })
764
- }), jsxRuntime.jsxs(NavBarBody, {
765
- children: [jsxRuntime.jsx(MenuItemGroup, {
766
- children: _mapInstanceProperty__default["default"](_context = [..._keysInstanceProperty__default["default"](_context2 = Array(2)).call(_context2)]).call(_context, index => jsxRuntime.jsx(MenuItem$1, {
767
- isExpanded: props.isExpanded
768
- }, index))
769
- }), jsxRuntime.jsx(MenuItemGroup, {
770
- children: _mapInstanceProperty__default["default"](_context3 = [..._keysInstanceProperty__default["default"](_context4 = Array(10)).call(_context4)]).call(_context3, index => jsxRuntime.jsx(MenuItem$1, {
771
- isExpanded: props.isExpanded
772
- }, index))
773
- }), jsxRuntime.jsx(MenuItemGroup, {
774
- children: jsxRuntime.jsx(MenuItem$1, {
775
- isExpanded: props.isExpanded
776
- })
777
- })]
778
- }), jsxRuntime.jsx(NavBarFooter, {
779
- isExpanded: props.isExpanded,
780
- children: jsxRuntime.jsx(ExpandIcon, {})
781
- })]
782
- });
783
- };
784
- NavBarSkeleton.displayName = 'NavBarSkeleton';
785
-
786
- function ownKeys$3(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
787
- function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var _context9, _context10; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context9 = ownKeys$3(Object(t), !0)).call(_context9, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context10 = ownKeys$3(Object(t))).call(_context10, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
788
- const compiledStyles$3 = {
789
- "global": ":root {\n\n /* Left navigation */\n}\n\n@keyframes navbar-mod__visible___ifOIc {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n/* Left Nav */\n\n.navbar-mod__left-navigation___op7AX {\n display: grid;\n width: 80px;\n background: var(--color-primary);\n height: 100%;\n grid-template-rows: 56px 1fr;\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n}\n\n.navbar-mod__navigation-header___vaIOk {\n background-color: var(--color-accent-10);\n color: var(--color-surface);\n display: flex;\n justify-content: center;\n flex-direction: row;\n align-items: center;\n padding: var(--spacing-30);\n}\n\n.navbar-mod__navigation-header___vaIOk .navbar-mod__icon-container___hAbPn {\n width: auto;\n display: flex;\n justify-content: center;\n}\n\n.navbar-mod__navigation-header___vaIOk .navbar-mod__title___aTo0V {\n font-weight: 600;\n margin-left: var(--spacing-20);\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n animation: navbar-mod__visible___ifOIc 150ms cubic-bezier(1, 0, 0.58, 1);\n}\n\n.navbar-mod__navigation-header___vaIOk .navbar-mod__icon___21inq {\n width: 24px;\n height: 24px;\n}\n\n.navbar-mod__list___pouHY {\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n min-height: 0;\n flex: 1 1 0;\n}\n\n.navbar-mod__list-item___y7qYe {\n min-height: 48px;\n background: var(--color-primary);\n margin: 0;\n list-style: none;\n cursor: pointer;\n}\n\n.navbar-mod__item-link___6U2c1 {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n width: 48px;\n position: relative;\n display: block;\n}\n\n.body__menu-open .navbar-mod__item-link___6U2c1 {\n width: 100%;\n}\n\n.navbar-mod__list-item___y7qYe .navbar-mod__item-icon-text___3ZFtB {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n\n.navbar-mod__list-item___y7qYe .navbar-mod__icon___21inq {\n width: 24px;\n height: 24px;\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n}\n\n.navbar-mod__list-item___y7qYe:hover .navbar-mod__icon___21inq {\n /* 1.16 is roughly the ratio of icon-size-hover to --icon-size */\n transform: scale(1.2);\n}\n\n.navbar-mod__list-item___y7qYe .navbar-mod__icon___21inq > svg *:not([fill='none']) {\n fill: var(--color-surface);\n}\n\n.navbar-mod__list-item___y7qYe .navbar-mod__title___aTo0V {\n flex: 1;\n font-weight: 600;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n opacity: 0;\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n text-align: left;\n text-decoration: none;\n z-index: 1;\n}\n\n.navbar-mod__expander___blASx {\n display: flex;\n align-items: center;\n justify-content: center;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background: linear-gradient(\n 180deg,\n var(--color-primary) 0%,\n var(--color-primary-25) 100%\n );\n padding: var(--spacing-30) var(--spacing-25);\n}\n\n.navbar-mod__expander___blASx:hover {\n background-color: var(--color-primary-40);\n}\n\n/* divider */\n\n.navbar-mod__expander___blASx::before {\n content: '';\n position: absolute;\n top: 56px;\n height: 1px;\n background: rgba(255, 255, 255, 0.5);\n width: calc(100% - 2 * var(--spacing-30));\n}\n\n.navbar-mod__expand-icon___3A2Dk {\n height: 40px;\n width: 40px;\n border-radius: var(--border-radius-4);\n padding: var(--spacing-20);\n background: rgba(255, 255, 255, 0.2);\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.navbar-mod__expand-icon___3A2Dk:hover {\n background: rgba(255, 255, 255, 0.3);\n cursor: pointer;\n}\n\n.navbar-mod__item--bottom___Pygdy {\n position: absolute;\n bottom: 50px;\n}\n\n.navbar-mod__list-item___y7qYe:not(.navbar-mod__item_menu__active___j515K):hover {\n background-color: var(--color-primary-40);\n border-radius: var(--border-radius-8);\n}\n\n.navbar-mod__item_menu-open___NnkVM {\n height: auto !important;\n}\n\n.navbar-mod__item_menu-collapsed___1s4K0 .navbar-mod__item-link___6U2c1 {\n text-align: center;\n}\n\n.body__menu-open .navbar-mod__left-navigation___op7AX {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n box-shadow: var(--shadow-for-navbar);\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n}\n\n.body__menu-open .navbar-mod__list-item___y7qYe {\n height: auto;\n min-height: 48px;\n overflow: hidden;\n width: 100%;\n}\n\n.body__menu-open .navbar-mod__left-navigation___op7AX {\n width: 256px;\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n}\n\n.body__menu-open .navbar-mod__list-item___y7qYe .navbar-mod__title___aTo0V {\n opacity: 1;\n margin-left: var(--spacing-25);\n color: var(--color-surface);\n transition: all 150ms cubic-bezier(1, 0, 0.58, 1);\n animation: navbar-mod__visible___ifOIc 150ms cubic-bezier(1, 0, 0.58, 1);\n}\n\n.navbar-mod__list-item___y7qYe:hover .navbar-mod__title___aTo0V {\n margin-left: calc(var(--spacing-25) + 2px);\n}\n\n.navbar-mod__list-item___y7qYe:not(.navbar-mod__item__active___SEPWP):hover .navbar-mod__icon___21inq > svg *:not([fill='none']) {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n fill: var(--color-for-navbar-icon-when-active);\n}\n\n.navbar-mod__list-item___y7qYe:not(.navbar-mod__item__active___SEPWP):hover .navbar-mod__title___aTo0V {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n}\n\n.body__menu-open .navbar-mod__item__active___SEPWP {\n max-height: 500px;\n transition: max-height 0.25s ease-in;\n}\n\n/* Second level menu */\n\n.navbar-mod__sublist___tMZy4 {\n padding: var(--spacing-30);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar);\n left: 72px;\n z-index: -1;\n list-style: none;\n position: fixed;\n display: none;\n}\n\n/* This pseudo-element is required to enable smooth coursor movement from the main menu item to submenu items with the gap in between */\n\n.navbar-mod__sublist-expanded__active___XyUuS::before,\n.navbar-mod__sublist-collapsed__active___yWHea::before,\n.navbar-mod__sublist-collapsed__active__above___-7-Ca::before {\n content: '';\n position: absolute;\n display: block;\n width: calc(253px + var(--spacing-20));\n height: 48px;\n left: calc(-1 * var(--spacing-20));\n}\n\n.navbar-mod__sublist__inactive___5-OgH {\n /* empty block */\n}\n\n.navbar-mod__sublist-item___ZZbsF {\n display: flex;\n align-items: center;\n align-self: stretch;\n transition: padding-left 150ms ease-out;\n}\n\n.navbar-mod__sublist-item__active___O2-c- {\n border-radius: var(--border-radius-4);\n background: var(--color-accent-30);\n}\n\n.navbar-mod__sublist-item___ZZbsF:not(.navbar-mod__sublist-item__active___O2-c-):hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-hovered);\n border-radius: var(--border-radius-4);\n background: var(--color-primary-95);\n padding-left: var(--spacing-20);\n}\n\n.navbar-mod__text___3TpQt {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n width: 100%;\n height: 100%;\n}\n\n.navbar-mod__text-link___TcEn2 {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n text-decoration: none;\n display: flex;\n padding: var(--spacing-25);\n align-items: center;\n justify-content: center;\n}\n\n.body__menu-open .navbar-mod__text-link___TcEn2 {\n justify-content: start;\n}\n\n.navbar-mod__text-link-sublist-wrapper___RQinz {\n overflow: hidden;\n display: flex;\n flex-direction: column;\n position: relative;\n min-height: 0;\n}\n\n.navbar-mod__text-link-sublist___V0-tf {\n /* stylelint-disable-next-line value-no-vendor-prefix */\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n color: var(--color-solid);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-hovered);\n text-decoration: none;\n flex: 1;\n padding: var(--spacing-25) var(--spacing-25) var(--spacing-25)\n var(--spacing-30);\n}\n\n.navbar-mod__navlink-clickable-content___o-emf {\n height: 100%;\n width: 100%;\n}\n\n/* Item active */\n\n.navbar-mod__item__active___SEPWP,\n.navbar-mod__item_menu__active___j515K {\n background: var(--color-accent-30);\n border-radius: var(--border-radius-8);\n}\n\n.navbar-mod__list-item___y7qYe.navbar-mod__item__active___SEPWP .navbar-mod__item-icon-text___3ZFtB {\n justify-content: flex-start;\n}\n\n.navbar-mod__list-item___y7qYe .navbar-mod__icon-container___hAbPn {\n width: auto;\n display: flex;\n justify-content: center;\n align-self: flex-start;\n}\n\n.navbar-mod__fixed-menu___QYEJM .navbar-mod__list-item___y7qYe .navbar-mod__item-icon-text___3ZFtB {\n justify-content: center;\n display: flex;\n width: 100%;\n}\n\n.navbar-mod__support-menu___bkf5Q {\n padding: 0 var(--spacing-30) var(--spacing-20) var(--spacing-30);\n height: calc(48px + var(--spacing-20));\n}\n\n.body__menu-open .navbar-mod__list-item___y7qYe.navbar-mod__item__active___SEPWP .navbar-mod__item-icon-text___3ZFtB {\n position: relative;\n width: auto;\n}\n\n.body__menu-open .navbar-mod__list-item___y7qYe.navbar-mod__item__active___SEPWP .navbar-mod__item-icon-text___3ZFtB {\n margin-left: 0;\n}\n\n.navbar-mod__tooltip-container___gTiaE {\n position: absolute;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n height: 48px;\n visibility: visible;\n}\n\n.navbar-mod__tooltip___3PSlF {\n padding: var(--spacing-10) calc(var(--spacing-20) + var(--spacing-10));\n /* stylelint-disable-next-line value-no-vendor-prefix */\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n border-radius: var(--border-radius-4);\n background: var(--color-accent-10);\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.25);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n color: var(--color-surface);\n max-height: 48px;\n visibility: inherit;\n}\n\n.navbar-mod__sublist-expanded__active___XyUuS,\n.navbar-mod__sublist-collapsed__active___yWHea,\n.navbar-mod__sublist-collapsed__active__above___-7-Ca {\n opacity: 1;\n display: none;\n text-align: left;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar-when-active);\n}\n\n.navbar-mod__item-link___6U2c1:hover .navbar-mod__sublist-collapsed__active___yWHea,\n.navbar-mod__item-link___6U2c1:hover .navbar-mod__sublist-collapsed__active__above___-7-Ca,\n.navbar-mod__item-link___6U2c1:hover .navbar-mod__sublist-expanded__active___XyUuS {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--color-surface);\n /* TODO: add design tokens instead hard-coded values */\n min-height: 50px;\n width: 253px;\n border-radius: var(--border-radius-8);\n /* z-index value must be higher than AppBar's z-index */\n z-index: 20001;\n box-shadow: -2px 4px 25px 0 rgba(89, 89, 89, 0.5);\n}\n\n.navbar-mod__item-link___6U2c1:hover .navbar-mod__sublist-collapsed__active___yWHea.navbar-mod__sublist-collapsed__empty___mXa6R,\n.navbar-mod__item-link___6U2c1:hover .navbar-mod__sublist-collapsed__active__above___-7-Ca.navbar-mod__sublist-collapsed__empty___mXa6R {\n visibility: hidden;\n}\n\n.navbar-mod__item-link___6U2c1:hover .navbar-mod__sublist-expanded__active___XyUuS {\n left: 248px;\n}\n\n.navbar-mod__highlighted___06BoS,\n.navbar-mod__highlighted___06BoS .navbar-mod__title___aTo0V {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-active) !important;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-active);\n}\n\n.navbar-mod__hidden___-s7eh {\n display: none;\n}\n\n.navbar-mod__divider___GBOn1 {\n border-top: 1px solid var(--color-neutral-40);\n}\n\n.navbar-mod__loading-dot-container___B7sPh {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.navbar-mod__scrollable-menu___I9ci7 {\n flex: 1 1 0;\n overflow-x: hidden;\n overflow-y: hidden;\n padding: var(--spacing-30) var(--spacing-30) 48px;\n width: 80px;\n box-sizing: border-box;\n /* For Firefox */\n scrollbar-width: thin;\n scrollbar-color: var(--color-primary-40) transparent;\n}\n\n.body__menu-open .navbar-mod__scrollable-menu___I9ci7 {\n width: 256px;\n}\n\n.navbar-mod__scrollable-menu___I9ci7:hover {\n overflow-y: scroll;\n padding-right: 8px;\n}\n\n.navbar-mod__scrollable-menu___I9ci7::-webkit-scrollbar {\n width: 8px;\n}\n\n.navbar-mod__scrollable-menu___I9ci7::-webkit-scrollbar-track {\n background: transparent;\n}\n\n.navbar-mod__scrollable-menu___I9ci7::-webkit-scrollbar-thumb {\n background-color: var(--color-primary-40);\n border-radius: var(--border-radius-8);\n}\n\n.navbar-mod__fixed-menu___QYEJM {\n position: relative;\n width: 80px;\n}\n\n.body__menu-open .navbar-mod__fixed-menu___QYEJM {\n width: 256px;\n}\n",
790
- "jsonMap": {
791
- "left-navigation": "navbar-mod__left-navigation___op7AX",
792
- "navigation-header": "navbar-mod__navigation-header___vaIOk",
793
- "icon-container": "navbar-mod__icon-container___hAbPn",
794
- "title": "navbar-mod__title___aTo0V",
795
- "visible": "navbar-mod__visible___ifOIc",
796
- "icon": "navbar-mod__icon___21inq",
797
- "list": "navbar-mod__list___pouHY",
798
- "list-item": "navbar-mod__list-item___y7qYe",
799
- "item-link": "navbar-mod__item-link___6U2c1",
800
- "item-icon-text": "navbar-mod__item-icon-text___3ZFtB",
801
- "expander": "navbar-mod__expander___blASx",
802
- "expand-icon": "navbar-mod__expand-icon___3A2Dk",
803
- "item--bottom": "navbar-mod__item--bottom___Pygdy",
804
- "item_menu__active": "navbar-mod__item_menu__active___j515K",
805
- "item_menu-open": "navbar-mod__item_menu-open___NnkVM",
806
- "item_menu-collapsed": "navbar-mod__item_menu-collapsed___1s4K0",
807
- "item__active": "navbar-mod__item__active___SEPWP",
808
- "sublist": "navbar-mod__sublist___tMZy4",
809
- "sublist-expanded__active": "navbar-mod__sublist-expanded__active___XyUuS",
810
- "sublist-collapsed__active": "navbar-mod__sublist-collapsed__active___yWHea",
811
- "sublist-collapsed__active__above": "navbar-mod__sublist-collapsed__active__above___-7-Ca",
812
- "sublist__inactive": "navbar-mod__sublist__inactive___5-OgH",
813
- "sublist-item": "navbar-mod__sublist-item___ZZbsF",
814
- "sublist-item__active": "navbar-mod__sublist-item__active___O2-c-",
815
- "text": "navbar-mod__text___3TpQt",
816
- "text-link": "navbar-mod__text-link___TcEn2",
817
- "text-link-sublist-wrapper": "navbar-mod__text-link-sublist-wrapper___RQinz",
818
- "text-link-sublist": "navbar-mod__text-link-sublist___V0-tf",
819
- "navlink-clickable-content": "navbar-mod__navlink-clickable-content___o-emf",
820
- "fixed-menu": "navbar-mod__fixed-menu___QYEJM",
821
- "support-menu": "navbar-mod__support-menu___bkf5Q",
822
- "tooltip-container": "navbar-mod__tooltip-container___gTiaE",
823
- "tooltip": "navbar-mod__tooltip___3PSlF",
824
- "sublist-collapsed__empty": "navbar-mod__sublist-collapsed__empty___mXa6R",
825
- "highlighted": "navbar-mod__highlighted___06BoS",
826
- "hidden": "navbar-mod__hidden___-s7eh",
827
- "divider": "navbar-mod__divider___GBOn1",
828
- "loading-dot-container": "navbar-mod__loading-dot-container___B7sPh",
829
- "scrollable-menu": "navbar-mod__scrollable-menu___I9ci7"
830
- }
831
- };
832
- const styles$3 = compiledStyles$3.jsonMap;
833
- const getMenuVisibilitiesOfSubmenus$1 = menu => {
834
- var _context, _context2;
835
- return _filterInstanceProperty__default["default"](_context = _mapInstanceProperty__default["default"](_context2 = menu.submenu).call(_context2, submenu => submenu.menuVisibility)).call(_context, nonNullable);
836
- };
837
- const getMenuVisibilityOfMainmenu$1 = menu => menu.menuVisibility ? [menu.menuVisibility] : [];
838
- const getIsSubmenuRouteActive = (uriPath, props) => {
839
- var _context3;
840
- return Boolean(reactRouterDom.matchPath(props.location.pathname, {
841
- path: _concatInstanceProperty__default["default"](_context3 = "/".concat(props.projectKey, "/")).call(_context3, uriPath),
842
- exact: true,
843
- strict: false
844
- }));
845
- };
846
- const ApplicationMenu$1 = props => {
847
- var _context4, _props$menu$featureTo, _props$menu$actionRig, _props$menu$dataFence, _context5, _context6;
848
- const _useState = react.useState(0),
849
- _useState2 = _slicedToArray(_useState, 2),
850
- submenuVerticalPosition = _useState2[0],
851
- setSubmenuVerticalPosition = _useState2[1];
852
- const _useState3 = react.useState(false),
853
- _useState4 = _slicedToArray(_useState3, 2),
854
- isSubmenuAboveMenuItem = _useState4[0],
855
- setIsSubmenuAboveMenuItem = _useState4[1];
856
- const submenuRef = react.useRef(null);
857
- const hasSubmenu = _Array$isArray__default["default"](props.menu.submenu) && props.menu.submenu.length > 0;
858
- const menuItemIdentifier = snakeCase__default["default"](props.menu.key);
859
- const callbackFn = react.useCallback(entries => {
860
- var _document$querySelect;
861
- const menuItemBoundingClientRect = (_document$querySelect = document.querySelector("[data-menuitem=\"".concat(menuItemIdentifier, "\"]"))) === null || _document$querySelect === void 0 ? void 0 : _document$querySelect.getBoundingClientRect();
862
- const menuItemTop = (menuItemBoundingClientRect === null || menuItemBoundingClientRect === void 0 ? void 0 : menuItemBoundingClientRect.top) || 0;
863
- const menuItemBottom = (menuItemBoundingClientRect === null || menuItemBoundingClientRect === void 0 ? void 0 : menuItemBoundingClientRect.bottom) || 0;
864
- const _entries = _slicedToArray(entries, 1),
865
- entry = _entries[0];
866
- const doesSubmenuFitWithinViewportBelowMenuItem = entry.boundingClientRect.height + (props.isMenuOpen ? menuItemTop : menuItemBottom) > window.innerHeight;
867
- // if the submenu does not fit at the bottom of the viewport (below the menu item)
868
- if (doesSubmenuFitWithinViewportBelowMenuItem) {
869
- setIsSubmenuAboveMenuItem(true);
870
- setSubmenuVerticalPosition(window.innerHeight - (props.isMenuOpen ? menuItemBottom : menuItemTop));
871
- // show the submenu above the menu item
872
- } else {
873
- setIsSubmenuAboveMenuItem(false);
874
- setSubmenuVerticalPosition(props.isMenuOpen ? menuItemTop : menuItemBottom);
875
- }
876
- }, [menuItemIdentifier, props.isMenuOpen]);
877
- const observerRef = react.useRef(null);
878
- react.useLayoutEffect(() => {
879
- observerRef.current = new IntersectionObserver(callbackFn, {
880
- rootMargin: '-100% 0px 0px 0px' // we want to observe if the submenu crosses the bottom line of the viewport - therefore we set the root element top margin to -100% of the viewport height
881
- });
882
-
883
- return () => {
884
- var _observerRef$current;
885
- return (_observerRef$current = observerRef.current) === null || _observerRef$current === void 0 ? void 0 : _observerRef$current.disconnect();
886
- };
887
- }, [callbackFn, props.isMenuOpen]);
888
- react.useLayoutEffect(() => {
889
- const currentSubmenuRef = submenuRef.current;
890
- const observer = observerRef.current;
891
- if (!currentSubmenuRef) return;
892
- if (observer && currentSubmenuRef) {
893
- observer.observe(currentSubmenuRef);
894
- }
895
- return () => observer === null || observer === void 0 ? void 0 : observer.disconnect();
896
- }, [menuItemIdentifier, props.isMenuOpen, props.handleToggleItem, callbackFn]);
897
- const isMainMenuRouteActive = Boolean(reactRouterDom.matchPath(props.location.pathname, {
898
- path: _concatInstanceProperty__default["default"](_context4 = "/".concat(props.projectKey, "/")).call(_context4, props.menu.uriPath),
899
- exact: false,
900
- strict: false
901
- }));
902
- react.useEffect(() => {
903
- // On first render, check which menu is active for the current application and expand
904
- // the submenu automatically unless the all navbar is collapsed or there are no submenu links.
905
- if (props.isMenuOpen && isMainMenuRouteActive && hasSubmenu) {
906
- props.handleToggleItem();
907
- }
908
- // eslint-disable-next-line react-hooks/exhaustive-deps
909
- }, [props.isMenuOpen]); // <-- (re)run this only when the all menu expands
910
-
911
- const namesOfMenuVisibilitiesOfAllSubmenus = hasSubmenu ? getMenuVisibilitiesOfSubmenus$1(props.menu) : getMenuVisibilityOfMainmenu$1(props.menu);
912
- return jsxRuntime.jsx(RestrictedMenuItem$1, {
913
- keyOfMenuItem: props.menu.key,
914
- featureToggle: (_props$menu$featureTo = props.menu.featureToggle) !== null && _props$menu$featureTo !== void 0 ? _props$menu$featureTo : undefined,
915
- permissions: props.menu.permissions,
916
- actionRights: (_props$menu$actionRig = props.menu.actionRights) !== null && _props$menu$actionRig !== void 0 ? _props$menu$actionRig : undefined,
917
- dataFences: (_props$menu$dataFence = props.menu.dataFences) !== null && _props$menu$dataFence !== void 0 ? _props$menu$dataFence : undefined,
918
- projectPermissions: props.projectPermissions,
919
- menuVisibilities: props.menuVisibilities,
920
- namesOfMenuVisibilities: namesOfMenuVisibilitiesOfAllSubmenus,
921
- children: jsxRuntime.jsxs(MenuItem$2, {
922
- hasSubmenu: hasSubmenu,
923
- isActive: props.isActive,
924
- isMainMenuRouteActive: isMainMenuRouteActive,
925
- isMenuOpen: props.isMenuOpen,
926
- onClick: props.handleToggleItem,
927
- onMouseEnter: props.handleToggleItem,
928
- onMouseLeave: props.shouldCloseMenuFly,
929
- identifier: menuItemIdentifier,
930
- children: [jsxRuntime.jsx(MenuItemLink$1, {
931
- linkTo: _concatInstanceProperty__default["default"](_context5 = "/".concat(props.projectKey, "/")).call(_context5, props.menu.uriPath),
932
- useFullRedirectsForLinks: props.useFullRedirectsForLinks,
933
- onClick: props.onMenuItemClick,
934
- children: jsxRuntime.jsx(ItemContainer, {
935
- labelAllLocales: props.menu.labelAllLocales,
936
- defaultLabel: props.menu.defaultLabel,
937
- applicationLocale: props.applicationLocale,
938
- icon: props.menu.icon,
939
- isMenuOpen: props.isMenuOpen
940
- })
941
- }), jsxRuntime.jsxs(MenuGroup$1, {
942
- id: "group-".concat(props.menu.key),
943
- level: 2,
944
- isActive: props.isActive,
945
- isExpanded: props.isMenuOpen,
946
- hasSubmenu: hasSubmenu,
947
- submenuVerticalPosition: submenuVerticalPosition,
948
- isSubmenuAboveMenuItem: isSubmenuAboveMenuItem,
949
- ref: submenuRef,
950
- children: [!props.isMenuOpen && jsxRuntime.jsx("div", {
951
- className: styles$3['tooltip-container'],
952
- css: /*#__PURE__*/react$1.css(isSubmenuAboveMenuItem ? 'bottom' : 'top', ":-", oidc.DIMENSIONS.navMenuItemHeight, ";" + ("" ), "" ),
953
- children: jsxRuntime.jsx("div", {
954
- className: styles$3['tooltip'],
955
- "aria-owns": "group-".concat(props.menu.key),
956
- children: jsxRuntime.jsx(MenuLabel$1, {
957
- labelAllLocales: props.menu.labelAllLocales,
958
- defaultLabel: props.menu.defaultLabel,
959
- applicationLocale: props.applicationLocale
960
- })
961
- })
962
- }), hasSubmenu ? _mapInstanceProperty__default["default"](_context6 = props.menu.submenu).call(_context6, submenu => {
963
- var _context7, _submenu$featureToggl, _submenu$actionRights, _submenu$dataFences, _context8;
964
- return jsxRuntime.jsx(RestrictedMenuItem$1, {
965
- keyOfMenuItem: submenu.key,
966
- featureToggle: (_submenu$featureToggl = submenu.featureToggle) !== null && _submenu$featureToggl !== void 0 ? _submenu$featureToggl : undefined,
967
- permissions: submenu.permissions,
968
- actionRights: (_submenu$actionRights = submenu.actionRights) !== null && _submenu$actionRights !== void 0 ? _submenu$actionRights : undefined,
969
- dataFences: (_submenu$dataFences = submenu.dataFences) !== null && _submenu$dataFences !== void 0 ? _submenu$dataFences : undefined,
970
- projectPermissions: props.projectPermissions,
971
- menuVisibilities: props.menuVisibilities,
972
- namesOfMenuVisibilities: submenu.menuVisibility ? [submenu.menuVisibility] : undefined,
973
- children: jsxRuntime.jsx("li", {
974
- className: classnames__default["default"](styles$3['sublist-item'], {
975
- [styles$3['sublist-item__active']]: getIsSubmenuRouteActive(submenu.uriPath, props)
976
- }),
977
- children: jsxRuntime.jsx("div", {
978
- className: styles$3.text,
979
- children: jsxRuntime.jsx(MenuItemLink$1, {
980
- linkTo: _concatInstanceProperty__default["default"](_context8 = "/".concat(props.projectKey, "/")).call(_context8, submenu.uriPath)
981
- // We want to use an exact matching strategy to avoid multiple
982
- // links matching sub-routes.
983
- ,
984
- exactMatch: true,
985
- useFullRedirectsForLinks: props.useFullRedirectsForLinks,
986
- onClick: props.onMenuItemClick,
987
- isSubmenuLink: true,
988
- children: jsxRuntime.jsx(MenuLabel$1, {
989
- labelAllLocales: submenu.labelAllLocales,
990
- defaultLabel: submenu.defaultLabel,
991
- applicationLocale: props.applicationLocale
992
- })
993
- })
994
- })
995
- })
996
- }, _concatInstanceProperty__default["default"](_context7 = "".concat(props.menu.key, "-submenu-")).call(_context7, submenu.key));
997
- }) : null]
998
- })]
999
- })
1000
- }, props.menu.key);
1001
- };
1002
- ApplicationMenu$1.propTypes = {};
1003
- ApplicationMenu$1.displayName = 'ApplicationMenu';
1004
- const NavBar$2 = props => {
1005
- const _useNavbarStateManage = useNavbarStateManager({
1006
- environment: props.environment,
1007
- newNavigation: true
1008
- }),
1009
- navBarNode = _useNavbarStateManage.navBarNode,
1010
- isMenuOpen = _useNavbarStateManage.isMenuOpen,
1011
- isExpanderVisible = _useNavbarStateManage.isExpanderVisible,
1012
- activeItemIndex = _useNavbarStateManage.activeItemIndex,
1013
- handleToggleItem = _useNavbarStateManage.handleToggleItem,
1014
- handleToggleMenu = _useNavbarStateManage.handleToggleMenu,
1015
- shouldCloseMenuFly = _useNavbarStateManage.shouldCloseMenuFly,
1016
- allInternalApplicationsNavbarMenu = _useNavbarStateManage.allInternalApplicationsNavbarMenu,
1017
- allCustomApplicationsNavbarMenu = _useNavbarStateManage.allCustomApplicationsNavbarMenu;
1018
- const useFullRedirectsForLinks = Boolean(props.environment.useFullRedirectsForLinks);
1019
- const location = reactRouterDom.useLocation();
1020
- const projectPermissions = react.useMemo(() => {
1021
- var _props$project, _props$project2, _props$project3;
1022
- return {
1023
- permissions: applicationShellConnectors.normalizeAllAppliedPermissions((_props$project = props.project) === null || _props$project === void 0 ? void 0 : _props$project.allPermissionsForAllApplications.allAppliedPermissions),
1024
- actionRights: applicationShellConnectors.normalizeAllAppliedActionRights((_props$project2 = props.project) === null || _props$project2 === void 0 ? void 0 : _props$project2.allPermissionsForAllApplications.allAppliedActionRights),
1025
- dataFences: applicationShellConnectors.normalizeAllAppliedDataFences((_props$project3 = props.project) === null || _props$project3 === void 0 ? void 0 : _props$project3.allPermissionsForAllApplications.allAppliedDataFences)
1026
- };
1027
- }, [props.project]);
1028
- const menuVisibilities = react.useMemo(() => {
1029
- var _props$project4;
1030
- return applicationShellConnectors.normalizeAllAppliedMenuVisibilities((_props$project4 = props.project) === null || _props$project4 === void 0 ? void 0 : _props$project4.allPermissionsForAllApplications.allAppliedMenuVisibilities);
1031
- }, [props.project]);
1032
- const applicationLocale = props.applicationLocale;
1033
-
1034
- // Render the loading navbar as long as all the data
1035
- // hasn't been loaded, or if the project does not exist.
1036
- if (props.isLoading || typeof applicationLocale === 'undefined') {
1037
- // Do not render anything until we have the feature flag remote value fetched so
1038
- // we avoid a flick effect in case it is 'true' (different value from the default one)
1039
- if (!props.isNewNavigationEnabledEvaluationReady) {
1040
- return null;
1041
- }
1042
- return jsxRuntime.jsx(NavBarSkeleton, {
1043
- isExpanded: isMenuOpen
1044
- });
1045
- }
1046
- return jsxRuntime.jsxs(NavBarLayout$2, {
1047
- ref: navBarNode,
1048
- children: [jsxRuntime.jsxs("div", {
1049
- className: styles$3['navigation-header'],
1050
- children: [jsxRuntime.jsx("div", {
1051
- className: styles$3['icon-container'],
1052
- children: jsxRuntime.jsx("div", {
1053
- className: styles$3['icon'],
1054
- children: jsxRuntime.jsx("img", {
1055
- src: LogoSVG__default["default"],
1056
- width: "100%",
1057
- alt: "Logo"
1058
- })
1059
- })
1060
- }), isMenuOpen ? jsxRuntime.jsx("div", {
1061
- className: styles$3['title'],
1062
- children: "Merchant Center"
1063
- }) : null]
1064
- }), jsxRuntime.jsxs(MenuGroup$1, {
1065
- id: "main",
1066
- level: 1,
1067
- children: [jsxRuntime.jsxs("div", {
1068
- className: styles$3['scrollable-menu'],
1069
- children: [_mapInstanceProperty__default["default"](allInternalApplicationsNavbarMenu).call(allInternalApplicationsNavbarMenu, menu => {
1070
- const menuType = 'scrollable';
1071
- const itemIndex = "".concat(menuType, "-").concat(menu.key);
1072
- return jsxRuntime.jsx(ApplicationMenu$1, {
1073
- location: location,
1074
- menu: menu,
1075
- isActive: activeItemIndex === itemIndex,
1076
- handleToggleItem: () => handleToggleItem(itemIndex),
1077
- isMenuOpen: isMenuOpen,
1078
- shouldCloseMenuFly: shouldCloseMenuFly,
1079
- projectPermissions: projectPermissions,
1080
- menuVisibilities: menuVisibilities,
1081
- applicationLocale: applicationLocale,
1082
- projectKey: props.projectKey,
1083
- useFullRedirectsForLinks: useFullRedirectsForLinks,
1084
- onMenuItemClick: props.onMenuItemClick
1085
- }, menu.key);
1086
- }), _mapInstanceProperty__default["default"](allCustomApplicationsNavbarMenu).call(allCustomApplicationsNavbarMenu, menu => {
1087
- const menuType = 'scrollable';
1088
- const itemIndex = "".concat(menuType, "-").concat(menu.key);
1089
- return jsxRuntime.jsx(ApplicationMenu$1, {
1090
- location: location,
1091
- menu: menu,
1092
- isActive: activeItemIndex === itemIndex,
1093
- handleToggleItem: () => handleToggleItem(itemIndex),
1094
- isMenuOpen: isMenuOpen,
1095
- shouldCloseMenuFly: shouldCloseMenuFly,
1096
- projectPermissions: projectPermissions,
1097
- menuVisibilities: menuVisibilities,
1098
- applicationLocale: applicationLocale,
1099
- projectKey: props.projectKey,
1100
- useFullRedirectsForLinks: useFullRedirectsForLinks,
1101
- onMenuItemClick: props.onMenuItemClick
1102
- }, menu.key);
1103
- })]
1104
- }), jsxRuntime.jsxs("div", {
1105
- className: styles$3['fixed-menu'],
1106
- children: [jsxRuntime.jsx(Faded$1, {}), jsxRuntime.jsx("div", {
1107
- className: styles$3['support-menu'],
1108
- children: jsxRuntime.jsx(MenuItem$2, {
1109
- hasSubmenu: false,
1110
- isActive: false,
1111
- isMenuOpen: isMenuOpen,
1112
- onClick: () => {
1113
- handleToggleItem('fixed-support');
1114
- },
1115
- onMouseEnter: isMenuOpen ? undefined : () => handleToggleItem('fixed-support'),
1116
- onMouseLeave: isMenuOpen ? undefined : shouldCloseMenuFly,
1117
- children: jsxRuntime.jsx("a", {
1118
- href: constants.SUPPORT_PORTAL_URL,
1119
- rel: "noopener noreferrer",
1120
- target: "_blank",
1121
- className: styles$3['text-link'],
1122
- children: jsxRuntime.jsxs("div", {
1123
- className: styles$3['item-icon-text'],
1124
- children: [jsxRuntime.jsx("div", {
1125
- className: styles$3['icon-container'],
1126
- children: jsxRuntime.jsx("div", {
1127
- className: styles$3['icon'],
1128
- children: jsxRuntime.jsx(icons.SupportIcon, {
1129
- size: "scale"
1130
- })
1131
- })
1132
- }), isMenuOpen ? jsxRuntime.jsx("div", {
1133
- className: styles$3.title,
1134
- children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$3({}, messages['NavBar.MCSupport.title']))
1135
- }) : null]
1136
- })
1137
- })
1138
- })
1139
- }), jsxRuntime.jsx(MenuExpander$1, {
1140
- isVisible: isExpanderVisible,
1141
- onClick: handleToggleMenu,
1142
- isMenuOpen: isMenuOpen
1143
- })]
1144
- })]
1145
- })]
1146
- });
1147
- };
1148
- NavBar$2.propTypes = {};
1149
- NavBar$2.displayName = 'NavBar';
1150
-
1151
- const useLoadingMenuLayoutEffect = () => {
1152
- const cachedIsForcedMenuOpen = window.localStorage.getItem(constants.STORAGE_KEYS.IS_FORCED_MENU_OPEN);
1153
- const isForcedMenuOpen = isNil__default["default"](cachedIsForcedMenuOpen) ? null : JSON.parse(cachedIsForcedMenuOpen);
1154
- react.useLayoutEffect(() => {
1155
- if (isForcedMenuOpen) document.body.classList.add('body__menu-open');
1156
- if (!isForcedMenuOpen) document.body.classList.remove('body__menu-open');
1157
- }, [isForcedMenuOpen]);
1158
- };
1159
-
1160
- const _excluded = ["icon"];
1161
- function ownKeys$2(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
1162
- function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context3, _context4; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context3 = ownKeys$2(Object(t), !0)).call(_context3, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context4 = ownKeys$2(Object(t))).call(_context4, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1163
- const compiledStyles$2 = {
1164
- "global": ":root {\n\n /* Left navigation */\n\n /* Active list item with icon text */\n}\n\n/* Left Nav */\n\n.navbar-mod__left-navigation___B11QL {\n display: flex;\n flex-grow: 1;\n width: 64px;\n z-index: 19999;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background: var(--background-color-for-navbar);\n}\n\n.navbar-mod__list___xLBjv {\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n min-height: 0;\n flex: 1 1 0;\n}\n\n.body__menu-open .navbar-mod__scrollable-menu___GUrXv {\n flex: 1 1 0;\n overflow-x: hidden;\n overflow-y: auto;\n}\n\n.navbar-mod__list-item___PtOVL {\n width: 64px;\n min-height: 56px;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background: var(--background-color-for-navbar);\n margin: 0;\n list-style: none;\n cursor: pointer;\n}\n\n.navbar-mod__item-link___3b3a7 {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n padding: var(--spacing-m);\n width: 100%;\n position: relative;\n display: block;\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__item-icon-text___ZlMLY {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__icon___xOiRj {\n width: 24px;\n height: 24px;\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__icon___xOiRj > svg *:not([fill='none']) {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n fill: var(--color-for-navbar-icon);\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__icon__active___8IKeB > svg *:not([fill='none']) {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n fill: var(--color-for-navbar-icon-when-active);\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__title___uOjhW {\n flex: 1;\n font-weight: 500;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n display: none;\n opacity: 0;\n transition: all 0.25s ease-in-out;\n text-align: left;\n text-decoration: none;\n z-index: 1;\n}\n\n.navbar-mod__expander___1CChn {\n border-top: 1px solid var(--color-neutral-40);\n height: 50px;\n display: flex;\n align-items: center;\n justify-content: center;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar);\n}\n\n.navbar-mod__expand-icon___biAt6 {\n align-items: center;\n border-radius: 32px;\n cursor: pointer;\n display: flex;\n height: 24px;\n justify-content: center;\n transform: translateX(0) rotateZ(0deg);\n width: 24px;\n}\n\n.navbar-mod__item--bottom___RE98P {\n position: absolute;\n bottom: 50px;\n}\n\n.navbar-mod__list-item___PtOVL:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar-when-hovered);\n}\n\n.navbar-mod__item__active___S-P3x .navbar-mod__title___uOjhW {\n opacity: 1;\n display: block;\n transition: all 0.2s ease;\n}\n\n.navbar-mod__item_menu-open___4wsej {\n height: auto !important;\n}\n\n/* NO SUBMENU */\n\n.navbar-mod__item_menu-collapsed___SNDmx .navbar-mod__item-link___3b3a7 {\n text-align: center;\n}\n\n.navbar-mod__item__no-submenu___mua5w .navbar-mod__title___uOjhW {\n border-bottom: 0;\n}\n\n.navbar-mod__item__no-submenu___mua5w .navbar-mod__sublist___5VV4O {\n padding-top: 40px;\n}\n\n/* left-nav open */\n\n.body__menu-open .navbar-mod__title___uOjhW {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n font-weight: 500;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n}\n\n.body__menu-open .navbar-mod__left-navigation___B11QL {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n box-shadow: var(--shadow-for-navbar);\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL {\n height: auto;\n min-height: 56px;\n transition: max-height 0.15s ease-out;\n overflow: hidden;\n}\n\n.body__menu-open .navbar-mod__left-navigation___B11QL,\n.body__menu-open .navbar-mod__list-item___PtOVL {\n width: 245px;\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL .navbar-mod__title___uOjhW {\n display: block;\n opacity: 1;\n margin-left: var(--spacing-m);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n}\n\n.navbar-mod__list-item___PtOVL:not(.navbar-mod__item__active___S-P3x):hover .navbar-mod__icon___xOiRj > svg *:not([fill='none']) {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n fill: var(--color-for-navbar-icon-when-active);\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__title___uOjhW:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n}\n\n.navbar-mod__list-item___PtOVL:not(.navbar-mod__item__active___S-P3x):hover .navbar-mod__title___uOjhW {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n}\n\n.body__menu-open .navbar-mod__expand-icon___biAt6 {\n transform: translateX(0) rotateZ(180deg);\n}\n\n.body__menu-open .navbar-mod__item__active___S-P3x {\n max-height: 500px;\n transition: max-height 0.25s ease-in;\n}\n\n.body__menu-open .navbar-mod__sublist___5VV4O {\n position: relative;\n z-index: 1;\n left: 0;\n margin: 0 0 0 calc(\n 24px + var(--spacing-m) + 4px + 4px\n );\n padding: var(--spacing-m) 0 0;\n background-color: transparent;\n}\n\n.body__menu-open .navbar-mod__sublist___5VV4O.navbar-mod__sublist-no-children___5Bwqb {\n border: 0;\n}\n\n.body__menu-open .navbar-mod__title-copy___SdRqf {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n text-decoration: none;\n transition: all 0.15s ease;\n}\n\n.body__menu-open .navbar-mod__title-copy___SdRqf:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-hovered);\n}\n\n.body__menu-open .navbar-mod__expander___1CChn {\n min-height: 50px;\n justify-content: flex-end;\n padding: var(--spacing-m);\n}\n\n/* Second level menu */\n\n.navbar-mod__sublist___5VV4O {\n padding: 75px var(--spacing-l) var(--spacing-m);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n position: absolute;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar);\n top: 0;\n left: 64px;\n list-style: none;\n opacity: 0.01;\n display: none;\n}\n\n.navbar-mod__sublist__inactive___9A4qo {\n /* empty block */\n}\n\n.navbar-mod__sublist-item___d-8UM {\n padding: var(--spacing-s) 0 0;\n}\n\n.navbar-mod__sublist-item___d-8UM:first-of-type {\n padding: 0;\n}\n\n.navbar-mod__sublist-item___d-8UM:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-hovered);\n}\n\n.navbar-mod__text___a585r {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n}\n\n.navbar-mod__text-link___pVuV6 {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n text-decoration: none;\n transition: all 0.15s ease;\n}\n\n.navbar-mod__text-link___pVuV6:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-hovered);\n}\n\n/* Item active */\n\n.navbar-mod__item__active___S-P3x,\n.navbar-mod__item_menu__active___c95PT {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background: var(--background-color-for-navbar-when-active);\n}\n\n.navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY {\n justify-content: flex-start;\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__icon-container___-yU8W {\n width: calc(24px + 4px * 2);\n display: flex;\n justify-content: center;\n align-self: flex-start;\n}\n\n.navbar-mod__fixed-menu___0HE2b .navbar-mod__list-item___PtOVL .navbar-mod__item-icon-text___ZlMLY {\n justify-content: flex-start;\n display: flex;\n width: 100%;\n}\n\n.navbar-mod__fixed-menu___0HE2b .navbar-mod__list-item___PtOVL .navbar-mod__icon-container___-yU8W {\n /* empty block */\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY {\n position: relative;\n width: auto;\n}\n\n.navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY .navbar-mod__title___uOjhW {\n margin-left: 40px;\n}\n\n.navbar-mod__item_menu-collapsed___SNDmx.navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY .navbar-mod__title___uOjhW {\n max-height: 44px;\n overflow: hidden;\n /* stylelint-disable-next-line value-no-vendor-prefix */\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n position: absolute;\n /* `left` and `width` required for displaying focus indicator properly */\n left: 46px;\n width: 166px;\n z-index: 1;\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY .navbar-mod__title___uOjhW {\n margin-left: var(--spacing-m);\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY {\n margin-left: 0;\n}\n\n.navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__sublist___5VV4O {\n width: 205px;\n min-height: 100%;\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__sublist___5VV4O {\n width: calc(100% - calc(\n 24px + var(--spacing-m) + 4px + 4px\n ));\n}\n\n.navbar-mod__sublist-expanded__active___Fett-,\n.navbar-mod__sublist-collapsed__active___NPTQn {\n opacity: 1;\n display: unset;\n text-align: left;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar-when-active);\n}\n\n.navbar-mod__sublist-expanded__active___Fett- {\n display: block;\n}\n\n.navbar-mod__highlighted___WWk0R,\n.navbar-mod__highlighted___WWk0R .navbar-mod__title___uOjhW {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-active) !important;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-active);\n}\n\n.navbar-mod__hidden___kfXoC {\n display: none;\n}\n\n.navbar-mod__divider___A9rwl {\n border-top: 1px solid var(--color-neutral-40);\n}\n\n.navbar-mod__loading-dot-container___8P8Tl {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.navbar-mod__scrollable-menu___GUrXv {\n flex: 1 1 0;\n padding-bottom: 32px;\n /*\n FIXME: Make the navbar scrollable in collapsed state.\n NOTE: do not use `overflow-x: hidden; overflow-y: auto;` as this prevents submenus from showing up on hover\n */\n}\n\n.navbar-mod__fixed-menu___0HE2b {\n flex: 0 0 0;\n position: relative;\n}\n",
1165
- "jsonMap": {
1166
- "left-navigation": "navbar-mod__left-navigation___B11QL",
1167
- "list": "navbar-mod__list___xLBjv",
1168
- "scrollable-menu": "navbar-mod__scrollable-menu___GUrXv",
1169
- "list-item": "navbar-mod__list-item___PtOVL",
1170
- "item-link": "navbar-mod__item-link___3b3a7",
1171
- "item-icon-text": "navbar-mod__item-icon-text___ZlMLY",
1172
- "icon": "navbar-mod__icon___xOiRj",
1173
- "icon__active": "navbar-mod__icon__active___8IKeB",
1174
- "title": "navbar-mod__title___uOjhW",
1175
- "expander": "navbar-mod__expander___1CChn",
1176
- "expand-icon": "navbar-mod__expand-icon___biAt6",
1177
- "item--bottom": "navbar-mod__item--bottom___RE98P",
1178
- "item__active": "navbar-mod__item__active___S-P3x",
1179
- "item_menu-open": "navbar-mod__item_menu-open___4wsej",
1180
- "item_menu-collapsed": "navbar-mod__item_menu-collapsed___SNDmx",
1181
- "item__no-submenu": "navbar-mod__item__no-submenu___mua5w",
1182
- "sublist": "navbar-mod__sublist___5VV4O",
1183
- "sublist-no-children": "navbar-mod__sublist-no-children___5Bwqb",
1184
- "title-copy": "navbar-mod__title-copy___SdRqf",
1185
- "sublist__inactive": "navbar-mod__sublist__inactive___9A4qo",
1186
- "sublist-item": "navbar-mod__sublist-item___d-8UM",
1187
- "text": "navbar-mod__text___a585r",
1188
- "text-link": "navbar-mod__text-link___pVuV6",
1189
- "item_menu__active": "navbar-mod__item_menu__active___c95PT",
1190
- "icon-container": "navbar-mod__icon-container___-yU8W",
1191
- "fixed-menu": "navbar-mod__fixed-menu___0HE2b",
1192
- "sublist-expanded__active": "navbar-mod__sublist-expanded__active___Fett-",
1193
- "sublist-collapsed__active": "navbar-mod__sublist-collapsed__active___NPTQn",
1194
- "highlighted": "navbar-mod__highlighted___WWk0R",
1195
- "hidden": "navbar-mod__hidden___kfXoC",
1196
- "divider": "navbar-mod__divider___A9rwl",
1197
- "loading-dot-container": "navbar-mod__loading-dot-container___8P8Tl"
1198
- }
1199
- };
1200
- const styles$2 = compiledStyles$2.jsonMap;
1201
- /*
1202
- <DataMenu data={[]}>
1203
- <MenuGroup>
1204
- <MenuItem>
1205
- <MenuItemLink linkTo="/foo">(icon) Products</MenuItemLink>
1206
- <MenuGroup>
1207
- <MenuItemLink linkTo="/foo/new">Add product</MenuItemLink>
1208
- </MenuGroup>
1209
- </MenuItem>
1210
- </MenuGroup>
1211
- <MenuExpander/>
1212
- </DataMenu>
1213
- */
1214
-
1215
- const HeartIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./heart-01f01038.cjs.prod.js'); }));
1216
- const PaperclipIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./paperclip-fe72a70d.cjs.prod.js'); }));
1217
- const PluginIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./plugin-81ae1044.cjs.prod.js'); }));
1218
- const RocketIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./rocket-cb99be06.cjs.prod.js'); }));
1219
- const StarIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./star-e4902bbb.cjs.prod.js'); }));
1220
- const ConnectedSquareIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./connected-square-2d046cb8.cjs.prod.js'); }));
1221
- const WorldIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./world-22189397.cjs.prod.js'); }));
1222
- const TreeStructureIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./tree-structure-3ec98cce.cjs.prod.js'); }));
1223
- const UserFilledIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./user-filled-26f333b2.cjs.prod.js'); }));
1224
- const SpeedometerIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./speedometer-26f52e73.cjs.prod.js'); }));
1225
- const TagMultiIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./tag-multi-1c065f61.cjs.prod.js'); }));
1226
- const CartIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./cart-645074db.cjs.prod.js'); }));
1227
- const BoxIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./box-09bf50e1.cjs.prod.js'); }));
1228
- const GearIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./gear-4f7cde98.cjs.prod.js'); }));
1229
- const ListWithSearchIcon = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./list-with-search-6462447e.cjs.prod.js'); }));
1230
- // The icon is expected to be the `svg` document as a string.
1231
- // For backwards compatibility purposes, we still support the legacy "icon name",
1232
- // which we then map to one of the pre-defined icons.
1233
- // Eventually, we want to get rid of this "switch" logic.
1234
- const IconSwitcher = _ref => {
1235
- let icon = _ref.icon,
1236
- iconProps = _objectWithoutProperties(_ref, _excluded);
1237
- if (_includesInstanceProperty__default["default"](icon).call(icon, '<svg')) {
1238
- return jsxRuntime.jsx(InlineSvg__default["default"], _objectSpread$2({
1239
- data: icon
1240
- }, iconProps));
1241
- }
1242
- // Backwards compatibility for apps using the "icon name".
1243
- switch (icon) {
1244
- // Legacy application icons
1245
- // TODO: To be removed once MC applications icons updates are published
1246
- case 'TreeStructureIcon':
1247
- return jsxRuntime.jsx(TreeStructureIcon, _objectSpread$2({}, iconProps));
1248
- case 'UserFilledIcon':
1249
- return jsxRuntime.jsx(UserFilledIcon, _objectSpread$2({}, iconProps));
1250
- case 'SpeedometerIcon':
1251
- return jsxRuntime.jsx(SpeedometerIcon, _objectSpread$2({}, iconProps));
1252
- case 'TagMultiIcon':
1253
- return jsxRuntime.jsx(TagMultiIcon, _objectSpread$2({}, iconProps));
1254
- case 'CartIcon':
1255
- return jsxRuntime.jsx(CartIcon, _objectSpread$2({}, iconProps));
1256
- case 'BoxIcon':
1257
- return jsxRuntime.jsx(BoxIcon, _objectSpread$2({}, iconProps));
1258
- case 'GearIcon':
1259
- return jsxRuntime.jsx(GearIcon, _objectSpread$2({}, iconProps));
1260
- case 'ListWithSearchIcon':
1261
- return jsxRuntime.jsx(ListWithSearchIcon, _objectSpread$2({}, iconProps));
1262
-
1263
- // Custom application icons set
1264
- case 'HeartIcon':
1265
- return jsxRuntime.jsx(HeartIcon, _objectSpread$2({}, iconProps));
1266
- case 'PaperclipIcon':
1267
- return jsxRuntime.jsx(PaperclipIcon, _objectSpread$2({}, iconProps));
1268
- case 'PluginIcon':
1269
- return jsxRuntime.jsx(PluginIcon, _objectSpread$2({}, iconProps));
1270
- case 'RocketIcon':
1271
- return jsxRuntime.jsx(RocketIcon, _objectSpread$2({}, iconProps));
1272
- case 'StarIcon':
1273
- return jsxRuntime.jsx(StarIcon, _objectSpread$2({}, iconProps));
1274
- case 'ConnectedSquareIcon':
1275
- return jsxRuntime.jsx(ConnectedSquareIcon, _objectSpread$2({}, iconProps));
1276
- // For backwards compatibility
1277
- case 'WorldIcon':
1278
- return jsxRuntime.jsx(WorldIcon, _objectSpread$2({}, iconProps));
1279
- default:
1280
- return jsxRuntime.jsx("img", {
1281
- src: MissingImageSvg__default["default"],
1282
- alt: "missing icon"
1283
- });
1284
- }
1285
- };
1286
- IconSwitcher.propTypes = {};
1287
- IconSwitcher.displayName = 'IconSwitcher';
1288
- const MenuExpander = props => {
1289
- return jsxRuntime.jsx("li", {
1290
- className: classnames__default["default"](styles$2['list-item'], styles$2.expander, {
1291
- [styles$2.hidden]: !props.isVisible
1292
- }),
1293
- children: jsxRuntime.jsx("div", {
1294
- onClick: props.onClick,
1295
- className: styles$2['expand-icon'],
1296
- "data-testid": "menu-expander",
1297
- children: jsxRuntime.jsx(icons.ArrowRightIcon, {
1298
- color: "surface",
1299
- size: "big"
1300
- })
1301
- })
1302
- }, "expander");
1303
- };
1304
- MenuExpander.propTypes = {};
1305
- MenuExpander.displayName = 'MenuExpander';
1306
- const Faded = /*#__PURE__*/_styled__default["default"]("div", {
1307
- target: "e7a2vqh0"
1308
- } )("position:absolute;top:-32px;height:32px;width:100%;background:linear-gradient(\n 0deg,\n ", applicationComponents.designTokens.backgroundColorForNavbar, " 0%,\n rgba(0, 0, 0, 0) 100%\n );z-index:1;" + ("" ));
1309
- const MenuGroup = props => {
1310
- if (props.isExpanded && (props.level === 2 && !props.hasSubmenu || props.level === 2 && !props.isActive)) {
1311
- return null;
1312
- }
1313
- const isSublistActiveWhileIsMenuExpanded = props.level === 2 && props.isActive && props.isExpanded;
1314
- const isSublistActiveWhileIsMenuCollapsed = props.level === 2 && props.isActive && !props.isExpanded;
1315
- return jsxRuntime.jsx("ul", {
1316
- id: "group-".concat(props.id),
1317
- "data-testid": "group-".concat(props.id),
1318
- role: "menu",
1319
- "aria-expanded": isSublistActiveWhileIsMenuExpanded || isSublistActiveWhileIsMenuCollapsed,
1320
- className: classnames__default["default"]({
1321
- [styles$2.list]: props.level === 1
1322
- }, {
1323
- [styles$2['sublist']]: props.level === 2
1324
- }, {
1325
- [styles$2['sublist-no-children']]: props.level === 2 && !props.children
1326
- }, {
1327
- [styles$2['sublist-expanded__active']]: isSublistActiveWhileIsMenuExpanded
1328
- }, {
1329
- [styles$2['sublist-collapsed__active']]: isSublistActiveWhileIsMenuCollapsed
1330
- }, {
1331
- [styles$2.sublist__inactive]: !isSublistActiveWhileIsMenuCollapsed
1332
- }),
1333
- children: props.children
1334
- });
1335
- };
1336
- MenuGroup.propTypes = {};
1337
- MenuGroup.displayName = 'MenuGroup';
1338
- const MenuItem = props => {
1339
- var _props$isMainMenuRout;
1340
- return jsxRuntime.jsx("li", {
1341
- role: "menuitem",
1342
- className: classnames__default["default"](styles$2['list-item'], {
1343
- [styles$2.item__active]: props.isActive,
1344
- [styles$2['item_menu__active']]: (_props$isMainMenuRout = props.isMainMenuRouteActive) !== null && _props$isMainMenuRout !== void 0 ? _props$isMainMenuRout : false,
1345
- [styles$2['item_menu-collapsed']]: !props.isMenuOpen,
1346
- [styles$2['item__no-submenu']]: !props.hasSubmenu
1347
- }),
1348
- onClick: props.onClick,
1349
- onMouseEnter: props.onMouseEnter,
1350
- onMouseLeave: props.onMouseLeave,
1351
- children: jsxRuntime.jsx("div", {
1352
- className: styles$2['item-link'],
1353
- children: props.children
1354
- })
1355
- });
1356
- };
1357
- MenuItem.propTypes = {};
1358
- MenuItem.displayName = 'MenuItem';
1359
- const menuItemLinkDefaultProps = {
1360
- exactMatch: false
1361
- };
1362
- const MenuItemLink = props => {
1363
- const redirectTo = targetUrl => useIsServedByProxy.location.replace(targetUrl);
1364
- if (props.linkTo) {
1365
- return jsxRuntime.jsx(reactRouterDom.NavLink, {
1366
- to: props.linkTo,
1367
- exact: props.exactMatch,
1368
- activeClassName: styles$2.highlighted,
1369
- className: styles$2['text-link'],
1370
- onClick: event => {
1371
- if (props.linkTo && props.useFullRedirectsForLinks) {
1372
- event.preventDefault();
1373
- redirectTo(props.linkTo);
1374
- } else if (props.onClick) {
1375
- event.persist();
1376
- props.onClick(event);
1377
- }
1378
- },
1379
- children: props.children
1380
- });
1381
- }
1382
- return jsxRuntime.jsx(jsxRuntime.Fragment, {
1383
- children: props.children
1384
- });
1385
- };
1386
- MenuItemLink.propTypes = {};
1387
- MenuItemLink.displayName = 'MenuItemLink';
1388
- MenuItemLink.defaultProps = menuItemLinkDefaultProps;
1389
- const MenuItemDivider = () => jsxRuntime.jsx("div", {
1390
- className: styles$2.divider
1391
- });
1392
- MenuItemDivider.displayName = 'MenuItemDivider';
1393
- const isEveryMenuVisibilitySetToHidden = (menuVisibilities, namesOfMenuVisibilities) => _Array$isArray__default["default"](namesOfMenuVisibilities) && namesOfMenuVisibilities.length > 0 && _everyInstanceProperty__default["default"](namesOfMenuVisibilities).call(namesOfMenuVisibilities, nameOfMenuVisibility => menuVisibilities && menuVisibilities[nameOfMenuVisibility] === true);
1394
- const restrictedMenuItemDefaultProps = {
1395
- permissions: []
1396
- };
1397
- function isLongLivedFlag(flag) {
1398
- return typeof (flag === null || flag === void 0 ? void 0 : flag.value) === 'boolean';
1399
- }
1400
- const RestrictedMenuItem = props => {
1401
- // NOTE: Custom application are activated/deactivated while their
1402
- // visibility is not controlled via a visibiility overwrite.
1403
- const flagVariation = reactBroadcast.useFlagVariation(props.featureToggle);
1404
- if (isEveryMenuVisibilitySetToHidden(props.menuVisibilities, props.namesOfMenuVisibilities)) return null;
1405
- const permissionsWrapper = _Array$isArray__default["default"](props.permissions) && props.permissions.length > 0 || _Array$isArray__default["default"](props.dataFences) && props.dataFences.length > 0 ? jsxRuntime.jsx(permissions.RestrictedByPermissions, {
1406
- permissions: props.permissions,
1407
- actionRights: props.actionRights,
1408
- dataFences: props.dataFences,
1409
- selectDataFenceData: demandedDataFence => {
1410
- switch (demandedDataFence.type) {
1411
- case 'store':
1412
- return demandedDataFence.actualDataFenceValues;
1413
- default:
1414
- return null;
1415
- }
1416
- }
1417
- // Always check that some of the given permissions match.
1418
- ,
1419
- shouldMatchSomePermissions: true,
1420
- projectPermissions: props.projectPermissions,
1421
- children: props.children
1422
- }) : jsxRuntime.jsx(jsxRuntime.Fragment, {
1423
- children: props.children
1424
- });
1425
- if (props.featureToggle) {
1426
- // A regular short-lived feature toggle
1427
- if (flagVariation === true) return permissionsWrapper;
1428
- // A long-lived feature toggle with `{ value: boolean, string: reason }`
1429
- if (isLongLivedFlag(flagVariation) && flagVariation.value === true) return permissionsWrapper;
1430
- return null;
1431
- }
1432
- return permissionsWrapper;
1433
- };
1434
- RestrictedMenuItem.propTypes = {};
1435
- RestrictedMenuItem.displayName = 'RestrictedMenuItem';
1436
- RestrictedMenuItem.defaultProps = restrictedMenuItemDefaultProps;
1437
- const MenuLabel = props => {
1438
- var _context;
1439
- const localizedLabel = _findInstanceProperty__default["default"](_context = props.labelAllLocales).call(_context, loc => {
1440
- var _context2;
1441
- return _startsWithInstanceProperty__default["default"](_context2 = props.applicationLocale).call(_context2, loc.locale);
1442
- });
1443
- if (localizedLabel) return jsxRuntime.jsx(jsxRuntime.Fragment, {
1444
- children: localizedLabel.value
1445
- });
1446
- if (props.defaultLabel) return jsxRuntime.jsx(jsxRuntime.Fragment, {
1447
- children: props.defaultLabel
1448
- });
1449
- return jsxRuntime.jsx(jsxRuntime.Fragment, {
1450
- children: constants.NO_VALUE_FALLBACK
1451
- });
1452
- };
1453
- MenuLabel.propTypes = {
1454
- labelAllLocales: _pt__default["default"].arrayOf(_pt__default["default"].any).isRequired,
1455
- defaultLabel: _pt__default["default"].string,
1456
- applicationLocale: _pt__default["default"].string.isRequired
1457
- };
1458
- const NavBarLayout = /*#__PURE__*/react.forwardRef((props, ref) => jsxRuntime.jsxs(jsxRuntime.Fragment, {
1459
- children: [jsxRuntime.jsx(react$1.Global, {
1460
- styles: /*#__PURE__*/react$1.css(compiledStyles$2.global, ";" + ("" ), "" )
1461
- }), jsxRuntime.jsx("nav", {
1462
- ref: ref,
1463
- className: styles$2['left-navigation'],
1464
- "data-test": "left-navigation",
1465
- "data-testid": "left-navigation",
1466
- children: props.children
1467
- })]
1468
- }));
1469
- NavBarLayout.displayName = 'NavBarLayout';
1470
-
1471
- const compiledStyles$1 = {
1472
- "global": ":root {\n\n /* Left navigation */\n\n /* Active list item with icon text */\n}\n\n/* Left Nav */\n\n.navbar-mod__left-navigation___B11QL {\n display: flex;\n flex-grow: 1;\n width: 64px;\n z-index: 19999;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background: var(--background-color-for-navbar);\n}\n\n.navbar-mod__list___xLBjv {\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n min-height: 0;\n flex: 1 1 0;\n}\n\n.body__menu-open .navbar-mod__scrollable-menu___GUrXv {\n flex: 1 1 0;\n overflow-x: hidden;\n overflow-y: auto;\n}\n\n.navbar-mod__list-item___PtOVL {\n width: 64px;\n min-height: 56px;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background: var(--background-color-for-navbar);\n margin: 0;\n list-style: none;\n cursor: pointer;\n}\n\n.navbar-mod__item-link___3b3a7 {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n padding: var(--spacing-m);\n width: 100%;\n position: relative;\n display: block;\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__item-icon-text___ZlMLY {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__icon___xOiRj {\n width: 24px;\n height: 24px;\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__icon___xOiRj > svg *:not([fill='none']) {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n fill: var(--color-for-navbar-icon);\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__icon__active___8IKeB > svg *:not([fill='none']) {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n fill: var(--color-for-navbar-icon-when-active);\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__title___uOjhW {\n flex: 1;\n font-weight: 500;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n display: none;\n opacity: 0;\n transition: all 0.25s ease-in-out;\n text-align: left;\n text-decoration: none;\n z-index: 1;\n}\n\n.navbar-mod__expander___1CChn {\n border-top: 1px solid var(--color-neutral-40);\n height: 50px;\n display: flex;\n align-items: center;\n justify-content: center;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar);\n}\n\n.navbar-mod__expand-icon___biAt6 {\n align-items: center;\n border-radius: 32px;\n cursor: pointer;\n display: flex;\n height: 24px;\n justify-content: center;\n transform: translateX(0) rotateZ(0deg);\n width: 24px;\n}\n\n.navbar-mod__item--bottom___RE98P {\n position: absolute;\n bottom: 50px;\n}\n\n.navbar-mod__list-item___PtOVL:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar-when-hovered);\n}\n\n.navbar-mod__item__active___S-P3x .navbar-mod__title___uOjhW {\n opacity: 1;\n display: block;\n transition: all 0.2s ease;\n}\n\n.navbar-mod__item_menu-open___4wsej {\n height: auto !important;\n}\n\n/* NO SUBMENU */\n\n.navbar-mod__item_menu-collapsed___SNDmx .navbar-mod__item-link___3b3a7 {\n text-align: center;\n}\n\n.navbar-mod__item__no-submenu___mua5w .navbar-mod__title___uOjhW {\n border-bottom: 0;\n}\n\n.navbar-mod__item__no-submenu___mua5w .navbar-mod__sublist___5VV4O {\n padding-top: 40px;\n}\n\n/* left-nav open */\n\n.body__menu-open .navbar-mod__title___uOjhW {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n font-weight: 500;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n}\n\n.body__menu-open .navbar-mod__left-navigation___B11QL {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n box-shadow: var(--shadow-for-navbar);\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL {\n height: auto;\n min-height: 56px;\n transition: max-height 0.15s ease-out;\n overflow: hidden;\n}\n\n.body__menu-open .navbar-mod__left-navigation___B11QL,\n.body__menu-open .navbar-mod__list-item___PtOVL {\n width: 245px;\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL .navbar-mod__title___uOjhW {\n display: block;\n opacity: 1;\n margin-left: var(--spacing-m);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n}\n\n.navbar-mod__list-item___PtOVL:not(.navbar-mod__item__active___S-P3x):hover .navbar-mod__icon___xOiRj > svg *:not([fill='none']) {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n fill: var(--color-for-navbar-icon-when-active);\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__title___uOjhW:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n}\n\n.navbar-mod__list-item___PtOVL:not(.navbar-mod__item__active___S-P3x):hover .navbar-mod__title___uOjhW {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n}\n\n.body__menu-open .navbar-mod__expand-icon___biAt6 {\n transform: translateX(0) rotateZ(180deg);\n}\n\n.body__menu-open .navbar-mod__item__active___S-P3x {\n max-height: 500px;\n transition: max-height 0.25s ease-in;\n}\n\n.body__menu-open .navbar-mod__sublist___5VV4O {\n position: relative;\n z-index: 1;\n left: 0;\n margin: 0 0 0 calc(\n 24px + var(--spacing-m) + 4px + 4px\n );\n padding: var(--spacing-m) 0 0;\n background-color: transparent;\n}\n\n.body__menu-open .navbar-mod__sublist___5VV4O.navbar-mod__sublist-no-children___5Bwqb {\n border: 0;\n}\n\n.body__menu-open .navbar-mod__title-copy___SdRqf {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n text-decoration: none;\n transition: all 0.15s ease;\n}\n\n.body__menu-open .navbar-mod__title-copy___SdRqf:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-hovered);\n}\n\n.body__menu-open .navbar-mod__expander___1CChn {\n min-height: 50px;\n justify-content: flex-end;\n padding: var(--spacing-m);\n}\n\n/* Second level menu */\n\n.navbar-mod__sublist___5VV4O {\n padding: 75px var(--spacing-l) var(--spacing-m);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n position: absolute;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar);\n top: 0;\n left: 64px;\n list-style: none;\n opacity: 0.01;\n display: none;\n}\n\n.navbar-mod__sublist__inactive___9A4qo {\n /* empty block */\n}\n\n.navbar-mod__sublist-item___d-8UM {\n padding: var(--spacing-s) 0 0;\n}\n\n.navbar-mod__sublist-item___d-8UM:first-of-type {\n padding: 0;\n}\n\n.navbar-mod__sublist-item___d-8UM:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-hovered);\n}\n\n.navbar-mod__text___a585r {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n}\n\n.navbar-mod__text-link___pVuV6 {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n text-decoration: none;\n transition: all 0.15s ease;\n}\n\n.navbar-mod__text-link___pVuV6:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-hovered);\n}\n\n/* Item active */\n\n.navbar-mod__item__active___S-P3x,\n.navbar-mod__item_menu__active___c95PT {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background: var(--background-color-for-navbar-when-active);\n}\n\n.navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY {\n justify-content: flex-start;\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__icon-container___-yU8W {\n width: calc(24px + 4px * 2);\n display: flex;\n justify-content: center;\n align-self: flex-start;\n}\n\n.navbar-mod__fixed-menu___0HE2b .navbar-mod__list-item___PtOVL .navbar-mod__item-icon-text___ZlMLY {\n justify-content: flex-start;\n display: flex;\n width: 100%;\n}\n\n.navbar-mod__fixed-menu___0HE2b .navbar-mod__list-item___PtOVL .navbar-mod__icon-container___-yU8W {\n /* empty block */\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY {\n position: relative;\n width: auto;\n}\n\n.navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY .navbar-mod__title___uOjhW {\n margin-left: 40px;\n}\n\n.navbar-mod__item_menu-collapsed___SNDmx.navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY .navbar-mod__title___uOjhW {\n max-height: 44px;\n overflow: hidden;\n /* stylelint-disable-next-line value-no-vendor-prefix */\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n position: absolute;\n /* `left` and `width` required for displaying focus indicator properly */\n left: 46px;\n width: 166px;\n z-index: 1;\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY .navbar-mod__title___uOjhW {\n margin-left: var(--spacing-m);\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY {\n margin-left: 0;\n}\n\n.navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__sublist___5VV4O {\n width: 205px;\n min-height: 100%;\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__sublist___5VV4O {\n width: calc(100% - calc(\n 24px + var(--spacing-m) + 4px + 4px\n ));\n}\n\n.navbar-mod__sublist-expanded__active___Fett-,\n.navbar-mod__sublist-collapsed__active___NPTQn {\n opacity: 1;\n display: unset;\n text-align: left;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar-when-active);\n}\n\n.navbar-mod__sublist-expanded__active___Fett- {\n display: block;\n}\n\n.navbar-mod__highlighted___WWk0R,\n.navbar-mod__highlighted___WWk0R .navbar-mod__title___uOjhW {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-active) !important;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-active);\n}\n\n.navbar-mod__hidden___kfXoC {\n display: none;\n}\n\n.navbar-mod__divider___A9rwl {\n border-top: 1px solid var(--color-neutral-40);\n}\n\n.navbar-mod__loading-dot-container___8P8Tl {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.navbar-mod__scrollable-menu___GUrXv {\n flex: 1 1 0;\n padding-bottom: 32px;\n /*\n FIXME: Make the navbar scrollable in collapsed state.\n NOTE: do not use `overflow-x: hidden; overflow-y: auto;` as this prevents submenus from showing up on hover\n */\n}\n\n.navbar-mod__fixed-menu___0HE2b {\n flex: 0 0 0;\n position: relative;\n}\n",
1473
- "jsonMap": {
1474
- "left-navigation": "navbar-mod__left-navigation___B11QL",
1475
- "list": "navbar-mod__list___xLBjv",
1476
- "scrollable-menu": "navbar-mod__scrollable-menu___GUrXv",
1477
- "list-item": "navbar-mod__list-item___PtOVL",
1478
- "item-link": "navbar-mod__item-link___3b3a7",
1479
- "item-icon-text": "navbar-mod__item-icon-text___ZlMLY",
1480
- "icon": "navbar-mod__icon___xOiRj",
1481
- "icon__active": "navbar-mod__icon__active___8IKeB",
1482
- "title": "navbar-mod__title___uOjhW",
1483
- "expander": "navbar-mod__expander___1CChn",
1484
- "expand-icon": "navbar-mod__expand-icon___biAt6",
1485
- "item--bottom": "navbar-mod__item--bottom___RE98P",
1486
- "item__active": "navbar-mod__item__active___S-P3x",
1487
- "item_menu-open": "navbar-mod__item_menu-open___4wsej",
1488
- "item_menu-collapsed": "navbar-mod__item_menu-collapsed___SNDmx",
1489
- "item__no-submenu": "navbar-mod__item__no-submenu___mua5w",
1490
- "sublist": "navbar-mod__sublist___5VV4O",
1491
- "sublist-no-children": "navbar-mod__sublist-no-children___5Bwqb",
1492
- "title-copy": "navbar-mod__title-copy___SdRqf",
1493
- "sublist__inactive": "navbar-mod__sublist__inactive___9A4qo",
1494
- "sublist-item": "navbar-mod__sublist-item___d-8UM",
1495
- "text": "navbar-mod__text___a585r",
1496
- "text-link": "navbar-mod__text-link___pVuV6",
1497
- "item_menu__active": "navbar-mod__item_menu__active___c95PT",
1498
- "icon-container": "navbar-mod__icon-container___-yU8W",
1499
- "fixed-menu": "navbar-mod__fixed-menu___0HE2b",
1500
- "sublist-expanded__active": "navbar-mod__sublist-expanded__active___Fett-",
1501
- "sublist-collapsed__active": "navbar-mod__sublist-collapsed__active___NPTQn",
1502
- "highlighted": "navbar-mod__highlighted___WWk0R",
1503
- "hidden": "navbar-mod__hidden___kfXoC",
1504
- "divider": "navbar-mod__divider___A9rwl",
1505
- "loading-dot-container": "navbar-mod__loading-dot-container___8P8Tl"
1506
- }
1507
- };
1508
- const styles$1 = compiledStyles$1.jsonMap;
1509
- const LoadingNavBar = () => {
1510
- var _context;
1511
- const ref = react.useRef(null);
1512
- useLoadingMenuLayoutEffect();
1513
- return jsxRuntime.jsx(NavBarLayout, {
1514
- ref: ref,
1515
- children: jsxRuntime.jsx(MenuGroup, {
1516
- id: "main",
1517
- level: 1,
1518
- children: jsxRuntime.jsx(jsxRuntime.Fragment, {
1519
- children: _mapInstanceProperty__default["default"](_context = _Array$from__default["default"](new Array(5))).call(_context, (_, index) => jsxRuntime.jsx(MenuItem, {
1520
- hasSubmenu: false,
1521
- isMenuOpen: false,
1522
- isActive: false,
1523
- onClick: () => undefined,
1524
- children: jsxRuntime.jsx("div", {
1525
- className: styles$1['loading-dot-container'],
1526
- "data-testid": "dot-container-".concat(index),
1527
- children: jsxRuntime.jsx(dist_commercetoolsFrontendApplicationShell.LoadingPlaceholder, {
1528
- shape: "dot",
1529
- size: "m"
1530
- })
1531
- })
1532
- }, index))
1533
- })
1534
- })
1535
- });
1536
- };
1537
- LoadingNavBar.displayName = 'LoadingNavBar';
1538
-
1539
- function ownKeys$1(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
1540
- function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var _context8, _context9; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context8 = ownKeys$1(Object(t), !0)).call(_context8, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context9 = ownKeys$1(Object(t))).call(_context9, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1541
- const compiledStyles = {
1542
- "global": ":root {\n\n /* Left navigation */\n\n /* Active list item with icon text */\n}\n\n/* Left Nav */\n\n.navbar-mod__left-navigation___B11QL {\n display: flex;\n flex-grow: 1;\n width: 64px;\n z-index: 19999;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background: var(--background-color-for-navbar);\n}\n\n.navbar-mod__list___xLBjv {\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n min-height: 0;\n flex: 1 1 0;\n}\n\n.body__menu-open .navbar-mod__scrollable-menu___GUrXv {\n flex: 1 1 0;\n overflow-x: hidden;\n overflow-y: auto;\n}\n\n.navbar-mod__list-item___PtOVL {\n width: 64px;\n min-height: 56px;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background: var(--background-color-for-navbar);\n margin: 0;\n list-style: none;\n cursor: pointer;\n}\n\n.navbar-mod__item-link___3b3a7 {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n padding: var(--spacing-m);\n width: 100%;\n position: relative;\n display: block;\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__item-icon-text___ZlMLY {\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__icon___xOiRj {\n width: 24px;\n height: 24px;\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__icon___xOiRj > svg *:not([fill='none']) {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n fill: var(--color-for-navbar-icon);\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__icon__active___8IKeB > svg *:not([fill='none']) {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n fill: var(--color-for-navbar-icon-when-active);\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__title___uOjhW {\n flex: 1;\n font-weight: 500;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n display: none;\n opacity: 0;\n transition: all 0.25s ease-in-out;\n text-align: left;\n text-decoration: none;\n z-index: 1;\n}\n\n.navbar-mod__expander___1CChn {\n border-top: 1px solid var(--color-neutral-40);\n height: 50px;\n display: flex;\n align-items: center;\n justify-content: center;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar);\n}\n\n.navbar-mod__expand-icon___biAt6 {\n align-items: center;\n border-radius: 32px;\n cursor: pointer;\n display: flex;\n height: 24px;\n justify-content: center;\n transform: translateX(0) rotateZ(0deg);\n width: 24px;\n}\n\n.navbar-mod__item--bottom___RE98P {\n position: absolute;\n bottom: 50px;\n}\n\n.navbar-mod__list-item___PtOVL:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar-when-hovered);\n}\n\n.navbar-mod__item__active___S-P3x .navbar-mod__title___uOjhW {\n opacity: 1;\n display: block;\n transition: all 0.2s ease;\n}\n\n.navbar-mod__item_menu-open___4wsej {\n height: auto !important;\n}\n\n/* NO SUBMENU */\n\n.navbar-mod__item_menu-collapsed___SNDmx .navbar-mod__item-link___3b3a7 {\n text-align: center;\n}\n\n.navbar-mod__item__no-submenu___mua5w .navbar-mod__title___uOjhW {\n border-bottom: 0;\n}\n\n.navbar-mod__item__no-submenu___mua5w .navbar-mod__sublist___5VV4O {\n padding-top: 40px;\n}\n\n/* left-nav open */\n\n.body__menu-open .navbar-mod__title___uOjhW {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n font-weight: 500;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n}\n\n.body__menu-open .navbar-mod__left-navigation___B11QL {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n box-shadow: var(--shadow-for-navbar);\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL {\n height: auto;\n min-height: 56px;\n transition: max-height 0.15s ease-out;\n overflow: hidden;\n}\n\n.body__menu-open .navbar-mod__left-navigation___B11QL,\n.body__menu-open .navbar-mod__list-item___PtOVL {\n width: 245px;\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL .navbar-mod__title___uOjhW {\n display: block;\n opacity: 1;\n margin-left: var(--spacing-m);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n}\n\n.navbar-mod__list-item___PtOVL:not(.navbar-mod__item__active___S-P3x):hover .navbar-mod__icon___xOiRj > svg *:not([fill='none']) {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n fill: var(--color-for-navbar-icon-when-active);\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__title___uOjhW:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n}\n\n.navbar-mod__list-item___PtOVL:not(.navbar-mod__item__active___S-P3x):hover .navbar-mod__title___uOjhW {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n}\n\n.body__menu-open .navbar-mod__expand-icon___biAt6 {\n transform: translateX(0) rotateZ(180deg);\n}\n\n.body__menu-open .navbar-mod__item__active___S-P3x {\n max-height: 500px;\n transition: max-height 0.25s ease-in;\n}\n\n.body__menu-open .navbar-mod__sublist___5VV4O {\n position: relative;\n z-index: 1;\n left: 0;\n margin: 0 0 0 calc(\n 24px + var(--spacing-m) + 4px + 4px\n );\n padding: var(--spacing-m) 0 0;\n background-color: transparent;\n}\n\n.body__menu-open .navbar-mod__sublist___5VV4O.navbar-mod__sublist-no-children___5Bwqb {\n border: 0;\n}\n\n.body__menu-open .navbar-mod__title-copy___SdRqf {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n text-decoration: none;\n transition: all 0.15s ease;\n}\n\n.body__menu-open .navbar-mod__title-copy___SdRqf:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-hovered);\n}\n\n.body__menu-open .navbar-mod__expander___1CChn {\n min-height: 50px;\n justify-content: flex-end;\n padding: var(--spacing-m);\n}\n\n/* Second level menu */\n\n.navbar-mod__sublist___5VV4O {\n padding: 75px var(--spacing-l) var(--spacing-m);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n position: absolute;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar);\n top: 0;\n left: 64px;\n list-style: none;\n opacity: 0.01;\n display: none;\n}\n\n.navbar-mod__sublist__inactive___9A4qo {\n /* empty block */\n}\n\n.navbar-mod__sublist-item___d-8UM {\n padding: var(--spacing-s) 0 0;\n}\n\n.navbar-mod__sublist-item___d-8UM:first-of-type {\n padding: 0;\n}\n\n.navbar-mod__sublist-item___d-8UM:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-hovered);\n}\n\n.navbar-mod__text___a585r {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-size: var(--font-size-for-navbar-link);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n line-height: var(--line-height-for-navbar-link);\n}\n\n.navbar-mod__text-link___pVuV6 {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link);\n text-decoration: none;\n transition: all 0.15s ease;\n}\n\n.navbar-mod__text-link___pVuV6:hover {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-hovered);\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-hovered);\n}\n\n/* Item active */\n\n.navbar-mod__item__active___S-P3x,\n.navbar-mod__item_menu__active___c95PT {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background: var(--background-color-for-navbar-when-active);\n}\n\n.navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY {\n justify-content: flex-start;\n}\n\n.navbar-mod__list-item___PtOVL .navbar-mod__icon-container___-yU8W {\n width: calc(24px + 4px * 2);\n display: flex;\n justify-content: center;\n align-self: flex-start;\n}\n\n.navbar-mod__fixed-menu___0HE2b .navbar-mod__list-item___PtOVL .navbar-mod__item-icon-text___ZlMLY {\n justify-content: flex-start;\n display: flex;\n width: 100%;\n}\n\n.navbar-mod__fixed-menu___0HE2b .navbar-mod__list-item___PtOVL .navbar-mod__icon-container___-yU8W {\n /* empty block */\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY {\n position: relative;\n width: auto;\n}\n\n.navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY .navbar-mod__title___uOjhW {\n margin-left: 40px;\n}\n\n.navbar-mod__item_menu-collapsed___SNDmx.navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY .navbar-mod__title___uOjhW {\n max-height: 44px;\n overflow: hidden;\n /* stylelint-disable-next-line value-no-vendor-prefix */\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n position: absolute;\n /* `left` and `width` required for displaying focus indicator properly */\n left: 46px;\n width: 166px;\n z-index: 1;\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY .navbar-mod__title___uOjhW {\n margin-left: var(--spacing-m);\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__item-icon-text___ZlMLY {\n margin-left: 0;\n}\n\n.navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__sublist___5VV4O {\n width: 205px;\n min-height: 100%;\n}\n\n.body__menu-open .navbar-mod__list-item___PtOVL.navbar-mod__item__active___S-P3x .navbar-mod__sublist___5VV4O {\n width: calc(100% - calc(\n 24px + var(--spacing-m) + 4px + 4px\n ));\n}\n\n.navbar-mod__sublist-expanded__active___Fett-,\n.navbar-mod__sublist-collapsed__active___NPTQn {\n opacity: 1;\n display: unset;\n text-align: left;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n background-color: var(--background-color-for-navbar-when-active);\n}\n\n.navbar-mod__sublist-expanded__active___Fett- {\n display: block;\n}\n\n.navbar-mod__highlighted___WWk0R,\n.navbar-mod__highlighted___WWk0R .navbar-mod__title___uOjhW {\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n color: var(--color-for-navbar-link-when-active) !important;\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties */\n font-weight: var(--font-weight-for-navbar-link-when-active);\n}\n\n.navbar-mod__hidden___kfXoC {\n display: none;\n}\n\n.navbar-mod__divider___A9rwl {\n border-top: 1px solid var(--color-neutral-40);\n}\n\n.navbar-mod__loading-dot-container___8P8Tl {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.navbar-mod__scrollable-menu___GUrXv {\n flex: 1 1 0;\n padding-bottom: 32px;\n /*\n FIXME: Make the navbar scrollable in collapsed state.\n NOTE: do not use `overflow-x: hidden; overflow-y: auto;` as this prevents submenus from showing up on hover\n */\n}\n\n.navbar-mod__fixed-menu___0HE2b {\n flex: 0 0 0;\n position: relative;\n}\n",
1543
- "jsonMap": {
1544
- "left-navigation": "navbar-mod__left-navigation___B11QL",
1545
- "list": "navbar-mod__list___xLBjv",
1546
- "scrollable-menu": "navbar-mod__scrollable-menu___GUrXv",
1547
- "list-item": "navbar-mod__list-item___PtOVL",
1548
- "item-link": "navbar-mod__item-link___3b3a7",
1549
- "item-icon-text": "navbar-mod__item-icon-text___ZlMLY",
1550
- "icon": "navbar-mod__icon___xOiRj",
1551
- "icon__active": "navbar-mod__icon__active___8IKeB",
1552
- "title": "navbar-mod__title___uOjhW",
1553
- "expander": "navbar-mod__expander___1CChn",
1554
- "expand-icon": "navbar-mod__expand-icon___biAt6",
1555
- "item--bottom": "navbar-mod__item--bottom___RE98P",
1556
- "item__active": "navbar-mod__item__active___S-P3x",
1557
- "item_menu-open": "navbar-mod__item_menu-open___4wsej",
1558
- "item_menu-collapsed": "navbar-mod__item_menu-collapsed___SNDmx",
1559
- "item__no-submenu": "navbar-mod__item__no-submenu___mua5w",
1560
- "sublist": "navbar-mod__sublist___5VV4O",
1561
- "sublist-no-children": "navbar-mod__sublist-no-children___5Bwqb",
1562
- "title-copy": "navbar-mod__title-copy___SdRqf",
1563
- "sublist__inactive": "navbar-mod__sublist__inactive___9A4qo",
1564
- "sublist-item": "navbar-mod__sublist-item___d-8UM",
1565
- "text": "navbar-mod__text___a585r",
1566
- "text-link": "navbar-mod__text-link___pVuV6",
1567
- "item_menu__active": "navbar-mod__item_menu__active___c95PT",
1568
- "icon-container": "navbar-mod__icon-container___-yU8W",
1569
- "fixed-menu": "navbar-mod__fixed-menu___0HE2b",
1570
- "sublist-expanded__active": "navbar-mod__sublist-expanded__active___Fett-",
1571
- "sublist-collapsed__active": "navbar-mod__sublist-collapsed__active___NPTQn",
1572
- "highlighted": "navbar-mod__highlighted___WWk0R",
1573
- "hidden": "navbar-mod__hidden___kfXoC",
1574
- "divider": "navbar-mod__divider___A9rwl",
1575
- "loading-dot-container": "navbar-mod__loading-dot-container___8P8Tl"
1576
- }
1577
- };
1578
- const styles = compiledStyles.jsonMap;
1579
- const getMenuVisibilitiesOfSubmenus = menu => {
1580
- var _context, _context2;
1581
- return _filterInstanceProperty__default["default"](_context = _mapInstanceProperty__default["default"](_context2 = menu.submenu).call(_context2, submenu => submenu.menuVisibility)).call(_context, nonNullable);
1582
- };
1583
- const getMenuVisibilityOfMainmenu = menu => menu.menuVisibility ? [menu.menuVisibility] : [];
1584
- const ApplicationMenu = props => {
1585
- var _context3, _props$menu$featureTo, _props$menu$actionRig, _props$menu$dataFence, _context4, _context5;
1586
- const isMainMenuRouteActive = Boolean(reactRouterDom.matchPath(props.location.pathname, {
1587
- path: _concatInstanceProperty__default["default"](_context3 = "/".concat(props.projectKey, "/")).call(_context3, props.menu.uriPath),
1588
- exact: false,
1589
- strict: false
1590
- }));
1591
- const hasSubmenu = _Array$isArray__default["default"](props.menu.submenu) && props.menu.submenu.length > 0;
1592
- react.useEffect(() => {
1593
- // On first render, check which menu is active for the current application and expand
1594
- // the submenu automatically unless the all navbar is collapsed or there are no submenu links.
1595
- if (props.isMenuOpen && isMainMenuRouteActive && hasSubmenu) {
1596
- props.handleToggleItem();
1597
- }
1598
- // eslint-disable-next-line react-hooks/exhaustive-deps
1599
- }, [props.isMenuOpen]); // <-- (re)run this only when the all menu expands
1600
-
1601
- const namesOfMenuVisibilitiesOfAllSubmenus = hasSubmenu ? getMenuVisibilitiesOfSubmenus(props.menu) : getMenuVisibilityOfMainmenu(props.menu);
1602
- const isMainMenuItemALink =
1603
- // 1. When the navbar is collapsed
1604
- !props.isMenuOpen ||
1605
- // 2. When there is no submenu
1606
- !hasSubmenu ||
1607
- // 3. When the submenu group is active/visible
1608
- props.isActive;
1609
- return jsxRuntime.jsx(RestrictedMenuItem, {
1610
- keyOfMenuItem: props.menu.key,
1611
- featureToggle: (_props$menu$featureTo = props.menu.featureToggle) !== null && _props$menu$featureTo !== void 0 ? _props$menu$featureTo : undefined,
1612
- permissions: props.menu.permissions,
1613
- actionRights: (_props$menu$actionRig = props.menu.actionRights) !== null && _props$menu$actionRig !== void 0 ? _props$menu$actionRig : undefined,
1614
- dataFences: (_props$menu$dataFence = props.menu.dataFences) !== null && _props$menu$dataFence !== void 0 ? _props$menu$dataFence : undefined,
1615
- projectPermissions: props.projectPermissions,
1616
- menuVisibilities: props.menuVisibilities,
1617
- namesOfMenuVisibilities: namesOfMenuVisibilitiesOfAllSubmenus,
1618
- children: jsxRuntime.jsxs(MenuItem, {
1619
- hasSubmenu: hasSubmenu,
1620
- isActive: props.isActive,
1621
- isMainMenuRouteActive: isMainMenuRouteActive,
1622
- isMenuOpen: props.isMenuOpen,
1623
- onClick: props.handleToggleItem,
1624
- onMouseEnter: props.isMenuOpen ? undefined : props.handleToggleItem,
1625
- onMouseLeave: props.isMenuOpen ? undefined : props.shouldCloseMenuFly,
1626
- children: [jsxRuntime.jsx(MenuItemLink, {
1627
- linkTo: isMainMenuItemALink ? _concatInstanceProperty__default["default"](_context4 = "/".concat(props.projectKey, "/")).call(_context4, props.menu.uriPath) : undefined,
1628
- useFullRedirectsForLinks: props.useFullRedirectsForLinks,
1629
- onClick: props.onMenuItemClick,
1630
- children: jsxRuntime.jsxs("div", {
1631
- className: styles['item-icon-text'],
1632
- children: [jsxRuntime.jsx("div", {
1633
- className: styles['icon-container'],
1634
- children: jsxRuntime.jsx("div", {
1635
- className: classnames__default["default"](styles.icon, {
1636
- [styles.icon__active]: props.isActive || isMainMenuRouteActive
1637
- }),
1638
- children: jsxRuntime.jsx(IconSwitcher, {
1639
- icon: props.menu.icon,
1640
- size: "scale"
1641
- })
1642
- })
1643
- }), jsxRuntime.jsx("div", {
1644
- className: styles.title,
1645
- "aria-owns": "group-".concat(props.menu.key),
1646
- children: jsxRuntime.jsx(MenuLabel, {
1647
- labelAllLocales: props.menu.labelAllLocales,
1648
- defaultLabel: props.menu.defaultLabel,
1649
- applicationLocale: props.applicationLocale
1650
- })
1651
- })]
1652
- })
1653
- }), jsxRuntime.jsx(MenuGroup, {
1654
- id: props.menu.key,
1655
- level: 2,
1656
- isActive: props.isActive,
1657
- isExpanded: props.isMenuOpen,
1658
- hasSubmenu: hasSubmenu,
1659
- children: hasSubmenu ? _mapInstanceProperty__default["default"](_context5 = props.menu.submenu).call(_context5, submenu => {
1660
- var _context6, _submenu$featureToggl, _submenu$actionRights, _submenu$dataFences, _context7;
1661
- return jsxRuntime.jsx(RestrictedMenuItem, {
1662
- keyOfMenuItem: submenu.key,
1663
- featureToggle: (_submenu$featureToggl = submenu.featureToggle) !== null && _submenu$featureToggl !== void 0 ? _submenu$featureToggl : undefined,
1664
- permissions: submenu.permissions,
1665
- actionRights: (_submenu$actionRights = submenu.actionRights) !== null && _submenu$actionRights !== void 0 ? _submenu$actionRights : undefined,
1666
- dataFences: (_submenu$dataFences = submenu.dataFences) !== null && _submenu$dataFences !== void 0 ? _submenu$dataFences : undefined,
1667
- projectPermissions: props.projectPermissions,
1668
- menuVisibilities: props.menuVisibilities,
1669
- namesOfMenuVisibilities: submenu.menuVisibility ? [submenu.menuVisibility] : undefined,
1670
- children: jsxRuntime.jsx("li", {
1671
- className: styles['sublist-item'],
1672
- children: jsxRuntime.jsx("div", {
1673
- className: styles.text,
1674
- children: jsxRuntime.jsx(MenuItemLink, {
1675
- linkTo: _concatInstanceProperty__default["default"](_context7 = "/".concat(props.projectKey, "/")).call(_context7, submenu.uriPath)
1676
- // We want to use an exact matching strategy to avoid multiple
1677
- // links matching sub-routes.
1678
- ,
1679
- exactMatch: true,
1680
- useFullRedirectsForLinks: props.useFullRedirectsForLinks,
1681
- onClick: props.onMenuItemClick,
1682
- children: jsxRuntime.jsx(MenuLabel, {
1683
- labelAllLocales: submenu.labelAllLocales,
1684
- defaultLabel: submenu.defaultLabel,
1685
- applicationLocale: props.applicationLocale
1686
- })
1687
- })
1688
- })
1689
- })
1690
- }, _concatInstanceProperty__default["default"](_context6 = "".concat(props.menu.key, "-submenu-")).call(_context6, submenu.key));
1691
- }) : null
1692
- })]
1693
- })
1694
- }, props.menu.key);
1695
- };
1696
- ApplicationMenu.propTypes = {};
1697
- ApplicationMenu.displayName = 'ApplicationMenu';
1698
- const NavBar$1 = props => {
1699
- const _useNavbarStateManage = useNavbarStateManager({
1700
- environment: props.environment
1701
- }),
1702
- navBarNode = _useNavbarStateManage.navBarNode,
1703
- isMenuOpen = _useNavbarStateManage.isMenuOpen,
1704
- isExpanderVisible = _useNavbarStateManage.isExpanderVisible,
1705
- activeItemIndex = _useNavbarStateManage.activeItemIndex,
1706
- handleToggleItem = _useNavbarStateManage.handleToggleItem,
1707
- handleToggleMenu = _useNavbarStateManage.handleToggleMenu,
1708
- shouldCloseMenuFly = _useNavbarStateManage.shouldCloseMenuFly,
1709
- allInternalApplicationsNavbarMenu = _useNavbarStateManage.allInternalApplicationsNavbarMenu,
1710
- allCustomApplicationsNavbarMenu = _useNavbarStateManage.allCustomApplicationsNavbarMenu;
1711
- const useFullRedirectsForLinks = Boolean(props.environment.useFullRedirectsForLinks);
1712
- const location = reactRouterDom.useLocation();
1713
- const projectPermissions = react.useMemo(() => {
1714
- var _props$project, _props$project2, _props$project3;
1715
- return {
1716
- permissions: applicationShellConnectors.normalizeAllAppliedPermissions((_props$project = props.project) === null || _props$project === void 0 ? void 0 : _props$project.allPermissionsForAllApplications.allAppliedPermissions),
1717
- actionRights: applicationShellConnectors.normalizeAllAppliedActionRights((_props$project2 = props.project) === null || _props$project2 === void 0 ? void 0 : _props$project2.allPermissionsForAllApplications.allAppliedActionRights),
1718
- dataFences: applicationShellConnectors.normalizeAllAppliedDataFences((_props$project3 = props.project) === null || _props$project3 === void 0 ? void 0 : _props$project3.allPermissionsForAllApplications.allAppliedDataFences)
1719
- };
1720
- }, [props.project]);
1721
- const menuVisibilities = react.useMemo(() => {
1722
- var _props$project4;
1723
- return applicationShellConnectors.normalizeAllAppliedMenuVisibilities((_props$project4 = props.project) === null || _props$project4 === void 0 ? void 0 : _props$project4.allPermissionsForAllApplications.allAppliedMenuVisibilities);
1724
- }, [props.project]);
1725
- const applicationLocale = props.applicationLocale;
1726
-
1727
- // Render the loading navbar as long as all the data
1728
- // hasn't been loaded, or if the project does not exist.
1729
- if (props.isLoading || typeof applicationLocale === 'undefined') {
1730
- // Do not render anything until we have the feature flag remote value fetched so
1731
- // we avoid a flick effect in case it is 'true' (different value from the default one)
1732
- if (!props.isNewNavigationEnabledEvaluationReady) {
1733
- return null;
1734
- }
1735
- return jsxRuntime.jsx(LoadingNavBar, {});
1736
- }
1737
- return jsxRuntime.jsx(NavBarLayout, {
1738
- ref: navBarNode,
1739
- children: jsxRuntime.jsxs(MenuGroup, {
1740
- id: "main",
1741
- level: 1,
1742
- children: [jsxRuntime.jsxs("div", {
1743
- className: styles['scrollable-menu'],
1744
- children: [_mapInstanceProperty__default["default"](allInternalApplicationsNavbarMenu).call(allInternalApplicationsNavbarMenu, menu => {
1745
- const menuType = 'scrollable';
1746
- const itemIndex = "".concat(menuType, "-").concat(menu.key);
1747
- return jsxRuntime.jsx(ApplicationMenu, {
1748
- location: location,
1749
- menu: menu,
1750
- isActive: activeItemIndex === itemIndex,
1751
- handleToggleItem: () => handleToggleItem(itemIndex),
1752
- isMenuOpen: isMenuOpen,
1753
- shouldCloseMenuFly: shouldCloseMenuFly,
1754
- projectPermissions: projectPermissions,
1755
- menuVisibilities: menuVisibilities,
1756
- applicationLocale: applicationLocale,
1757
- projectKey: props.projectKey,
1758
- useFullRedirectsForLinks: useFullRedirectsForLinks,
1759
- onMenuItemClick: props.onMenuItemClick
1760
- }, menu.key);
1761
- }), jsxRuntime.jsx(MenuItemDivider, {}), _mapInstanceProperty__default["default"](allCustomApplicationsNavbarMenu).call(allCustomApplicationsNavbarMenu, menu => {
1762
- const menuType = 'scrollable';
1763
- const itemIndex = "".concat(menuType, "-").concat(menu.key);
1764
- return jsxRuntime.jsx(ApplicationMenu, {
1765
- location: location,
1766
- menu: menu,
1767
- isActive: activeItemIndex === itemIndex,
1768
- handleToggleItem: () => handleToggleItem(itemIndex),
1769
- isMenuOpen: isMenuOpen,
1770
- shouldCloseMenuFly: shouldCloseMenuFly,
1771
- projectPermissions: projectPermissions,
1772
- menuVisibilities: menuVisibilities,
1773
- applicationLocale: applicationLocale,
1774
- projectKey: props.projectKey,
1775
- useFullRedirectsForLinks: useFullRedirectsForLinks,
1776
- onMenuItemClick: props.onMenuItemClick
1777
- }, menu.key);
1778
- })]
1779
- }), jsxRuntime.jsxs("div", {
1780
- className: styles['fixed-menu'],
1781
- children: [jsxRuntime.jsx(Faded, {}), jsxRuntime.jsx(MenuItem, {
1782
- hasSubmenu: false,
1783
- isActive: false,
1784
- isMenuOpen: isMenuOpen,
1785
- onClick: () => {
1786
- handleToggleItem('fixed-support');
1787
- },
1788
- onMouseEnter: isMenuOpen ? undefined : () => handleToggleItem('fixed-support'),
1789
- onMouseLeave: isMenuOpen ? undefined : shouldCloseMenuFly,
1790
- children: jsxRuntime.jsx("a", {
1791
- href: constants.SUPPORT_PORTAL_URL,
1792
- rel: "noopener noreferrer",
1793
- target: "_blank",
1794
- children: jsxRuntime.jsxs("div", {
1795
- className: styles['item-icon-text'],
1796
- children: [jsxRuntime.jsx("div", {
1797
- className: styles['icon-container'],
1798
- children: jsxRuntime.jsx("div", {
1799
- className: classnames__default["default"](styles.icon, {
1800
- [styles.icon__active]: activeItemIndex === 'fixed-support'
1801
- }),
1802
- children: jsxRuntime.jsx(icons.SupportIcon, {
1803
- size: "scale"
1804
- })
1805
- })
1806
- }), jsxRuntime.jsx("div", {
1807
- className: styles.title,
1808
- children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread$1({}, messages['NavBar.MCSupport.title']))
1809
- })]
1810
- })
1811
- })
1812
- }), jsxRuntime.jsx(MenuExpander, {
1813
- isVisible: isExpanderVisible,
1814
- onClick: handleToggleMenu,
1815
- isMenuOpen: isMenuOpen
1816
- })]
1817
- })]
1818
- })
1819
- });
1820
- };
1821
- NavBar$1.propTypes = {};
1822
- NavBar$1.displayName = 'NavBar';
1823
-
1824
- function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
1825
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
1826
- const NavBar = props => {
1827
- if (!props.isNewNavigationEnabled) {
1828
- return jsxRuntime.jsx(NavBar$1, _objectSpread({}, props));
1829
- }
1830
- return jsxRuntime.jsx(NavBar$2, _objectSpread({}, props));
1831
- };
1832
- NavBar.displayName = 'NavBar';
1833
-
1834
- exports["default"] = NavBar;