@cagatayfdn/flora-components 0.0.94 → 0.0.95
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/Modal.css +1 -1
- package/dist/components/Modal/Modal.js +60 -44
- package/package.json +2 -2
package/dist/Modal.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._overlay_yit4w_1{position:fixed;top:0;left:0;width:100%;height:100%;z-index:999}._modal_yit4w_10{position:fixed;top:0;right:0;bottom:0;left:0;z-index:999;width:100%;height:100%;display:flex;background:#00000073;justify-content:center;overflow:auto;align-items:center}._modal_yit4w_10 ._content_yit4w_25{border-radius:10px;background-color:#333b57;position:relative;box-shadow:0 3px 6px -4px #0000007a,0 6px 16px #00000052,0 9px 28px 8px #0003;pointer-events:auto;margin:30px;width:450px;display:inline-block}._modal_yit4w_10 ._content_yit4w_25 ._header_yit4w_35{padding:16px 30px;position:relative;border-bottom:1px solid #3b4768}._modal_yit4w_10 ._content_yit4w_25 ._header_yit4w_35 h2{margin:0;font-size:20px;font-weight:500}._modal_yit4w_10 ._content_yit4w_25 ._header_yit4w_35 h2:before{content:"";position:absolute;top:50%;left:0;width:4px;height:16px;margin-top:-8px;background-color:#4482ff}._modal_yit4w_10 ._content_yit4w_25 ._header_yit4w_35 ._close_yit4w_55{position:absolute;right:30px;top:50%;cursor:pointer;margin-top:-10px}._modal_yit4w_10 ._content_yit4w_25 ._body_yit4w_62{padding:40px 30px;height:100%}._modal_yit4w_10 ._content_yit4w_25 ._body_yit4w_62 ._desc_yit4w_66{color:#bcbcbc;margin-bottom:23px}._modal__light_yit4w_70 ._content_yit4w_25{background-color:#f5f5f5}._modal__light_yit4w_70 ._content_yit4w_25 ._header_yit4w_35{background-color:#fff;border-bottom-color:#c8daec;border-radius:10px 10px 0 0}._modal__light_yit4w_70 ._content_yit4w_25 ._header_yit4w_35 h2,._modal__light_yit4w_70 ._content_yit4w_25 ._header_yit4w_35 ._close_yit4w_55{color:#3d4561}._modal__light_yit4w_70 ._content_yit4w_25 ._body_yit4w_62,._modal__light_yit4w_70 ._content_yit4w_25 ._body_yit4w_62 ._desc_yit4w_66{color:#788195}
|
|
@@ -1,57 +1,73 @@
|
|
|
1
1
|
import { j as e } from "../../jsx-runtime-BcAkpsdy.js";
|
|
2
|
-
import { useEffect as
|
|
2
|
+
import { useEffect as u } from "react";
|
|
3
3
|
import { c as s } from "../../index-BHf7G3IG.js";
|
|
4
|
-
import { Icons as
|
|
4
|
+
import { Icons as w } from "../../assets/icons/icons.js";
|
|
5
5
|
import N from "../Icon/index.js";
|
|
6
|
-
import '../../Modal.css';const b = "
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
6
|
+
import '../../Modal.css';const b = "_overlay_yit4w_1", f = "_modal_yit4w_10", g = "_content_yit4w_25", C = "_header_yit4w_35", k = "_close_yit4w_55", E = "_body_yit4w_62", S = "_desc_yit4w_66", F = "_modal__light_yit4w_70", o = {
|
|
7
|
+
overlay: b,
|
|
8
|
+
modal: f,
|
|
9
|
+
content: g,
|
|
10
|
+
header: C,
|
|
11
|
+
close: k,
|
|
12
|
+
body: E,
|
|
12
13
|
desc: S,
|
|
13
|
-
modal__light:
|
|
14
|
-
},
|
|
14
|
+
modal__light: F
|
|
15
|
+
}, H = (i) => {
|
|
15
16
|
const {
|
|
16
|
-
children:
|
|
17
|
+
children: m,
|
|
17
18
|
header: a,
|
|
18
|
-
title:
|
|
19
|
-
description:
|
|
20
|
-
className:
|
|
21
|
-
onClose:
|
|
22
|
-
visible:
|
|
23
|
-
appearance:
|
|
24
|
-
headerClass:
|
|
25
|
-
descriptionClass:
|
|
26
|
-
} =
|
|
19
|
+
title: t,
|
|
20
|
+
description: d,
|
|
21
|
+
className: y,
|
|
22
|
+
onClose: _,
|
|
23
|
+
visible: c = !0,
|
|
24
|
+
appearance: l,
|
|
25
|
+
headerClass: h,
|
|
26
|
+
descriptionClass: v
|
|
27
|
+
} = i, x = () => {
|
|
27
28
|
document.body.style.width = "calc(100% - 15px)", document.body.className = "overflow-hidden";
|
|
28
|
-
}, y = () => {
|
|
29
|
-
document.body.className = "", document.body.removeAttribute("style");
|
|
30
29
|
}, p = () => {
|
|
31
|
-
|
|
30
|
+
document.body.className = "", document.body.removeAttribute("style");
|
|
31
|
+
}, n = () => {
|
|
32
|
+
_();
|
|
32
33
|
};
|
|
33
|
-
return
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
{
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
34
|
+
return u(() => {
|
|
35
|
+
const r = (j) => {
|
|
36
|
+
j.key === "Escape" && n();
|
|
37
|
+
};
|
|
38
|
+
return document.addEventListener("keydown", r), c && x(), () => {
|
|
39
|
+
p(), document.removeEventListener("keydown", r);
|
|
40
|
+
};
|
|
41
|
+
}, [c]), /* @__PURE__ */ e.jsx(e.Fragment, { children: c && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
|
|
42
|
+
/* @__PURE__ */ e.jsx(
|
|
43
|
+
"div",
|
|
44
|
+
{
|
|
45
|
+
"data-testid": "modal-overlay",
|
|
46
|
+
onClick: n,
|
|
47
|
+
className: o.overlay
|
|
48
|
+
}
|
|
49
|
+
),
|
|
50
|
+
/* @__PURE__ */ e.jsx(
|
|
51
|
+
"div",
|
|
52
|
+
{
|
|
53
|
+
className: s(o.modal, {
|
|
54
|
+
[o[`modal__${l}`]]: l
|
|
55
|
+
}),
|
|
56
|
+
"data-testid": "modal-container",
|
|
57
|
+
children: /* @__PURE__ */ e.jsxs("div", { className: s(y, o.content), children: [
|
|
58
|
+
t || a ? /* @__PURE__ */ e.jsxs("div", { className: s(o.header, h), children: [
|
|
59
|
+
t ? /* @__PURE__ */ e.jsx("h2", { children: t }) : a,
|
|
60
|
+
/* @__PURE__ */ e.jsx("span", { className: o.close, onClick: n, children: /* @__PURE__ */ e.jsx(N, { name: w.Close }) })
|
|
61
|
+
] }) : /* @__PURE__ */ e.jsx(e.Fragment, {}),
|
|
62
|
+
/* @__PURE__ */ e.jsxs("div", { className: o.body, children: [
|
|
63
|
+
d && /* @__PURE__ */ e.jsx("p", { className: s(o.desc, v), children: d }),
|
|
64
|
+
m
|
|
65
|
+
] })
|
|
50
66
|
] })
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
) });
|
|
67
|
+
}
|
|
68
|
+
)
|
|
69
|
+
] }) });
|
|
54
70
|
};
|
|
55
71
|
export {
|
|
56
|
-
|
|
72
|
+
H as default
|
|
57
73
|
};
|
package/package.json
CHANGED