@stenajs-webui/panels 20.4.1 → 20.4.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.es.js +46 -46
- package/dist/index.js +2 -2
- package/package.json +10 -10
package/dist/index.es.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
(function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode("._navBar_kzibd_1{--swui-navbar-background-color: var(--lhds-color-ui-50);--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 );--swui-nav-bar-height: 48px;background-color:var(--swui-navbar-background-color);height:var(--swui-nav-bar-height);min-height:var(--swui-nav-bar-height)}._navBarButton_b3x3w_1:hover{background:var(--lhds-color-ui-100)}._navBarButton_b3x3w_1:focus-visible{background:var(--lhds-color-ui-200)}._navBarButton_b3x3w_1:active{background:var(--lhds-color-ui-200)}._navBarButton_b3x3w_1._selected_b3x3w_14{background:var(--lhds-color-blue-200)}._navBarButton_b3x3w_1._selected_b3x3w_14:hover{background:var(--lhds-color-blue-100)}._navBarButton_b3x3w_1._selected_b3x3w_14:focus-visible{background:var(--lhds-color-blue-300)}._navBarButton_b3x3w_1._selected_b3x3w_14:active{background:var(--lhds-color-blue-200)}._navBarNotificationButton_1wt3y_1{--current-background-color: var(--lhds-color-ui-400);--current-outline-color: var(--modern-blue);background-color:var(--current-background-color);border-color:transparent;color:var(--lhds-color-ui-50);--swui-nav-bar-notification-shake-count: 3;transition:.5s width}._navBarNotificationButton_1wt3y_1:hover{--current-background-color: var(--lhds-color-red-500);--current-outline-color: var(--lhds-color-red-500)}._navBarNotificationButton_1wt3y_1:active{--current-background-color: var(--lhds-color-red-600);--current-outline-color: var(--lhds-color-red-600)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23 ._icon_1wt3y_23{transform-origin:top center;animation:_shake_1wt3y_1 1.5s ease-in-out var(--swui-nav-bar-notification-shake-count)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23{--current-background-color: var(--lhds-color-red-500);--current-outline-color: var(--lhds-color-red-500)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23:hover{--current-background-color: var(--lhds-color-red-600);--current-outline-color: var(--lhds-color-red-600)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23:active{--current-background-color: var(--lhds-color-red-700);--current-outline-color: var(--lhds-color-red-700)}._navBarNotificationButton_1wt3y_1:focus-visible{outline:var(--swui-focus-outline);outline-color:var(--current-outline-color);outline-offset:var(--swui-focus-outline-width)}@keyframes _shake_1wt3y_1{0%{transform:rotate(0)}7%{transform:rotate(20deg)}15%{transform:rotate(-20deg)}22%{transform:rotate(16deg)}30%{transform:rotate(-16deg)}38%{transform:rotate(6deg)}42%{transform:rotate(-6deg)}46%{transform:rotate(2deg)}to{transform:rotate(0)}}.
|
|
1
|
+
(function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode("._navBar_kzibd_1{--swui-navbar-background-color: var(--lhds-color-ui-50);--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 );--swui-nav-bar-height: 48px;background-color:var(--swui-navbar-background-color);height:var(--swui-nav-bar-height);min-height:var(--swui-nav-bar-height)}._navBarButton_b3x3w_1:hover{background:var(--lhds-color-ui-100)}._navBarButton_b3x3w_1:focus-visible{background:var(--lhds-color-ui-200)}._navBarButton_b3x3w_1:active{background:var(--lhds-color-ui-200)}._navBarButton_b3x3w_1._selected_b3x3w_14{background:var(--lhds-color-blue-200)}._navBarButton_b3x3w_1._selected_b3x3w_14:hover{background:var(--lhds-color-blue-100)}._navBarButton_b3x3w_1._selected_b3x3w_14:focus-visible{background:var(--lhds-color-blue-300)}._navBarButton_b3x3w_1._selected_b3x3w_14:active{background:var(--lhds-color-blue-200)}._navBarNotificationButton_1wt3y_1{--current-background-color: var(--lhds-color-ui-400);--current-outline-color: var(--modern-blue);background-color:var(--current-background-color);border-color:transparent;color:var(--lhds-color-ui-50);--swui-nav-bar-notification-shake-count: 3;transition:.5s width}._navBarNotificationButton_1wt3y_1:hover{--current-background-color: var(--lhds-color-red-500);--current-outline-color: var(--lhds-color-red-500)}._navBarNotificationButton_1wt3y_1:active{--current-background-color: var(--lhds-color-red-600);--current-outline-color: var(--lhds-color-red-600)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23 ._icon_1wt3y_23{transform-origin:top center;animation:_shake_1wt3y_1 1.5s ease-in-out var(--swui-nav-bar-notification-shake-count)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23{--current-background-color: var(--lhds-color-red-500);--current-outline-color: var(--lhds-color-red-500)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23:hover{--current-background-color: var(--lhds-color-red-600);--current-outline-color: var(--lhds-color-red-600)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23:active{--current-background-color: var(--lhds-color-red-700);--current-outline-color: var(--lhds-color-red-700)}._navBarNotificationButton_1wt3y_1:focus-visible{outline:var(--swui-focus-outline);outline-color:var(--current-outline-color);outline-offset:var(--swui-focus-outline-width)}@keyframes _shake_1wt3y_1{0%{transform:rotate(0)}7%{transform:rotate(20deg)}15%{transform:rotate(-20deg)}22%{transform:rotate(16deg)}30%{transform:rotate(-16deg)}38%{transform:rotate(6deg)}42%{transform:rotate(-6deg)}46%{transform:rotate(2deg)}to{transform:rotate(0)}}._navBarSearchFieldInput_1rp8g_1._navBarSearchFieldInput_1rp8g_1{line-height:2.7rem;color:var(--lhds-color-ui-800)}._navBarSearchFieldInput_1rp8g_1._navBarSearchFieldInput_1rp8g_1::placeholder{color:var(--lhds-color-blue-600)}._navBarSearchFieldInput_1rp8g_1._navBarSearchFieldInput_1rp8g_1{padding:0 var(--swui-metrics-indent)}._navBarSearchFieldWrapper_1rp8g_12._navBarSearchFieldWrapper_1rp8g_12{background:var(--lhds-color-ui-200);border-color:transparent}._navBarSearchFieldWrapper_1rp8g_12._navBarSearchFieldWrapper_1rp8g_12:hover{border-color:transparent}._navBarSearchFieldWrapper_1rp8g_12._navBarSearchFieldWrapper_1rp8g_12{padding:0 var(--swui-metrics-indent);border-radius:var(--swui-max-border-radius)}._navBarSearchFieldWrapper_1rp8g_12._navBarSearchFieldWrapper_1rp8g_12._withButton_1rp8g_24{padding-right:1px}._navBarSearchFieldWrapper_1rp8g_12._navBarSearchFieldWrapper_1rp8g_12:focus-within{color:var(--lhds-color-ui-800);background:var(--lhds-color-ui-50)}._navBarSearchFieldWrapper_1rp8g_12._navBarSearchFieldWrapper_1rp8g_12 ._clearButton_1rp8g_33{border-radius:var(--swui-max-border-radius)}._navBarUserButton_10f9z_1:hover{background:var(--lhds-color-ui-100)}._navBarUserButton_10f9z_1:focus-visible{background:var(--lhds-color-ui-200)}._navBarUserButton_10f9z_1:active{background:var(--lhds-color-ui-200)}._unreadDot_l8bni_1{position:relative}._unreadDot_l8bni_1 ._dot_l8bni_4{top:1px;right:1px;position:absolute;width:8px;height:8px;border-radius:var(--swui-max-border-radius);background:var(--lhds-color-blue-500)}._notification_1hao0_1{display:flex;flex-direction:column;width:100%;background:var(--lhds-color-ui-50)}._notification_1hao0_1 ._body_1hao0_7{padding-left:64px;padding-right:24px;padding-bottom:16px}._notification_1hao0_1._standard_1hao0_13._unread_1hao0_14{background:var(--lhds-color-blue-50)}._notification_1hao0_1._danger_1hao0_19{background:var(--lhds-color-red-100)}._notificationList_1rkvu_1{display:flex;flex-direction:column;gap:2px;background:var(--lhds-color-ui-200)}._clickable_1ijxc_1{--swui-toast-border-color: transparent;--swui-toast-item-border-color-hover: var(--lhds-color-blue-500);--current-border-color: var(--swui-toast-border-color);border-width:1px;border-style:solid;border-color:var(--current-border-color);position:absolute;top:0;left:0;right:0;bottom:0;border-radius:8px;background-color:transparent;width:100%;cursor:pointer}._clickable_1ijxc_1:hover{--current-border-color: var(--swui-toast-item-border-color-hover)}._nonClickable_1ijxc_27{position:relative;z-index:1;pointer-events:none}._nonClickable_1ijxc_27 a,._nonClickable_1ijxc_27 button{pointer-events:auto}._sidebarMenu_1bx5w_1{--swui-sidebar-menu-separator-color: var(--swui-white);--swui-sidebar-menu-text-color: var(--lhds-color-ui-900);--swui-sidebar-menu-icon-color: var(--lhds-color-ui-900);--swui-sidebar-menu-background-color: transparent;--swui-sidebar-menu-background-color-hover: var(--lhds-color-ui-400);--swui-sidebar-menu-background-color-focus: var(--lhds-color-ui-400);--swui-sidebar-menu-background-color-active: var(--lhds-color-ui-300);--swui-sidebar-menu-background-selected: var(--lhds-color-blue-100);--swui-sidebar-menu-background-selected-hover: var(--lhds-color-blue-200);--swui-sidebar-menu-background-selected-focus: var(--lhds-color-blue-200);--swui-sidebar-menu-background-selected-active: var(--lhds-color-blue-100);--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-background-selected: var(--swui-sidebar-menu-background-selected);--current-background-selected-hover: var( --swui-sidebar-menu-background-selected-hover );--current-background-selected-focus: var( --swui-sidebar-menu-background-selected-focus );--current-background-selected-active: var( --swui-sidebar-menu-background-selected-active )}._sidebarMenu_1bx5w_1 ._sidebarItems_1bx5w_38{--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)}._sidebarMenu_1bx5w_1{background-color:var(--current-background-color);height:100dvh}._sidebarMenu_1bx5w_1 ._scrollContainer_1bx5w_48{background:var(--current-background-color);height:100%;overflow:auto}._stenaFlag_108h7_1{height:32px}")),document.head.appendChild(r)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
|
|
2
2
|
import { jsxs as i, Fragment as B, jsx as n } from "react/jsx-runtime";
|
|
3
|
-
import { ActionMenu as V, ActionMenuContext as ln, stenaAngleDown as X, PrimaryButton as cn, SecondaryButton as sn, FlatButton as F, stenaHamburger as J, BaseButton as dn, stenaBellFilled as un, TextInputButton as hn, stenaTimes as pn, stenaUserCircle as
|
|
4
|
-
import * as
|
|
3
|
+
import { ActionMenu as V, ActionMenuContext as ln, stenaAngleDown as X, PrimaryButton as cn, SecondaryButton as sn, FlatButton as F, stenaHamburger as J, BaseButton as dn, stenaBellFilled as un, TextInputButton as hn, stenaTimes as pn, stenaUserCircle as gn, CircledIcon as A, CloseButton as K, Icon as mn, stenaMail as fn, MenuButton as $, Card as bn, CardBody as vn, stenaTripFerryXl as _n, Spinner as Bn, StenaFlag as Cn, stenaAngleLeftDouble as Q, stenaPin as xn, IconMenuButton as H, IconMenuButtonLink as yn, MenuButtonLink as kn } from "@stenajs-webui/elements";
|
|
4
|
+
import * as wn from "react";
|
|
5
5
|
import { useRef as In, useMemo as Nn, forwardRef as Sn, createContext as Mn, useContext as Rn, useState as Fn } from "react";
|
|
6
|
-
import { useBoolean as E, Column as h, Box as u, Row as c, Indent as
|
|
6
|
+
import { useBoolean as E, Column as h, Box as u, Row as c, Indent as w, Heading as L, Text as f, Space as m, SeparatorLine as Ln } from "@stenajs-webui/core";
|
|
7
7
|
import { Popover as j, Tooltip as Y } from "@stenajs-webui/tooltip";
|
|
8
8
|
import { Checkbox as Z, TextInput as jn } from "@stenajs-webui/forms";
|
|
9
9
|
import p from "classnames";
|
|
@@ -17,7 +17,7 @@ const U = ({
|
|
|
17
17
|
zIndex: l,
|
|
18
18
|
menuWidth: s,
|
|
19
19
|
menuTop: d,
|
|
20
|
-
onClick:
|
|
20
|
+
onClick: g,
|
|
21
21
|
disableArrow: v = !1,
|
|
22
22
|
buttonRef: _,
|
|
23
23
|
...en
|
|
@@ -55,7 +55,7 @@ const U = ({
|
|
|
55
55
|
...en,
|
|
56
56
|
ref: I,
|
|
57
57
|
onClick: (y) => {
|
|
58
|
-
|
|
58
|
+
g == null || g(y), tn();
|
|
59
59
|
}
|
|
60
60
|
}
|
|
61
61
|
),
|
|
@@ -100,7 +100,7 @@ const U = ({
|
|
|
100
100
|
borderRadius: "4px",
|
|
101
101
|
children: [
|
|
102
102
|
/* @__PURE__ */ n(Z, { ...t }),
|
|
103
|
-
/* @__PURE__ */ n(
|
|
103
|
+
/* @__PURE__ */ n(w, { num: 0.5 }),
|
|
104
104
|
/* @__PURE__ */ n(F, { size: "small", onClick: o, leftIcon: X })
|
|
105
105
|
]
|
|
106
106
|
}
|
|
@@ -143,16 +143,16 @@ const U = ({
|
|
|
143
143
|
alignItems: "center",
|
|
144
144
|
children: [
|
|
145
145
|
/* @__PURE__ */ i(c, { width: "86px", alignItems: "center", children: [
|
|
146
|
-
/* @__PURE__ */ n(
|
|
146
|
+
/* @__PURE__ */ n(w, {}),
|
|
147
147
|
r && /* @__PURE__ */ n(Hn, { onClick: s })
|
|
148
148
|
] }),
|
|
149
149
|
e && /* @__PURE__ */ i(B, { children: [
|
|
150
150
|
e,
|
|
151
|
-
/* @__PURE__ */ n(
|
|
151
|
+
/* @__PURE__ */ n(w, { num: 2 })
|
|
152
152
|
] }),
|
|
153
|
-
o && /* @__PURE__ */ n(B, { children: /* @__PURE__ */ n(c, { justifyContent: "center", alignItems: "center", children:
|
|
154
|
-
v > 0 && /* @__PURE__ */ n(
|
|
155
|
-
|
|
153
|
+
o && /* @__PURE__ */ n(B, { children: /* @__PURE__ */ n(c, { justifyContent: "center", alignItems: "center", children: wn.Children.map(o, (g, v) => /* @__PURE__ */ i(B, { children: [
|
|
154
|
+
v > 0 && /* @__PURE__ */ n(w, {}),
|
|
155
|
+
g
|
|
156
156
|
] })) }) })
|
|
157
157
|
]
|
|
158
158
|
}
|
|
@@ -160,7 +160,7 @@ const U = ({
|
|
|
160
160
|
l && /* @__PURE__ */ n(c, { justifyContent: "center", alignItems: "center", children: l }),
|
|
161
161
|
/* @__PURE__ */ i(c, { justifyContent: "flex-end", alignItems: "center", flex: d, children: [
|
|
162
162
|
a,
|
|
163
|
-
/* @__PURE__ */ n(
|
|
163
|
+
/* @__PURE__ */ n(w, { num: 2 })
|
|
164
164
|
] })
|
|
165
165
|
]
|
|
166
166
|
}
|
|
@@ -201,7 +201,7 @@ const U = ({
|
|
|
201
201
|
children: /* @__PURE__ */ n(Dn, { ...r, onClick: l })
|
|
202
202
|
}
|
|
203
203
|
);
|
|
204
|
-
}, Tn = "_navBarNotificationButton_1wt3y_1", On = "_unread_1wt3y_23", Wn = "_icon_1wt3y_23", qn = "_shake_1wt3y_1",
|
|
204
|
+
}, Tn = "_navBarNotificationButton_1wt3y_1", On = "_unread_1wt3y_23", Wn = "_icon_1wt3y_23", qn = "_shake_1wt3y_1", k = {
|
|
205
205
|
navBarNotificationButton: Tn,
|
|
206
206
|
unread: On,
|
|
207
207
|
icon: Wn,
|
|
@@ -222,17 +222,17 @@ const U = ({
|
|
|
222
222
|
...s,
|
|
223
223
|
leftIcon: l,
|
|
224
224
|
className: p(
|
|
225
|
-
|
|
226
|
-
t &&
|
|
227
|
-
d &&
|
|
225
|
+
k.navBarNotificationButton,
|
|
226
|
+
t && k.unread,
|
|
227
|
+
d && k.hasCount,
|
|
228
228
|
r
|
|
229
229
|
),
|
|
230
230
|
label: d ? String(e) : void 0,
|
|
231
|
-
labelClassName: p(o,
|
|
232
|
-
iconClassName: p(a,
|
|
231
|
+
labelClassName: p(o, k.label),
|
|
232
|
+
iconClassName: p(a, k.icon)
|
|
233
233
|
}
|
|
234
234
|
);
|
|
235
|
-
}, Gn = "
|
|
235
|
+
}, Gn = "_navBarSearchFieldInput_1rp8g_1", Vn = "_navBarSearchFieldWrapper_1rp8g_12", Xn = "_withButton_1rp8g_24", Jn = "_clearButton_1rp8g_33", S = {
|
|
236
236
|
navBarSearchFieldInput: Gn,
|
|
237
237
|
navBarSearchFieldWrapper: Vn,
|
|
238
238
|
withButton: Xn,
|
|
@@ -273,7 +273,7 @@ const U = ({
|
|
|
273
273
|
className: e,
|
|
274
274
|
username: t,
|
|
275
275
|
initials: r,
|
|
276
|
-
icon: o =
|
|
276
|
+
icon: o = gn,
|
|
277
277
|
iconClassName: a,
|
|
278
278
|
responsiveIconOnly: l = r == null,
|
|
279
279
|
...s
|
|
@@ -303,7 +303,7 @@ const U = ({
|
|
|
303
303
|
contentRight: l,
|
|
304
304
|
onClose: s,
|
|
305
305
|
unread: d = !1,
|
|
306
|
-
variant:
|
|
306
|
+
variant: g,
|
|
307
307
|
iconBackgroundColor: v
|
|
308
308
|
}) => {
|
|
309
309
|
const _ = r ? /* @__PURE__ */ n(
|
|
@@ -312,7 +312,7 @@ const U = ({
|
|
|
312
312
|
size: "small",
|
|
313
313
|
icon: r,
|
|
314
314
|
"aria-label": o,
|
|
315
|
-
backgroundColor: v || ee(d,
|
|
315
|
+
backgroundColor: v || ee(d, g)
|
|
316
316
|
}
|
|
317
317
|
) : void 0;
|
|
318
318
|
return /* @__PURE__ */ i(c, { alignItems: "flex-start", indent: 2, spacing: !0, children: [
|
|
@@ -402,7 +402,7 @@ const U = ({
|
|
|
402
402
|
/* @__PURE__ */ n(u, { className: p({ [P.nonClickable]: e }), children: /* @__PURE__ */ n(nn, { ...l }) }),
|
|
403
403
|
r && /* @__PURE__ */ i(u, { indent: 3, className: p({ [P.nonClickable]: e }), children: [
|
|
404
404
|
r,
|
|
405
|
-
/* @__PURE__ */ n(
|
|
405
|
+
/* @__PURE__ */ n(m, { num: 2 })
|
|
406
406
|
] }),
|
|
407
407
|
e && /* @__PURE__ */ n(
|
|
408
408
|
"button",
|
|
@@ -415,8 +415,8 @@ const U = ({
|
|
|
415
415
|
]
|
|
416
416
|
}
|
|
417
417
|
), ue = () => /* @__PURE__ */ i(h, { indent: !0, spacing: !0, flex: 1, alignItems: "center", children: [
|
|
418
|
-
/* @__PURE__ */ n(
|
|
419
|
-
/* @__PURE__ */ n(
|
|
418
|
+
/* @__PURE__ */ n(mn, { icon: fn, color: b("--lhds-color-ui-500") }),
|
|
419
|
+
/* @__PURE__ */ n(m, {}),
|
|
420
420
|
/* @__PURE__ */ n(f, { size: "small", color: b("--lhds-color-ui-500"), children: "No content" })
|
|
421
421
|
] }), he = Sn(
|
|
422
422
|
function({
|
|
@@ -427,14 +427,14 @@ const U = ({
|
|
|
427
427
|
onClick: l,
|
|
428
428
|
disabled: s = !1,
|
|
429
429
|
children: d,
|
|
430
|
-
autoFocus:
|
|
430
|
+
autoFocus: g = !1,
|
|
431
431
|
...v
|
|
432
432
|
}, _) {
|
|
433
433
|
return /* @__PURE__ */ n(
|
|
434
434
|
$,
|
|
435
435
|
{
|
|
436
436
|
...v,
|
|
437
|
-
autoFocus:
|
|
437
|
+
autoFocus: g,
|
|
438
438
|
ref: _,
|
|
439
439
|
label: t,
|
|
440
440
|
onClick: l,
|
|
@@ -485,14 +485,14 @@ const U = ({
|
|
|
485
485
|
const d = !e && !t ? "Something unexpected happened." : e;
|
|
486
486
|
return /* @__PURE__ */ n(bn, { ...s, children: /* @__PURE__ */ n(vn, { children: /* @__PURE__ */ i(h, { spacing: 1, gap: 3, alignItems: "center", children: [
|
|
487
487
|
/* @__PURE__ */ i(h, { alignItems: "center", children: [
|
|
488
|
-
/* @__PURE__ */ n(
|
|
488
|
+
/* @__PURE__ */ n(m, { num: 1 }),
|
|
489
489
|
/* @__PURE__ */ n(A, { icon: a, size: "xl" })
|
|
490
490
|
] }),
|
|
491
491
|
t && /* @__PURE__ */ n(L, { as: l, children: t }),
|
|
492
492
|
d && /* @__PURE__ */ n(f, { children: d }),
|
|
493
493
|
r,
|
|
494
494
|
o && /* @__PURE__ */ i(u, { children: [
|
|
495
|
-
/* @__PURE__ */ n(
|
|
495
|
+
/* @__PURE__ */ n(m, { num: 2 }),
|
|
496
496
|
o
|
|
497
497
|
] })
|
|
498
498
|
] }) }) });
|
|
@@ -505,11 +505,11 @@ const U = ({
|
|
|
505
505
|
alignItems: "center",
|
|
506
506
|
children: /* @__PURE__ */ n(pe, { ...e })
|
|
507
507
|
}
|
|
508
|
-
),
|
|
508
|
+
), ge = ({
|
|
509
509
|
text: e = "Loading..."
|
|
510
510
|
}) => /* @__PURE__ */ i(u, { alignItems: "center", children: [
|
|
511
511
|
/* @__PURE__ */ n(Bn, { size: "small" }),
|
|
512
|
-
/* @__PURE__ */ n(
|
|
512
|
+
/* @__PURE__ */ n(m, { num: 4 }),
|
|
513
513
|
/* @__PURE__ */ n(L, { variant: "h4", children: e })
|
|
514
514
|
] }), Qe = (e) => /* @__PURE__ */ n(
|
|
515
515
|
u,
|
|
@@ -518,7 +518,7 @@ const U = ({
|
|
|
518
518
|
height: "100%",
|
|
519
519
|
justifyContent: "center",
|
|
520
520
|
alignItems: "center",
|
|
521
|
-
children: /* @__PURE__ */ n(
|
|
521
|
+
children: /* @__PURE__ */ n(ge, { ...e })
|
|
522
522
|
}
|
|
523
523
|
), Ye = ({
|
|
524
524
|
renderBreadCrumbs: e,
|
|
@@ -532,7 +532,7 @@ const U = ({
|
|
|
532
532
|
e()
|
|
533
533
|
] }),
|
|
534
534
|
t == null ? void 0 : t(),
|
|
535
|
-
r && /* @__PURE__ */ n(
|
|
535
|
+
r && /* @__PURE__ */ n(m, {}),
|
|
536
536
|
r == null ? void 0 : r()
|
|
537
537
|
] }),
|
|
538
538
|
o
|
|
@@ -549,14 +549,14 @@ const U = ({
|
|
|
549
549
|
] }),
|
|
550
550
|
/* @__PURE__ */ n(c, { alignItems: "center", children: o }),
|
|
551
551
|
/* @__PURE__ */ n(c, { style: { marginLeft: "auto" }, alignItems: "center", children: a })
|
|
552
|
-
] }),
|
|
553
|
-
sidebarMenu:
|
|
552
|
+
] }), me = "_sidebarMenu_1bx5w_1", fe = "_sidebarItems_1bx5w_38", be = "_scrollContainer_1bx5w_48", z = {
|
|
553
|
+
sidebarMenu: me,
|
|
554
554
|
sidebarItems: fe,
|
|
555
555
|
scrollContainer: be
|
|
556
556
|
}, ve = "_stenaFlag_108h7_1", _e = {
|
|
557
557
|
stenaFlag: ve
|
|
558
558
|
}, Be = ({ onClick: e }) => /* @__PURE__ */ i(h, { background: b("--lhds-color-ui-50"), children: [
|
|
559
|
-
/* @__PURE__ */ n(
|
|
559
|
+
/* @__PURE__ */ n(m, {}),
|
|
560
560
|
/* @__PURE__ */ i(
|
|
561
561
|
c,
|
|
562
562
|
{
|
|
@@ -584,8 +584,8 @@ const U = ({
|
|
|
584
584
|
onClickPinButton: l,
|
|
585
585
|
bottomItems: s,
|
|
586
586
|
isPinned: d,
|
|
587
|
-
...
|
|
588
|
-
}) => /* @__PURE__ */ i(u, { ...
|
|
587
|
+
...g
|
|
588
|
+
}) => /* @__PURE__ */ i(u, { ...g, className: p(z.sidebarMenu, e), children: [
|
|
589
589
|
/* @__PURE__ */ n(Be, { onClick: r }),
|
|
590
590
|
/* @__PURE__ */ n(u, { className: z.scrollContainer, children: /* @__PURE__ */ i(
|
|
591
591
|
h,
|
|
@@ -606,7 +606,7 @@ const U = ({
|
|
|
606
606
|
onClick: l
|
|
607
607
|
}
|
|
608
608
|
),
|
|
609
|
-
/* @__PURE__ */ n(
|
|
609
|
+
/* @__PURE__ */ n(m, {})
|
|
610
610
|
] })
|
|
611
611
|
]
|
|
612
612
|
}
|
|
@@ -654,13 +654,13 @@ const U = ({
|
|
|
654
654
|
), ye = ({
|
|
655
655
|
label: e
|
|
656
656
|
}) => D() ? null : /* @__PURE__ */ i(u, { height: "32px", justifyContent: "center", indent: 1, children: [
|
|
657
|
-
/* @__PURE__ */ n(
|
|
657
|
+
/* @__PURE__ */ n(m, {}),
|
|
658
658
|
/* @__PURE__ */ n(f, { variant: "overline", size: "smaller", children: e })
|
|
659
|
-
] }),
|
|
659
|
+
] }), ke = ({
|
|
660
660
|
label: e,
|
|
661
661
|
leftIcon: t,
|
|
662
662
|
...r
|
|
663
|
-
}) => t == null ? null : /* @__PURE__ */ n(Y, { label: e, placement: "right", appendTo: document.body, children: /* @__PURE__ */ n(yn, { icon: t, ...r }) }), rt = (e) => D() ? /* @__PURE__ */ n(
|
|
663
|
+
}) => t == null ? null : /* @__PURE__ */ n(Y, { label: e, placement: "right", appendTo: document.body, children: /* @__PURE__ */ n(yn, { icon: t, ...r }) }), rt = (e) => D() ? /* @__PURE__ */ n(ke, { ...e }) : /* @__PURE__ */ n(kn, { ...e }), we = ({
|
|
664
664
|
children: e,
|
|
665
665
|
label: t,
|
|
666
666
|
icon: r,
|
|
@@ -699,7 +699,7 @@ const U = ({
|
|
|
699
699
|
initialExpand: a = !1
|
|
700
700
|
}) => {
|
|
701
701
|
const [l, s] = Fn(a);
|
|
702
|
-
return D() ? r == null ? null : /* @__PURE__ */ n(
|
|
702
|
+
return D() ? r == null ? null : /* @__PURE__ */ n(we, { label: t, icon: r, children: e }) : /* @__PURE__ */ n(
|
|
703
703
|
$,
|
|
704
704
|
{
|
|
705
705
|
label: t,
|
|
@@ -739,7 +739,7 @@ const U = ({
|
|
|
739
739
|
/* @__PURE__ */ i(c, { alignItems: "center", gap: 2, children: [
|
|
740
740
|
e != null || t != null ? /* @__PURE__ */ n(c, { alignItems: "center", children: e != null ? /* @__PURE__ */ i(B, { children: [
|
|
741
741
|
/* @__PURE__ */ n(f, { children: e }),
|
|
742
|
-
/* @__PURE__ */ n(
|
|
742
|
+
/* @__PURE__ */ n(m, {}),
|
|
743
743
|
/* @__PURE__ */ i(f, { children: [
|
|
744
744
|
"item",
|
|
745
745
|
e === 1 ? "" : "s",
|
|
@@ -764,7 +764,7 @@ export {
|
|
|
764
764
|
Xe as CollapsibleWithCheckbox,
|
|
765
765
|
pe as ErrorPanel,
|
|
766
766
|
Ke as ErrorScreen,
|
|
767
|
-
|
|
767
|
+
ge as LoadingPanel,
|
|
768
768
|
Qe as LoadingScreen,
|
|
769
769
|
He as NavBar,
|
|
770
770
|
Dn as NavBarButton,
|
package/dist/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
(function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode("._navBar_kzibd_1{--swui-navbar-background-color: var(--lhds-color-ui-50);--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 );--swui-nav-bar-height: 48px;background-color:var(--swui-navbar-background-color);height:var(--swui-nav-bar-height);min-height:var(--swui-nav-bar-height)}._navBarButton_b3x3w_1:hover{background:var(--lhds-color-ui-100)}._navBarButton_b3x3w_1:focus-visible{background:var(--lhds-color-ui-200)}._navBarButton_b3x3w_1:active{background:var(--lhds-color-ui-200)}._navBarButton_b3x3w_1._selected_b3x3w_14{background:var(--lhds-color-blue-200)}._navBarButton_b3x3w_1._selected_b3x3w_14:hover{background:var(--lhds-color-blue-100)}._navBarButton_b3x3w_1._selected_b3x3w_14:focus-visible{background:var(--lhds-color-blue-300)}._navBarButton_b3x3w_1._selected_b3x3w_14:active{background:var(--lhds-color-blue-200)}._navBarNotificationButton_1wt3y_1{--current-background-color: var(--lhds-color-ui-400);--current-outline-color: var(--modern-blue);background-color:var(--current-background-color);border-color:transparent;color:var(--lhds-color-ui-50);--swui-nav-bar-notification-shake-count: 3;transition:.5s width}._navBarNotificationButton_1wt3y_1:hover{--current-background-color: var(--lhds-color-red-500);--current-outline-color: var(--lhds-color-red-500)}._navBarNotificationButton_1wt3y_1:active{--current-background-color: var(--lhds-color-red-600);--current-outline-color: var(--lhds-color-red-600)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23 ._icon_1wt3y_23{transform-origin:top center;animation:_shake_1wt3y_1 1.5s ease-in-out var(--swui-nav-bar-notification-shake-count)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23{--current-background-color: var(--lhds-color-red-500);--current-outline-color: var(--lhds-color-red-500)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23:hover{--current-background-color: var(--lhds-color-red-600);--current-outline-color: var(--lhds-color-red-600)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23:active{--current-background-color: var(--lhds-color-red-700);--current-outline-color: var(--lhds-color-red-700)}._navBarNotificationButton_1wt3y_1:focus-visible{outline:var(--swui-focus-outline);outline-color:var(--current-outline-color);outline-offset:var(--swui-focus-outline-width)}@keyframes _shake_1wt3y_1{0%{transform:rotate(0)}7%{transform:rotate(20deg)}15%{transform:rotate(-20deg)}22%{transform:rotate(16deg)}30%{transform:rotate(-16deg)}38%{transform:rotate(6deg)}42%{transform:rotate(-6deg)}46%{transform:rotate(2deg)}to{transform:rotate(0)}}.
|
|
2
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("@stenajs-webui/elements"),g=require("react"),t=require("@stenajs-webui/core"),B=require("@stenajs-webui/tooltip"),R=require("@stenajs-webui/forms"),d=require("classnames"),j=require("@stenajs-webui/theme");function Z(n){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const o in n)if(o!=="default"){const a=Object.getOwnPropertyDescriptor(n,o);Object.defineProperty(s,o,a.get?a:{enumerable:!0,get:()=>n[o]})}}return s.default=n,Object.freeze(s)}const ee=Z(g),k=({renderItems:n,placement:s="bottom",buttonComponent:o,rightIcon:a=r.stenaAngleDown,portalTarget:i="parent",zIndex:l,menuWidth:c,menuTop:u,onClick:x,disableArrow:h=!1,buttonRef:p,...V})=>{const[P,L,b,X]=t.useBoolean(!1),J=g.useRef(null),v=p??J,K={name:"focusManager",defaultValue:!0,fn({popper:f}){let _=!1;const H=m=>{m.key==="Escape"&&(_=!0,b()),(m.key==="Enter"||m.key===" ")&&(_=!0)};return{onCreate(){f.addEventListener("keydown",H)},onDestroy(){f.removeEventListener("keydown",H)},onMount(){var m;_=!1,(m=f.querySelector("button:not([disabled]), a[href]"))==null||m.focus()},onHide(){v.current&&_&&v.current.focus()}}}},Q=g.useMemo(()=>({open:L,close:b}),[L,b]),Y=f=>{x==null||x(f),X()};return e.jsxs(e.Fragment,{children:[e.jsx(o,{rightIcon:h?void 0:a,...V,ref:v,onClick:Y}),e.jsx(B.Popover,{disablePadding:!0,visible:P,onClickOutside:b,placement:s,content:P&&e.jsx(r.ActionMenu,{width:c,top:u,trapFocus:!0,children:e.jsx(r.ActionMenuContext.Provider,{value:Q,children:n(b)})}),arrow:!1,appendTo:i,zIndex:l,plugins:[K],lazy:!0,reference:v})]})},ne=n=>e.jsx(k,{buttonComponent:r.PrimaryButton,...n}),te=n=>e.jsx(k,{buttonComponent:r.SecondaryButton,...n}),z=n=>e.jsx(k,{buttonComponent:r.FlatButton,...n}),se="1px solid var(--lhds-color-ui-300)",oe=({renderMenu:n,...s})=>{const[o,a,i]=t.useBoolean(!1);return e.jsx(B.Popover,{onClickOutside:i,arrow:!1,visible:o,disablePadding:!0,content:n?e.jsx(t.Column,{children:e.jsx(r.ActionMenu,{children:n(i)})}):void 0,placement:"bottom-start",children:e.jsx(t.Box,{display:"inline-block",children:e.jsxs(t.Row,{spacing:.5,indent:!0,alignItems:"center",border:se,borderRadius:"4px",children:[e.jsx(R.Checkbox,{...s}),e.jsx(t.Indent,{num:.5}),e.jsx(r.FlatButton,{size:"small",onClick:a,leftIcon:r.stenaAngleDown})]})})})},ae="_navBar_kzibd_1",re={navBar:ae},ie=({className:n,onClick:s})=>e.jsx(r.FlatButton,{leftIcon:r.stenaHamburger,className:n,onClick:s}),le=({left:n,className:s,showMenuButton:o=!1,children:a,right:i,center:l,onClickMenuButton:c})=>{const u=l?1:void 0;return e.jsxs(t.Row,{justifyContent:"space-between",className:d(re.navBar,s),children:[e.jsxs(t.Row,{flex:u,justifyContent:"flex-start",alignItems:"center",children:[e.jsxs(t.Row,{width:"86px",alignItems:"center",children:[e.jsx(t.Indent,{}),o&&e.jsx(ie,{onClick:c})]}),n&&e.jsxs(e.Fragment,{children:[n,e.jsx(t.Indent,{num:2})]}),a&&e.jsx(e.Fragment,{children:e.jsx(t.Row,{justifyContent:"center",alignItems:"center",children:ee.Children.map(a,(x,h)=>e.jsxs(e.Fragment,{children:[h>0&&e.jsx(t.Indent,{}),x]}))})})]}),l&&e.jsx(t.Row,{justifyContent:"center",alignItems:"center",children:l}),e.jsxs(t.Row,{justifyContent:"flex-end",alignItems:"center",flex:u,children:[i,e.jsx(t.Indent,{num:2})]})]})},ce="_navBarButton_b3x3w_1",ue="_selected_b3x3w_14",T={navBarButton:ce,selected:ue},D=({selected:n,className:s,...o})=>e.jsx(r.FlatButton,{...o,className:d(T.navBarButton,n&&T.selected,s)}),de=n=>e.jsx(t.Heading,{whiteSpace:"nowrap",variant:"h4",as:"h1",...n}),xe=({content:n,children:s,...o})=>{const[a,,i,l]=t.useBoolean(!1);return e.jsx(B.Popover,{onClickOutside:i,triggerTarget:document.body,visible:a,content:e.jsxs(e.Fragment,{children:[n&&n({close:i}),s]}),children:e.jsx(D,{...o,onClick:l})})},je="_navBarNotificationButton_1wt3y_1",he="_unread_1wt3y_23",pe="_icon_1wt3y_23",ge="_shake_1wt3y_1",C={navBarNotificationButton:je,unread:he,icon:pe,shake:ge},me=({count:n,unread:s=!1,className:o,labelClassName:a,iconClassName:i,icon:l=r.stenaBellFilled,...c})=>{const u=n>1;return e.jsx(r.BaseButton,{...c,leftIcon:l,className:d(C.navBarNotificationButton,s&&C.unread,u&&C.hasCount,o),label:u?String(n):void 0,labelClassName:d(a,C.label),iconClassName:d(i,C.icon)})},Be="_navBarSearchFieldInput_1wmvx_1",be="_navBarSearchFieldWrapper_1wmvx_12",fe="_withButton_1wmvx_24",Ce="_clearButton_1wmvx_33",w={navBarSearchFieldInput:Be,navBarSearchFieldWrapper:be,withButton:fe,clearButton:Ce},ve=({placeholder:n="Search",className:s,wrapperClassName:o,showClearButton:a,onClickClearButton:i,value:l,...c})=>e.jsx(R.TextInput,{wrapperClassName:d(w.navBarSearchFieldWrapper,a?w.withButton:void 0,o),className:d(w.navBarSearchFieldInput,s),placeholder:n,value:l,buttonRight:l&&a?e.jsx(r.TextInputButton,{className:w.clearButton,icon:r.stenaTimes,variant:"error",onClick:i}):void 0,...c}),_e="_navBarUserButton_10f9z_1",we={navBarUserButton:_e},ye=({className:n,username:s,initials:o,icon:a=r.stenaUserCircle,iconClassName:i,responsiveIconOnly:l=o==null,...c})=>e.jsx(z,{...c,className:d(we.navBarUserButton,n),leftIcon:s!=null?a:void 0,label:o??s,forceRound:o!=null,responsiveIconOnly:l,disableArrow:!0}),Se="_unreadDot_l8bni_1",Ie="_dot_l8bni_4",A={unreadDot:Se,dot:Ie},O=({children:n})=>e.jsxs("div",{className:A.unreadDot,children:[n,e.jsx("div",{className:A.dot})]}),M=({text:n,timestamp:s,icon:o,iconAriaLabel:a,contentLeft:i,contentRight:l,onClose:c,unread:u=!1,variant:x,iconBackgroundColor:h})=>{const p=o?e.jsx(r.CircledIcon,{size:"small",icon:o,"aria-label":a,backgroundColor:h||E(u,x)}):void 0;return e.jsxs(t.Row,{alignItems:"flex-start",indent:2,spacing:!0,children:[e.jsxs(t.Row,{spacing:!0,gap:2,flex:1,alignItems:"flex-start",children:[i&&e.jsx(t.Box,{minHeight:20,justifyContent:"center",children:i}),!i&&p&&(u?e.jsx(O,{children:p}):p),e.jsxs(t.Box,{minHeight:20,justifyContent:"center",flex:1,gap:.5,children:[e.jsx(t.Text,{variant:"bold",children:n}),s&&e.jsx(t.Text,{size:"small",color:j.cssColor(u?"--lhds-color-blue-600":"--lhds-color-ui-600"),children:s})]}),l]}),c&&e.jsx(t.Box,{flex:"none",justifyContent:"center",height:"calc(20px + 2 * var(--swui-metrics-spacing))",children:e.jsx(r.CloseButton,{onClick:c})})]})},E=(n,s)=>{if(!(!n&&s==="standard"))return"--lhds-color-ui-50"},Ne="_notification_1hao0_1",Re="_body_1hao0_7",ke="_standard_1hao0_13",Me="_unread_1hao0_14",Fe="_danger_1hao0_19",y={notification:Ne,body:Re,standard:ke,unread:Me,danger:Fe},Pe=({variant:n="standard",children:s,unread:o,...a})=>e.jsxs("div",{className:d(y.notification,y[n],o&&y.unread),children:[e.jsx(M,{...a,unread:o,variant:n}),s&&e.jsx(t.Column,{className:y.body,children:s})]}),Le="_notificationList_1rkvu_1",He={notificationList:Le},Te=({children:n})=>e.jsxs("div",{className:He.notificationList,children:[n,e.jsx("div",{})]}),Ae="_clickable_1ijxc_1",ze="_nonClickable_1ijxc_27",I={clickable:Ae,nonClickable:ze},De=({onClick:n,onClickAriaLabel:s,children:o,width:a=264,maxWidth:i,...l})=>e.jsxs(t.Box,{borderRadius:8,background:j.cssColor("--lhds-color-ui-50"),shadow:"popover",width:a,maxWidth:i,role:"alert",position:"relative",children:[e.jsx(t.Box,{className:d({[I.nonClickable]:n}),children:e.jsx(M,{...l})}),o&&e.jsxs(t.Box,{indent:3,className:d({[I.nonClickable]:n}),children:[o,e.jsx(t.Space,{num:2})]}),n&&e.jsx("button",{onClick:n,className:I.clickable,"aria-label":s})]}),U=()=>e.jsxs(t.Column,{indent:!0,spacing:!0,flex:1,alignItems:"center",children:[e.jsx(r.Icon,{icon:r.stenaMail,color:j.cssColor("--lhds-color-ui-500")}),e.jsx(t.Space,{}),e.jsx(t.Text,{size:"small",color:j.cssColor("--lhds-color-ui-500"),children:"No content"})]}),$=g.forwardRef(function({label:s,contentLeft:o,contentRight:a,collapsed:i=!1,onClick:l,disabled:c=!1,children:u,autoFocus:x=!1,...h},p){return e.jsx(r.MenuButton,{...h,autoFocus:x,ref:p,label:s,onClick:l,disabled:c,expandable:!0,expanded:!i,selected:!i,left:o,right:a,children:u??e.jsx(U,{})})}),Oe=({children:n})=>e.jsx(t.Column,{gap:1,children:n}),Ee=({value:n,onValueChange:s,onChange:o,indeterminate:a,checkboxDisabled:i,...l})=>e.jsx($,{contentLeft:e.jsx(R.Checkbox,{value:n,indeterminate:a,onValueChange:s,onChange:o,disabled:i,onClick:c=>c.stopPropagation()}),...l}),Ue=({children:n})=>e.jsx(t.Box,{spacing:!0,indent:!0,children:e.jsx(t.Text,{variant:"overline",size:"smaller",children:n})}),q=({text:n,heading:s,children:o,buttons:a,icon:i=r.stenaTripFerryXl,headingLevel:l="h3",...c})=>{const u=!n&&!s?"Something unexpected happened.":n;return e.jsx(r.Card,{...c,children:e.jsx(r.CardBody,{children:e.jsxs(t.Column,{spacing:1,gap:3,alignItems:"center",children:[e.jsxs(t.Column,{alignItems:"center",children:[e.jsx(t.Space,{num:1}),e.jsx(r.CircledIcon,{icon:i,size:"xl"})]}),s&&e.jsx(t.Heading,{as:l,children:s}),u&&e.jsx(t.Text,{children:u}),o,a&&e.jsxs(t.Box,{children:[e.jsx(t.Space,{num:2}),a]})]})})})},$e=n=>e.jsx(t.Box,{width:"100%",height:"100%",justifyContent:"center",alignItems:"center",children:e.jsx(q,{...n})}),W=({text:n="Loading..."})=>e.jsxs(t.Box,{alignItems:"center",children:[e.jsx(r.Spinner,{size:"small"}),e.jsx(t.Space,{num:4}),e.jsx(t.Heading,{variant:"h4",children:n})]}),qe=n=>e.jsx(t.Box,{width:"100%",height:"100%",justifyContent:"center",alignItems:"center",children:e.jsx(W,{...n})}),We=({renderBreadCrumbs:n,renderPageHeading:s,renderTabs:o,children:a})=>e.jsxs(t.Box,{shadow:"bottom",background:j.cssColor("--lhds-color-ui-50"),gap:2,children:[e.jsxs(t.Box,{indent:3,children:[n&&e.jsxs(t.Row,{spacing:1,alignItems:"center",children:[e.jsx(t.Row,{width:"64px",height:"16px"}),n()]}),s==null?void 0:s(),o&&e.jsx(t.Space,{}),o==null?void 0:o()]}),a]}),Ge=n=>e.jsx(t.Row,{indent:3,spacing:!0,...n}),Ve=({icon:n,heading:s,headingLevel:o="h2",contentLeft:a,contentRight:i})=>e.jsxs(t.Row,{alignItems:"center",gap:2,height:"64px",children:[e.jsxs(t.Row,{alignItems:"center",children:[e.jsx(t.Row,{width:"64px",alignItems:"center",children:n&&e.jsx(r.CircledIcon,{icon:n})}),e.jsx(t.Heading,{variant:"h3",as:o,children:s})]}),e.jsx(t.Row,{alignItems:"center",children:a}),e.jsx(t.Row,{style:{marginLeft:"auto"},alignItems:"center",children:i})]}),Xe="_sidebarMenu_1bx5w_1",Je="_sidebarItems_1bx5w_38",Ke="_scrollContainer_1bx5w_48",N={sidebarMenu:Xe,sidebarItems:Je,scrollContainer:Ke},Qe="_stenaFlag_108h7_1",Ye={stenaFlag:Qe},Ze=({onClick:n})=>e.jsxs(t.Column,{background:j.cssColor("--lhds-color-ui-50"),children:[e.jsx(t.Space,{}),e.jsxs(t.Row,{justifyContent:"space-between",alignItems:"center",flex:1,indent:1,minHeight:"48px",children:[e.jsx(r.CloseButton,{onClick:n}),e.jsx(r.StenaFlag,{className:Ye.stenaFlag})]})]}),en=({isPinned:n,onClick:s,label:o})=>{const i=o??(n?"Unpin menu":"Pin menu"),l=n?r.stenaAngleLeftDouble:r.stenaPin;return e.jsx(r.MenuButton,{onClick:s,label:i,leftIcon:l})},nn=({className:n,children:s,onCloseClick:o,variant:a="standard",pinButtonVisible:i,onClickPinButton:l,bottomItems:c,isPinned:u,...x})=>e.jsxs(t.Box,{...x,className:d(N.sidebarMenu,n),children:[e.jsx(Ze,{onClick:o}),e.jsx(t.Box,{className:N.scrollContainer,children:e.jsxs(t.Column,{className:N.sidebarItems,justifyContent:"space-between",flex:1,gap:1,indent:1,children:[e.jsx(t.Column,{gap:1,children:s}),(c||i)&&e.jsxs(t.Column,{gap:1,children:[c,i&&e.jsx(en,{isPinned:u,onClick:l}),e.jsx(t.Space,{})]})]})})]}),S=g.createContext(!1),F=()=>g.useContext(S),tn=({label:n,...s})=>e.jsx(B.Tooltip,{label:n,placement:"right",appendTo:document.body,children:e.jsx(r.IconMenuButton,{...s})}),sn=({closeButtonVisible:n,onClickCloseButton:s,onClickMenuButton:o,children:a,bottomItems:i,closeButtonTitle:l="Unpin menu"})=>e.jsxs(t.Box,{position:"fixed",left:0,top:0,bottom:0,indent:.5,spacing:1,gap:1,shadow:"popover",background:j.cssColor("--lhds-color-ui-50"),children:[e.jsx(r.IconMenuButton,{onClick:o,icon:r.stenaHamburger}),e.jsxs(t.Column,{justifyContent:"space-between",flex:1,gap:1,children:[e.jsx(t.Column,{gap:1,children:e.jsx(S.Provider,{value:!0,children:a})}),e.jsx(t.Column,{gap:1,children:(i||n)&&e.jsxs(S.Provider,{value:!0,children:[i,n&&e.jsx(tn,{icon:r.stenaAngleLeftDouble,label:l,onClick:s})]})})]})]}),G=({label:n})=>F()?null:e.jsxs(t.Box,{height:"32px",justifyContent:"center",indent:1,children:[e.jsx(t.Space,{}),e.jsx(t.Text,{variant:"overline",size:"smaller",children:n})]}),on=({label:n,leftIcon:s,...o})=>s==null?null:e.jsx(B.Tooltip,{label:n,placement:"right",appendTo:document.body,children:e.jsx(r.IconMenuButtonLink,{icon:s,...o})}),an=n=>F()?e.jsx(on,{...n}):e.jsx(r.MenuButtonLink,{...n}),rn=({children:n,label:s,icon:o,popupMinWidth:a="200px"})=>e.jsx(B.Popover,{appendTo:"parent",arrow:!1,offset:[0,0],placement:"right-start",trigger:"focusin mouseenter click",disablePadding:!0,lazy:!0,content:e.jsx(t.Box,{minWidth:a,shadow:"popover",spacing:1,indent:1,gap:2,children:e.jsxs(S.Provider,{value:!1,children:[e.jsx(G,{label:s}),n]})}),children:e.jsx(r.IconMenuButton,{icon:o})}),ln=({children:n,label:s,leftIcon:o,className:a,initialExpand:i=!1})=>{const[l,c]=g.useState(i);return F()?o==null?null:e.jsx(rn,{label:s,icon:o,children:n}):e.jsx(r.MenuButton,{label:s,onClick:()=>c(!l),leftIcon:o,className:a,expandable:!0,expanded:l,selected:l,children:n})},cn=n=>e.jsx(t.SeparatorLine,{color:j.cssColor("--lhds-color-ui-400"),...n}),un=({numItemsSelected:n,label:s,afterLabelContent:o,rightContent:a})=>e.jsxs(t.Row,{indent:3,spacing:!0,gap:3,minHeight:"56px",justifyContent:"space-between",alignItems:"center",background:j.cssColor("--silver-lighter"),flex:1,borderRadius:"var(--swui-border-radius)",children:[e.jsxs(t.Row,{alignItems:"center",gap:2,children:[n!=null||s!=null?e.jsx(t.Row,{alignItems:"center",children:n!=null?e.jsxs(e.Fragment,{children:[e.jsx(t.Text,{children:n}),e.jsx(t.Space,{}),e.jsxs(t.Text,{children:["item",n===1?"":"s"," selected"]})]}):s!=null?e.jsx(e.Fragment,{children:typeof s=="string"?e.jsx(t.Text,{children:s}):s}):null}):null,o&&e.jsx(t.Row,{children:o})]}),e.jsx(t.Row,{gap:2,children:a})]}),dn=({children:n})=>e.jsx(t.Row,{spacing:.5,indent:.5,flex:1,children:n});exports.ActionMenuFlatButton=z;exports.ActionMenuPrimaryButton=ne;exports.ActionMenuSecondaryButton=te;exports.CheckboxMenu=oe;exports.Collapsible=$;exports.CollapsibleEmptyContent=U;exports.CollapsibleGroupHeading=Ue;exports.CollapsibleList=Oe;exports.CollapsibleWithCheckbox=Ee;exports.ErrorPanel=q;exports.ErrorScreen=$e;exports.LoadingPanel=W;exports.LoadingScreen=qe;exports.NavBar=le;exports.NavBarButton=D;exports.NavBarHeading=de;exports.NavBarNotificationButton=me;exports.NavBarPopoverButton=xe;exports.NavBarSearchField=ve;exports.NavBarUserButton=ye;exports.Notification=Pe;exports.NotificationHeader=M;exports.NotificationList=Te;exports.PageHeader=We;exports.PageHeaderRow=Ge;exports.PageHeading=Ve;exports.SelectedItemsActionsPadding=dn;exports.SelectedItemsActionsPanel=un;exports.SidebarMenu=nn;exports.SidebarMenuCollapsible=ln;exports.SidebarMenuHeading=G;exports.SidebarMenuLink=an;exports.SidebarMenuSeparator=cn;exports.SidebarRailMenu=sn;exports.Toast=De;exports.UnreadDot=O;exports.getIconBgColorFromVariant=E;
|
|
1
|
+
(function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode("._navBar_kzibd_1{--swui-navbar-background-color: var(--lhds-color-ui-50);--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 );--swui-nav-bar-height: 48px;background-color:var(--swui-navbar-background-color);height:var(--swui-nav-bar-height);min-height:var(--swui-nav-bar-height)}._navBarButton_b3x3w_1:hover{background:var(--lhds-color-ui-100)}._navBarButton_b3x3w_1:focus-visible{background:var(--lhds-color-ui-200)}._navBarButton_b3x3w_1:active{background:var(--lhds-color-ui-200)}._navBarButton_b3x3w_1._selected_b3x3w_14{background:var(--lhds-color-blue-200)}._navBarButton_b3x3w_1._selected_b3x3w_14:hover{background:var(--lhds-color-blue-100)}._navBarButton_b3x3w_1._selected_b3x3w_14:focus-visible{background:var(--lhds-color-blue-300)}._navBarButton_b3x3w_1._selected_b3x3w_14:active{background:var(--lhds-color-blue-200)}._navBarNotificationButton_1wt3y_1{--current-background-color: var(--lhds-color-ui-400);--current-outline-color: var(--modern-blue);background-color:var(--current-background-color);border-color:transparent;color:var(--lhds-color-ui-50);--swui-nav-bar-notification-shake-count: 3;transition:.5s width}._navBarNotificationButton_1wt3y_1:hover{--current-background-color: var(--lhds-color-red-500);--current-outline-color: var(--lhds-color-red-500)}._navBarNotificationButton_1wt3y_1:active{--current-background-color: var(--lhds-color-red-600);--current-outline-color: var(--lhds-color-red-600)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23 ._icon_1wt3y_23{transform-origin:top center;animation:_shake_1wt3y_1 1.5s ease-in-out var(--swui-nav-bar-notification-shake-count)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23{--current-background-color: var(--lhds-color-red-500);--current-outline-color: var(--lhds-color-red-500)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23:hover{--current-background-color: var(--lhds-color-red-600);--current-outline-color: var(--lhds-color-red-600)}._navBarNotificationButton_1wt3y_1._unread_1wt3y_23:active{--current-background-color: var(--lhds-color-red-700);--current-outline-color: var(--lhds-color-red-700)}._navBarNotificationButton_1wt3y_1:focus-visible{outline:var(--swui-focus-outline);outline-color:var(--current-outline-color);outline-offset:var(--swui-focus-outline-width)}@keyframes _shake_1wt3y_1{0%{transform:rotate(0)}7%{transform:rotate(20deg)}15%{transform:rotate(-20deg)}22%{transform:rotate(16deg)}30%{transform:rotate(-16deg)}38%{transform:rotate(6deg)}42%{transform:rotate(-6deg)}46%{transform:rotate(2deg)}to{transform:rotate(0)}}._navBarSearchFieldInput_1rp8g_1._navBarSearchFieldInput_1rp8g_1{line-height:2.7rem;color:var(--lhds-color-ui-800)}._navBarSearchFieldInput_1rp8g_1._navBarSearchFieldInput_1rp8g_1::placeholder{color:var(--lhds-color-blue-600)}._navBarSearchFieldInput_1rp8g_1._navBarSearchFieldInput_1rp8g_1{padding:0 var(--swui-metrics-indent)}._navBarSearchFieldWrapper_1rp8g_12._navBarSearchFieldWrapper_1rp8g_12{background:var(--lhds-color-ui-200);border-color:transparent}._navBarSearchFieldWrapper_1rp8g_12._navBarSearchFieldWrapper_1rp8g_12:hover{border-color:transparent}._navBarSearchFieldWrapper_1rp8g_12._navBarSearchFieldWrapper_1rp8g_12{padding:0 var(--swui-metrics-indent);border-radius:var(--swui-max-border-radius)}._navBarSearchFieldWrapper_1rp8g_12._navBarSearchFieldWrapper_1rp8g_12._withButton_1rp8g_24{padding-right:1px}._navBarSearchFieldWrapper_1rp8g_12._navBarSearchFieldWrapper_1rp8g_12:focus-within{color:var(--lhds-color-ui-800);background:var(--lhds-color-ui-50)}._navBarSearchFieldWrapper_1rp8g_12._navBarSearchFieldWrapper_1rp8g_12 ._clearButton_1rp8g_33{border-radius:var(--swui-max-border-radius)}._navBarUserButton_10f9z_1:hover{background:var(--lhds-color-ui-100)}._navBarUserButton_10f9z_1:focus-visible{background:var(--lhds-color-ui-200)}._navBarUserButton_10f9z_1:active{background:var(--lhds-color-ui-200)}._unreadDot_l8bni_1{position:relative}._unreadDot_l8bni_1 ._dot_l8bni_4{top:1px;right:1px;position:absolute;width:8px;height:8px;border-radius:var(--swui-max-border-radius);background:var(--lhds-color-blue-500)}._notification_1hao0_1{display:flex;flex-direction:column;width:100%;background:var(--lhds-color-ui-50)}._notification_1hao0_1 ._body_1hao0_7{padding-left:64px;padding-right:24px;padding-bottom:16px}._notification_1hao0_1._standard_1hao0_13._unread_1hao0_14{background:var(--lhds-color-blue-50)}._notification_1hao0_1._danger_1hao0_19{background:var(--lhds-color-red-100)}._notificationList_1rkvu_1{display:flex;flex-direction:column;gap:2px;background:var(--lhds-color-ui-200)}._clickable_1ijxc_1{--swui-toast-border-color: transparent;--swui-toast-item-border-color-hover: var(--lhds-color-blue-500);--current-border-color: var(--swui-toast-border-color);border-width:1px;border-style:solid;border-color:var(--current-border-color);position:absolute;top:0;left:0;right:0;bottom:0;border-radius:8px;background-color:transparent;width:100%;cursor:pointer}._clickable_1ijxc_1:hover{--current-border-color: var(--swui-toast-item-border-color-hover)}._nonClickable_1ijxc_27{position:relative;z-index:1;pointer-events:none}._nonClickable_1ijxc_27 a,._nonClickable_1ijxc_27 button{pointer-events:auto}._sidebarMenu_1bx5w_1{--swui-sidebar-menu-separator-color: var(--swui-white);--swui-sidebar-menu-text-color: var(--lhds-color-ui-900);--swui-sidebar-menu-icon-color: var(--lhds-color-ui-900);--swui-sidebar-menu-background-color: transparent;--swui-sidebar-menu-background-color-hover: var(--lhds-color-ui-400);--swui-sidebar-menu-background-color-focus: var(--lhds-color-ui-400);--swui-sidebar-menu-background-color-active: var(--lhds-color-ui-300);--swui-sidebar-menu-background-selected: var(--lhds-color-blue-100);--swui-sidebar-menu-background-selected-hover: var(--lhds-color-blue-200);--swui-sidebar-menu-background-selected-focus: var(--lhds-color-blue-200);--swui-sidebar-menu-background-selected-active: var(--lhds-color-blue-100);--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-background-selected: var(--swui-sidebar-menu-background-selected);--current-background-selected-hover: var( --swui-sidebar-menu-background-selected-hover );--current-background-selected-focus: var( --swui-sidebar-menu-background-selected-focus );--current-background-selected-active: var( --swui-sidebar-menu-background-selected-active )}._sidebarMenu_1bx5w_1 ._sidebarItems_1bx5w_38{--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)}._sidebarMenu_1bx5w_1{background-color:var(--current-background-color);height:100dvh}._sidebarMenu_1bx5w_1 ._scrollContainer_1bx5w_48{background:var(--current-background-color);height:100%;overflow:auto}._stenaFlag_108h7_1{height:32px}")),document.head.appendChild(r)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
|
|
2
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("@stenajs-webui/elements"),g=require("react"),t=require("@stenajs-webui/core"),B=require("@stenajs-webui/tooltip"),R=require("@stenajs-webui/forms"),d=require("classnames"),j=require("@stenajs-webui/theme");function Z(n){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const o in n)if(o!=="default"){const a=Object.getOwnPropertyDescriptor(n,o);Object.defineProperty(s,o,a.get?a:{enumerable:!0,get:()=>n[o]})}}return s.default=n,Object.freeze(s)}const ee=Z(g),k=({renderItems:n,placement:s="bottom",buttonComponent:o,rightIcon:a=r.stenaAngleDown,portalTarget:i="parent",zIndex:l,menuWidth:c,menuTop:u,onClick:x,disableArrow:h=!1,buttonRef:p,...V})=>{const[P,L,b,X]=t.useBoolean(!1),J=g.useRef(null),v=p??J,K={name:"focusManager",defaultValue:!0,fn({popper:f}){let _=!1;const H=m=>{m.key==="Escape"&&(_=!0,b()),(m.key==="Enter"||m.key===" ")&&(_=!0)};return{onCreate(){f.addEventListener("keydown",H)},onDestroy(){f.removeEventListener("keydown",H)},onMount(){var m;_=!1,(m=f.querySelector("button:not([disabled]), a[href]"))==null||m.focus()},onHide(){v.current&&_&&v.current.focus()}}}},Q=g.useMemo(()=>({open:L,close:b}),[L,b]),Y=f=>{x==null||x(f),X()};return e.jsxs(e.Fragment,{children:[e.jsx(o,{rightIcon:h?void 0:a,...V,ref:v,onClick:Y}),e.jsx(B.Popover,{disablePadding:!0,visible:P,onClickOutside:b,placement:s,content:P&&e.jsx(r.ActionMenu,{width:c,top:u,trapFocus:!0,children:e.jsx(r.ActionMenuContext.Provider,{value:Q,children:n(b)})}),arrow:!1,appendTo:i,zIndex:l,plugins:[K],lazy:!0,reference:v})]})},ne=n=>e.jsx(k,{buttonComponent:r.PrimaryButton,...n}),te=n=>e.jsx(k,{buttonComponent:r.SecondaryButton,...n}),z=n=>e.jsx(k,{buttonComponent:r.FlatButton,...n}),se="1px solid var(--lhds-color-ui-300)",oe=({renderMenu:n,...s})=>{const[o,a,i]=t.useBoolean(!1);return e.jsx(B.Popover,{onClickOutside:i,arrow:!1,visible:o,disablePadding:!0,content:n?e.jsx(t.Column,{children:e.jsx(r.ActionMenu,{children:n(i)})}):void 0,placement:"bottom-start",children:e.jsx(t.Box,{display:"inline-block",children:e.jsxs(t.Row,{spacing:.5,indent:!0,alignItems:"center",border:se,borderRadius:"4px",children:[e.jsx(R.Checkbox,{...s}),e.jsx(t.Indent,{num:.5}),e.jsx(r.FlatButton,{size:"small",onClick:a,leftIcon:r.stenaAngleDown})]})})})},ae="_navBar_kzibd_1",re={navBar:ae},ie=({className:n,onClick:s})=>e.jsx(r.FlatButton,{leftIcon:r.stenaHamburger,className:n,onClick:s}),le=({left:n,className:s,showMenuButton:o=!1,children:a,right:i,center:l,onClickMenuButton:c})=>{const u=l?1:void 0;return e.jsxs(t.Row,{justifyContent:"space-between",className:d(re.navBar,s),children:[e.jsxs(t.Row,{flex:u,justifyContent:"flex-start",alignItems:"center",children:[e.jsxs(t.Row,{width:"86px",alignItems:"center",children:[e.jsx(t.Indent,{}),o&&e.jsx(ie,{onClick:c})]}),n&&e.jsxs(e.Fragment,{children:[n,e.jsx(t.Indent,{num:2})]}),a&&e.jsx(e.Fragment,{children:e.jsx(t.Row,{justifyContent:"center",alignItems:"center",children:ee.Children.map(a,(x,h)=>e.jsxs(e.Fragment,{children:[h>0&&e.jsx(t.Indent,{}),x]}))})})]}),l&&e.jsx(t.Row,{justifyContent:"center",alignItems:"center",children:l}),e.jsxs(t.Row,{justifyContent:"flex-end",alignItems:"center",flex:u,children:[i,e.jsx(t.Indent,{num:2})]})]})},ce="_navBarButton_b3x3w_1",ue="_selected_b3x3w_14",T={navBarButton:ce,selected:ue},D=({selected:n,className:s,...o})=>e.jsx(r.FlatButton,{...o,className:d(T.navBarButton,n&&T.selected,s)}),de=n=>e.jsx(t.Heading,{whiteSpace:"nowrap",variant:"h4",as:"h1",...n}),xe=({content:n,children:s,...o})=>{const[a,,i,l]=t.useBoolean(!1);return e.jsx(B.Popover,{onClickOutside:i,triggerTarget:document.body,visible:a,content:e.jsxs(e.Fragment,{children:[n&&n({close:i}),s]}),children:e.jsx(D,{...o,onClick:l})})},je="_navBarNotificationButton_1wt3y_1",he="_unread_1wt3y_23",pe="_icon_1wt3y_23",ge="_shake_1wt3y_1",C={navBarNotificationButton:je,unread:he,icon:pe,shake:ge},me=({count:n,unread:s=!1,className:o,labelClassName:a,iconClassName:i,icon:l=r.stenaBellFilled,...c})=>{const u=n>1;return e.jsx(r.BaseButton,{...c,leftIcon:l,className:d(C.navBarNotificationButton,s&&C.unread,u&&C.hasCount,o),label:u?String(n):void 0,labelClassName:d(a,C.label),iconClassName:d(i,C.icon)})},Be="_navBarSearchFieldInput_1rp8g_1",be="_navBarSearchFieldWrapper_1rp8g_12",fe="_withButton_1rp8g_24",Ce="_clearButton_1rp8g_33",w={navBarSearchFieldInput:Be,navBarSearchFieldWrapper:be,withButton:fe,clearButton:Ce},ve=({placeholder:n="Search",className:s,wrapperClassName:o,showClearButton:a,onClickClearButton:i,value:l,...c})=>e.jsx(R.TextInput,{wrapperClassName:d(w.navBarSearchFieldWrapper,a?w.withButton:void 0,o),className:d(w.navBarSearchFieldInput,s),placeholder:n,value:l,buttonRight:l&&a?e.jsx(r.TextInputButton,{className:w.clearButton,icon:r.stenaTimes,variant:"error",onClick:i}):void 0,...c}),_e="_navBarUserButton_10f9z_1",we={navBarUserButton:_e},ye=({className:n,username:s,initials:o,icon:a=r.stenaUserCircle,iconClassName:i,responsiveIconOnly:l=o==null,...c})=>e.jsx(z,{...c,className:d(we.navBarUserButton,n),leftIcon:s!=null?a:void 0,label:o??s,forceRound:o!=null,responsiveIconOnly:l,disableArrow:!0}),Se="_unreadDot_l8bni_1",Ie="_dot_l8bni_4",A={unreadDot:Se,dot:Ie},O=({children:n})=>e.jsxs("div",{className:A.unreadDot,children:[n,e.jsx("div",{className:A.dot})]}),M=({text:n,timestamp:s,icon:o,iconAriaLabel:a,contentLeft:i,contentRight:l,onClose:c,unread:u=!1,variant:x,iconBackgroundColor:h})=>{const p=o?e.jsx(r.CircledIcon,{size:"small",icon:o,"aria-label":a,backgroundColor:h||E(u,x)}):void 0;return e.jsxs(t.Row,{alignItems:"flex-start",indent:2,spacing:!0,children:[e.jsxs(t.Row,{spacing:!0,gap:2,flex:1,alignItems:"flex-start",children:[i&&e.jsx(t.Box,{minHeight:20,justifyContent:"center",children:i}),!i&&p&&(u?e.jsx(O,{children:p}):p),e.jsxs(t.Box,{minHeight:20,justifyContent:"center",flex:1,gap:.5,children:[e.jsx(t.Text,{variant:"bold",children:n}),s&&e.jsx(t.Text,{size:"small",color:j.cssColor(u?"--lhds-color-blue-600":"--lhds-color-ui-600"),children:s})]}),l]}),c&&e.jsx(t.Box,{flex:"none",justifyContent:"center",height:"calc(20px + 2 * var(--swui-metrics-spacing))",children:e.jsx(r.CloseButton,{onClick:c})})]})},E=(n,s)=>{if(!(!n&&s==="standard"))return"--lhds-color-ui-50"},Ne="_notification_1hao0_1",Re="_body_1hao0_7",ke="_standard_1hao0_13",Me="_unread_1hao0_14",Fe="_danger_1hao0_19",y={notification:Ne,body:Re,standard:ke,unread:Me,danger:Fe},Pe=({variant:n="standard",children:s,unread:o,...a})=>e.jsxs("div",{className:d(y.notification,y[n],o&&y.unread),children:[e.jsx(M,{...a,unread:o,variant:n}),s&&e.jsx(t.Column,{className:y.body,children:s})]}),Le="_notificationList_1rkvu_1",He={notificationList:Le},Te=({children:n})=>e.jsxs("div",{className:He.notificationList,children:[n,e.jsx("div",{})]}),Ae="_clickable_1ijxc_1",ze="_nonClickable_1ijxc_27",I={clickable:Ae,nonClickable:ze},De=({onClick:n,onClickAriaLabel:s,children:o,width:a=264,maxWidth:i,...l})=>e.jsxs(t.Box,{borderRadius:8,background:j.cssColor("--lhds-color-ui-50"),shadow:"popover",width:a,maxWidth:i,role:"alert",position:"relative",children:[e.jsx(t.Box,{className:d({[I.nonClickable]:n}),children:e.jsx(M,{...l})}),o&&e.jsxs(t.Box,{indent:3,className:d({[I.nonClickable]:n}),children:[o,e.jsx(t.Space,{num:2})]}),n&&e.jsx("button",{onClick:n,className:I.clickable,"aria-label":s})]}),U=()=>e.jsxs(t.Column,{indent:!0,spacing:!0,flex:1,alignItems:"center",children:[e.jsx(r.Icon,{icon:r.stenaMail,color:j.cssColor("--lhds-color-ui-500")}),e.jsx(t.Space,{}),e.jsx(t.Text,{size:"small",color:j.cssColor("--lhds-color-ui-500"),children:"No content"})]}),$=g.forwardRef(function({label:s,contentLeft:o,contentRight:a,collapsed:i=!1,onClick:l,disabled:c=!1,children:u,autoFocus:x=!1,...h},p){return e.jsx(r.MenuButton,{...h,autoFocus:x,ref:p,label:s,onClick:l,disabled:c,expandable:!0,expanded:!i,selected:!i,left:o,right:a,children:u??e.jsx(U,{})})}),Oe=({children:n})=>e.jsx(t.Column,{gap:1,children:n}),Ee=({value:n,onValueChange:s,onChange:o,indeterminate:a,checkboxDisabled:i,...l})=>e.jsx($,{contentLeft:e.jsx(R.Checkbox,{value:n,indeterminate:a,onValueChange:s,onChange:o,disabled:i,onClick:c=>c.stopPropagation()}),...l}),Ue=({children:n})=>e.jsx(t.Box,{spacing:!0,indent:!0,children:e.jsx(t.Text,{variant:"overline",size:"smaller",children:n})}),q=({text:n,heading:s,children:o,buttons:a,icon:i=r.stenaTripFerryXl,headingLevel:l="h3",...c})=>{const u=!n&&!s?"Something unexpected happened.":n;return e.jsx(r.Card,{...c,children:e.jsx(r.CardBody,{children:e.jsxs(t.Column,{spacing:1,gap:3,alignItems:"center",children:[e.jsxs(t.Column,{alignItems:"center",children:[e.jsx(t.Space,{num:1}),e.jsx(r.CircledIcon,{icon:i,size:"xl"})]}),s&&e.jsx(t.Heading,{as:l,children:s}),u&&e.jsx(t.Text,{children:u}),o,a&&e.jsxs(t.Box,{children:[e.jsx(t.Space,{num:2}),a]})]})})})},$e=n=>e.jsx(t.Box,{width:"100%",height:"100%",justifyContent:"center",alignItems:"center",children:e.jsx(q,{...n})}),W=({text:n="Loading..."})=>e.jsxs(t.Box,{alignItems:"center",children:[e.jsx(r.Spinner,{size:"small"}),e.jsx(t.Space,{num:4}),e.jsx(t.Heading,{variant:"h4",children:n})]}),qe=n=>e.jsx(t.Box,{width:"100%",height:"100%",justifyContent:"center",alignItems:"center",children:e.jsx(W,{...n})}),We=({renderBreadCrumbs:n,renderPageHeading:s,renderTabs:o,children:a})=>e.jsxs(t.Box,{shadow:"bottom",background:j.cssColor("--lhds-color-ui-50"),gap:2,children:[e.jsxs(t.Box,{indent:3,children:[n&&e.jsxs(t.Row,{spacing:1,alignItems:"center",children:[e.jsx(t.Row,{width:"64px",height:"16px"}),n()]}),s==null?void 0:s(),o&&e.jsx(t.Space,{}),o==null?void 0:o()]}),a]}),Ge=n=>e.jsx(t.Row,{indent:3,spacing:!0,...n}),Ve=({icon:n,heading:s,headingLevel:o="h2",contentLeft:a,contentRight:i})=>e.jsxs(t.Row,{alignItems:"center",gap:2,height:"64px",children:[e.jsxs(t.Row,{alignItems:"center",children:[e.jsx(t.Row,{width:"64px",alignItems:"center",children:n&&e.jsx(r.CircledIcon,{icon:n})}),e.jsx(t.Heading,{variant:"h3",as:o,children:s})]}),e.jsx(t.Row,{alignItems:"center",children:a}),e.jsx(t.Row,{style:{marginLeft:"auto"},alignItems:"center",children:i})]}),Xe="_sidebarMenu_1bx5w_1",Je="_sidebarItems_1bx5w_38",Ke="_scrollContainer_1bx5w_48",N={sidebarMenu:Xe,sidebarItems:Je,scrollContainer:Ke},Qe="_stenaFlag_108h7_1",Ye={stenaFlag:Qe},Ze=({onClick:n})=>e.jsxs(t.Column,{background:j.cssColor("--lhds-color-ui-50"),children:[e.jsx(t.Space,{}),e.jsxs(t.Row,{justifyContent:"space-between",alignItems:"center",flex:1,indent:1,minHeight:"48px",children:[e.jsx(r.CloseButton,{onClick:n}),e.jsx(r.StenaFlag,{className:Ye.stenaFlag})]})]}),en=({isPinned:n,onClick:s,label:o})=>{const i=o??(n?"Unpin menu":"Pin menu"),l=n?r.stenaAngleLeftDouble:r.stenaPin;return e.jsx(r.MenuButton,{onClick:s,label:i,leftIcon:l})},nn=({className:n,children:s,onCloseClick:o,variant:a="standard",pinButtonVisible:i,onClickPinButton:l,bottomItems:c,isPinned:u,...x})=>e.jsxs(t.Box,{...x,className:d(N.sidebarMenu,n),children:[e.jsx(Ze,{onClick:o}),e.jsx(t.Box,{className:N.scrollContainer,children:e.jsxs(t.Column,{className:N.sidebarItems,justifyContent:"space-between",flex:1,gap:1,indent:1,children:[e.jsx(t.Column,{gap:1,children:s}),(c||i)&&e.jsxs(t.Column,{gap:1,children:[c,i&&e.jsx(en,{isPinned:u,onClick:l}),e.jsx(t.Space,{})]})]})})]}),S=g.createContext(!1),F=()=>g.useContext(S),tn=({label:n,...s})=>e.jsx(B.Tooltip,{label:n,placement:"right",appendTo:document.body,children:e.jsx(r.IconMenuButton,{...s})}),sn=({closeButtonVisible:n,onClickCloseButton:s,onClickMenuButton:o,children:a,bottomItems:i,closeButtonTitle:l="Unpin menu"})=>e.jsxs(t.Box,{position:"fixed",left:0,top:0,bottom:0,indent:.5,spacing:1,gap:1,shadow:"popover",background:j.cssColor("--lhds-color-ui-50"),children:[e.jsx(r.IconMenuButton,{onClick:o,icon:r.stenaHamburger}),e.jsxs(t.Column,{justifyContent:"space-between",flex:1,gap:1,children:[e.jsx(t.Column,{gap:1,children:e.jsx(S.Provider,{value:!0,children:a})}),e.jsx(t.Column,{gap:1,children:(i||n)&&e.jsxs(S.Provider,{value:!0,children:[i,n&&e.jsx(tn,{icon:r.stenaAngleLeftDouble,label:l,onClick:s})]})})]})]}),G=({label:n})=>F()?null:e.jsxs(t.Box,{height:"32px",justifyContent:"center",indent:1,children:[e.jsx(t.Space,{}),e.jsx(t.Text,{variant:"overline",size:"smaller",children:n})]}),on=({label:n,leftIcon:s,...o})=>s==null?null:e.jsx(B.Tooltip,{label:n,placement:"right",appendTo:document.body,children:e.jsx(r.IconMenuButtonLink,{icon:s,...o})}),an=n=>F()?e.jsx(on,{...n}):e.jsx(r.MenuButtonLink,{...n}),rn=({children:n,label:s,icon:o,popupMinWidth:a="200px"})=>e.jsx(B.Popover,{appendTo:"parent",arrow:!1,offset:[0,0],placement:"right-start",trigger:"focusin mouseenter click",disablePadding:!0,lazy:!0,content:e.jsx(t.Box,{minWidth:a,shadow:"popover",spacing:1,indent:1,gap:2,children:e.jsxs(S.Provider,{value:!1,children:[e.jsx(G,{label:s}),n]})}),children:e.jsx(r.IconMenuButton,{icon:o})}),ln=({children:n,label:s,leftIcon:o,className:a,initialExpand:i=!1})=>{const[l,c]=g.useState(i);return F()?o==null?null:e.jsx(rn,{label:s,icon:o,children:n}):e.jsx(r.MenuButton,{label:s,onClick:()=>c(!l),leftIcon:o,className:a,expandable:!0,expanded:l,selected:l,children:n})},cn=n=>e.jsx(t.SeparatorLine,{color:j.cssColor("--lhds-color-ui-400"),...n}),un=({numItemsSelected:n,label:s,afterLabelContent:o,rightContent:a})=>e.jsxs(t.Row,{indent:3,spacing:!0,gap:3,minHeight:"56px",justifyContent:"space-between",alignItems:"center",background:j.cssColor("--silver-lighter"),flex:1,borderRadius:"var(--swui-border-radius)",children:[e.jsxs(t.Row,{alignItems:"center",gap:2,children:[n!=null||s!=null?e.jsx(t.Row,{alignItems:"center",children:n!=null?e.jsxs(e.Fragment,{children:[e.jsx(t.Text,{children:n}),e.jsx(t.Space,{}),e.jsxs(t.Text,{children:["item",n===1?"":"s"," selected"]})]}):s!=null?e.jsx(e.Fragment,{children:typeof s=="string"?e.jsx(t.Text,{children:s}):s}):null}):null,o&&e.jsx(t.Row,{children:o})]}),e.jsx(t.Row,{gap:2,children:a})]}),dn=({children:n})=>e.jsx(t.Row,{spacing:.5,indent:.5,flex:1,children:n});exports.ActionMenuFlatButton=z;exports.ActionMenuPrimaryButton=ne;exports.ActionMenuSecondaryButton=te;exports.CheckboxMenu=oe;exports.Collapsible=$;exports.CollapsibleEmptyContent=U;exports.CollapsibleGroupHeading=Ue;exports.CollapsibleList=Oe;exports.CollapsibleWithCheckbox=Ee;exports.ErrorPanel=q;exports.ErrorScreen=$e;exports.LoadingPanel=W;exports.LoadingScreen=qe;exports.NavBar=le;exports.NavBarButton=D;exports.NavBarHeading=de;exports.NavBarNotificationButton=me;exports.NavBarPopoverButton=xe;exports.NavBarSearchField=ve;exports.NavBarUserButton=ye;exports.Notification=Pe;exports.NotificationHeader=M;exports.NotificationList=Te;exports.PageHeader=We;exports.PageHeaderRow=Ge;exports.PageHeading=Ve;exports.SelectedItemsActionsPadding=dn;exports.SelectedItemsActionsPanel=un;exports.SidebarMenu=nn;exports.SidebarMenuCollapsible=ln;exports.SidebarMenuHeading=G;exports.SidebarMenuLink=an;exports.SidebarMenuSeparator=cn;exports.SidebarRailMenu=sn;exports.Toast=De;exports.UnreadDot=O;exports.getIconBgColorFromVariant=E;
|
|
3
3
|
//# sourceMappingURL=index.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stenajs-webui/panels",
|
|
3
|
-
"version": "20.4.
|
|
3
|
+
"version": "20.4.3",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "",
|
|
6
6
|
"author": "mattias800",
|
|
@@ -14,9 +14,9 @@
|
|
|
14
14
|
"module": "dist/index.es.js",
|
|
15
15
|
"jsnext:main": "dist/index.es.js",
|
|
16
16
|
"exports": {
|
|
17
|
-
"require": "dist/index.js",
|
|
18
|
-
"import": "dist/index.es.js",
|
|
19
|
-
"types": "dist/index.d.ts"
|
|
17
|
+
"require": "./dist/index.js",
|
|
18
|
+
"import": "./dist/index.es.js",
|
|
19
|
+
"types": "./dist/index.d.ts"
|
|
20
20
|
},
|
|
21
21
|
"sideEffects": false,
|
|
22
22
|
"engines": {
|
|
@@ -33,11 +33,11 @@
|
|
|
33
33
|
"deploy": "gh-pages -d example/build"
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"@stenajs-webui/core": "20.4.
|
|
37
|
-
"@stenajs-webui/elements": "20.4.
|
|
38
|
-
"@stenajs-webui/forms": "20.4.
|
|
39
|
-
"@stenajs-webui/theme": "20.4.
|
|
40
|
-
"@stenajs-webui/tooltip": "20.4.
|
|
36
|
+
"@stenajs-webui/core": "20.4.3",
|
|
37
|
+
"@stenajs-webui/elements": "20.4.3",
|
|
38
|
+
"@stenajs-webui/forms": "20.4.3",
|
|
39
|
+
"@stenajs-webui/theme": "20.4.3",
|
|
40
|
+
"@stenajs-webui/tooltip": "20.4.3",
|
|
41
41
|
"classnames": "^2.3.1",
|
|
42
42
|
"date-fns": "2.26.0",
|
|
43
43
|
"react-transition-group": "^4.3.0",
|
|
@@ -71,5 +71,5 @@
|
|
|
71
71
|
"files": [
|
|
72
72
|
"dist"
|
|
73
73
|
],
|
|
74
|
-
"gitHead": "
|
|
74
|
+
"gitHead": "4955a3e4f3019be78591ba47a2b51fba6ce9ef8f"
|
|
75
75
|
}
|