@cfx-dev/ui-components 2.1.13 → 2.1.14
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/assets/Modal.css +1 -1
- package/dist/components/Modal/Modal.js +39 -39
- package/package.json +1 -1
package/dist/assets/Modal.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._root_lmrwf_1{flex-shrink:0;position:relative;display:flex;flex-direction:column;max-width:calc((var(--width) - var(--offset-safezone) * 2) * 1);min-width:calc(var(--quant) * 50);max-height:calc((var(--height) - var(--offset-safezone) * 2) * 1);padding:calc(var(--quant) * 6);background-color:var(--color-modal-background);border-radius:var(--border-radius-small);overflow:hidden;animation-name:_modal-appearance_lmrwf_1;animation-duration:.2s}@media (min-width: 768px){._root_lmrwf_1{min-width:calc(var(--quant) * 80)}}@media (min-width: 1280px){._root_lmrwf_1{min-width:calc(var(--quant) * 100)}}@keyframes _modal-appearance_lmrwf_1{0%{opacity:0;transform:scale(.75)}to{opacity:1;transform:scale(1)}}._root_lmrwf_1 ._close_lmrwf_36{position:absolute;top:calc(var(--quant) * 1.5);right:calc(var(--quant) * 2);z-index:1}._root_lmrwf_1 ._header_lmrwf_42{display:flex;flex-direction:column;gap:calc(var(--quant) * 2.5);padding-bottom:calc(var(--quant) * 4)}._root_lmrwf_1 ._header_lmrwf_42 a{border-bottom:1px solid rgba(var(--color-secondary),1);font-weight:700}._root_lmrwf_1 ._footer_lmrwf_52{padding-top:calc(var(--quant) * 6)}
|
|
@@ -4,46 +4,46 @@ import "../Button/Button.js";
|
|
|
4
4
|
import { ButtonBar as k } from "../Button/ButtonBar.js";
|
|
5
5
|
import "../Button/LinkButton.js";
|
|
6
6
|
import y from "../IconButton/IconButton.js";
|
|
7
|
-
import { Overlay as
|
|
8
|
-
import { Text as
|
|
9
|
-
import { clsx as
|
|
7
|
+
import { Overlay as c } from "../Overlay/Overlay.js";
|
|
8
|
+
import { Text as d } from "../Text/Text.js";
|
|
9
|
+
import { clsx as s } from "../../utils/clsx.js";
|
|
10
10
|
import "../../utils/hooks/useGlobalKeyboardEvent.js";
|
|
11
11
|
import { useKeyboardClose as w } from "../../utils/hooks/useKeyboardClose.js";
|
|
12
12
|
import "../../index-2hJuj4UN.js";
|
|
13
|
-
import '../../assets/Modal.css';const B = "
|
|
13
|
+
import '../../assets/Modal.css';const B = "_root_lmrwf_1", v = "_close_lmrwf_36", x = "_header_lmrwf_42", g = "_footer_lmrwf_52", r = {
|
|
14
14
|
root: B,
|
|
15
|
-
"modal-appearance": "_modal-
|
|
15
|
+
"modal-appearance": "_modal-appearance_lmrwf_1",
|
|
16
16
|
close: v,
|
|
17
17
|
header: x,
|
|
18
18
|
footer: g
|
|
19
19
|
};
|
|
20
|
-
function
|
|
20
|
+
function f(t) {
|
|
21
21
|
const {
|
|
22
|
-
onClose:
|
|
23
|
-
children:
|
|
24
|
-
className:
|
|
25
|
-
overlayClassName:
|
|
26
|
-
backdropClassName:
|
|
27
|
-
contentClassName:
|
|
22
|
+
onClose: e,
|
|
23
|
+
children: l,
|
|
24
|
+
className: o,
|
|
25
|
+
overlayClassName: p,
|
|
26
|
+
backdropClassName: _,
|
|
27
|
+
contentClassName: b,
|
|
28
28
|
ariaDescribedby: h,
|
|
29
29
|
ariaLabelledby: u,
|
|
30
30
|
disableBackdropClose: n = !1,
|
|
31
31
|
disableFocusLock: C = !1
|
|
32
|
-
} =
|
|
33
|
-
n || !
|
|
34
|
-
}, [
|
|
35
|
-
return w(
|
|
32
|
+
} = t, m = N.useCallback(() => {
|
|
33
|
+
n || !e || e();
|
|
34
|
+
}, [e, n]);
|
|
35
|
+
return w(m), /* @__PURE__ */ i(c, { className: s(r.overlay, p), children: [
|
|
36
36
|
/* @__PURE__ */ a(
|
|
37
|
-
|
|
37
|
+
c.Backdrop,
|
|
38
38
|
{
|
|
39
|
-
onClick:
|
|
40
|
-
className:
|
|
39
|
+
onClick: m,
|
|
40
|
+
className: s(r.backdrop, _)
|
|
41
41
|
}
|
|
42
42
|
),
|
|
43
43
|
/* @__PURE__ */ a(
|
|
44
|
-
|
|
44
|
+
c.Content,
|
|
45
45
|
{
|
|
46
|
-
className:
|
|
46
|
+
className: b,
|
|
47
47
|
disableFocusLock: C,
|
|
48
48
|
children: /* @__PURE__ */ i(
|
|
49
49
|
"div",
|
|
@@ -51,10 +51,10 @@ function p(c) {
|
|
|
51
51
|
role: "dialog",
|
|
52
52
|
"aria-describedby": h,
|
|
53
53
|
"aria-labelledby": u,
|
|
54
|
-
className:
|
|
54
|
+
className: s(r.root, o),
|
|
55
55
|
children: [
|
|
56
|
-
!!
|
|
57
|
-
|
|
56
|
+
!!e && /* @__PURE__ */ a(y, { areaSize: "large", className: r.close, name: "Close", onClick: e }),
|
|
57
|
+
l
|
|
58
58
|
]
|
|
59
59
|
}
|
|
60
60
|
)
|
|
@@ -62,37 +62,37 @@ function p(c) {
|
|
|
62
62
|
)
|
|
63
63
|
] });
|
|
64
64
|
}
|
|
65
|
-
|
|
65
|
+
f.Header = function(e) {
|
|
66
66
|
const {
|
|
67
|
-
title:
|
|
68
|
-
description:
|
|
69
|
-
} =
|
|
67
|
+
title: l,
|
|
68
|
+
description: o
|
|
69
|
+
} = e;
|
|
70
70
|
return /* @__PURE__ */ i("div", { className: r.header, children: [
|
|
71
71
|
/* @__PURE__ */ a(
|
|
72
|
-
|
|
72
|
+
d,
|
|
73
73
|
{
|
|
74
74
|
weight: "bold",
|
|
75
75
|
size: "large",
|
|
76
|
-
children:
|
|
76
|
+
children: l
|
|
77
77
|
}
|
|
78
78
|
),
|
|
79
|
-
|
|
80
|
-
|
|
79
|
+
o && /* @__PURE__ */ a(
|
|
80
|
+
d,
|
|
81
81
|
{
|
|
82
82
|
size: "small",
|
|
83
83
|
color: "secondary",
|
|
84
|
-
children:
|
|
84
|
+
children: o
|
|
85
85
|
}
|
|
86
86
|
)
|
|
87
87
|
] });
|
|
88
88
|
};
|
|
89
|
-
|
|
89
|
+
f.Footer = function(e) {
|
|
90
90
|
const {
|
|
91
|
-
className:
|
|
92
|
-
...
|
|
93
|
-
} =
|
|
94
|
-
return /* @__PURE__ */ a(k, { ...
|
|
91
|
+
className: l,
|
|
92
|
+
...o
|
|
93
|
+
} = e;
|
|
94
|
+
return /* @__PURE__ */ a(k, { ...o, className: s(r.footer, l) });
|
|
95
95
|
};
|
|
96
96
|
export {
|
|
97
|
-
|
|
97
|
+
f as Modal
|
|
98
98
|
};
|