@stenajs-webui/panels 17.4.1 → 17.7.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 (57) hide show
  1. package/CHANGELOG.md +38 -0
  2. package/dist/components/action-menu-button/ActionMenuButton.d.ts +19 -19
  3. package/dist/components/action-menu-button/ActionMenuFlatButton.d.ts +5 -5
  4. package/dist/components/action-menu-button/ActionMenuPrimaryButton.d.ts +6 -6
  5. package/dist/components/action-menu-button/ActionMenuSecondaryButton.d.ts +5 -5
  6. package/dist/components/checkbox-menu/CheckboxMenu.d.ts +7 -7
  7. package/dist/components/collapsible/Collapsible.d.ts +18 -18
  8. package/dist/components/collapsible/CollapsibleClickableContent.d.ts +6 -6
  9. package/dist/components/collapsible/CollapsibleContent.d.ts +7 -7
  10. package/dist/components/collapsible/CollapsibleEmptyContent.d.ts +5 -5
  11. package/dist/components/collapsible/CollapsibleGroupHeading.d.ts +6 -6
  12. package/dist/components/collapsible/CollapsibleWithCheckbox.d.ts +6 -6
  13. package/dist/components/error-panel/ErrorPanel.d.ts +5 -5
  14. package/dist/components/error-panel/ErrorScreen.d.ts +3 -3
  15. package/dist/components/loading-panel/LoadingPanel.d.ts +5 -5
  16. package/dist/components/loading-panel/LoadingScreen.d.ts +3 -3
  17. package/dist/components/nav-bar/NavBar.d.ts +16 -16
  18. package/dist/components/nav-bar/NavBarButton.d.ts +6 -6
  19. package/dist/components/nav-bar/NavBarHeading.d.ts +6 -6
  20. package/dist/components/nav-bar/NavBarNotificationButton.d.ts +9 -9
  21. package/dist/components/nav-bar/NavBarPopoverButton.d.ts +12 -12
  22. package/dist/components/nav-bar/NavBarSearchField.d.ts +6 -6
  23. package/dist/components/nav-bar/NavBarSideMenuButton.d.ts +6 -6
  24. package/dist/components/nav-bar/NavBarUserButton.d.ts +9 -9
  25. package/dist/components/nav-bar/NavbarHeightStyleUtil.d.ts +2 -2
  26. package/dist/components/notifications/Notification.d.ts +16 -16
  27. package/dist/components/notifications/NotificationTheme.d.ts +7 -7
  28. package/dist/components/page-header/PageHeader.d.ts +9 -9
  29. package/dist/components/page-header/PageHeaderRow.d.ts +5 -5
  30. package/dist/components/page-header/PageHeading.d.ts +11 -11
  31. package/dist/components/selected-items-actions-panel/SelectedItemsActionsPanel.d.ts +10 -10
  32. package/dist/components/sidebar-menu/SidebarMenu.d.ts +12 -12
  33. package/dist/components/sidebar-menu/SidebarMenuCloseButton.d.ts +5 -5
  34. package/dist/components/sidebar-menu/SidebarMenuCollapsible.d.ts +10 -10
  35. package/dist/components/sidebar-menu/SidebarMenuHeading.d.ts +7 -7
  36. package/dist/components/sidebar-menu/SidebarMenuLink.d.ts +16 -16
  37. package/dist/components/sidebar-menu/SidebarMenuSeparator.d.ts +5 -5
  38. package/dist/components/sidebar-menu/rail/SidebarRailMenu.d.ts +10 -10
  39. package/dist/components/sidebar-menu/rail/renderer/RailRenderer.d.ts +8 -8
  40. package/dist/components/sidebar-menu/rail/renderer/types.d.ts +19 -19
  41. package/dist/index.d.ts +35 -35
  42. package/dist/index.es.js +1098 -587
  43. package/dist/index.es.js.map +1 -1
  44. package/dist/index.js +1 -656
  45. package/dist/index.js.map +1 -1
  46. package/package.json +10 -11
  47. package/dist/components/action-menu-button/ActionMenuButton.stories.d.ts +0 -15
  48. package/dist/components/checkbox-menu/CheckboxMenu.stories.d.ts +0 -7
  49. package/dist/components/collapsible/Collapsible.stories.d.ts +0 -21
  50. package/dist/components/error-panel/ErrorPanel.stories.d.ts +0 -8
  51. package/dist/components/error-panel/ErrorScreen.stories.d.ts +0 -8
  52. package/dist/components/loading-panel/LoadingPanel.stories.d.ts +0 -8
  53. package/dist/components/loading-panel/LoadingScreen.stories.d.ts +0 -8
  54. package/dist/components/nav-bar/NavBar.stories.d.ts +0 -27
  55. package/dist/components/notifications/Notification.stories.d.ts +0 -7
  56. package/dist/components/page-header/PageHeader.stories.d.ts +0 -15
  57. package/dist/components/sidebar-menu/SidebarMenu.stories.d.ts +0 -14
