@stenajs-webui/panels 23.12.2 → 23.12.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 +45 -45
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +7 -7
package/dist/index.es.js
CHANGED
|
@@ -5,11 +5,11 @@ import * as Ee from "react";
|
|
|
5
5
|
import { useRef as K, useMemo as j, forwardRef as V, createContext as He, useContext as We, useState as L, useCallback as X, useEffect as $e } from "react";
|
|
6
6
|
import { useBoolean as se, Column as d, Row as c, Indent as B, Heading as P, Box as u, Text as x, Space as w, getDataProps as A, SeparatorLine as qe, pluralFormatter as Ue, selectPluralRule as Ge, Spacing as De, isEmptyFragment as Ke, useAccessibleFontSizeContext as Ve, exhaustSwitchCaseElseThrow as de, BlockKeyboardEvents as Ze } from "@stenajs-webui/core";
|
|
7
7
|
import { ControlledPopover as ue, Popover as he, Tooltip as pe } from "@stenajs-webui/tooltip";
|
|
8
|
-
import { Checkbox as
|
|
8
|
+
import { Checkbox as ge, TextInput as Qe } from "@stenajs-webui/forms";
|
|
9
9
|
import _ from "classnames";
|
|
10
10
|
import { cssColor as p } from "@stenajs-webui/theme";
|
|
11
11
|
import { useMediaQuery as M } from "react-responsive";
|
|
12
|
-
import
|
|
12
|
+
import me from "yet-another-react-lightbox";
|
|
13
13
|
import Xe from "yet-another-react-lightbox/plugins/inline";
|
|
14
14
|
import Je from "yet-another-react-lightbox/plugins/zoom";
|
|
15
15
|
import Ye from "yet-another-react-lightbox/plugins/counter";
|
|
@@ -23,13 +23,13 @@ const Z = ({
|
|
|
23
23
|
menuTop: a,
|
|
24
24
|
onClick: s,
|
|
25
25
|
disableArrow: h = !1,
|
|
26
|
-
buttonRef:
|
|
26
|
+
buttonRef: m,
|
|
27
27
|
appendTo: b,
|
|
28
28
|
zIndex: f,
|
|
29
29
|
disableTrapFocus: C = !1,
|
|
30
30
|
...y
|
|
31
31
|
}) => {
|
|
32
|
-
const [S, I, v, k] = se(!1),
|
|
32
|
+
const [S, I, v, k] = se(!1), g = K(null), W = m ?? g, fe = j(() => ({ open: I, close: v }), [I, v]), xe = ($) => {
|
|
33
33
|
s?.($), k();
|
|
34
34
|
};
|
|
35
35
|
return /* @__PURE__ */ e(z, { children: /* @__PURE__ */ e(
|
|
@@ -79,7 +79,7 @@ const Z = ({
|
|
|
79
79
|
border: tn,
|
|
80
80
|
borderRadius: "4px",
|
|
81
81
|
children: [
|
|
82
|
-
/* @__PURE__ */ e(
|
|
82
|
+
/* @__PURE__ */ e(ge, { ...t }),
|
|
83
83
|
/* @__PURE__ */ e(B, { num: 0.5 }),
|
|
84
84
|
/* @__PURE__ */ e(E, { size: "small", leftIcon: te, ...r })
|
|
85
85
|
]
|
|
@@ -133,9 +133,9 @@ const Z = ({
|
|
|
133
133
|
n,
|
|
134
134
|
/* @__PURE__ */ e(B, { num: 2 })
|
|
135
135
|
] }),
|
|
136
|
-
o && /* @__PURE__ */ e(z, { children: /* @__PURE__ */ e(c, { justifyContent: "center", alignItems: "center", children: Ee.Children.map(o, (
|
|
136
|
+
o && /* @__PURE__ */ e(z, { children: /* @__PURE__ */ e(c, { justifyContent: "center", alignItems: "center", children: Ee.Children.map(o, (m, b) => /* @__PURE__ */ i(z, { children: [
|
|
137
137
|
b > 0 && /* @__PURE__ */ e(B, {}),
|
|
138
|
-
|
|
138
|
+
m
|
|
139
139
|
] })) }) })
|
|
140
140
|
]
|
|
141
141
|
}
|
|
@@ -177,7 +177,7 @@ const Z = ({
|
|
|
177
177
|
return /* @__PURE__ */ e(
|
|
178
178
|
ue,
|
|
179
179
|
{
|
|
180
|
-
renderTrigger: (
|
|
180
|
+
renderTrigger: (m) => /* @__PURE__ */ e(sn, { ...l, ...m, onClick: h }),
|
|
181
181
|
open: a,
|
|
182
182
|
onRequestClose: s,
|
|
183
183
|
zIndex: o,
|
|
@@ -192,7 +192,7 @@ const Z = ({
|
|
|
192
192
|
navBarNotificationButton: dn,
|
|
193
193
|
unread: un,
|
|
194
194
|
icon: hn
|
|
195
|
-
},
|
|
195
|
+
}, gt = V(function({
|
|
196
196
|
count: n,
|
|
197
197
|
unread: t = !1,
|
|
198
198
|
className: r,
|
|
@@ -201,7 +201,7 @@ const Z = ({
|
|
|
201
201
|
icon: a = we,
|
|
202
202
|
...s
|
|
203
203
|
}, h) {
|
|
204
|
-
const
|
|
204
|
+
const m = n > 1;
|
|
205
205
|
return /* @__PURE__ */ e(
|
|
206
206
|
Ce,
|
|
207
207
|
{
|
|
@@ -211,20 +211,20 @@ const Z = ({
|
|
|
211
211
|
className: _(
|
|
212
212
|
F.navBarNotificationButton,
|
|
213
213
|
t && F.unread,
|
|
214
|
-
|
|
214
|
+
m && F.hasCount,
|
|
215
215
|
r
|
|
216
216
|
),
|
|
217
|
-
label:
|
|
217
|
+
label: m ? String(n) : void 0,
|
|
218
218
|
labelClassName: _(o, F.label),
|
|
219
219
|
iconClassName: _(l, F.icon)
|
|
220
220
|
}
|
|
221
221
|
);
|
|
222
|
-
}), pn = "_navBarSearchFieldInput_1rp8g_1",
|
|
222
|
+
}), pn = "_navBarSearchFieldInput_1rp8g_1", gn = "_navBarSearchFieldWrapper_1rp8g_12", mn = "_withButton_1rp8g_24", bn = "_clearButton_1rp8g_33", T = {
|
|
223
223
|
navBarSearchFieldInput: pn,
|
|
224
|
-
navBarSearchFieldWrapper:
|
|
225
|
-
withButton:
|
|
224
|
+
navBarSearchFieldWrapper: gn,
|
|
225
|
+
withButton: mn,
|
|
226
226
|
clearButton: bn
|
|
227
|
-
},
|
|
227
|
+
}, mt = ({
|
|
228
228
|
placeholder: n = "Search",
|
|
229
229
|
className: t,
|
|
230
230
|
wrapperClassName: r,
|
|
@@ -300,7 +300,7 @@ const Z = ({
|
|
|
300
300
|
vn,
|
|
301
301
|
{
|
|
302
302
|
contentLeft: /* @__PURE__ */ e(
|
|
303
|
-
|
|
303
|
+
ge,
|
|
304
304
|
{
|
|
305
305
|
value: n,
|
|
306
306
|
indeterminate: o,
|
|
@@ -334,7 +334,7 @@ const Z = ({
|
|
|
334
334
|
/* @__PURE__ */ e(H, { icon: l, size: "xl" })
|
|
335
335
|
] }),
|
|
336
336
|
t && /* @__PURE__ */ e(P, { as: a, children: t }),
|
|
337
|
-
h && /* @__PURE__ */ e(x, { children: h }),
|
|
337
|
+
h && /* @__PURE__ */ e(x, { textAlign: "center", children: h }),
|
|
338
338
|
r,
|
|
339
339
|
o && /* @__PURE__ */ i(u, { children: [
|
|
340
340
|
/* @__PURE__ */ e(w, { num: 2 }),
|
|
@@ -681,13 +681,13 @@ const Z = ({
|
|
|
681
681
|
priceText: a,
|
|
682
682
|
title: s,
|
|
683
683
|
subTitle: h,
|
|
684
|
-
renderImage:
|
|
684
|
+
renderImage: m,
|
|
685
685
|
children: b,
|
|
686
686
|
headingLevel: f
|
|
687
687
|
}) => {
|
|
688
688
|
const C = r == null ? !1 : Array.isArray(r) ? r.length > 0 : !Ke(r);
|
|
689
689
|
return /* @__PURE__ */ i(d, { children: [
|
|
690
|
-
|
|
690
|
+
m?.(),
|
|
691
691
|
/* @__PURE__ */ i(u, { gap: 2, spacing: 4, indent: 4, background: p("--moln"), children: [
|
|
692
692
|
/* @__PURE__ */ i(u, { gap: 0.5, children: [
|
|
693
693
|
/* @__PURE__ */ i(
|
|
@@ -762,7 +762,7 @@ const Z = ({
|
|
|
762
762
|
renderButton: a,
|
|
763
763
|
renderOfferCodeTag: s,
|
|
764
764
|
renderMandatoryTag: h,
|
|
765
|
-
renderContentLeftOfButton:
|
|
765
|
+
renderContentLeftOfButton: m,
|
|
766
766
|
children: b,
|
|
767
767
|
...f
|
|
768
768
|
}) => {
|
|
@@ -770,7 +770,7 @@ const Z = ({
|
|
|
770
770
|
query: "(max-width: 460px)"
|
|
771
771
|
}), I = M({
|
|
772
772
|
query: "(max-width: 360px)"
|
|
773
|
-
}) || y && C > 1.2, v = r ? "normal" : t, k = qn(v),
|
|
773
|
+
}) || y && C > 1.2, v = r ? "normal" : t, k = qn(v), g = p("--moln"), W = $n(v);
|
|
774
774
|
return /* @__PURE__ */ i(
|
|
775
775
|
u,
|
|
776
776
|
{
|
|
@@ -783,7 +783,7 @@ const Z = ({
|
|
|
783
783
|
children: [
|
|
784
784
|
/* @__PURE__ */ i(c, { flex: 1, children: [
|
|
785
785
|
!I && /* @__PURE__ */ e(u, { flex: 2, justifyContent: "center", background: k, children: o && /* @__PURE__ */ e(G, { color: W, icon: o, size: 73 }) }),
|
|
786
|
-
/* @__PURE__ */ e(u, { flex: 4, indent: 2, spacing: 2, background:
|
|
786
|
+
/* @__PURE__ */ e(u, { flex: 4, indent: 2, spacing: 2, background: g, children: /* @__PURE__ */ i(d, { gap: 2, children: [
|
|
787
787
|
n && /* @__PURE__ */ i(c, { justifyContent: "space-between", children: [
|
|
788
788
|
/* @__PURE__ */ i(c, { gap: 2, alignItems: "center", children: [
|
|
789
789
|
I && l && /* @__PURE__ */ e(H, { icon: l, size: "medium" }),
|
|
@@ -802,7 +802,7 @@ const Z = ({
|
|
|
802
802
|
gap: 2,
|
|
803
803
|
flexWrap: "wrap",
|
|
804
804
|
children: [
|
|
805
|
-
|
|
805
|
+
m?.() ?? /* @__PURE__ */ e("div", {}),
|
|
806
806
|
a?.()
|
|
807
807
|
]
|
|
808
808
|
}
|
|
@@ -920,17 +920,17 @@ const Z = ({
|
|
|
920
920
|
altLabelZoomOut: a,
|
|
921
921
|
altLabelNext: s,
|
|
922
922
|
altLabelClose: h,
|
|
923
|
-
onRequestClose:
|
|
923
|
+
onRequestClose: m,
|
|
924
924
|
images: b
|
|
925
925
|
}) => {
|
|
926
|
-
const f = K(null), { deviceSize: C } = be(), y = C !== "mobile", [S, I] = L(t ?? 0), v = ({ index:
|
|
927
|
-
I(
|
|
928
|
-
}, k = j(() => b.map((
|
|
926
|
+
const f = K(null), { deviceSize: C } = be(), y = C !== "mobile", [S, I] = L(t ?? 0), v = ({ index: g }) => {
|
|
927
|
+
I(g), r?.(g);
|
|
928
|
+
}, k = j(() => b.map((g) => Dn(g)), [b]);
|
|
929
929
|
return /* @__PURE__ */ e(
|
|
930
|
-
|
|
930
|
+
me,
|
|
931
931
|
{
|
|
932
932
|
open: n,
|
|
933
|
-
close:
|
|
933
|
+
close: m,
|
|
934
934
|
index: S,
|
|
935
935
|
plugins: [Je, Ye, en],
|
|
936
936
|
slides: k,
|
|
@@ -952,14 +952,14 @@ const Z = ({
|
|
|
952
952
|
}
|
|
953
953
|
},
|
|
954
954
|
render: {
|
|
955
|
-
buttonZoom: (
|
|
955
|
+
buttonZoom: (g) => y && /* @__PURE__ */ i(c, { gap: 1, indent: 2, children: [
|
|
956
956
|
/* @__PURE__ */ e(
|
|
957
957
|
R,
|
|
958
958
|
{
|
|
959
959
|
"aria-label": l,
|
|
960
960
|
leftIcon: Le,
|
|
961
961
|
size: "large",
|
|
962
|
-
onClick: () =>
|
|
962
|
+
onClick: () => g.zoomIn()
|
|
963
963
|
}
|
|
964
964
|
),
|
|
965
965
|
/* @__PURE__ */ e(
|
|
@@ -968,7 +968,7 @@ const Z = ({
|
|
|
968
968
|
"aria-label": a,
|
|
969
969
|
leftIcon: Oe,
|
|
970
970
|
size: "large",
|
|
971
|
-
onClick: () =>
|
|
971
|
+
onClick: () => g.zoomOut()
|
|
972
972
|
}
|
|
973
973
|
)
|
|
974
974
|
] }),
|
|
@@ -1019,25 +1019,25 @@ const Z = ({
|
|
|
1019
1019
|
altLabelNext: a,
|
|
1020
1020
|
altLabelClose: s
|
|
1021
1021
|
}) => {
|
|
1022
|
-
const h = K(null), [
|
|
1022
|
+
const h = K(null), [m, b] = L(!1), [f, C] = L(t ?? 0), y = X(() => {
|
|
1023
1023
|
b(!0);
|
|
1024
1024
|
}, []), S = X(() => {
|
|
1025
1025
|
b(!1);
|
|
1026
|
-
}, []), I = ({ index:
|
|
1026
|
+
}, []), I = ({ index: g }) => C(g);
|
|
1027
1027
|
$e(() => {
|
|
1028
1028
|
C(t ?? 0);
|
|
1029
1029
|
}, [t]);
|
|
1030
1030
|
const v = j(() => n.map(Kn), [n]), k = j(() => n.map(
|
|
1031
|
-
(
|
|
1032
|
-
...
|
|
1033
|
-
url:
|
|
1034
|
-
width:
|
|
1035
|
-
height:
|
|
1036
|
-
} :
|
|
1031
|
+
(g) => g.fullscreenImage ? {
|
|
1032
|
+
...g,
|
|
1033
|
+
url: g.fullscreenImage.url,
|
|
1034
|
+
width: g.fullscreenImage.width,
|
|
1035
|
+
height: g.fullscreenImage.height
|
|
1036
|
+
} : g
|
|
1037
1037
|
), [n]);
|
|
1038
1038
|
return /* @__PURE__ */ i(Ze, { blockedKeys: "Escape", children: [
|
|
1039
1039
|
/* @__PURE__ */ e(
|
|
1040
|
-
|
|
1040
|
+
me,
|
|
1041
1041
|
{
|
|
1042
1042
|
controller: { ref: h },
|
|
1043
1043
|
index: f,
|
|
@@ -1085,7 +1085,7 @@ const Z = ({
|
|
|
1085
1085
|
}
|
|
1086
1086
|
}
|
|
1087
1087
|
),
|
|
1088
|
-
|
|
1088
|
+
m && /* @__PURE__ */ e(
|
|
1089
1089
|
Gn,
|
|
1090
1090
|
{
|
|
1091
1091
|
isOpen: !0,
|
|
@@ -1128,9 +1128,9 @@ export {
|
|
|
1128
1128
|
ut as NavBar,
|
|
1129
1129
|
sn as NavBarButton,
|
|
1130
1130
|
ht as NavBarHeading,
|
|
1131
|
-
|
|
1131
|
+
gt as NavBarNotificationButton,
|
|
1132
1132
|
pt as NavBarPopoverButton,
|
|
1133
|
-
|
|
1133
|
+
mt as NavBarSearchField,
|
|
1134
1134
|
bt as NavBarUserButton,
|
|
1135
1135
|
yt as PageHeader,
|
|
1136
1136
|
It as PageHeaderRow,
|