package/dist/index.js CHANGED
@@ -1,657 +1,2 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var React = require('react');
6
- var elements = require('@stenajs-webui/elements');
7
- var core = require('@stenajs-webui/core');
8
- var tooltip = require('@stenajs-webui/tooltip');
9
- var freeSolidSvgIcons = require('@fortawesome/free-solid-svg-icons');
10
- var faAngleDown = require('@fortawesome/free-solid-svg-icons/faAngleDown');
11
- var forms = require('@stenajs-webui/forms');
12
- var cx = require('classnames');
13
- var faBell = require('@fortawesome/free-solid-svg-icons/faBell');
14
- var faUser = require('@fortawesome/free-solid-svg-icons/faUser');
15
- var theme = require('@stenajs-webui/theme');
16
- var dateFns = require('date-fns');
17
- var faChevronUp = require('@fortawesome/free-solid-svg-icons/faChevronUp');
18
- var reactTransitionGroup = require('react-transition-group');
19
- var faInbox = require('@fortawesome/free-solid-svg-icons/faInbox');
20
-
21
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
22
-
23
- function _interopNamespace(e) {
24
- if (e && e.__esModule) return e;
25
- var n = Object.create(null);
26
- if (e) {
27
- Object.keys(e).forEach(function (k) {
28
- if (k !== 'default') {
29
- var d = Object.getOwnPropertyDescriptor(e, k);
30
- Object.defineProperty(n, k, d.get ? d : {
31
- enumerable: true,
32
- get: function () { return e[k]; }
33
- });
34
- }
35
- });
36
- }
37
- n["default"] = e;
38
- return Object.freeze(n);
39
- }
40
-
41
- var React__namespace = /*#__PURE__*/_interopNamespace(React);
42
- var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
43
-
44
- /*! *****************************************************************************
45
- Copyright (c) Microsoft Corporation.
46
-
47
- Permission to use, copy, modify, and/or distribute this software for any
48
- purpose with or without fee is hereby granted.
49
-
50
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
51
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
52
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
53
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
54
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
55
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
56
- PERFORMANCE OF THIS SOFTWARE.
57
- ***************************************************************************** */
58
-
59
- var __assign = function() {
60
- __assign = Object.assign || function __assign(t) {
61
- for (var s, i = 1, n = arguments.length; i < n; i++) {
62
- s = arguments[i];
63
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
64
- }
65
- return t;
66
- };
67
- return __assign.apply(this, arguments);
68
- };
69
-
70
- function __rest(s, e) {
71
- var t = {};
72
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
73
- t[p] = s[p];
74
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
75
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
76
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
77
- t[p[i]] = s[p[i]];
78
- }
79
- return t;
80
- }
81
-
82
- var ActionMenuButton = function (_a) {
83
- var renderItems = _a.renderItems, _b = _a.placement, placement = _b === void 0 ? "bottom" : _b, Button = _a.buttonComponent, _c = _a.rightIcon, rightIcon = _c === void 0 ? freeSolidSvgIcons.faAngleDown : _c, _d = _a.portalTarget, portalTarget = _d === void 0 ? "parent" : _d, zIndex = _a.zIndex, menuWidth = _a.menuWidth, menuTop = _a.menuTop, onClick = _a.onClick, _e = _a.disableArrow, disableArrow = _e === void 0 ? false : _e, buttonProps = __rest(_a, ["renderItems", "placement", "buttonComponent", "rightIcon", "portalTarget", "zIndex", "menuWidth", "menuTop", "onClick", "disableArrow"]);
84
- var _f = core.useBoolean(false), isOpen = _f[0], open = _f[1], close = _f[2], toggle = _f[3];
85
- var buttonRef = React.useRef(null);
86
- var focusManager = {
87
- name: "focusManager",
88
- defaultValue: true,
89
- fn: function (_a) {
90
- var popper = _a.popper;
91
- var restoreFocus = false;
92
- var closeOnEscape = function (event) {
93
- if (event.key === "Escape") {
94
- restoreFocus = true;
95
- close();
96
- }
97
- if (event.key === "Enter" || event.key === " ") {
98
- restoreFocus = true;
99
- }
100
- };
101
- return {
102
- onCreate: function () {
103
- popper.addEventListener("keydown", closeOnEscape);
104
- },
105
- onDestroy: function () {
106
- popper.removeEventListener("keydown", closeOnEscape);
107
- },
108
- onMount: function () {
109
- var _a;
110
- restoreFocus = false;
111
- (_a = popper
112
- .querySelector("button:not([disabled]), a[href]")) === null || _a === void 0 ? void 0 : _a.focus();
113
- },
114
- onHide: function () {
115
- if (buttonRef.current && restoreFocus) {
116
- buttonRef.current.focus();
117
- }
118
- },
119
- };
120
- },
121
- };
122
- var contextValue = React.useMemo(function () { return ({ open: open, close: close }); }, [open, close]);
123
- var handleClick = function (event) {
124
- onClick === null || onClick === void 0 ? void 0 : onClick(event);
125
- toggle();
126
- };
127
- return (React__namespace.createElement(tooltip.Popover, { disablePadding: true, visible: isOpen, onClickOutside: close, placement: placement, content: isOpen && (React__namespace.createElement(elements.ActionMenu, { variant: "outlined", width: menuWidth, top: menuTop, trapFocus: true },
128
- React__namespace.createElement(elements.ActionMenuContext.Provider, { value: contextValue }, renderItems(close)))), arrow: false, appendTo: portalTarget, zIndex: zIndex, plugins: [focusManager], lazy: true },
129
- React__namespace.createElement(Button, __assign({ rightIcon: disableArrow ? undefined : rightIcon }, buttonProps, { ref: buttonRef, onClick: handleClick }))));
130
- };
131
-
132
- var ActionMenuPrimaryButton = function (props) {
133
- return React__namespace.createElement(ActionMenuButton, __assign({ buttonComponent: elements.PrimaryButton }, props));
134
- };
135
-
136
- var ActionMenuSecondaryButton = function (props) {
137
- return React__namespace.createElement(ActionMenuButton, __assign({ buttonComponent: elements.SecondaryButton }, props));
138
- };
139
-
140
- var ActionMenuFlatButton = function (props) {
141
- return React__namespace.createElement(ActionMenuButton, __assign({ buttonComponent: elements.FlatButton }, props));
142
- };
143
-
144
- var border = "1px solid var(--lhds-color-ui-300)";
145
- var CheckboxMenu = function (_a) {
146
- var renderMenu = _a.renderMenu, checkboxProps = __rest(_a, ["renderMenu"]);
147
- var _b = core.useBoolean(false), isOpen = _b[0], open = _b[1], close = _b[2];
148
- return (React__namespace.createElement(tooltip.Popover, { onClickOutside: close, arrow: false, visible: isOpen, disablePadding: true, content: renderMenu ? (React__namespace.createElement(core.Column, null,
149
- React__namespace.createElement(elements.ActionMenu, null, renderMenu(close)))) : undefined, placement: "bottom-start", variant: "outlined" },
150
- React__namespace.createElement(core.Box, { display: "inline-block" },
151
- React__namespace.createElement(core.Row, { spacing: 0.5, indent: true, alignItems: "center", border: border, borderRadius: "4px" },
152
- React__namespace.createElement(forms.Checkbox, __assign({}, checkboxProps)),
153
- React__namespace.createElement(core.Indent, { num: 0.5 }),
154
- React__namespace.createElement(elements.FlatButton, { size: "small", onClick: open, leftIcon: faAngleDown.faAngleDown })))));
155
- };
156
-
157
- function styleInject(css, ref) {
158
- if ( ref === void 0 ) ref = {};
159
- var insertAt = ref.insertAt;
160
-
161
- if (!css || typeof document === 'undefined') { return; }
162
-
163
- var head = document.head || document.getElementsByTagName('head')[0];
164
- var style = document.createElement('style');
165
- style.type = 'text/css';
166
-
167
- if (insertAt === 'top') {
168
- if (head.firstChild) {
169
- head.insertBefore(style, head.firstChild);
170
- } else {
171
- head.appendChild(style);
172
- }
173
- } else {
174
- head.appendChild(style);
175
- }
176
-
177
- if (style.styleSheet) {
178
- style.styleSheet.cssText = css;
179
- } else {
180
- style.appendChild(document.createTextNode(css));
181
- }
182
- }
183
-
184
- var css_248z$b = ".NavBar-module_navBar__HOrS3 {\n /* Theme vars */\n --swui-navbar-background-color: var(--lhds-color-blue-500);\n --swui-navbar-item-background-color-hover: var(--lhds-color-blue-700);\n --swui-navbar-item-background-color-selected: var(--lhds-color-blue-600);\n --swui-navbar-item-background-color-selected-hover: var(\n --lhds-color-blue-700\n );\n\n /* Styling */\n background-color: var(--swui-navbar-background-color);\n}\n";
185
- var styles$a = {"navBar":"NavBar-module_navBar__HOrS3"};
186
- styleInject(css_248z$b);
187
-
188
- var css_248z$a = ".NavBarSideMenuButton-module_sidebarMenuButton__SlbsU {\n /* Theme vars */\n --swui-nav-bar-side-menu-button-text-color: var(--lhds-color-ui-50);\n --swui-nav-bar-side-menu-button-background-color: var(--lhds-color-blue-500);\n --swui-nav-bar-side-menu-button-background-color-hover: var(\n --lhds-color-blue-600\n );\n --swui-nav-bar-side-menu-button-background-color-focus: var(\n --lhds-color-blue-600\n );\n --swui-nav-bar-side-menu-button-background-color-active: var(\n --lhds-color-blue-700\n );\n\n /* State vars */\n --current-background-color: var(\n --swui-nav-bar-side-menu-button-background-color\n );\n\n /* Styling */\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 10px;\n background-color: var(--current-background-color);\n color: var(--swui-nav-bar-side-menu-button-text-color);\n cursor: pointer;\n height: var(--swui-nav-bar-height);\n width: var(--swui-nav-bar-height);\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n border-radius: 0;\n outline: none;\n border: none;\n}\n\n .NavBarSideMenuButton-module_sidebarMenuButton__SlbsU:hover {\n --current-background-color: var(\n --swui-nav-bar-side-menu-button-background-color-hover\n );\n }\n\n .NavBarSideMenuButton-module_sidebarMenuButton__SlbsU:focus-visible {\n --current-background-color: var(\n --swui-nav-bar-side-menu-button-background-color-focus\n );\n }\n\n .NavBarSideMenuButton-module_sidebarMenuButton__SlbsU:active {\n --current-background-color: var(\n --swui-nav-bar-side-menu-button-background-color-active\n );\n }\n\n .NavBarSideMenuButton-module_sidebarMenuButton__SlbsU .NavBarSideMenuButton-module_icon__Art-L {\n color: var(--swui-nav-bar-side-menu-button-text-color);\n }\n";
189
- var styles$9 = {"sidebarMenuButton":"NavBarSideMenuButton-module_sidebarMenuButton__SlbsU","icon":"NavBarSideMenuButton-module_icon__Art-L"};
190
- styleInject(css_248z$a);
191
-
192
- function _extends$1() { _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
193
-
194
- var _ref$1 = /*#__PURE__*/React__namespace.createElement("path", {
195
- fill: "#FFF",
196
- fillRule: "evenodd",
197
- d: "M22 5H2c.12 0 0-.15 0 0V3c0 .15.12 0 0 0h20c-.12 0 0 .15 0 0v2c0-.15-.12 0 0 0zm0 8H2c.12 0 0-.15 0 0v-2c0 .15.12 0 0 0h20c-.12 0 0 .15 0 0v2c0-.15-.12 0 0 0zm0 8H2c.12 0 0-.15 0 0v-2c0 .15.12 0 0 0h20c-.12 0 0 .15 0 0v2c0-.15-.12 0 0 0z"
198
- });
199
-
200
- function SvgBars(props) {
201
- return /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
202
- xmlns: "http://www.w3.org/2000/svg",
203
- width: 16,
204
- height: 16,
205
- viewBox: "0 0 24 24"
206
- }, props), _ref$1);
207
- }
208
-
209
- var NavBarSideMenuButton = function (_a) {
210
- var className = _a.className, onClick = _a.onClick;
211
- return (React__namespace.createElement("button", { onClick: onClick, className: cx__default["default"](styles$9.sidebarMenuButton, className) },
212
- React__namespace.createElement(SvgBars, { className: styles$9.icon })));
213
- };
214
-
215
- var variantToHeight = {
216
- compact: 40,
217
- standard: 48,
218
- relaxed: 64,
219
- };
220
- var getNavbarHeight = function (variant) {
221
- return variantToHeight[variant] + "px";
222
- };
223
-
224
- var NavBar = function (_a) {
225
- var _b;
226
- var left = _a.left, className = _a.className, _c = _a.showMenuButton, showMenuButton = _c === void 0 ? false : _c, _d = _a.menuButtonVisibility, menuButtonVisibility = _d === void 0 ? "visible" : _d, children = _a.children, right = _a.right, center = _a.center, _e = _a.variant, variant = _e === void 0 ? "standard" : _e, onClickMenuButton = _a.onClickMenuButton;
227
- var currentFlex = center ? 1 : undefined;
228
- var height = getNavbarHeight(variant);
229
- return (React__namespace.createElement(core.Row, { height: height, minHeight: height, justifyContent: "space-between", style: (_b = {}, _b["--swui-nav-bar-height"] = height, _b), className: cx__default["default"](styles$a.navBar, className) },
230
- React__namespace.createElement(core.Row, { flex: currentFlex, justifyContent: "flex-start", alignItems: "center" },
231
- showMenuButton ? (React__namespace.createElement(React__namespace.Fragment, null,
232
- menuButtonVisibility === "hidden" ? (React__namespace.createElement(core.Box, { width: "var(--swui-nav-bar-height)" })) : (React__namespace.createElement(NavBarSideMenuButton, { onClick: onClickMenuButton })),
233
- React__namespace.createElement(core.Indent, null))) : (React__namespace.createElement(core.Indent, { num: 2 })),
234
- left ? (React__namespace.createElement(React__namespace.Fragment, null,
235
- left,
236
- React__namespace.createElement(core.Indent, { num: 2 }))) : (React__namespace.createElement(core.Indent, { num: 2 })),
237
- children && (React__namespace.createElement(React__namespace.Fragment, null,
238
- React__namespace.createElement(core.Row, { justifyContent: "center", alignItems: "center" }, React__namespace.Children.map(children, function (child, index) { return (React__namespace.createElement(React__namespace.Fragment, null,
239
- index > 0 && React__namespace.createElement(core.Indent, null),
240
- child)); }))))),
241
- center && (React__namespace.createElement(core.Row, { justifyContent: "center", alignItems: "center" }, center)),
242
- React__namespace.createElement(core.Row, { justifyContent: "flex-end", alignItems: "center", flex: currentFlex },
243
- right,
244
- React__namespace.createElement(core.Indent, { num: 2 }))));
245
- };
246
-
247
- var css_248z$9 = ".NavBarButton-module_navBarButton__3XKjB {\n /* Theme vars */\n --swui-nav-bar-button-text-color: var(--lhds-color-ui-50);\n --swui-nav-bar-button-background-color: transparent;\n --swui-nav-bar-button-background-color-hover: var(--lhds-color-blue-900);\n --swui-nav-bar-button-background-color-focus: var(--lhds-color-blue-700);\n --swui-nav-bar-button-background-color-active: var(--lhds-color-blue-800);\n --swui-nav-bar-button-background-color-selected: var(--lhds-color-blue-600);\n --swui-nav-bar-button-background-color-selected-hover: var(\n --lhds-color-blue-700\n );\n --swui-nav-bar-button-background-color-selected-focus: var(\n --lhds-color-blue-700\n );\n --swui-nav-bar-button-background-color-selected-active: var(\n --lhds-color-blue-800\n );\n\n /* Flatbutton overrrides */\n --swui-flat-button-text-color: var(--swui-nav-bar-button-text-color);\n --swui-flat-button-icon-color: var(--swui-nav-bar-button-text-color);\n --swui-flat-button-text-color-active: var(--swui-nav-bar-button-text-color);\n --swui-flat-button-background-color: var(\n --swui-nav-bar-button-background-color\n );\n --swui-flat-button-background-color-hover: var(\n --swui-nav-bar-button-background-color-hover\n );\n --swui-flat-button-background-color-focus: var(\n --swui-nav-bar-button-background-color-focus\n );\n --swui-flat-button-background-color-active: var(\n --swui-nav-bar-button-background-color-active\n );\n}\n\n .NavBarButton-module_navBarButton__3XKjB.NavBarButton-module_selected__1ReDE {\n --swui-flat-button-background-color: var(\n --swui-nav-bar-button-background-color-selected\n );\n --swui-flat-button-background-color-hover: var(\n --swui-nav-bar-button-background-color-selected-hover\n );\n --swui-flat-button-background-color-focus: var(\n --swui-nav-bar-button-background-color-selected-focus\n );\n --swui-flat-button-background-color-active: var(\n --swui-nav-bar-button-background-color-selected-active\n );\n }\n";
248
- var styles$8 = {"navBarButton":"NavBarButton-module_navBarButton__3XKjB","selected":"NavBarButton-module_selected__1ReDE"};
249
- styleInject(css_248z$9);
250
-
251
- var NavBarButton = function (_a) {
252
- var selected = _a.selected, className = _a.className, buttonProps = __rest(_a, ["selected", "className"]);
253
- return (React__namespace.createElement(elements.FlatButton, __assign({}, buttonProps, { className: cx__default["default"](styles$8.navBarButton, selected && styles$8.selected, className) })));
254
- };
255
-
256
- var NavBarHeading = function (headingProps) {
257
- return React__namespace.createElement(core.Heading, __assign({ whiteSpace: "nowrap", color: "#fff" }, headingProps));
258
- };
259
-
260
- var NavBarPopoverButton = function (_a) {
261
- var content = _a.content, children = _a.children, navBarButtonProps = __rest(_a, ["content", "children"]);
262
- var _b = core.useBoolean(false), isOpen = _b[0], open = _b[1], close = _b[2];
263
- return (React__namespace.createElement(tooltip.Popover, { onClickOutside: close, triggerTarget: document.body, visible: isOpen, content: React__namespace.createElement(React__namespace.Fragment, null,
264
- content && content({ close: close }),
265
- children) },
266
- React__namespace.createElement(NavBarButton, __assign({}, navBarButtonProps, { onClick: open }))));
267
- };
268
-
269
- var css_248z$8 = ".NavBarNotificationButton-module_navBarNotificationButton__20Q0f {\n /* Theme vars */\n --swui-nav-bar-notification-button-text-color: var(--lhds-color-ui-50);\n --swui-nav-bar-notification-button-background-color: var(\n --lhds-color-blue-700\n );\n --swui-nav-bar-notification-button-background-color-hover: var(\n --lhds-color-blue-900\n );\n --swui-nav-bar-notification-button-background-color-focus: var(\n --lhds-color-blue-700\n );\n --swui-nav-bar-notification-button-background-color-active: var(\n --lhds-color-blue-800\n );\n --swui-nav-bar-notification-button-background-color-unread: var(\n --lhds-color-red-500\n );\n --swui-nav-bar-notification-button-background-color-unread-hover: var(\n --lhds-color-red-700\n );\n --swui-nav-bar-notification-button-background-color-unread-focus: var(\n --lhds-color-red-700\n );\n --swui-nav-bar-notification-button-background-color-unread-active: var(\n --lhds-color-red-800\n );\n\n /* FlatButton overrides */\n --swui-flat-button-text-color: var(\n --swui-nav-bar-notification-button-text-color\n );\n --swui-flat-button-icon-color: var(\n --swui-nav-bar-notification-button-text-color\n );\n --swui-flat-button-text-color-active: var(\n --swui-nav-bar-notification-button-text-color\n );\n --swui-flat-button-background-color: var(\n --swui-nav-bar-notification-button-background-color\n );\n --swui-flat-button-background-color-hover: var(\n --swui-nav-bar-notification-button-background-color-hover\n );\n --swui-flat-button-background-color-focus: var(\n --swui-nav-bar-notification-button-background-color-focus\n );\n --swui-flat-button-background-color-active: var(\n --swui-nav-bar-notification-button-background-color-active\n );\n\n --swui-button-border-radius: 16px;\n --swui-button-border-radius-icon-only: 16px;\n --swui-nav-bar-notification-shake-count: 3;\n\n transition: 0.5s width;\n\n width: 32px;\n}\n\n .NavBarNotificationButton-module_navBarNotificationButton__20Q0f.NavBarNotificationButton-module_hasCount__1ecR2 {\n width: 56px;\n }\n\n .NavBarNotificationButton-module_navBarNotificationButton__20Q0f.NavBarNotificationButton-module_unread__2AREp {\n --swui-flat-button-background-color: var(\n --swui-nav-bar-notification-button-background-color-unread\n );\n --swui-flat-button-background-color-hover: var(\n --swui-nav-bar-notification-button-background-color-unread-hover\n );\n --swui-flat-button-background-color-focus: var(\n --swui-nav-bar-notification-button-background-color-unread-focus\n );\n --swui-flat-button-background-color-active: var(\n --swui-nav-bar-notification-button-background-color-unread-active\n );\n }\n\n .NavBarNotificationButton-module_navBarNotificationButton__20Q0f.NavBarNotificationButton-module_unread__2AREp.NavBarNotificationButton-module_hasCount__1ecR2 .NavBarNotificationButton-module_icon__2hfJP {\n -webkit-transform-origin: top center;\n transform-origin: top center;\n -webkit-animation: NavBarNotificationButton-module_shake__3vEP0 1.5s ease-in-out\n var(--swui-nav-bar-notification-shake-count);\n animation: NavBarNotificationButton-module_shake__3vEP0 1.5s ease-in-out\n var(--swui-nav-bar-notification-shake-count);\n }\n\n @-webkit-keyframes NavBarNotificationButton-module_shake__3vEP0 {\n 0% {\n -webkit-transform: rotate(0);\n transform: rotate(0);\n }\n 7% {\n -webkit-transform: rotate(20deg);\n transform: rotate(20deg);\n }\n 15% {\n -webkit-transform: rotate(-20deg);\n transform: rotate(-20deg);\n }\n 22% {\n -webkit-transform: rotate(16deg);\n transform: rotate(16deg);\n }\n 30% {\n -webkit-transform: rotate(-16deg);\n transform: rotate(-16deg);\n }\n 38% {\n -webkit-transform: rotate(6deg);\n transform: rotate(6deg);\n }\n 42% {\n -webkit-transform: rotate(-6deg);\n transform: rotate(-6deg);\n }\n 46% {\n -webkit-transform: rotate(2deg);\n transform: rotate(2deg);\n }\n 100% {\n -webkit-transform: rotate(0);\n transform: rotate(0);\n }\n }\n\n @keyframes NavBarNotificationButton-module_shake__3vEP0 {\n 0% {\n -webkit-transform: rotate(0);\n transform: rotate(0);\n }\n 7% {\n -webkit-transform: rotate(20deg);\n transform: rotate(20deg);\n }\n 15% {\n -webkit-transform: rotate(-20deg);\n transform: rotate(-20deg);\n }\n 22% {\n -webkit-transform: rotate(16deg);\n transform: rotate(16deg);\n }\n 30% {\n -webkit-transform: rotate(-16deg);\n transform: rotate(-16deg);\n }\n 38% {\n -webkit-transform: rotate(6deg);\n transform: rotate(6deg);\n }\n 42% {\n -webkit-transform: rotate(-6deg);\n transform: rotate(-6deg);\n }\n 46% {\n -webkit-transform: rotate(2deg);\n transform: rotate(2deg);\n }\n 100% {\n -webkit-transform: rotate(0);\n transform: rotate(0);\n }\n }\n";
270
- var styles$7 = {"navBarNotificationButton":"NavBarNotificationButton-module_navBarNotificationButton__20Q0f","hasCount":"NavBarNotificationButton-module_hasCount__1ecR2","unread":"NavBarNotificationButton-module_unread__2AREp","icon":"NavBarNotificationButton-module_icon__2hfJP","shake":"NavBarNotificationButton-module_shake__3vEP0"};
271
- styleInject(css_248z$8);
272
-
273
- var NavBarNotificationButton = function (_a) {
274
- var _b, _c;
275
- var count = _a.count, _d = _a.unread, unread = _d === void 0 ? false : _d, className = _a.className, labelClassName = _a.labelClassName, iconClassName = _a.iconClassName, _e = _a.icon, icon = _e === void 0 ? faBell.faBell : _e, buttonProps = __rest(_a, ["count", "unread", "className", "labelClassName", "iconClassName", "icon"]);
276
- var hasCount = count > 0;
277
- return (React__namespace.createElement(elements.FlatButton, __assign({}, buttonProps, { leftIcon: icon, className: cx__default["default"]((_b = {}, _b[styles$7.unread] = unread, _b), (_c = {}, _c[styles$7.hasCount] = hasCount, _c), styles$7.navBarNotificationButton, className), label: hasCount ? String(count) : undefined, labelClassName: cx__default["default"](labelClassName, styles$7.label), iconClassName: cx__default["default"](iconClassName, styles$7.icon) })));
278
- };
279
-
280
- var css_248z$7 = ".NavBarSearchField-module_navBarSearchFieldInput__2kThv {\n --swui-textinput-line-height: 2.7rem;\n --swui-textinput-text-color: var(--lhds-color-ui-50);\n}\n\n .NavBarSearchField-module_navBarSearchFieldInput__2kThv:focus {\n --swui-textinput-text-color: var(--lhds-color-ui-800);\n }\n\n.NavBarSearchField-module_navBarSearchField__kIe66 {\n --swui-textinput-animation-time: var(--swui-animation-time-fast);\n\n --swui-textinput-placeholder-color: var(--lhds-color-ui-500);\n --swui-textinput-bg-color: var(--lhds-color-blue-600);\n --swui-textinput-border-color: transparent;\n --swui-textinput-border-color-hover: transparent;\n}\n\n.NavBarSearchField-module_navBarSearchField__kIe66:focus-within {\n --swui-textinput-text-color: var(--lhds-color-ui-800);\n --swui-field-text-color: var(--swui-field-text-color);\n --swui-textinput-icon-color: var(--lhds-color-ui-500);\n --swui-textinput-bg-color: var(--lhds-color-ui-50);\n }\n";
281
- var styles$6 = {"navBarSearchFieldInput":"NavBarSearchField-module_navBarSearchFieldInput__2kThv","navBarSearchField":"NavBarSearchField-module_navBarSearchField__kIe66"};
282
- styleInject(css_248z$7);
283
-
284
- var NavBarSearchField = function (_a) {
285
- var _b = _a.placeholder, placeholder = _b === void 0 ? "Search..." : _b, className = _a.className, wrapperClassName = _a.wrapperClassName, textInputProps = __rest(_a, ["placeholder", "className", "wrapperClassName"]);
286
- return (React__namespace.createElement(forms.TextInput, __assign({ wrapperClassName: cx__default["default"](styles$6.navBarSearchField, wrapperClassName), className: cx__default["default"](styles$6.navBarSearchFieldInput, className), placeholder: placeholder, contentRight: React__namespace.createElement(core.Clickable, null,
287
- React__namespace.createElement(elements.Icon, { icon: elements.stenaSearch })) }, textInputProps)));
288
- };
289
-
290
- var css_248z$6 = ".NavBarUserButton-module_navBarUserButton__2iY95 {\n /* Theme vars */\n --swui-nav-bar-user-button-text-color: var(--lhds-color-ui-50);\n --swui-nav-bar-user-button-background-color: var(--lhds-color-blue-700);\n --swui-nav-bar-user-button-background-color-hover: var(--lhds-color-blue-900);\n --swui-nav-bar-user-button-background-color-focus: var(--lhds-color-blue-700);\n --swui-nav-bar-user-button-background-color-active: var(\n --lhds-color-blue-800\n );\n\n /* FlatButton overrides */\n --swui-flat-button-text-color: var(--swui-nav-bar-user-button-text-color);\n --swui-flat-button-icon-color: var(--swui-nav-bar-user-button-text-color);\n --swui-flat-button-text-color-active: var(\n --swui-nav-bar-user-button-text-color\n );\n --swui-flat-button-background-color: var(\n --swui-nav-bar-user-button-background-color\n );\n --swui-flat-button-background-color-hover: var(\n --swui-nav-bar-user-button-background-color-hover\n );\n --swui-flat-button-background-color-focus: var(\n --swui-nav-bar-user-button-background-color-focus\n );\n --swui-flat-button-background-color-active: var(\n --swui-nav-bar-user-button-background-color-active\n );\n\n --swui-button-border-radius: 16px;\n --swui-button-border-radius-icon-only: 16px;\n}\n\n .NavBarUserButton-module_navBarUserButton__2iY95.NavBarUserButton-module_initials__1J9z5 {\n width: 32px;\n }\n";
291
- var styles$5 = {"navBarUserButton":"NavBarUserButton-module_navBarUserButton__2iY95","initials":"NavBarUserButton-module_initials__1J9z5"};
292
- styleInject(css_248z$6);
293
-
294
- var NavBarUserButton = function (_a) {
295
- var _b;
296
- var className = _a.className, username = _a.username, initials = _a.initials; _a.icon; _a.iconClassName; var buttonProps = __rest(_a, ["className", "username", "initials", "icon", "iconClassName"]);
297
- return (React__namespace.createElement(ActionMenuFlatButton, __assign({}, buttonProps, { className: cx__default["default"]((_b = {}, _b[styles$5.initials] = initials != null, _b), styles$5.navBarUserButton, className), leftIcon: username != null ? faUser.faUser : undefined, label: initials !== null && initials !== void 0 ? initials : username, disableArrow: true })));
298
- };
299
-
300
- var defaultNotificationTheme = {
301
- notificationBg: "#eaeaea",
302
- notificationHoverBg: "#eeeeee",
303
- notificationDismissedBg: "#ffffff",
304
- notificationDismissedHoverBg: "#f4f4f4",
305
- };
306
-
307
- var Notification = function (_a) {
308
- var onClick = _a.onClick, icon = _a.icon, iconColor = _a.iconColor, title = _a.title, text = _a.text, content = _a.content, date = _a.date, dismissed = _a.dismissed, _b = _a.theme, theme$1 = _b === void 0 ? defaultNotificationTheme : _b;
309
- var agoLabel = React.useMemo(function () {
310
- if (date) {
311
- return "".concat(dateFns.formatDistance(date, new Date()), " ago");
312
- }
313
- return undefined;
314
- }, [date]);
315
- return (React__namespace.createElement(core.Clickable, { onClick: onClick, style: { textAlign: "left" } },
316
- React__namespace.createElement(core.Box, { background: dismissed ? theme$1.notificationDismissedBg : theme$1.notificationBg, hoverBackground: dismissed
317
- ? theme$1.notificationDismissedHoverBg
318
- : theme$1.notificationHoverBg, spacing: true, indent: true },
319
- React__namespace.createElement(core.Row, { width: "250px" },
320
- icon && (React__namespace.createElement(core.Row, { width: "34px", alignItems: "center" },
321
- React__namespace.createElement(elements.Icon, { icon: icon, color: iconColor }))),
322
- React__namespace.createElement(core.Column, { flex: 1 },
323
- title && (React__namespace.createElement(React__namespace.Fragment, null,
324
- React__namespace.createElement(core.Text, null, title),
325
- React__namespace.createElement(core.Space, { half: true }))),
326
- text && (React__namespace.createElement(React__namespace.Fragment, null,
327
- React__namespace.createElement(core.Text, { size: "small" }, text),
328
- React__namespace.createElement(core.Space, { half: true }))),
329
- content && (React__namespace.createElement(React__namespace.Fragment, null,
330
- content,
331
- React__namespace.createElement(core.Space, { half: true }))),
332
- React__namespace.createElement(core.Text, { size: "small", color: theme.cssColor("--swui-text-disabled-color") }, agoLabel))))));
333
- };
334
-
335
- var css_248z$5 = ".Collapsible-module_collapsible__2Nn8K {\n --swui-collapsible-animation-time: var(--swui-animation-time-fast);\n\n --swui-collapsible-expanded-line-background-color: var(\n --swui-primary-action-color\n );\n\n /*\n * Header\n */\n --swui-collapsible-header-text-color: var(--lhds-color-ui-900);\n --swui-collapsible-header-background-color: var(--swui-white);\n --swui-collapsible-header-background-color-hover: var(--lhds-color-blue-100);\n --swui-collapsible-header-background-color-active: var(--lhds-color-blue-100);\n --swui-collapsible-header-border-color: var(--lhds-color-ui-300);\n --swui-collapsible-header-border-color-focus: var(\n --swui-primary-action-color\n );\n --swui-collapsible-header-focus-shadow: var(--swui-field-focus-shadow);\n --swui-collapsible-header-content-margin: calc(\n var(--swui-metrics-indent) * 2\n );\n --swui-collapsible-header-font-weight: var(--swui-font-weight-text-bold);\n --swui-collapsible-header-indicator-color: var(--swui-primary-action-color);\n --swui-collapsible-header-indicator-color-collapsed: var(--lhds-color-ui-500);\n --swui-collapsible-header-indicator-color-hover: var(\n --swui-primary-action-color\n );\n --swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0;\n\n /*\n * Content\n */\n --swui-collapsible-content-background-color: var(--lhds-color-ui-100);\n --swui-collapsible-content-border-color: var(--lhds-color-ui-300);\n --swui-collapsible-content-padding: var(--swui-metrics-indent)\n calc(var(--swui-metrics-indent) * 2);\n\n --swui-collapsible-groupheading-font-size: var(--swui-font-size-smaller);\n --swui-collapsible-groupheading-text-color: var(--lhds-color-ui-600);\n\n --swui-collapsible-min-height: 40px;\n}\n\n /* Header */\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_header__IZx0y {\n background-color: var(--swui-collapsible-header-background-color);\n width: 100%;\n text-align: left;\n\n min-height: var(--swui-collapsible-min-height);\n box-sizing: border-box;\n display: flex;\n justify-content: space-between;\n align-items: center;\n border-bottom: 1px solid var(--swui-collapsible-header-border-color);\n padding: var(--swui-collapsible-header-padding);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_header__IZx0y .Collapsible-module_indicator__3YBhK {\n transition: all var(--swui-collapsible-animation-time) ease-in-out;\n margin-left: var(--swui-collapsible-header-content-margin);\n color: var(--swui-collapsible-header-indicator-color);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_header__IZx0y:not(:disabled):hover:not(:active) {\n background-color: var(--swui-collapsible-header-background-color-hover);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_header__IZx0y:not(:disabled):hover:not(:active) .Collapsible-module_indicator__3YBhK {\n color: var(--swui-collapsible-header-indicator-color-hover);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_header__IZx0y:focus-visible {\n outline: 1px solid var(--swui-collapsible-header-border-color-focus);\n outline-offset: -1px;\n box-shadow: var(--swui-collapsible-header-focus-shadow);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_header__IZx0y:active {\n background: var(--swui-collapsible-header-background-color-active);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_header__IZx0y:disabled {\n cursor: not-allowed;\n }\n\n .Collapsible-module_collapsible__2Nn8K {\n\n position: relative;\n}\n\n .Collapsible-module_collapsible__2Nn8K::before {\n content: \"\";\n position: absolute;\n width: 2px;\n background: var(--swui-collapsible-expanded-line-background-color);\n top: 0;\n bottom: 0;\n left: 0;\n z-index: 1;\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_headerText__2qjzx {\n font-weight: var(--swui-collapsible-header-font-weight);\n }\n\n .Collapsible-module_collapsible__2Nn8K[aria-expanded=\"false\"] {\n --swui-collapsible-expanded-line-background-color: transparent;\n }\n\n .Collapsible-module_collapsible__2Nn8K[aria-expanded=\"false\"] .Collapsible-module_indicator__3YBhK {\n color: var(--swui-collapsible-header-indicator-color-collapsed);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_label__Hpp-R {\n margin-right: auto;\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_label__Hpp-R span {\n --current-line-height: 1;\n font-weight: var(--swui-collapsible-header-font-weight);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_contentLeft__2gPpu,\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_contentRight__bTr59 {\n display: flex;\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_contentLeft__2gPpu button, .Collapsible-module_collapsible__2Nn8K .Collapsible-module_contentRight__bTr59 button {\n cursor: pointer;\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_contentLeft__2gPpu {\n margin-right: var(--swui-collapsible-header-content-margin);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_contentRight__bTr59 {\n margin-left: auto;\n }\n\n /* Content */\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_content__1e1C8 {\n display: flex;\n align-items: center;\n justify-content: stretch;\n background: var(--swui-collapsible-content-background-color);\n padding: var(--swui-collapsible-content-padding);\n min-height: var(--swui-collapsible-min-height);\n box-sizing: border-box;\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_content__1e1C8:last-child {\n border-bottom: 1px solid var(--swui-collapsible-content-border-color);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_content__1e1C8.Collapsible-module_groupHeading__3BK-5 {\n border: none;\n font-size: var(--swui-collapsible-groupheading-font-size);\n font-family: var(--swui-font-primary);\n color: var(--swui-collapsible-groupheading-text-color);\n text-transform: uppercase;\n font-weight: var(--swui-font-weight-text-bold);\n letter-spacing: 0.1rem;\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_content__1e1C8 [data-hidden=\"true\"] {\n display: none;\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_content__1e1C8:hover [data-hidden=\"true\"] {\n display: inherit;\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_content__1e1C8:hover [data-hover=\"true\"] {\n color: var(--swui-collapsible-header-indicator-color-hover);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_contentEnter__GWHoW {\n opacity: 0;\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_contentEnterActive__1YdNi {\n opacity: 1;\n transition: opacity var(--swui-collapsible-animation-time) ease-in-out;\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_contentExitDone__35Iht {\n display: none;\n }\n\n /** Clickable content */\n\n .Collapsible-module_collapsible__2Nn8K button.Collapsible-module_content__1e1C8 {\n font-family: var(--swui-font-primary);\n font-size: inherit;\n width: 100%;\n text-align: left;\n }\n\n .Collapsible-module_collapsible__2Nn8K button.Collapsible-module_content__1e1C8:focus-visible {\n outline: 1px solid var(--swui-collapsible-header-border-color-focus);\n outline-offset: -1px;\n box-shadow: var(--swui-collapsible-header-focus-shadow);\n }\n\n .Collapsible-module_collapsible__2Nn8K button.Collapsible-module_content__1e1C8:not(:disabled):hover {\n background-color: var(--swui-collapsible-header-background-color-hover);\n }\n\n .Collapsible-module_collapsible__2Nn8K button.Collapsible-module_content__1e1C8:disabled {\n cursor: not-allowed;\n }\n\n .Collapsible-module_collapsible__2Nn8K button.Collapsible-module_content__1e1C8:focus-within [data-hidden=\"true\"] {\n display: inherit;\n }\n\n /* Remove header background color if not at the highest level */\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_collapsible__2Nn8K {\n --swui-collapsible-header-background-color: var(\n --swui-collapsible-content-background-color\n );\n --swui-collapsible-header-font-weight: normal;\n }\n\n /* Increase padding with depth */\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_collapsible__2Nn8K {\n --swui-collapsible-content-padding: var(--swui-metrics-indent)\n calc(var(--swui-metrics-indent) * 2) var(--swui-metrics-indent)\n calc(var(--swui-metrics-indent) * 4);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_collapsible__2Nn8K .Collapsible-module_collapsible__2Nn8K {\n --swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0\n calc(var(--swui-metrics-indent) * 4);\n --swui-collapsible-content-padding: var(--swui-metrics-indent)\n calc(var(--swui-metrics-indent) * 2) var(--swui-metrics-indent)\n calc(var(--swui-metrics-indent) * 6);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_collapsible__2Nn8K .Collapsible-module_collapsible__2Nn8K .Collapsible-module_collapsible__2Nn8K {\n --swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0\n calc(var(--swui-metrics-indent) * 6);\n --swui-collapsible-content-padding: var(--swui-metrics-indent)\n calc(var(--swui-metrics-indent) * 2) var(--swui-metrics-indent)\n calc(var(--swui-metrics-indent) * 8);\n }\n\n .Collapsible-module_collapsible__2Nn8K .Collapsible-module_collapsible__2Nn8K .Collapsible-module_collapsible__2Nn8K .Collapsible-module_collapsible__2Nn8K .Collapsible-module_collapsible__2Nn8K {\n --swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0\n calc(var(--swui-metrics-indent) * 8);\n --swui-collapsible-content-padding: var(--swui-metrics-indent)\n calc(var(--swui-metrics-indent) * 2) var(--swui-metrics-indent)\n calc(var(--swui-metrics-indent) * 10);\n }\n";
336
- var styles$4 = {"collapsible":"Collapsible-module_collapsible__2Nn8K","header":"Collapsible-module_header__IZx0y","indicator":"Collapsible-module_indicator__3YBhK","headerText":"Collapsible-module_headerText__2qjzx","label":"Collapsible-module_label__Hpp-R","contentLeft":"Collapsible-module_contentLeft__2gPpu","contentRight":"Collapsible-module_contentRight__bTr59","content":"Collapsible-module_content__1e1C8","groupHeading":"Collapsible-module_groupHeading__3BK-5","contentEnter":"Collapsible-module_contentEnter__GWHoW","contentEnterActive":"Collapsible-module_contentEnterActive__1YdNi","contentExitDone":"Collapsible-module_contentExitDone__35Iht"};
337
- styleInject(css_248z$5);
338
-
339
- var CollapsibleEmptyContent = function () {
340
- return (React__namespace.createElement(core.Column, { indent: true, spacing: true, flex: 1, alignItems: "center" },
341
- React__namespace.createElement(elements.Icon, { icon: faInbox.faInbox, color: theme.cssColor("--lhds-color-ui-500") }),
342
- React__namespace.createElement(core.Space, null),
343
- React__namespace.createElement(core.Text, { size: "small", color: theme.cssColor("--lhds-color-ui-500") }, "No content")));
344
- };
345
-
346
- var CollapsibleContent = function (_a) {
347
- var contentLeft = _a.contentLeft, contentRight = _a.contentRight, className = _a.className, children = _a.children, props = __rest(_a, ["contentLeft", "contentRight", "className", "children"]);
348
- return (React__namespace.createElement("div", __assign({ className: cx__default["default"](styles$4.content, className) }, props),
349
- contentLeft && React__namespace.createElement("div", { className: styles$4.contentLeft }, contentLeft), children !== null && children !== void 0 ? children : React__namespace.createElement(CollapsibleEmptyContent, null),
350
- contentRight && (React__namespace.createElement("div", { className: styles$4.contentRight }, contentRight))));
351
- };
352
-
353
- var mapCSSTime = function (value) {
354
- var num = parseFloat(value);
355
- var match = value.match(/m?s/);
356
- switch (match === null || match === void 0 ? void 0 : match[0]) {
357
- case "s":
358
- return num * 1000;
359
- case "ms":
360
- return num;
361
- default:
362
- return 0;
363
- }
364
- };
365
- var Collapsible = React.forwardRef(function Collapsible(_a, ref) {
366
- var label = _a.label, contentLeft = _a.contentLeft, contentRight = _a.contentRight, _b = _a.collapsed, collapsed = _b === void 0 ? false : _b, onClick = _a.onClick, className = _a.className, _c = _a.disabled, disabled = _c === void 0 ? false : _c, _d = _a.unmountOnCollapse, unmountOnCollapse = _d === void 0 ? false : _d, _e = _a.mountOnEnter, mountOnEnter = _e === void 0 ? true : _e, _f = _a.icon, icon = _f === void 0 ? faChevronUp.faChevronUp : _f, _g = _a.iconCollapsed, iconCollapsed = _g === void 0 ? freeSolidSvgIcons.faChevronDown : _g, _h = _a.iconSize, iconSize = _h === void 0 ? 8 : _h, children = _a.children, _j = _a.autoFocus, autoFocus = _j === void 0 ? false : _j, divProps = __rest(_a, ["label", "contentLeft", "contentRight", "collapsed", "onClick", "className", "disabled", "unmountOnCollapse", "mountOnEnter", "icon", "iconCollapsed", "iconSize", "children", "autoFocus"]);
367
- var divRef = React__namespace.useRef(null);
368
- var timeout = divRef.current
369
- ? mapCSSTime(getComputedStyle(divRef.current).getPropertyValue("--swui-collapsible-animation-time"))
370
- : undefined;
371
- return (React__namespace.createElement("div", __assign({ className: cx__default["default"](styles$4.collapsible, className), "aria-expanded": !collapsed, ref: divRef }, divProps),
372
- React__namespace.createElement(core.Clickable, { disableFocusHighlight: true, disableOpacityOnClick: true, className: styles$4.header, onClick: onClick, disabled: disabled, autoFocus: autoFocus, ref: ref },
373
- contentLeft && (React__namespace.createElement("div", { className: styles$4.contentLeft }, contentLeft)),
374
- React__namespace.createElement("div", { className: styles$4.label },
375
- React__namespace.createElement(core.Text, { color: "var(--swui-collapsible-header-text-color)", className: styles$4.headerText }, label)),
376
- contentRight && (React__namespace.createElement("div", { className: styles$4.contentRight }, contentRight)),
377
- React__namespace.createElement(elements.Icon, { icon: collapsed ? iconCollapsed : icon, className: styles$4.indicator, size: iconSize, fixedWidth: true })),
378
- React__namespace.createElement(reactTransitionGroup.CSSTransition, { in: !collapsed, timeout: {
379
- enter: timeout,
380
- }, classNames: {
381
- enter: styles$4.contentEnter,
382
- enterActive: styles$4.contentEnterActive,
383
- exit: styles$4.contentExit,
384
- exitActive: styles$4.contentExitActive,
385
- exitDone: styles$4.contentExitDone,
386
- }, mountOnEnter: mountOnEnter, unmountOnExit: unmountOnCollapse },
387
- React__namespace.createElement("div", { role: "region" }, children !== null && children !== void 0 ? children : (React__namespace.createElement(CollapsibleContent, null,
388
- React__namespace.createElement(CollapsibleEmptyContent, null)))))));
389
- });
390
-
391
- var CollapsibleWithCheckbox = function (_a) {
392
- var value = _a.value, onValueChange = _a.onValueChange, onChange = _a.onChange, indeterminate = _a.indeterminate, collapsibleProps = __rest(_a, ["value", "onValueChange", "onChange", "indeterminate"]);
393
- return (React__namespace.createElement(Collapsible, __assign({ contentLeft: React__namespace.createElement(forms.Checkbox, { value: value, indeterminate: indeterminate, onValueChange: onValueChange, onChange: onChange, onClick: function (ev) { return ev.stopPropagation(); } }) }, collapsibleProps)));
394
- };
395
-
396
- var CollapsibleClickableContent = function (_a) {
397
- var contentLeft = _a.contentLeft, contentRight = _a.contentRight, className = _a.className, onClick = _a.onClick, children = _a.children, props = __rest(_a, ["contentLeft", "contentRight", "className", "onClick", "children"]);
398
- return (React__namespace.createElement(core.Clickable, __assign({ disableFocusHighlight: true, disableOpacityOnClick: true, className: cx__default["default"](styles$4.content, className), onClick: onClick }, props),
399
- contentLeft && React__namespace.createElement("div", { className: styles$4.contentLeft }, contentLeft), children !== null && children !== void 0 ? children : React__namespace.createElement(CollapsibleEmptyContent, null),
400
- contentRight && (React__namespace.createElement("div", { className: styles$4.contentRight }, contentRight))));
401
- };
402
-
403
- var CollapsibleGroupHeading = function (_a) {
404
- var className = _a.className, props = __rest(_a, ["className"]);
405
- return (React__namespace.createElement(CollapsibleContent, __assign({ className: cx__default["default"](styles$4.groupHeading, className) }, props)));
406
- };
407
-
408
- var ErrorPanel = function (_a) {
409
- var _b = _a.text, text = _b === void 0 ? "Something unexpected happened." : _b;
410
- return (React__namespace.createElement(core.Box, { justifyContent: "center", alignItems: "center" },
411
- React__namespace.createElement(elements.Banner, { variant: "error", headerText: text })));
412
- };
413
-
414
- var ErrorScreen = function (props) {
415
- return (React__namespace.createElement(core.Box, { width: "100%", height: "100%", justifyContent: "center", alignItems: "center" },
416
- React__namespace.createElement(ErrorPanel, __assign({}, props))));
417
- };
418
-
419
- var LoadingPanel = function (_a) {
420
- var _b = _a.text, text = _b === void 0 ? "Loading..." : _b;
421
- return (React__namespace.createElement(core.Box, { alignItems: "center" },
422
- React__namespace.createElement(elements.Spinner, { size: "small" }),
423
- React__namespace.createElement(core.Space, { num: 4 }),
424
- React__namespace.createElement(core.Heading, { variant: "h4" }, text)));
425
- };
426
-
427
- var LoadingScreen = function (props) {
428
- return (React__namespace.createElement(core.Box, { width: "100%", height: "100%", justifyContent: "center", alignItems: "center" },
429
- React__namespace.createElement(LoadingPanel, __assign({}, props))));
430
- };
431
-
432
- var PageHeader = function (_a) {
433
- var renderBreadCrumbs = _a.renderBreadCrumbs, renderPageHeading = _a.renderPageHeading, renderTabs = _a.renderTabs, children = _a.children;
434
- return (React__namespace.createElement(core.Box, { shadow: "box" },
435
- React__namespace.createElement(core.Box, { indent: 3 },
436
- renderBreadCrumbs && React__namespace.createElement(core.Row, { spacing: 1.25 }, renderBreadCrumbs()), renderPageHeading === null || renderPageHeading === void 0 ? void 0 :
437
- renderPageHeading(), renderTabs === null || renderTabs === void 0 ? void 0 :
438
- renderTabs()),
439
- children && (React__namespace.createElement(React__namespace.Fragment, null,
440
- !renderTabs && React__namespace.createElement(core.Space, null),
441
- React__namespace.createElement(core.SeparatorLine, null),
442
- children))));
443
- };
444
-
445
- var PageHeaderRow = function (props) { return (React__namespace.createElement(core.Row, __assign({ indent: 3, spacing: true }, props))); };
446
-
447
- var variantToSpacing = {
448
- compact: 1,
449
- standard: 1.5,
450
- relaxed: 2,
451
- };
452
- var PageHeading = function (_a) {
453
- var heading = _a.heading, _b = _a.variant, variant = _b === void 0 ? "standard" : _b, contentLeft = _a.contentLeft, contentRight = _a.contentRight;
454
- return (React__namespace.createElement(core.Row, { spacing: variantToSpacing[variant], alignItems: "center", gap: 2 },
455
- React__namespace.createElement(core.Heading, { variant: "h3" }, heading),
456
- React__namespace.createElement(core.Row, { alignItems: "center" }, contentLeft),
457
- React__namespace.createElement(core.Row, { style: { marginLeft: "auto" }, alignItems: "center" }, contentRight)));
458
- };
459
-
460
- var css_248z$4 = ".SidebarMenu-module_sidebarMenu__3IOkS {\n /* Theme vars */\n --swui-sidebar-menu-separator-color: var(--lhds-color-blue-700);\n --swui-sidebar-menu-text-color: var(--swui-white);\n --swui-sidebar-menu-icon-color: var(--swui-white);\n --swui-sidebar-menu-background-color: var(--lhds-color-blue-500);\n --swui-sidebar-menu-background-color-hover: var(--lhds-color-blue-700);\n --swui-sidebar-menu-background-color-focus: var(--lhds-color-blue-700);\n --swui-sidebar-menu-background-color-active: var(--lhds-color-blue-600);\n --swui-sidebar-menu-item-selected: var(--lhds-color-blue-800);\n --swui-sidebar-menu-content-padding: var(--swui-metrics-indent)\n var(--swui-metrics-indent) var(--swui-metrics-indent) 0;\n\n /* State vars */\n --current-separator-color: var(--swui-sidebar-menu-separator-color);\n --current-text-color: var(--swui-sidebar-menu-text-color);\n --current-icon-color: var(--swui-sidebar-menu-icon-color);\n --current-background-color: var(--swui-sidebar-menu-background-color);\n --current-background-color-hover: var(\n --swui-sidebar-menu-background-color-hover\n );\n --current-background-color-focus: var(\n --swui-sidebar-menu-background-color-focus\n );\n --current-background-color-active: var(\n --swui-sidebar-menu-background-color-active\n );\n --current-item-selected: var(--swui-sidebar-menu-item-selected);\n --current-content-padding: var(--swui-sidebar-menu-content-padding);\n\n /* Styling */\n\n background-color: var(--current-background-color);\n height: 100vh;\n}\n\n .SidebarMenu-module_sidebarMenu__3IOkS[data-collapsed] {\n width: var(--swui-sidebar-menu-item-height);\n }\n\n .SidebarMenu-module_sidebarMenu__3IOkS button {\n --swui-button-text-color: var(--swui-white);\n --swui-button-background-color-hover: var(\n --swui-sidebar-menu-background-color-hover\n );\n }\n";
461
- var styles$3 = {"sidebarMenu":"SidebarMenu-module_sidebarMenu__3IOkS"};
462
- styleInject(css_248z$4);
463
-
464
- var css_248z$3 = ".SidebarMenuCloseButton-module_sidebarMenuCloseButton__1h_pt {\n /* Theme vars */\n --swui-sidebar-menu-close-button-text-color: var(--lhds-color-ui-50);\n --swui-sidebar-menu-close-button-background-color: var(--lhds-color-blue-500);\n --swui-sidebar-menu-close-button-background-color-hover: var(\n --lhds-color-blue-600\n );\n --swui-sidebar-menu-close-button-background-color-focus: var(\n --lhds-color-blue-600\n );\n --swui-sidebar-menu-close-button-background-color-active: var(\n --lhds-color-blue-500\n );\n\n /* Current */\n --current-background-color: var(\n --swui-sidebar-menu-close-button-background-color\n );\n\n /* Styling */\n\n display: flex;\n align-items: center;\n justify-content: flex-start;\n line-height: 10px;\n background-color: var(--current-background-color);\n color: var(--swui-sidebar-menu-close-button-text-color);\n cursor: pointer;\n height: var(--swui-sidebar-menu-item-height);\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n border-radius: 0;\n outline: none;\n border: none;\n}\n\n .SidebarMenuCloseButton-module_sidebarMenuCloseButton__1h_pt:hover {\n --current-background-color: var(\n --swui-sidebar-menu-close-button-background-color-hover\n );\n }\n\n .SidebarMenuCloseButton-module_sidebarMenuCloseButton__1h_pt:focus {\n --current-background-color: var(\n --swui-sidebar-menu-close-button-background-color-focus\n );\n }\n\n .SidebarMenuCloseButton-module_sidebarMenuCloseButton__1h_pt:active {\n --current-background-color: var(\n --swui-sidebar-menu-close-button-background-color-active\n );\n }\n\n .SidebarMenuCloseButton-module_sidebarMenuCloseButton__1h_pt .SidebarMenuCloseButton-module_iconWrapper__2nLkY {\n justify-content: center;\n align-items: center;\n width: var(--swui-sidebar-menu-item-height);\n height: var(--swui-sidebar-menu-item-height);\n }\n\n .SidebarMenuCloseButton-module_sidebarMenuCloseButton__1h_pt .SidebarMenuCloseButton-module_icon__1lPJE {\n color: var(--swui-sidebar-menu-close-button-text-color);\n }\n";
465
- var styles$2 = {"sidebarMenuCloseButton":"SidebarMenuCloseButton-module_sidebarMenuCloseButton__1h_pt","iconWrapper":"SidebarMenuCloseButton-module_iconWrapper__2nLkY","icon":"SidebarMenuCloseButton-module_icon__1lPJE"};
466
- styleInject(css_248z$3);
467
-
468
- function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
469
-
470
- var _ref = /*#__PURE__*/React__namespace.createElement("path", {
471
- d: "M.929.929a1 1 0 011.414 0L8 6.585 13.657.929a1 1 0 011.414 1.414L9.415 8l5.656 5.657a1 1 0 01.083 1.32l-.083.094a1 1 0 01-1.414 0L8 9.415l-5.657 5.656A1 1 0 11.93 13.657L6.585 8 .929 2.343a1 1 0 01-.083-1.32z",
472
- fill: "#FFF"
473
- });
474
-
475
- function SvgClose(props) {
476
- return /*#__PURE__*/React__namespace.createElement("svg", _extends({
477
- width: 16,
478
- height: 16,
479
- xmlns: "http://www.w3.org/2000/svg"
480
- }, props), _ref);
481
- }
482
-
483
- var SidebarMenuCloseButton = function (_a) {
484
- var className = _a.className, onClick = _a.onClick;
485
- return (React__namespace.createElement("button", { onClick: onClick, className: cx__default["default"](styles$2.sidebarMenuCloseButton, className) },
486
- React__namespace.createElement(core.Box, { className: styles$2.iconWrapper },
487
- React__namespace.createElement(SvgClose, { className: styles$2.icon }))));
488
- };
489
-
490
- var SidebarMenuSeparator = function (separatorLineProps) { return (React__namespace.createElement(core.SeparatorLine, __assign({ color: theme.cssColor("--lhds-color-blue-600") }, separatorLineProps))); };
491
-
492
- var SidebarMenu = function (_a) {
493
- var _b;
494
- var className = _a.className, children = _a.children, onCloseClick = _a.onCloseClick, _c = _a.collapsed, collapsed = _c === void 0 ? false : _c, _d = _a.hideCloseButton, hideCloseButton = _d === void 0 ? false : _d, _e = _a.variant, variant = _e === void 0 ? "standard" : _e, boxProps = __rest(_a, ["className", "children", "onCloseClick", "collapsed", "hideCloseButton", "variant"]);
495
- var height = getNavbarHeight(variant);
496
- return (React__namespace.createElement(core.Box, __assign({ className: cx__default["default"](styles$3.sidebarMenu, collapsed ? styles$3.collapsed : null, className), style: (_b = {},
497
- _b["--swui-sidebar-menu-item-height"] = height,
498
- _b["--swui-nav-bar-height"] = height,
499
- _b), "data-collapsed": collapsed || undefined }, boxProps),
500
- !hideCloseButton && (React__namespace.createElement(React__namespace.Fragment, null,
501
- React__namespace.createElement(SidebarMenuCloseButton, { onClick: onCloseClick }),
502
- React__namespace.createElement(SidebarMenuSeparator, null),
503
- React__namespace.createElement(core.Space, null))),
504
- React__namespace.createElement(core.Box, { className: styles$3.sidebarMenuContent, height: "100%", background: "var(--current-background-color)" },
505
- React__namespace.createElement(core.Column, { flex: 1 }, children))));
506
- };
507
-
508
- var SidebarRailMenu = function (_a) {
509
- var variant = _a.variant, onClickMenuButton = _a.onClickMenuButton, children = _a.children;
510
- return (React__namespace.createElement(SidebarMenu, { collapsed: true, position: "fixed", left: 0, top: 0, hideCloseButton: true, variant: variant },
511
- React__namespace.createElement(NavBarSideMenuButton, { onClick: onClickMenuButton }),
512
- children));
513
- };
514
-
515
- var css_248z$2 = ".SidebarMenuContent-module_label__3NyDU {\n font-size: var(--current-text-size, var(--swui-font-size-medium));\n line-height: var(--current-line-height, var(--swui-line-height-medium));\n font-weight: var(--swui-button-font-weight);\n font-family: var(--swui-font-buttons);\n color: var(--current-text-color);\n}\n\n.SidebarMenuContent-module_icon__1kQOa {\n color: var(--current-text-color);\n font-size: 1.6rem;\n}\n\n.SidebarMenuContent-module_spinner__K0lsy {\n color: var(--current-text-color);\n}\n\n.SidebarMenuContent-module_leftWrapper__2sA9a.SidebarMenuContent-module_leftWrapper__2sA9a.SidebarMenuContent-module_leftWrapper__2sA9a.SidebarMenuContent-module_leftWrapper__2sA9a {\n width: var(--swui-sidebar-menu-item-height);\n margin-right: 0;\n}\n\n.SidebarMenuContent-module_button__3x5IE {\n border: 0;\n padding: 0;\n background: var(--current-background-color);\n}\n\n[data-collapsed] [aria-expanded=\"true\"] .SidebarMenuContent-module_button__3x5IE,\n .SidebarMenuContent-module_button__3x5IE:hover {\n background: var(--current-background-color-hover);\n }\n\n.SidebarMenuContent-module_button__3x5IE:focus {\n outline: none;\n }\n\n.SidebarMenuContent-module_button__3x5IE:focus-visible {\n background: var(--current-background-color-active);\n }\n\n.SidebarMenuContent-module_button__3x5IE:active {\n background: var(--current-background-color-active);\n }\n\n.SidebarMenuContent-module_button__3x5IE.SidebarMenuContent-module_selected__aeI_K {\n background: var(--current-item-selected);\n }\n";
516
- var contentStyles = {"label":"SidebarMenuContent-module_label__3NyDU","icon":"SidebarMenuContent-module_icon__1kQOa","spinner":"SidebarMenuContent-module_spinner__K0lsy","leftWrapper":"SidebarMenuContent-module_leftWrapper__2sA9a","button":"SidebarMenuContent-module_button__3x5IE","selected":"SidebarMenuContent-module_selected__aeI_K"};
517
- styleInject(css_248z$2);
518
-
519
- var defaultRenderLink = function (_a) {
520
- _a.activeClassName; var props = __rest(_a, ["activeClassName"]);
521
- return React__namespace.createElement("button", __assign({}, props));
522
- };
523
- var SidebarMenuLink = function (_a) {
524
- var className = _a.className; _a.children; var selected = _a.selected, indent = _a.indent, label = _a.label, loading = _a.loading, left = _a.left, leftIcon = _a.leftIcon, right = _a.right, rightIcon = _a.rightIcon, success = _a.success, width = _a.width, _b = _a.renderLink, renderLink = _b === void 0 ? defaultRenderLink : _b, style = _a.style, buttonProps = __rest(_a, ["className", "children", "selected", "indent", "label", "loading", "left", "leftIcon", "right", "rightIcon", "success", "width", "renderLink", "style"]);
525
- var hasContentLeft = left || leftIcon || loading || success;
526
- var innerClassName = cx__default["default"](contentStyles.button, selected ? contentStyles.selected : undefined, className);
527
- var innerStyle = __assign(__assign({}, style), { width: width, height: "var(--swui-sidebar-menu-item-height)" });
528
- var innerChildren = (React__namespace.createElement(core.Row, { spacing: 1, flex: 1, alignItems: "center" },
529
- !hasContentLeft && React__namespace.createElement(core.Indent, null),
530
- indent && React__namespace.createElement(core.Indent, { num: 3.5 }),
531
- React__namespace.createElement(elements.ButtonContent, { label: label, loading: loading, left: left, leftIcon: leftIcon, right: right, rightIcon: rightIcon, success: success, labelClassName: contentStyles.label, spinnerClassName: contentStyles.spinner, iconClassName: cx__default["default"](contentStyles.icon), leftWrapperClassName: contentStyles.leftWrapper })));
532
- return (React__namespace.createElement(React__namespace.Fragment, null, renderLink(__assign(__assign({}, buttonProps), { activeClassName: contentStyles.selected, className: innerClassName, children: innerChildren, style: innerStyle }))));
533
- };
534
-
535
- var css_248z$1 = ".SidebarMenuHeading-module_sidebarMenuHeading__2Z8R_ {\n --swui-sidebar-menu-heading-text-color: var(--lhds-color-ui-300);\n\n /* Styling */\n\n text-transform: uppercase;\n}\n";
536
- var styles$1 = {"sidebarMenuHeading":"SidebarMenuHeading-module_sidebarMenuHeading__2Z8R_"};
537
- styleInject(css_248z$1);
538
-
539
- var SidebarMenuHeading = function (_a) {
540
- _a.className; var label = _a.label, contentLeft = _a.contentLeft, contentRight = _a.contentRight, textProps = __rest(_a, ["className", "label", "contentLeft", "contentRight"]);
541
- return (React__namespace.createElement(core.Box, { spacing: 2, indent: 2 },
542
- React__namespace.createElement(CollapsibleContent, { className: styles$1.sidebarMenuHeading, contentLeft: contentLeft, contentRight: contentRight },
543
- React__namespace.createElement(core.Text, __assign({ variant: "overline", color: "var(--swui-sidebar-menu-heading-text-color)" }, textProps), label))));
544
- };
545
-
546
- var css_248z = ".SidebarMenuCollapsible-module_sidebarMenuCollapsible__3g5N3 {\n --swui-collapsible-header-text-color: var(--current-text-color);\n --swui-collapsible-header-background-color: var(--current-background-color);\n --swui-collapsible-header-background-color-hover: var(\n --current-background-color-hover\n );\n --swui-collapsible-header-background-color-active: var(\n --current-background-color-active\n );\n --swui-collapsible-header-indicator-color: var(--current-text-color);\n --swui-collapsible-header-indicator-color-collapsed: var(\n --current-text-color\n );\n --swui-collapsible-header-indicator-color-hover: var(--current-text-color);\n --swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0 0;\n --swui-collapsible-header-content-margin: 0;\n --swui-collapsible-collapsible-link-padding: var(--swui-metrics-indent)\n var(--swui-metrics-indent) var(--swui-metrics-indent)\n calc(var(--swui-metrics-indent) * 4);\n --swui-collapsible-header-border-color: transparent;\n\n --swui-collapsible-min-height: var(--swui-sidebar-menu-item-height);\n}\n";
547
- var styles = {"sidebarMenuCollapsible":"SidebarMenuCollapsible-module_sidebarMenuCollapsible__3g5N3"};
548
- styleInject(css_248z);
549
-
550
- var SidebarMenuCollapsible = function (_a) {
551
- var children = _a.children, label = _a.label, leftIcon = _a.leftIcon;
552
- var _b = React.useState(false), collapsed = _b[0], setCollapsed = _b[1];
553
- return (React__namespace.createElement(core.Box, { background: "var(--current-background-color)" },
554
- React__namespace.createElement(Collapsible, { className: styles.sidebarMenuCollapsible, label: label, collapsed: collapsed, onClick: function () { return setCollapsed(!collapsed); }, contentLeft: leftIcon ? (React__namespace.createElement(core.Box, { width: "var(--swui-sidebar-menu-item-height)", alignItems: "center", justifyContent: "center" },
555
- React__namespace.createElement(elements.Icon, { icon: leftIcon, size: 16, color: "var(--current-text-color)", "data-hover": true }))) : (React__namespace.createElement(core.Indent, { num: 1 })) },
556
- React__namespace.createElement(core.Column, { flex: 1 }, children))));
557
- };
558
-
559
- var renderItemsExpanded = function (items, indent) {
560
- if (indent === void 0) { indent = false; }
561
- return items.map(function (item, index) {
562
- switch (item.type) {
563
- case "heading":
564
- return React__namespace.createElement(SidebarMenuHeading, { key: index, label: item.label });
565
- case "separator":
566
- return React__namespace.createElement(SidebarMenuSeparator, { key: index });
567
- case "link": {
568
- item.type; var linkProps = __rest(item, ["type"]);
569
- return React__namespace.createElement(SidebarMenuLink, __assign({ key: index, indent: indent }, linkProps));
570
- }
571
- case "grouped":
572
- return (React__namespace.createElement(SidebarMenuCollapsible, { key: index, leftIcon: item.leftIcon, label: item.label }, renderItemsExpanded(item.items, true)));
573
- default:
574
- return core.exhaustSwitchCaseElseThrow(item);
575
- }
576
- });
577
- };
578
- var renderItemsInRail = function (items, _a) {
579
- var popupMinWidth = _a.popupMinWidth;
580
- return items.map(function (item, index) {
581
- switch (item.type) {
582
- case "heading":
583
- return null;
584
- case "separator":
585
- return React__namespace.createElement(SidebarMenuSeparator, { key: index });
586
- case "link": {
587
- item.type; var label = item.label, linkProps = __rest(item, ["type", "label"]);
588
- return (React__namespace.createElement(SidebarMenuLink, __assign({ key: index, title: label, width: "var(--swui-sidebar-menu-item-height)" }, linkProps)));
589
- }
590
- case "grouped":
591
- return (React__namespace.createElement("div", { key: index },
592
- React__namespace.createElement(tooltip.Popover, { appendTo: "parent", arrow: false, offset: [0, 0], placement: "right-start", trigger: "focusin mouseenter click", disablePadding: true, lazy: true, content: React__namespace.createElement(core.Box, { minWidth: popupMinWidth, background: "var(--lhds-color-blue-500)" },
593
- React__namespace.createElement(SidebarMenuHeading, { label: item.label }),
594
- renderItemsExpanded(item.items)) },
595
- React__namespace.createElement(SidebarMenuLink, { title: item.label, width: "var(--swui-sidebar-menu-item-height)", leftIcon: item.leftIcon }))));
596
- default:
597
- return core.exhaustSwitchCaseElseThrow(item);
598
- }
599
- });
600
- };
601
-
602
- var borderTop = "1px solid ".concat(theme.cssColor("--lhds-color-orange-400"));
603
- var SelectedItemsActionsPanel = function (_a) {
604
- var numItemsSelected = _a.numItemsSelected, label = _a.label, afterLabelContent = _a.afterLabelContent, rightContent = _a.rightContent;
605
- return (React__namespace.createElement(core.Row, { indent: 3, spacing: true, minHeight: "56px", justifyContent: "space-between", alignItems: "center", borderTop: borderTop, background: theme.cssColor("--lhds-color-orange-50") },
606
- React__namespace.createElement(core.Row, { alignItems: "center" },
607
- numItemsSelected != null || label != null ? (React__namespace.createElement(React__namespace.Fragment, null, numItemsSelected != null ? (React__namespace.createElement(React__namespace.Fragment, null,
608
- React__namespace.createElement(core.Text, { variant: "bold" }, numItemsSelected),
609
- React__namespace.createElement(core.Space, null),
610
- React__namespace.createElement(core.Text, null,
611
- "item",
612
- numItemsSelected === 1 ? "" : "s",
613
- " selected"))) : label != null ? (React__namespace.createElement(React__namespace.Fragment, null, typeof label === "string" ? React__namespace.createElement(core.Text, null, label) : label)) : null)) : null,
614
- afterLabelContent ? (React__namespace.createElement(React__namespace.Fragment, null,
615
- React__namespace.createElement(core.Indent, null),
616
- React__namespace.createElement(core.Box, null, afterLabelContent))) : null),
617
- React__namespace.createElement(core.Box, null, rightContent)));
618
- };
619
-
620
- exports.ActionMenuFlatButton = ActionMenuFlatButton;
621
- exports.ActionMenuPrimaryButton = ActionMenuPrimaryButton;
622
- exports.ActionMenuSecondaryButton = ActionMenuSecondaryButton;
623
- exports.CheckboxMenu = CheckboxMenu;
624
- exports.Collapsible = Collapsible;
625
- exports.CollapsibleClickableContent = CollapsibleClickableContent;
626
- exports.CollapsibleContent = CollapsibleContent;
627
- exports.CollapsibleEmptyContent = CollapsibleEmptyContent;
628
- exports.CollapsibleGroupHeading = CollapsibleGroupHeading;
629
- exports.CollapsibleWithCheckbox = CollapsibleWithCheckbox;
630
- exports.ErrorPanel = ErrorPanel;
631
- exports.ErrorScreen = ErrorScreen;
632
- exports.LoadingPanel = LoadingPanel;
633
- exports.LoadingScreen = LoadingScreen;
634
- exports.NavBar = NavBar;
635
- exports.NavBarButton = NavBarButton;
636
- exports.NavBarHeading = NavBarHeading;
637
- exports.NavBarNotificationButton = NavBarNotificationButton;
638
- exports.NavBarPopoverButton = NavBarPopoverButton;
639
- exports.NavBarSearchField = NavBarSearchField;
640
- exports.NavBarUserButton = NavBarUserButton;
641
- exports.Notification = Notification;
642
- exports.PageHeader = PageHeader;
643
- exports.PageHeaderRow = PageHeaderRow;
644
- exports.PageHeading = PageHeading;
645
- exports.SelectedItemsActionsPanel = SelectedItemsActionsPanel;
646
- exports.SidebarMenu = SidebarMenu;
647
- exports.SidebarMenuCollapsible = SidebarMenuCollapsible;
648
- exports.SidebarMenuHeading = SidebarMenuHeading;
649
- exports.SidebarMenuLink = SidebarMenuLink;
650
- exports.SidebarMenuSeparator = SidebarMenuSeparator;
651
- exports.SidebarRailMenu = SidebarRailMenu;
652
- exports.defaultNotificationTheme = defaultNotificationTheme;
653
- exports.defaultRenderLink = defaultRenderLink;
654
- exports.mapCSSTime = mapCSSTime;
655
- exports.renderItemsExpanded = renderItemsExpanded;
656
- exports.renderItemsInRail = renderItemsInRail;
1
+ (function(){ try {var elementStyle = document.createElement('style'); elementStyle.appendChild(document.createTextNode("._navBar_1qp30_1{--swui-navbar-background-color: var(--lhds-color-blue-500);--swui-navbar-item-background-color-hover: var(--lhds-color-blue-700);--swui-navbar-item-background-color-selected: var(--lhds-color-blue-600);--swui-navbar-item-background-color-selected-hover: var( --lhds-color-blue-700 );background-color:var(--swui-navbar-background-color)}._sidebarMenuButton_1x4z8_1{--swui-nav-bar-side-menu-button-text-color: var(--lhds-color-ui-50);--swui-nav-bar-side-menu-button-background-color: var(--lhds-color-blue-500);--swui-nav-bar-side-menu-button-background-color-hover: var( --lhds-color-blue-600 );--swui-nav-bar-side-menu-button-background-color-focus: var( --lhds-color-blue-600 );--swui-nav-bar-side-menu-button-background-color-active: var( --lhds-color-blue-700 );--current-background-color: var( --swui-nav-bar-side-menu-button-background-color );display:flex;align-items:center;justify-content:center;line-height:10px;background-color:var(--current-background-color);color:var(--swui-nav-bar-side-menu-button-text-color);cursor:pointer;height:var(--swui-nav-bar-height);width:var(--swui-nav-bar-height);padding:0;margin:0;box-sizing:border-box;border-radius:0;outline:none;border:none}._sidebarMenuButton_1x4z8_1:hover{--current-background-color: var( --swui-nav-bar-side-menu-button-background-color-hover )}._sidebarMenuButton_1x4z8_1:focus-visible{--current-background-color: var( --swui-nav-bar-side-menu-button-background-color-focus )}._sidebarMenuButton_1x4z8_1:active{--current-background-color: var( --swui-nav-bar-side-menu-button-background-color-active )}._sidebarMenuButton_1x4z8_1 ._icon_1x4z8_55{color:var(--swui-nav-bar-side-menu-button-text-color)}._navBarButton_1xy53_1{--swui-nav-bar-button-text-color: var(--lhds-color-ui-50);--swui-nav-bar-button-background-color: transparent;--swui-nav-bar-button-background-color-hover: var(--lhds-color-blue-900);--swui-nav-bar-button-background-color-focus: var(--lhds-color-blue-700);--swui-nav-bar-button-background-color-active: var(--lhds-color-blue-800);--swui-nav-bar-button-background-color-selected: var(--lhds-color-blue-600);--swui-nav-bar-button-background-color-selected-hover: var( --lhds-color-blue-700 );--swui-nav-bar-button-background-color-selected-focus: var( --lhds-color-blue-700 );--swui-nav-bar-button-background-color-selected-active: var( --lhds-color-blue-800 );--swui-flat-button-text-color: var(--swui-nav-bar-button-text-color);--swui-flat-button-icon-color: var(--swui-nav-bar-button-text-color);--swui-flat-button-text-color-active: var(--swui-nav-bar-button-text-color);--swui-flat-button-background-color: var( --swui-nav-bar-button-background-color );--swui-flat-button-background-color-hover: var( --swui-nav-bar-button-background-color-hover );--swui-flat-button-background-color-focus: var( --swui-nav-bar-button-background-color-focus );--swui-flat-button-background-color-active: var( --swui-nav-bar-button-background-color-active )}._navBarButton_1xy53_1._selected_1xy53_36{--swui-flat-button-background-color: var( --swui-nav-bar-button-background-color-selected );--swui-flat-button-background-color-hover: var( --swui-nav-bar-button-background-color-selected-hover );--swui-flat-button-background-color-focus: var( --swui-nav-bar-button-background-color-selected-focus );--swui-flat-button-background-color-active: var( --swui-nav-bar-button-background-color-selected-active )}._navBarNotificationButton_1wchp_1{--swui-nav-bar-notification-button-text-color: var(--lhds-color-ui-50);--swui-nav-bar-notification-button-background-color: var( --lhds-color-blue-700 );--swui-nav-bar-notification-button-background-color-hover: var( --lhds-color-blue-900 );--swui-nav-bar-notification-button-background-color-focus: var( --lhds-color-blue-700 );--swui-nav-bar-notification-button-background-color-active: var( --lhds-color-blue-800 );--swui-nav-bar-notification-button-background-color-unread: var( --lhds-color-red-500 );--swui-nav-bar-notification-button-background-color-unread-hover: var( --lhds-color-red-700 );--swui-nav-bar-notification-button-background-color-unread-focus: var( --lhds-color-red-700 );--swui-nav-bar-notification-button-background-color-unread-active: var( --lhds-color-red-800 );--swui-flat-button-text-color: var( --swui-nav-bar-notification-button-text-color );--swui-flat-button-icon-color: var( --swui-nav-bar-notification-button-text-color );--swui-flat-button-text-color-active: var( --swui-nav-bar-notification-button-text-color );--swui-flat-button-background-color: var( --swui-nav-bar-notification-button-background-color );--swui-flat-button-background-color-hover: var( --swui-nav-bar-notification-button-background-color-hover );--swui-flat-button-background-color-focus: var( --swui-nav-bar-notification-button-background-color-focus );--swui-flat-button-background-color-active: var( --swui-nav-bar-notification-button-background-color-active );--swui-button-border-radius: 16px;--swui-button-border-radius-icon-only: 16px;--swui-nav-bar-notification-shake-count: 3;transition:.5s width;width:32px}._navBarNotificationButton_1wchp_1._hasCount_1wchp_60{width:56px}._navBarNotificationButton_1wchp_1._unread_1wchp_64{--swui-flat-button-background-color: var( --swui-nav-bar-notification-button-background-color-unread );--swui-flat-button-background-color-hover: var( --swui-nav-bar-notification-button-background-color-unread-hover );--swui-flat-button-background-color-focus: var( --swui-nav-bar-notification-button-background-color-unread-focus );--swui-flat-button-background-color-active: var( --swui-nav-bar-notification-button-background-color-unread-active )}._navBarNotificationButton_1wchp_1._unread_1wchp_64._hasCount_1wchp_60 ._icon_1wchp_79{-webkit-transform-origin:top center;transform-origin:top center;-webkit-animation:_shake_1wchp_1 1.5s ease-in-out var(--swui-nav-bar-notification-shake-count);animation:_shake_1wchp_1 1.5s ease-in-out var(--swui-nav-bar-notification-shake-count)}@-webkit-keyframes _shake_1wchp_1{0%{-webkit-transform:rotate(0);transform:rotate(0)}7%{-webkit-transform:rotate(20deg);transform:rotate(20deg)}15%{-webkit-transform:rotate(-20deg);transform:rotate(-20deg)}22%{-webkit-transform:rotate(16deg);transform:rotate(16deg)}30%{-webkit-transform:rotate(-16deg);transform:rotate(-16deg)}38%{-webkit-transform:rotate(6deg);transform:rotate(6deg)}42%{-webkit-transform:rotate(-6deg);transform:rotate(-6deg)}46%{-webkit-transform:rotate(2deg);transform:rotate(2deg)}to{-webkit-transform:rotate(0);transform:rotate(0)}}@keyframes _shake_1wchp_1{0%{-webkit-transform:rotate(0);transform:rotate(0)}7%{-webkit-transform:rotate(20deg);transform:rotate(20deg)}15%{-webkit-transform:rotate(-20deg);transform:rotate(-20deg)}22%{-webkit-transform:rotate(16deg);transform:rotate(16deg)}30%{-webkit-transform:rotate(-16deg);transform:rotate(-16deg)}38%{-webkit-transform:rotate(6deg);transform:rotate(6deg)}42%{-webkit-transform:rotate(-6deg);transform:rotate(-6deg)}46%{-webkit-transform:rotate(2deg);transform:rotate(2deg)}to{-webkit-transform:rotate(0);transform:rotate(0)}}._navBarSearchFieldInput_4knxd_1{--swui-textinput-line-height: 2.7rem;--swui-textinput-text-color: var(--lhds-color-ui-50)}._navBarSearchFieldInput_4knxd_1:focus{--swui-textinput-text-color: var(--lhds-color-ui-800)}._navBarSearchField_4knxd_1{--swui-textinput-animation-time: var(--swui-animation-time-fast);--swui-textinput-placeholder-color: var(--lhds-color-ui-500);--swui-textinput-bg-color: var(--lhds-color-blue-600);--swui-textinput-border-color: transparent;--swui-textinput-border-color-hover: transparent}._navBarSearchField_4knxd_1:focus-within{--swui-textinput-text-color: var(--lhds-color-ui-800);--swui-field-text-color: var(--swui-field-text-color);--swui-textinput-icon-color: var(--lhds-color-ui-500);--swui-textinput-bg-color: var(--lhds-color-ui-50)}._navBarUserButton_1gxfr_1{--swui-nav-bar-user-button-text-color: var(--lhds-color-ui-50);--swui-nav-bar-user-button-background-color: var(--lhds-color-blue-700);--swui-nav-bar-user-button-background-color-hover: var(--lhds-color-blue-900);--swui-nav-bar-user-button-background-color-focus: var(--lhds-color-blue-700);--swui-nav-bar-user-button-background-color-active: var( --lhds-color-blue-800 );--swui-flat-button-text-color: var(--swui-nav-bar-user-button-text-color);--swui-flat-button-icon-color: var(--swui-nav-bar-user-button-text-color);--swui-flat-button-text-color-active: var( --swui-nav-bar-user-button-text-color );--swui-flat-button-background-color: var( --swui-nav-bar-user-button-background-color );--swui-flat-button-background-color-hover: var( --swui-nav-bar-user-button-background-color-hover );--swui-flat-button-background-color-focus: var( --swui-nav-bar-user-button-background-color-focus );--swui-flat-button-background-color-active: var( --swui-nav-bar-user-button-background-color-active );--swui-button-border-radius: 16px;--swui-button-border-radius-icon-only: 16px}._navBarUserButton_1gxfr_1._initials_1gxfr_33{width:32px}._collapsible_1nroa_1{--swui-collapsible-animation-time: var(--swui-animation-time-fast);--swui-collapsible-expanded-line-background-color: var( --swui-primary-action-color );--swui-collapsible-header-text-color: var(--lhds-color-ui-900);--swui-collapsible-header-background-color: var(--swui-white);--swui-collapsible-header-background-color-hover: var(--lhds-color-blue-100);--swui-collapsible-header-background-color-active: var(--lhds-color-blue-100);--swui-collapsible-header-border-color: var(--lhds-color-ui-300);--swui-collapsible-header-border-color-focus: var( --swui-primary-action-color );--swui-collapsible-header-focus-shadow: var(--swui-field-focus-shadow);--swui-collapsible-header-content-margin: calc( var(--swui-metrics-indent) * 2 );--swui-collapsible-header-font-weight: var(--swui-font-weight-text-bold);--swui-collapsible-header-indicator-color: var(--swui-primary-action-color);--swui-collapsible-header-indicator-color-collapsed: var(--lhds-color-ui-500);--swui-collapsible-header-indicator-color-hover: var( --swui-primary-action-color );--swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0;--swui-collapsible-content-background-color: var(--lhds-color-ui-100);--swui-collapsible-content-border-color: var(--lhds-color-ui-300);--swui-collapsible-content-padding: var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 2);--swui-collapsible-groupheading-font-size: var(--swui-font-size-smaller);--swui-collapsible-groupheading-text-color: var(--lhds-color-ui-600);--swui-collapsible-min-height: 40px}._collapsible_1nroa_1 ._header_1nroa_46{background-color:var(--swui-collapsible-header-background-color);width:100%;text-align:left;min-height:var(--swui-collapsible-min-height);box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--swui-collapsible-header-border-color);padding:var(--swui-collapsible-header-padding)}._collapsible_1nroa_1 ._header_1nroa_46 ._indicator_1nroa_59{transition:all var(--swui-collapsible-animation-time) ease-in-out;margin-left:var(--swui-collapsible-header-content-margin);color:var(--swui-collapsible-header-indicator-color)}._collapsible_1nroa_1 ._header_1nroa_46:not(:disabled):hover:not(:active){background-color:var(--swui-collapsible-header-background-color-hover)}._collapsible_1nroa_1 ._header_1nroa_46:not(:disabled):hover:not(:active) ._indicator_1nroa_59{color:var(--swui-collapsible-header-indicator-color-hover)}._collapsible_1nroa_1 ._header_1nroa_46:focus-visible{outline:1px solid var(--swui-collapsible-header-border-color-focus);outline-offset:-1px;box-shadow:var(--swui-collapsible-header-focus-shadow)}._collapsible_1nroa_1 ._header_1nroa_46:active{background:var(--swui-collapsible-header-background-color-active)}._collapsible_1nroa_1 ._header_1nroa_46:disabled{cursor:not-allowed}._collapsible_1nroa_1{position:relative}._collapsible_1nroa_1:before{content:\"\";position:absolute;width:2px;background:var(--swui-collapsible-expanded-line-background-color);top:0;bottom:0;left:0;z-index:1}._collapsible_1nroa_1 ._headerText_1nroa_103{font-weight:var(--swui-collapsible-header-font-weight)}._collapsible_1nroa_1[aria-expanded=false]{--swui-collapsible-expanded-line-background-color: transparent}._collapsible_1nroa_1[aria-expanded=false] ._indicator_1nroa_59{color:var(--swui-collapsible-header-indicator-color-collapsed)}._collapsible_1nroa_1 ._label_1nroa_114{margin-right:auto}._collapsible_1nroa_1 ._label_1nroa_114 span{--current-line-height: 1;font-weight:var(--swui-collapsible-header-font-weight)}._collapsible_1nroa_1 ._contentLeft_1nroa_123,._collapsible_1nroa_1 ._contentRight_1nroa_124{display:flex}._collapsible_1nroa_1 ._contentLeft_1nroa_123 button,._collapsible_1nroa_1 ._contentRight_1nroa_124 button{cursor:pointer}._collapsible_1nroa_1 ._contentLeft_1nroa_123{margin-right:var(--swui-collapsible-header-content-margin)}._collapsible_1nroa_1 ._contentRight_1nroa_124{margin-left:auto}._collapsible_1nroa_1 ._content_1nroa_123{display:flex;align-items:center;justify-content:stretch;background:var(--swui-collapsible-content-background-color);padding:var(--swui-collapsible-content-padding);min-height:var(--swui-collapsible-min-height);box-sizing:border-box}._collapsible_1nroa_1 ._content_1nroa_123:last-child{border-bottom:1px solid var(--swui-collapsible-content-border-color)}._collapsible_1nroa_1 ._content_1nroa_123._groupHeading_1nroa_155{border:none;font-size:var(--swui-collapsible-groupheading-font-size);font-family:var(--swui-font-primary);color:var(--swui-collapsible-groupheading-text-color);text-transform:uppercase;font-weight:var(--swui-font-weight-text-bold);letter-spacing:.1rem}._collapsible_1nroa_1 ._content_1nroa_123 [data-hidden=true]{display:none}._collapsible_1nroa_1 ._content_1nroa_123:hover [data-hidden=true]{display:inherit}._collapsible_1nroa_1 ._content_1nroa_123:hover [data-hover=true]{color:var(--swui-collapsible-header-indicator-color-hover)}._collapsible_1nroa_1 ._contentEnter_1nroa_180{opacity:0}._collapsible_1nroa_1 ._contentEnterActive_1nroa_184{opacity:1;transition:opacity var(--swui-collapsible-animation-time) ease-in-out}._collapsible_1nroa_1 ._contentExitDone_1nroa_189{display:none}._collapsible_1nroa_1 button._content_1nroa_123{font-family:var(--swui-font-primary);font-size:inherit;width:100%;text-align:left}._collapsible_1nroa_1 button._content_1nroa_123:focus-visible{outline:1px solid var(--swui-collapsible-header-border-color-focus);outline-offset:-1px;box-shadow:var(--swui-collapsible-header-focus-shadow)}._collapsible_1nroa_1 button._content_1nroa_123:not(:disabled):hover{background-color:var(--swui-collapsible-header-background-color-hover)}._collapsible_1nroa_1 button._content_1nroa_123:disabled{cursor:not-allowed}._collapsible_1nroa_1 button._content_1nroa_123:focus-within [data-hidden=true]{display:inherit}._collapsible_1nroa_1 ._collapsible_1nroa_1{--swui-collapsible-header-background-color: var( --swui-collapsible-content-background-color );--swui-collapsible-header-font-weight: normal}._collapsible_1nroa_1 ._collapsible_1nroa_1{--swui-collapsible-content-padding: var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 2) var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 4)}._collapsible_1nroa_1 ._collapsible_1nroa_1 ._collapsible_1nroa_1{--swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0 calc(var(--swui-metrics-indent) * 4);--swui-collapsible-content-padding: var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 2) var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 6)}._collapsible_1nroa_1 ._collapsible_1nroa_1 ._collapsible_1nroa_1 ._collapsible_1nroa_1{--swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0 calc(var(--swui-metrics-indent) * 6);--swui-collapsible-content-padding: var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 2) var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 8)}._collapsible_1nroa_1 ._collapsible_1nroa_1 ._collapsible_1nroa_1 ._collapsible_1nroa_1 ._collapsible_1nroa_1{--swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0 calc(var(--swui-metrics-indent) * 8);--swui-collapsible-content-padding: var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 2) var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 10)}._sidebarMenu_hch18_1{--swui-sidebar-menu-separator-color: var(--lhds-color-blue-700);--swui-sidebar-menu-text-color: var(--swui-white);--swui-sidebar-menu-icon-color: var(--swui-white);--swui-sidebar-menu-background-color: var(--lhds-color-blue-500);--swui-sidebar-menu-background-color-hover: var(--lhds-color-blue-700);--swui-sidebar-menu-background-color-focus: var(--lhds-color-blue-700);--swui-sidebar-menu-background-color-active: var(--lhds-color-blue-600);--swui-sidebar-menu-item-selected: var(--lhds-color-blue-800);--swui-sidebar-menu-content-padding: var(--swui-metrics-indent) var(--swui-metrics-indent) var(--swui-metrics-indent) 0;--current-separator-color: var(--swui-sidebar-menu-separator-color);--current-text-color: var(--swui-sidebar-menu-text-color);--current-icon-color: var(--swui-sidebar-menu-icon-color);--current-background-color: var(--swui-sidebar-menu-background-color);--current-background-color-hover: var( --swui-sidebar-menu-background-color-hover );--current-background-color-focus: var( --swui-sidebar-menu-background-color-focus );--current-background-color-active: var( --swui-sidebar-menu-background-color-active );--current-item-selected: var(--swui-sidebar-menu-item-selected);--current-content-padding: var(--swui-sidebar-menu-content-padding);background-color:var(--current-background-color);height:100vh}._sidebarMenu_hch18_1[data-collapsed]{width:var(--swui-sidebar-menu-item-height)}._sidebarMenu_hch18_1 button{--swui-button-text-color: var(--swui-white);--swui-button-background-color-hover: var( --swui-sidebar-menu-background-color-hover )}._sidebarMenuCloseButton_1j21u_1{--swui-sidebar-menu-close-button-text-color: var(--lhds-color-ui-50);--swui-sidebar-menu-close-button-background-color: var(--lhds-color-blue-500);--swui-sidebar-menu-close-button-background-color-hover: var( --lhds-color-blue-600 );--swui-sidebar-menu-close-button-background-color-focus: var( --lhds-color-blue-600 );--swui-sidebar-menu-close-button-background-color-active: var( --lhds-color-blue-500 );--current-background-color: var( --swui-sidebar-menu-close-button-background-color );display:flex;align-items:center;justify-content:flex-start;line-height:10px;background-color:var(--current-background-color);color:var(--swui-sidebar-menu-close-button-text-color);cursor:pointer;height:var(--swui-sidebar-menu-item-height);padding:0;margin:0;box-sizing:border-box;border-radius:0;outline:none;border:none}._sidebarMenuCloseButton_1j21u_1:hover{--current-background-color: var( --swui-sidebar-menu-close-button-background-color-hover )}._sidebarMenuCloseButton_1j21u_1:focus{--current-background-color: var( --swui-sidebar-menu-close-button-background-color-focus )}._sidebarMenuCloseButton_1j21u_1:active{--current-background-color: var( --swui-sidebar-menu-close-button-background-color-active )}._sidebarMenuCloseButton_1j21u_1 ._iconWrapper_1j21u_55{justify-content:center;align-items:center;width:var(--swui-sidebar-menu-item-height);height:var(--swui-sidebar-menu-item-height)}._sidebarMenuCloseButton_1j21u_1 ._icon_1j21u_55{color:var(--swui-sidebar-menu-close-button-text-color)}._label_mnp0f_1{font-size:var(--current-text-size, var(--swui-font-size-medium));line-height:var(--current-line-height, var(--swui-line-height-medium));font-weight:var(--swui-button-font-weight);font-family:var(--swui-font-buttons);color:var(--current-text-color)}._icon_mnp0f_9{color:var(--current-text-color);font-size:1.6rem}._spinner_mnp0f_14{color:var(--current-text-color)}._leftWrapper_mnp0f_18._leftWrapper_mnp0f_18._leftWrapper_mnp0f_18._leftWrapper_mnp0f_18{width:var(--swui-sidebar-menu-item-height);margin-right:0}._button_mnp0f_23{border:0;padding:0;background:var(--current-background-color)}[data-collapsed] [aria-expanded=true] ._button_mnp0f_23,._button_mnp0f_23:hover{background:var(--current-background-color-hover)}._button_mnp0f_23:focus{outline:none}._button_mnp0f_23:focus-visible{background:var(--current-background-color-active)}._button_mnp0f_23:active{background:var(--current-background-color-active)}._button_mnp0f_23._selected_mnp0f_45{background:var(--current-item-selected)}._sidebarMenuHeading_kvpq5_1{--swui-sidebar-menu-heading-text-color: var(--lhds-color-ui-300);text-transform:uppercase}._sidebarMenuCollapsible_1jwhs_1{--swui-collapsible-header-text-color: var(--current-text-color);--swui-collapsible-header-background-color: var(--current-background-color);--swui-collapsible-header-background-color-hover: var( --current-background-color-hover );--swui-collapsible-header-background-color-active: var( --current-background-color-active );--swui-collapsible-header-indicator-color: var(--current-text-color);--swui-collapsible-header-indicator-color-collapsed: var( --current-text-color );--swui-collapsible-header-indicator-color-hover: var(--current-text-color);--swui-collapsible-header-padding: 0 calc(var(--swui-metrics-indent) * 2) 0 0;--swui-collapsible-header-content-margin: 0;--swui-collapsible-collapsible-link-padding: var(--swui-metrics-indent) var(--swui-metrics-indent) var(--swui-metrics-indent) calc(var(--swui-metrics-indent) * 4);--swui-collapsible-header-border-color: transparent;--swui-collapsible-min-height: var(--swui-sidebar-menu-item-height)}")); document.head.appendChild(elementStyle);} catch(e) {console.error('vite-plugin-css-injected-by-js', e);} })();"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var l=require("@stenajs-webui/elements"),w=require("react"),t=require("@stenajs-webui/core"),R=require("@stenajs-webui/tooltip"),e=require("react/jsx-runtime"),O=require("@stenajs-webui/forms"),oe=require("classnames"),_=require("@stenajs-webui/theme"),ie=require("date-fns"),le=require("@fortawesome/free-solid-svg-icons"),ce=require("@fortawesome/free-solid-svg-icons/faChevronUp"),ue=require("react-transition-group"),de=require("@fortawesome/free-solid-svg-icons/faInbox");function xe(n){return n&&typeof n=="object"&&"default"in n?n:{default:n}}function he(n){if(n&&n.__esModule)return n;var a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});return n&&Object.keys(n).forEach(function(s){if(s!=="default"){var r=Object.getOwnPropertyDescriptor(n,s);Object.defineProperty(a,s,r.get?r:{enumerable:!0,get:function(){return n[s]}})}}),a.default=n,Object.freeze(a)}var S=he(w),x=xe(oe);const D=({renderItems:n,placement:a="bottom",buttonComponent:s,rightIcon:r=l.stenaAngleDown,portalTarget:o="parent",zIndex:i,menuWidth:c,menuTop:d,onClick:h,disableArrow:j=!1,...f})=>{const[g,m,p,N]=t.useBoolean(!1),v=w.useRef(null),y={name:"focusManager",defaultValue:!0,fn({popper:I}){let F=!1;const z=B=>{B.key==="Escape"&&(F=!0,p()),(B.key==="Enter"||B.key===" ")&&(F=!0)};return{onCreate(){I.addEventListener("keydown",z)},onDestroy(){I.removeEventListener("keydown",z)},onMount(){var B;F=!1,(B=I.querySelector("button:not([disabled]), a[href]"))==null||B.focus()},onHide(){v.current&&F&&v.current.focus()}}}},b=w.useMemo(()=>({open:m,close:p}),[m,p]),M=I=>{h==null||h(I),N()};return e.jsx(R.Popover,{disablePadding:!0,visible:g,onClickOutside:p,placement:a,content:g&&e.jsx(l.ActionMenu,{variant:"outlined",width:c,top:d,trapFocus:!0,children:e.jsx(l.ActionMenuContext.Provider,{value:b,children:n(p)})}),arrow:!1,appendTo:o,zIndex:i,plugins:[y],lazy:!0,children:e.jsx(s,{rightIcon:j?void 0:r,...f,ref:v,onClick:M})})},pe=n=>e.jsx(D,{buttonComponent:l.PrimaryButton,...n}),je=n=>e.jsx(D,{buttonComponent:l.SecondaryButton,...n}),J=n=>e.jsx(D,{buttonComponent:l.FlatButton,...n}),fe="1px solid var(--lhds-color-ui-300)",ge=({renderMenu:n,...a})=>{const[s,r,o]=t.useBoolean(!1);return e.jsx(R.Popover,{onClickOutside:o,arrow:!1,visible:s,disablePadding:!0,content:n?e.jsx(t.Column,{children:e.jsx(l.ActionMenu,{children:n(o)})}):void 0,placement:"bottom-start",variant:"outlined",children:e.jsx(t.Box,{display:"inline-block",children:e.jsxs(t.Row,{spacing:.5,indent:!0,alignItems:"center",border:fe,borderRadius:"4px",children:[e.jsx(O.Checkbox,{...a}),e.jsx(t.Indent,{num:.5}),e.jsx(l.FlatButton,{size:"small",onClick:r,leftIcon:l.stenaAngleDown})]})})})},me="_navBar_1qp30_1";var ve={navBar:me};const be="_sidebarMenuButton_1x4z8_1",Ce="_icon_1x4z8_55";var U={sidebarMenuButton:be,icon:Ce};const _e=n=>S.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 24 24",...n},S.createElement("path",{fill:"#FFF",fillRule:"evenodd",d:"M22,5 L2,5 C2.11992373,5 2,4.85076158 2,5 L2,3 C2,3.14923842 2.11992373,3 2,3 L22,3 C21.8800763,3 22,3.14923842 22,3 L22,5 C22,4.85076158 21.8800763,5 22,5 Z M22,13 L2,13 C2.11992373,13 2,12.8507616 2,13 L2,11 C2,11.1492384 2.11992373,11 2,11 L22,11 C21.8800763,11 22,11.1492384 22,11 L22,13 C22,12.8507616 21.8800763,13 22,13 Z M22,21 L2,21 C2.11992373,21 2,20.8507616 2,21 L2,19 C2,19.1492384 2.11992373,19 2,19 L22,19 C21.8800763,19 22,19.1492384 22,19 L22,21 C22,20.8507616 21.8800763,21 22,21 Z"})),K=({className:n,onClick:a})=>e.jsx("button",{onClick:a,className:x.default(U.sidebarMenuButton,n),children:e.jsx(_e,{className:U.icon})}),Be={compact:40,standard:48,relaxed:64},Q=n=>Be[n]+"px",we=({left:n,className:a,showMenuButton:s=!1,menuButtonVisibility:r="visible",children:o,right:i,center:c,variant:d="standard",onClickMenuButton:h})=>{const j=c?1:void 0,f=Q(d);return e.jsxs(t.Row,{height:f,minHeight:f,justifyContent:"space-between",style:{["--swui-nav-bar-height"]:f},className:x.default(ve.navBar,a),children:[e.jsxs(t.Row,{flex:j,justifyContent:"flex-start",alignItems:"center",children:[s?e.jsxs(e.Fragment,{children:[r==="hidden"?e.jsx(t.Box,{width:"var(--swui-nav-bar-height)"}):e.jsx(K,{onClick:h}),e.jsx(t.Indent,{})]}):e.jsx(t.Indent,{num:2}),n?e.jsxs(e.Fragment,{children:[n,e.jsx(t.Indent,{num:2})]}):e.jsx(t.Indent,{num:2}),o&&e.jsx(e.Fragment,{children:e.jsx(t.Row,{justifyContent:"center",alignItems:"center",children:S.Children.map(o,(g,m)=>e.jsxs(e.Fragment,{children:[m>0&&e.jsx(t.Indent,{}),g]}))})})]}),c&&e.jsx(t.Row,{justifyContent:"center",alignItems:"center",children:c}),e.jsxs(t.Row,{justifyContent:"flex-end",alignItems:"center",flex:j,children:[i,e.jsx(t.Indent,{num:2})]})]})},Se="_navBarButton_1xy53_1",Ne="_selected_1xy53_36";var Z={navBarButton:Se,selected:Ne};const X=({selected:n,className:a,...s})=>e.jsx(l.FlatButton,{...s,className:x.default(Z.navBarButton,n&&Z.selected,a)}),ye=n=>e.jsx(t.Heading,{whiteSpace:"nowrap",color:"#fff",...n}),Me=({content:n,children:a,...s})=>{const[r,o,i]=t.useBoolean(!1);return e.jsx(R.Popover,{onClickOutside:i,triggerTarget:document.body,visible:r,content:e.jsxs(e.Fragment,{children:[n&&n({close:i}),a]}),children:e.jsx(X,{...s,onClick:o})})},Ie="_navBarNotificationButton_1wchp_1",ke="_hasCount_1wchp_60",Fe="_unread_1wchp_64",Le="_icon_1wchp_79",Re="_shake_1wchp_1";var k={navBarNotificationButton:Ie,hasCount:ke,unread:Fe,icon:Le,shake:Re};const Ee=({count:n,unread:a=!1,className:s,labelClassName:r,iconClassName:o,icon:i=l.stenaBell,...c})=>{const d=n>0;return e.jsx(l.FlatButton,{...c,leftIcon:i,className:x.default({[k.unread]:a},{[k.hasCount]:d},k.navBarNotificationButton,s),label:d?String(n):void 0,labelClassName:x.default(r,k.label),iconClassName:x.default(o,k.icon)})},He="_navBarSearchFieldInput_4knxd_1",Pe="_navBarSearchField_4knxd_1";var G={navBarSearchFieldInput:He,navBarSearchField:Pe};const Te=({placeholder:n="Search...",className:a,wrapperClassName:s,...r})=>e.jsx(O.TextInput,{wrapperClassName:x.default(G.navBarSearchField,s),className:x.default(G.navBarSearchFieldInput,a),placeholder:n,contentRight:e.jsx(t.Clickable,{children:e.jsx(l.Icon,{icon:l.stenaSearch})}),...r}),Ae="_navBarUserButton_1gxfr_1",Oe="_initials_1gxfr_33";var V={navBarUserButton:Ae,initials:Oe};const De=({className:n,username:a,initials:s,icon:r=l.stenaUser,iconClassName:o,...i})=>e.jsx(J,{...i,className:x.default({[V.initials]:s!=null},V.navBarUserButton,n),leftIcon:a!=null?l.stenaUser:void 0,label:s!=null?s:a,disableArrow:!0}),Y={notificationBg:"#eaeaea",notificationHoverBg:"#eeeeee",notificationDismissedBg:"#ffffff",notificationDismissedHoverBg:"#f4f4f4"},qe=({onClick:n,icon:a,iconColor:s,title:r,text:o,content:i,date:c,dismissed:d,theme:h=Y})=>{const j=w.useMemo(()=>{if(c)return`${ie.formatDistance(c,new Date)} ago`},[c]);return e.jsx(t.Clickable,{onClick:n,style:{textAlign:"left"},children:e.jsx(t.Box,{background:d?h.notificationDismissedBg:h.notificationBg,hoverBackground:d?h.notificationDismissedHoverBg:h.notificationHoverBg,spacing:!0,indent:!0,children:e.jsxs(t.Row,{width:"250px",children:[a&&e.jsx(t.Row,{width:"34px",alignItems:"center",children:e.jsx(l.Icon,{icon:a,color:s})}),e.jsxs(t.Column,{flex:1,children:[r&&e.jsxs(e.Fragment,{children:[e.jsx(t.Text,{children:r}),e.jsx(t.Space,{half:!0})]}),o&&e.jsxs(e.Fragment,{children:[e.jsx(t.Text,{size:"small",children:o}),e.jsx(t.Space,{half:!0})]}),i&&e.jsxs(e.Fragment,{children:[i,e.jsx(t.Space,{half:!0})]}),e.jsx(t.Text,{size:"small",color:_.cssColor("--swui-text-disabled-color"),children:j})]})]})})})},$e="_collapsible_1nroa_1",We="_header_1nroa_46",ze="_indicator_1nroa_59",Ue="_headerText_1nroa_103",Ze="_label_1nroa_114",Ge="_contentLeft_1nroa_123",Ve="_contentRight_1nroa_124",Je="_content_1nroa_123",Ke="_groupHeading_1nroa_155",Qe="_contentEnter_1nroa_180",Xe="_contentEnterActive_1nroa_184",Ye="_contentExitDone_1nroa_189";var u={collapsible:$e,header:We,indicator:ze,headerText:Ue,label:Ze,contentLeft:Ge,contentRight:Ve,content:Je,groupHeading:Ke,contentEnter:Qe,contentEnterActive:Xe,contentExitDone:Ye};const E=()=>e.jsxs(t.Column,{indent:!0,spacing:!0,flex:1,alignItems:"center",children:[e.jsx(l.Icon,{icon:de.faInbox,color:_.cssColor("--lhds-color-ui-500")}),e.jsx(t.Space,{}),e.jsx(t.Text,{size:"small",color:_.cssColor("--lhds-color-ui-500"),children:"No content"})]}),H=({contentLeft:n,contentRight:a,className:s,children:r,...o})=>e.jsxs("div",{className:x.default(u.content,s),...o,children:[n&&e.jsx("div",{className:u.contentLeft,children:n}),r!=null?r:e.jsx(E,{}),a&&e.jsx("div",{className:u.contentRight,children:a})]}),ee=n=>{const a=parseFloat(n),s=n.match(/m?s/);switch(s==null?void 0:s[0]){case"s":return a*1e3;case"ms":return a;default:return 0}},q=w.forwardRef(function({label:a,contentLeft:s,contentRight:r,collapsed:o=!1,onClick:i,className:c,disabled:d=!1,unmountOnCollapse:h=!1,mountOnEnter:j=!0,icon:f=ce.faChevronUp,iconCollapsed:g=le.faChevronDown,iconSize:m=8,children:p,autoFocus:N=!1,...v},y){const b=S.useRef(null),M=b.current?ee(getComputedStyle(b.current).getPropertyValue("--swui-collapsible-animation-time")):void 0;return e.jsxs("div",{className:x.default(u.collapsible,c),"aria-expanded":!o,ref:b,...v,children:[e.jsxs(t.Clickable,{disableFocusHighlight:!0,disableOpacityOnClick:!0,className:u.header,onClick:i,disabled:d,autoFocus:N,ref:y,children:[s&&e.jsx("div",{className:u.contentLeft,children:s}),e.jsx("div",{className:u.label,children:e.jsx(t.Text,{color:"var(--swui-collapsible-header-text-color)",className:u.headerText,children:a})}),r&&e.jsx("div",{className:u.contentRight,children:r}),e.jsx(l.Icon,{icon:o?g:f,className:u.indicator,size:m,fixedWidth:!0})]}),e.jsx(ue.CSSTransition,{in:!o,timeout:{enter:M},classNames:{enter:u.contentEnter,enterActive:u.contentEnterActive,exit:u.contentExit,exitActive:u.contentExitActive,exitDone:u.contentExitDone},mountOnEnter:j,unmountOnExit:h,children:e.jsx("div",{role:"region",children:p!=null?p:e.jsx(H,{children:e.jsx(E,{})})})})]})}),en=({value:n,onValueChange:a,onChange:s,indeterminate:r,...o})=>e.jsx(q,{contentLeft:e.jsx(O.Checkbox,{value:n,indeterminate:r,onValueChange:a,onChange:s,onClick:i=>i.stopPropagation()}),...o}),nn=({contentLeft:n,contentRight:a,className:s,onClick:r,children:o,...i})=>e.jsxs(t.Clickable,{disableFocusHighlight:!0,disableOpacityOnClick:!0,className:x.default(u.content,s),onClick:r,...i,children:[n&&e.jsx("div",{className:u.contentLeft,children:n}),o!=null?o:e.jsx(E,{}),a&&e.jsx("div",{className:u.contentRight,children:a})]}),tn=({className:n,...a})=>e.jsx(H,{className:x.default(u.groupHeading,n),...a}),ne=({text:n="Something unexpected happened."})=>e.jsx(t.Box,{justifyContent:"center",alignItems:"center",children:e.jsx(l.Banner,{variant:"error",headerText:n})}),sn=n=>e.jsx(t.Box,{width:"100%",height:"100%",justifyContent:"center",alignItems:"center",children:e.jsx(ne,{...n})}),te=({text:n="Loading..."})=>e.jsxs(t.Box,{alignItems:"center",children:[e.jsx(l.Spinner,{size:"small"}),e.jsx(t.Space,{num:4}),e.jsx(t.Heading,{variant:"h4",children:n})]}),an=n=>e.jsx(t.Box,{width:"100%",height:"100%",justifyContent:"center",alignItems:"center",children:e.jsx(te,{...n})}),rn=({renderBreadCrumbs:n,renderPageHeading:a,renderTabs:s,children:r})=>e.jsxs(t.Box,{shadow:"box",background:_.cssColor("--lhds-color-ui-50"),children:[e.jsxs(t.Box,{indent:3,children:[n&&e.jsx(t.Row,{spacing:1.25,children:n()}),a==null?void 0:a(),s==null?void 0:s()]}),r&&e.jsxs(e.Fragment,{children:[!s&&e.jsx(t.Space,{}),e.jsx(t.SeparatorLine,{}),r]})]}),on=n=>e.jsx(t.Row,{indent:3,spacing:!0,...n}),ln={compact:1,standard:1.5,relaxed:2},cn=({heading:n,variant:a="standard",contentLeft:s,contentRight:r})=>e.jsxs(t.Row,{spacing:ln[a],alignItems:"center",gap:2,children:[e.jsx(t.Heading,{variant:"h3",children:n}),e.jsx(t.Row,{alignItems:"center",children:s}),e.jsx(t.Row,{style:{marginLeft:"auto"},alignItems:"center",children:r})]}),un="_sidebarMenu_hch18_1";var T={sidebarMenu:un};const dn="_sidebarMenuCloseButton_1j21u_1",xn="_iconWrapper_1j21u_55",hn="_icon_1j21u_55";var A={sidebarMenuCloseButton:dn,iconWrapper:xn,icon:hn};const pn=n=>S.createElement("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg",...n},S.createElement("path",{d:"M0.928932188,0.928932188 C1.31945648,0.538407896 1.95262146,0.538407896 2.34314575,0.928932188 L2.34314575,0.928932188 L8.00003897,6.58503897 L13.6568542,0.928932188 C14.0473785,0.538407896 14.6805435,0.538407896 15.0710678,0.928932188 C15.4615921,1.31945648 15.4615921,1.95262146 15.0710678,2.34314575 L9.41503897,8.00003897 L15.0710678,13.6568542 C15.4315518,14.0173382 15.4592813,14.5845693 15.1542564,14.9768605 L15.0710678,15.0710678 C14.6805435,15.4615921 14.0473785,15.4615921 13.6568542,15.0710678 L13.6568542,15.0710678 L8.00003897,9.41503897 L2.34314575,15.0710678 C1.95262146,15.4615921 1.31945648,15.4615921 0.928932188,15.0710678 C0.538407896,14.6805435 0.538407896,14.0473785 0.928932188,13.6568542 L6.58503897,8.00003897 L0.928932188,2.34314575 C0.568448227,1.98266179 0.540718691,1.41543073 0.845743582,1.02313953 Z",id:"Combined-Shape",fill:"#FFFFFF"})),jn=({className:n,onClick:a})=>e.jsx("button",{onClick:a,className:x.default(A.sidebarMenuCloseButton,n),children:e.jsx(t.Box,{className:A.iconWrapper,children:e.jsx(pn,{className:A.icon})})}),P=n=>e.jsx(t.SeparatorLine,{color:_.cssColor("--lhds-color-blue-600"),...n}),se=({className:n,children:a,onCloseClick:s,collapsed:r=!1,hideCloseButton:o=!1,variant:i="standard",...c})=>{const d=Q(i);return e.jsxs(t.Box,{className:x.default(T.sidebarMenu,r?T.collapsed:null,n),style:{["--swui-sidebar-menu-item-height"]:d,["--swui-nav-bar-height"]:d},"data-collapsed":r||void 0,...c,children:[!o&&e.jsxs(e.Fragment,{children:[e.jsx(jn,{onClick:s}),e.jsx(P,{}),e.jsx(t.Space,{})]}),e.jsx(t.Box,{className:T.sidebarMenuContent,height:"100%",background:"var(--current-background-color)",children:e.jsx(t.Column,{flex:1,children:a})})]})},fn=({variant:n,onClickMenuButton:a,children:s})=>e.jsxs(se,{collapsed:!0,position:"fixed",left:0,top:0,hideCloseButton:!0,variant:n,children:[e.jsx(K,{onClick:a}),s]}),gn="_label_mnp0f_1",mn="_icon_mnp0f_9",vn="_spinner_mnp0f_14",bn="_leftWrapper_mnp0f_18",Cn="_button_mnp0f_23",_n="_selected_mnp0f_45";var C={label:gn,icon:mn,spinner:vn,leftWrapper:bn,button:Cn,selected:_n};const ae=({activeClassName:n,...a})=>e.jsx("button",{...a}),L=({className:n,children:a,selected:s,indent:r,label:o,loading:i,left:c,leftIcon:d,right:h,rightIcon:j,success:f,width:g,renderLink:m=ae,style:p,...N})=>{const v=c||d||i||f,y=x.default(C.button,s?C.selected:void 0,n),b={...p,width:g,height:"var(--swui-sidebar-menu-item-height)"},M=e.jsxs(t.Row,{spacing:1,flex:1,alignItems:"center",children:[!v&&e.jsx(t.Indent,{}),r&&e.jsx(t.Indent,{num:3.5}),e.jsx(l.ButtonContent,{label:o,loading:i,left:c,leftIcon:d,right:h,rightIcon:j,success:f,labelClassName:C.label,spinnerClassName:C.spinner,iconClassName:x.default(C.icon),leftWrapperClassName:C.leftWrapper})]});return e.jsx(e.Fragment,{children:m({...N,activeClassName:C.selected,className:y,children:M,style:b})})},Bn="_sidebarMenuHeading_kvpq5_1";var wn={sidebarMenuHeading:Bn};const $=({className:n,label:a,contentLeft:s,contentRight:r,...o})=>e.jsx(t.Box,{spacing:2,indent:2,children:e.jsx(H,{className:wn.sidebarMenuHeading,contentLeft:s,contentRight:r,children:e.jsx(t.Text,{variant:"overline",color:"var(--swui-sidebar-menu-heading-text-color)",...o,children:a})})}),Sn="_sidebarMenuCollapsible_1jwhs_1";var Nn={sidebarMenuCollapsible:Sn};const re=({children:n,label:a,leftIcon:s})=>{const[r,o]=w.useState(!1);return e.jsx(t.Box,{background:"var(--current-background-color)",children:e.jsx(q,{className:Nn.sidebarMenuCollapsible,label:a,collapsed:r,onClick:()=>o(!r),contentLeft:s?e.jsx(t.Box,{width:"var(--swui-sidebar-menu-item-height)",alignItems:"center",justifyContent:"center",children:e.jsx(l.Icon,{icon:s,size:16,color:"var(--current-text-color)","data-hover":!0})}):e.jsx(t.Indent,{num:1}),children:e.jsx(t.Column,{flex:1,children:n})})})},W=(n,a=!1)=>n.map((s,r)=>{switch(s.type){case"heading":return e.jsx($,{label:s.label},r);case"separator":return e.jsx(P,{},r);case"link":{const{type:o,...i}=s;return e.jsx(L,{indent:a,...i},r)}case"grouped":return e.jsx(re,{leftIcon:s.leftIcon,label:s.label,children:W(s.items,!0)},r);default:return t.exhaustSwitchCaseElseThrow(s)}}),yn=(n,{popupMinWidth:a})=>n.map((s,r)=>{switch(s.type){case"heading":return null;case"separator":return e.jsx(P,{},r);case"link":{const{type:o,label:i,...c}=s;return e.jsx(L,{title:i,width:"var(--swui-sidebar-menu-item-height)",...c},r)}case"grouped":return e.jsx("div",{children:e.jsx(R.Popover,{appendTo:"parent",arrow:!1,offset:[0,0],placement:"right-start",trigger:"focusin mouseenter click",disablePadding:!0,lazy:!0,content:e.jsxs(t.Box,{minWidth:a,background:"var(--lhds-color-blue-500)",children:[e.jsx($,{label:s.label}),W(s.items)]}),children:e.jsx(L,{title:s.label,width:"var(--swui-sidebar-menu-item-height)",leftIcon:s.leftIcon})})},r);default:return t.exhaustSwitchCaseElseThrow(s)}}),Mn=`1px solid ${_.cssColor("--lhds-color-orange-400")}`,In=({numItemsSelected:n,label:a,afterLabelContent:s,rightContent:r})=>e.jsxs(t.Row,{indent:3,spacing:!0,minHeight:"56px",justifyContent:"space-between",alignItems:"center",borderTop:Mn,background:_.cssColor("--lhds-color-orange-50"),children:[e.jsxs(t.Row,{alignItems:"center",children:[n!=null||a!=null?e.jsx(e.Fragment,{children:n!=null?e.jsxs(e.Fragment,{children:[e.jsx(t.Text,{variant:"bold",children:n}),e.jsx(t.Space,{}),e.jsxs(t.Text,{children:["item",n===1?"":"s"," selected"]})]}):a!=null?e.jsx(e.Fragment,{children:typeof a=="string"?e.jsx(t.Text,{children:a}):a}):null}):null,s?e.jsxs(e.Fragment,{children:[e.jsx(t.Indent,{}),e.jsx(t.Box,{children:s})]}):null]}),e.jsx(t.Box,{children:r})]});exports.ActionMenuFlatButton=J;exports.ActionMenuPrimaryButton=pe;exports.ActionMenuSecondaryButton=je;exports.CheckboxMenu=ge;exports.Collapsible=q;exports.CollapsibleClickableContent=nn;exports.CollapsibleContent=H;exports.CollapsibleEmptyContent=E;exports.CollapsibleGroupHeading=tn;exports.CollapsibleWithCheckbox=en;exports.ErrorPanel=ne;exports.ErrorScreen=sn;exports.LoadingPanel=te;exports.LoadingScreen=an;exports.NavBar=we;exports.NavBarButton=X;exports.NavBarHeading=ye;exports.NavBarNotificationButton=Ee;exports.NavBarPopoverButton=Me;exports.NavBarSearchField=Te;exports.NavBarUserButton=De;exports.Notification=qe;exports.PageHeader=rn;exports.PageHeaderRow=on;exports.PageHeading=cn;exports.SelectedItemsActionsPanel=In;exports.SidebarMenu=se;exports.SidebarMenuCollapsible=re;exports.SidebarMenuHeading=$;exports.SidebarMenuLink=L;exports.SidebarMenuSeparator=P;exports.SidebarRailMenu=fn;exports.defaultNotificationTheme=Y;exports.defaultRenderLink=ae;exports.mapCSSTime=ee;exports.renderItemsExpanded=W;exports.renderItemsInRail=yn;
657
2
  //# sourceMappingURL=index.js.map