@stenajs-webui/modal 18.12.0 → 19.0.0-next.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.
- package/dist/index.es.js +32 -32
- package/dist/index.js +2 -2
- package/package.json +5 -5
package/dist/index.es.js
CHANGED
|
@@ -1,20 +1,20 @@
|
|
|
1
|
-
(function(){"use strict";try{var o=document.createElement("style");o.appendChild(document.createTextNode("._overlay_5x3op_1{--swui-modal-animation-time: var(--swui-animation-time-fast);--swui-modal-overlay-bg-color: var(--swui-overlay-bg-color);--swui-modal-content-bg-color: var(--swui-white);--swui-modal-width: 960px;--swui-modal-max-width: 100%;--swui-modal-header-border-color: var(--lhds-color-ui-300);--swui-modal-shadow: var(--swui-shadow-modal);--swui-modal-footer-shadow: var(--swui-shadow-modal);position:fixed;z-index:10;top:0;left:0;right:0;bottom:0;background-color:var(--swui-modal-overlay-bg-color);overflow:auto;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;-webkit-animation:_fadeIn_5x3op_1 var(--swui-modal-animation-time) cubic-bezier(.645,.045,.355,1) both;animation:_fadeIn_5x3op_1 var(--swui-modal-animation-time) cubic-bezier(.645,.045,.355,1) both}@media print{._overlay_5x3op_1{background-color:#fff}}._overlay_5x3op_1 ._modal_5x3op_31{max-width:100%;outline:none;pointer-events:none}@media (max-width: 768px){._overlay_5x3op_1 ._modal_5x3op_31{width:100%}}._overlay_5x3op_1 ._content_5x3op_41{position:relative;display:block;background:var(--swui-modal-content-bg-color);box-shadow:var(--swui-modal-shadow);pointer-events:all;top:calc(var(--swui-metrics-space) * 2);width:var(--swui-modal-width);max-width:var(--swui-modal-max-width)}@media (max-width: 768px){._overlay_5x3op_1 ._content_5x3op_41{top:0;width:100%;max-width:100%}}._overlay_5x3op_1 ._content_5x3op_41{-webkit-animation:_appear_5x3op_1 var(--swui-animation-time-fast) cubic-bezier(.645,.045,.355,1) both;animation:_appear_5x3op_1 var(--swui-animation-time-fast) cubic-bezier(.645,.045,.355,1) both}@media print{._overlay_5x3op_1 ._content_5x3op_41{box-shadow:none;top:0}}._overlay_5x3op_1 ._content_5x3op_41 :focus{outline:0}._overlay_5x3op_1 ._content_5x3op_41._isDraggable_5x3op_70 .draggable-modal-handle{cursor:move}._overlay_5x3op_1 ._content_5x3op_41._isDraggable_5x3op_70 .draggable-modal-handle .draggable-modal-cancel,._overlay_5x3op_1 ._content_5x3op_41._isDraggable_5x3op_70 .draggable-modal-handle [role=tooltip]{cursor:initial}@-webkit-keyframes _fadeIn_5x3op_1{0%{background-color:var(--swui-hidden)}to{background-color:var(--swui-modal-overlay-bg-color)}}@keyframes _fadeIn_5x3op_1{0%{background-color:var(--swui-hidden)}to{background-color:var(--swui-modal-overlay-bg-color)}}@-webkit-keyframes _appear_5x3op_1{0%{opacity:0}to{opacity:1}}@keyframes _appear_5x3op_1{0%{opacity:0}to{opacity:1}}._footer_5x3op_101{background-color:var(--swui-modal-content-bg-color)}._stickyFooter_5x3op_105{position:-webkit-sticky;position:sticky;bottom:0;box-shadow:var(--swui-modal-footer-shadow)}@media print{._stickyFooter_5x3op_105{position:static;box-shadow:none}}.
|
|
1
|
+
(function(){"use strict";try{var o=document.createElement("style");o.appendChild(document.createTextNode("._overlay_5x3op_1{--swui-modal-animation-time: var(--swui-animation-time-fast);--swui-modal-overlay-bg-color: var(--swui-overlay-bg-color);--swui-modal-content-bg-color: var(--swui-white);--swui-modal-width: 960px;--swui-modal-max-width: 100%;--swui-modal-header-border-color: var(--lhds-color-ui-300);--swui-modal-shadow: var(--swui-shadow-modal);--swui-modal-footer-shadow: var(--swui-shadow-modal);position:fixed;z-index:10;top:0;left:0;right:0;bottom:0;background-color:var(--swui-modal-overlay-bg-color);overflow:auto;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;-webkit-animation:_fadeIn_5x3op_1 var(--swui-modal-animation-time) cubic-bezier(.645,.045,.355,1) both;animation:_fadeIn_5x3op_1 var(--swui-modal-animation-time) cubic-bezier(.645,.045,.355,1) both}@media print{._overlay_5x3op_1{background-color:#fff}}._overlay_5x3op_1 ._modal_5x3op_31{max-width:100%;outline:none;pointer-events:none}@media (max-width: 768px){._overlay_5x3op_1 ._modal_5x3op_31{width:100%}}._overlay_5x3op_1 ._content_5x3op_41{position:relative;display:block;background:var(--swui-modal-content-bg-color);box-shadow:var(--swui-modal-shadow);pointer-events:all;top:calc(var(--swui-metrics-space) * 2);width:var(--swui-modal-width);max-width:var(--swui-modal-max-width)}@media (max-width: 768px){._overlay_5x3op_1 ._content_5x3op_41{top:0;width:100%;max-width:100%}}._overlay_5x3op_1 ._content_5x3op_41{-webkit-animation:_appear_5x3op_1 var(--swui-animation-time-fast) cubic-bezier(.645,.045,.355,1) both;animation:_appear_5x3op_1 var(--swui-animation-time-fast) cubic-bezier(.645,.045,.355,1) both}@media print{._overlay_5x3op_1 ._content_5x3op_41{box-shadow:none;top:0}}._overlay_5x3op_1 ._content_5x3op_41 :focus{outline:0}._overlay_5x3op_1 ._content_5x3op_41._isDraggable_5x3op_70 .draggable-modal-handle{cursor:move}._overlay_5x3op_1 ._content_5x3op_41._isDraggable_5x3op_70 .draggable-modal-handle .draggable-modal-cancel,._overlay_5x3op_1 ._content_5x3op_41._isDraggable_5x3op_70 .draggable-modal-handle [role=tooltip]{cursor:initial}@-webkit-keyframes _fadeIn_5x3op_1{0%{background-color:var(--swui-hidden)}to{background-color:var(--swui-modal-overlay-bg-color)}}@keyframes _fadeIn_5x3op_1{0%{background-color:var(--swui-hidden)}to{background-color:var(--swui-modal-overlay-bg-color)}}@-webkit-keyframes _appear_5x3op_1{0%{opacity:0}to{opacity:1}}@keyframes _appear_5x3op_1{0%{opacity:0}to{opacity:1}}._footer_5x3op_101{background-color:var(--swui-modal-content-bg-color)}._stickyFooter_5x3op_105{position:-webkit-sticky;position:sticky;bottom:0;box-shadow:var(--swui-modal-footer-shadow)}@media print{._stickyFooter_5x3op_105{position:static;box-shadow:none}}._portal_b436j_1 ._overlay_b436j_2{position:fixed;inset:0}._portal_b436j_1 ._content_b436j_7{box-shadow:var(--swui-shadow-modal);background:white;position:absolute;transition:-webkit-transform var(--swui-animation-time-medium) ease-in-out;transition:transform var(--swui-animation-time-medium) ease-in-out;transition:transform var(--swui-animation-time-medium) ease-in-out,-webkit-transform var(--swui-animation-time-medium) ease-in-out}._portal_b436j_1 ._content_b436j_7:focus-visible{outline:unset}._portal_b436j_1 ._content_b436j_7._slideFromLeft_b436j_17,._portal_b436j_1 ._content_b436j_7._slideFromRight_b436j_18{-webkit-transform:translateX(var(--translate-x-outside-screen, 0));transform:translate(var(--translate-x-outside-screen, 0));overflow-y:auto;top:0;bottom:0}._portal_b436j_1 ._content_b436j_7._slideFromLeft_b436j_17._afterOpen_b436j_24,._portal_b436j_1 ._content_b436j_7._slideFromRight_b436j_18._afterOpen_b436j_24{-webkit-transform:translateX(0);transform:translate(0)}._portal_b436j_1 ._content_b436j_7._slideFromLeft_b436j_17._beforeClose_b436j_28,._portal_b436j_1 ._content_b436j_7._slideFromRight_b436j_18._beforeClose_b436j_28{-webkit-transform:translateX(var(--translate-x-outside-screen));transform:translate(var(--translate-x-outside-screen))}._portal_b436j_1 ._content_b436j_7._slideFromTop_b436j_33,._portal_b436j_1 ._content_b436j_7._slideFromBottom_b436j_34{-webkit-transform:translateY(var(--translate-y-outside-screen, 0));transform:translateY(var(--translate-y-outside-screen, 0));overflow-x:auto;left:0;right:0}._portal_b436j_1 ._content_b436j_7._slideFromTop_b436j_33._afterOpen_b436j_24,._portal_b436j_1 ._content_b436j_7._slideFromBottom_b436j_34._afterOpen_b436j_24{-webkit-transform:translateY(0);transform:translateY(0)}._portal_b436j_1 ._content_b436j_7._slideFromTop_b436j_33._beforeClose_b436j_28,._portal_b436j_1 ._content_b436j_7._slideFromBottom_b436j_34._beforeClose_b436j_28{-webkit-transform:translateY(var(--translate-y-outside-screen));transform:translateY(var(--translate-y-outside-screen))}._portal_b436j_1 ._content_b436j_7._slideFromLeft_b436j_17{--translate-x-outside-screen: -100%;width:370px;left:0}._portal_b436j_1 ._content_b436j_7._slideFromRight_b436j_18{--translate-x-outside-screen: 100%;width:370px;right:0}._portal_b436j_1 ._content_b436j_7._slideFromTop_b436j_33{--translate-y-outside-screen: -100%;height:370px;top:0}._portal_b436j_1 ._content_b436j_7._slideFromBottom_b436j_34{--translate-y-outside-screen: 100%;height:370px;bottom:0}._modal_4fwgb_1{display:flex;justify-content:center;align-items:center;position:fixed;top:0;left:0;right:0;bottom:0;background-color:transparent}._overlay_4fwgb_13{position:fixed;top:0;left:0;right:0;bottom:0;background-color:var(--swui-overlay-bg-color)}")),document.head.appendChild(o)}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
|
|
2
2
|
import _ from "react-modal";
|
|
3
3
|
import w from "react-draggable";
|
|
4
|
-
import
|
|
4
|
+
import b from "classnames";
|
|
5
5
|
import { jsx as e, jsxs as c, Fragment as h } from "react/jsx-runtime";
|
|
6
|
-
import { exhaustSwitchCase as x, Column as
|
|
6
|
+
import { exhaustSwitchCase as x, Column as u, Box as m, Spacing as j, Row as f, Indent as S, Heading as A, Txt as B } from "@stenajs-webui/core";
|
|
7
7
|
import { Spinner as L, Icon as M, FlatButton as D, stenaTimes as I } from "@stenajs-webui/elements";
|
|
8
|
-
const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k = "_content_5x3op_41", E = "_appear_5x3op_1",
|
|
8
|
+
const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k = "_content_5x3op_41", E = "_appear_5x3op_1", G = "_isDraggable_5x3op_70", z = "_footer_5x3op_101", H = "_stickyFooter_5x3op_105", n = {
|
|
9
9
|
overlay: O,
|
|
10
10
|
fadeIn: R,
|
|
11
11
|
modal: $,
|
|
12
12
|
content: k,
|
|
13
13
|
appear: E,
|
|
14
|
-
isDraggable:
|
|
15
|
-
footer:
|
|
16
|
-
stickyFooter:
|
|
17
|
-
},
|
|
14
|
+
isDraggable: G,
|
|
15
|
+
footer: z,
|
|
16
|
+
stickyFooter: H
|
|
17
|
+
}, v = "draggable-modal-handle", F = "draggable-modal-cancel", T = ({
|
|
18
18
|
width: o,
|
|
19
19
|
maxWidth: t,
|
|
20
20
|
draggable: l = !1,
|
|
@@ -25,7 +25,7 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
25
25
|
className: n.modal,
|
|
26
26
|
...s,
|
|
27
27
|
children: /* @__PURE__ */ e(w, {
|
|
28
|
-
handle: `.${
|
|
28
|
+
handle: `.${v}`,
|
|
29
29
|
cancel: `.${F}, button, [role="tooltip"]`,
|
|
30
30
|
bounds: ".ReactModal__Overlay",
|
|
31
31
|
disabled: !l,
|
|
@@ -34,22 +34,22 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
34
34
|
["--swui-modal-width"]: o,
|
|
35
35
|
["--swui-modal-max-width"]: t
|
|
36
36
|
},
|
|
37
|
-
className:
|
|
37
|
+
className: b(n.content, {
|
|
38
38
|
[n.isDraggable]: l
|
|
39
39
|
}),
|
|
40
40
|
children: r
|
|
41
41
|
})
|
|
42
42
|
})
|
|
43
|
-
}),
|
|
44
|
-
portal:
|
|
45
|
-
overlay:
|
|
46
|
-
content:
|
|
47
|
-
slideFromLeft:
|
|
48
|
-
slideFromRight:
|
|
49
|
-
afterOpen:
|
|
50
|
-
beforeClose:
|
|
51
|
-
slideFromTop:
|
|
52
|
-
slideFromBottom:
|
|
43
|
+
}), J = "_portal_b436j_1", K = "_overlay_b436j_2", Q = "_content_b436j_7", U = "_slideFromLeft_b436j_17", V = "_slideFromRight_b436j_18", W = "_afterOpen_b436j_24", X = "_beforeClose_b436j_28", Y = "_slideFromTop_b436j_33", Z = "_slideFromBottom_b436j_34", a = {
|
|
44
|
+
portal: J,
|
|
45
|
+
overlay: K,
|
|
46
|
+
content: Q,
|
|
47
|
+
slideFromLeft: U,
|
|
48
|
+
slideFromRight: V,
|
|
49
|
+
afterOpen: W,
|
|
50
|
+
beforeClose: X,
|
|
51
|
+
slideFromTop: Y,
|
|
52
|
+
slideFromBottom: Z
|
|
53
53
|
}, me = ({
|
|
54
54
|
background: o,
|
|
55
55
|
zIndex: t,
|
|
@@ -71,7 +71,7 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
71
71
|
beforeClose: a.beforeClose
|
|
72
72
|
},
|
|
73
73
|
className: {
|
|
74
|
-
base:
|
|
74
|
+
base: b(a.content, q(r)),
|
|
75
75
|
afterOpen: a.afterOpen,
|
|
76
76
|
beforeClose: a.beforeClose
|
|
77
77
|
},
|
|
@@ -89,7 +89,7 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
89
89
|
...i,
|
|
90
90
|
children: l
|
|
91
91
|
});
|
|
92
|
-
},
|
|
92
|
+
}, q = (o) => {
|
|
93
93
|
switch (o) {
|
|
94
94
|
case "left":
|
|
95
95
|
return a.slideFromLeft;
|
|
@@ -133,7 +133,7 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
133
133
|
isOpen: !0,
|
|
134
134
|
className: y.modal,
|
|
135
135
|
overlayClassName: y.overlay,
|
|
136
|
-
children: /* @__PURE__ */ c(
|
|
136
|
+
children: /* @__PURE__ */ c(u, {
|
|
137
137
|
spacing: 2,
|
|
138
138
|
alignItems: "center",
|
|
139
139
|
children: [/* @__PURE__ */ e(m, {
|
|
@@ -148,7 +148,7 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
148
148
|
size: "small"
|
|
149
149
|
})
|
|
150
150
|
}), (o || t) && /* @__PURE__ */ c(h, {
|
|
151
|
-
children: [/* @__PURE__ */ e(
|
|
151
|
+
children: [/* @__PURE__ */ e(j, {}), /* @__PURE__ */ c(f, {
|
|
152
152
|
indent: 2,
|
|
153
153
|
children: [o && /* @__PURE__ */ c(h, {
|
|
154
154
|
children: [/* @__PURE__ */ e(M, {
|
|
@@ -173,7 +173,7 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
173
173
|
spacing: 2,
|
|
174
174
|
indent: 2,
|
|
175
175
|
borderBottom: "1px solid var(--swui-modal-header-border-color)",
|
|
176
|
-
className:
|
|
176
|
+
className: v,
|
|
177
177
|
children: [/* @__PURE__ */ c(f, {
|
|
178
178
|
flex: 1,
|
|
179
179
|
indent: !0,
|
|
@@ -204,7 +204,7 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
204
204
|
footer: g,
|
|
205
205
|
disableStickyFooter: C = !1,
|
|
206
206
|
...N
|
|
207
|
-
}) => /* @__PURE__ */ c(
|
|
207
|
+
}) => /* @__PURE__ */ c(T, {
|
|
208
208
|
...N,
|
|
209
209
|
onRequestClose: d,
|
|
210
210
|
draggable: i,
|
|
@@ -218,27 +218,27 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
218
218
|
indent: typeof s == "number" ? s : 1,
|
|
219
219
|
children: l
|
|
220
220
|
}), g && /* @__PURE__ */ e(m, {
|
|
221
|
-
className:
|
|
221
|
+
className: b(n.footer, {
|
|
222
222
|
[n.stickyFooter]: !C
|
|
223
223
|
}),
|
|
224
224
|
children: g
|
|
225
225
|
})]
|
|
226
|
-
}),
|
|
226
|
+
}), be = ({
|
|
227
227
|
children: o
|
|
228
|
-
}) => /* @__PURE__ */ e(
|
|
228
|
+
}) => /* @__PURE__ */ e(u, {
|
|
229
229
|
indent: 2,
|
|
230
230
|
spacing: 2,
|
|
231
231
|
children: o
|
|
232
232
|
});
|
|
233
233
|
export {
|
|
234
|
-
|
|
234
|
+
T as BaseModal,
|
|
235
235
|
_e as CenterModal,
|
|
236
236
|
F as DRAGGABLE_CANCEL_CLASSNAME,
|
|
237
|
-
|
|
237
|
+
v as DRAGGABLE_HANDLE_CLASSNAME,
|
|
238
238
|
me as Drawer,
|
|
239
239
|
pe as LoadingModal,
|
|
240
240
|
fe as Modal,
|
|
241
|
-
|
|
241
|
+
be as ModalFooter,
|
|
242
242
|
te as ModalHeader
|
|
243
243
|
};
|
|
244
244
|
//# sourceMappingURL=index.es.js.map
|
package/dist/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
(function(){"use strict";try{var o=document.createElement("style");o.appendChild(document.createTextNode("._overlay_5x3op_1{--swui-modal-animation-time: var(--swui-animation-time-fast);--swui-modal-overlay-bg-color: var(--swui-overlay-bg-color);--swui-modal-content-bg-color: var(--swui-white);--swui-modal-width: 960px;--swui-modal-max-width: 100%;--swui-modal-header-border-color: var(--lhds-color-ui-300);--swui-modal-shadow: var(--swui-shadow-modal);--swui-modal-footer-shadow: var(--swui-shadow-modal);position:fixed;z-index:10;top:0;left:0;right:0;bottom:0;background-color:var(--swui-modal-overlay-bg-color);overflow:auto;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;-webkit-animation:_fadeIn_5x3op_1 var(--swui-modal-animation-time) cubic-bezier(.645,.045,.355,1) both;animation:_fadeIn_5x3op_1 var(--swui-modal-animation-time) cubic-bezier(.645,.045,.355,1) both}@media print{._overlay_5x3op_1{background-color:#fff}}._overlay_5x3op_1 ._modal_5x3op_31{max-width:100%;outline:none;pointer-events:none}@media (max-width: 768px){._overlay_5x3op_1 ._modal_5x3op_31{width:100%}}._overlay_5x3op_1 ._content_5x3op_41{position:relative;display:block;background:var(--swui-modal-content-bg-color);box-shadow:var(--swui-modal-shadow);pointer-events:all;top:calc(var(--swui-metrics-space) * 2);width:var(--swui-modal-width);max-width:var(--swui-modal-max-width)}@media (max-width: 768px){._overlay_5x3op_1 ._content_5x3op_41{top:0;width:100%;max-width:100%}}._overlay_5x3op_1 ._content_5x3op_41{-webkit-animation:_appear_5x3op_1 var(--swui-animation-time-fast) cubic-bezier(.645,.045,.355,1) both;animation:_appear_5x3op_1 var(--swui-animation-time-fast) cubic-bezier(.645,.045,.355,1) both}@media print{._overlay_5x3op_1 ._content_5x3op_41{box-shadow:none;top:0}}._overlay_5x3op_1 ._content_5x3op_41 :focus{outline:0}._overlay_5x3op_1 ._content_5x3op_41._isDraggable_5x3op_70 .draggable-modal-handle{cursor:move}._overlay_5x3op_1 ._content_5x3op_41._isDraggable_5x3op_70 .draggable-modal-handle .draggable-modal-cancel,._overlay_5x3op_1 ._content_5x3op_41._isDraggable_5x3op_70 .draggable-modal-handle [role=tooltip]{cursor:initial}@-webkit-keyframes _fadeIn_5x3op_1{0%{background-color:var(--swui-hidden)}to{background-color:var(--swui-modal-overlay-bg-color)}}@keyframes _fadeIn_5x3op_1{0%{background-color:var(--swui-hidden)}to{background-color:var(--swui-modal-overlay-bg-color)}}@-webkit-keyframes _appear_5x3op_1{0%{opacity:0}to{opacity:1}}@keyframes _appear_5x3op_1{0%{opacity:0}to{opacity:1}}._footer_5x3op_101{background-color:var(--swui-modal-content-bg-color)}._stickyFooter_5x3op_105{position:-webkit-sticky;position:sticky;bottom:0;box-shadow:var(--swui-modal-footer-shadow)}@media print{._stickyFooter_5x3op_105{position:static;box-shadow:none}}.
|
|
2
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const N=require("react-modal"),
|
|
1
|
+
(function(){"use strict";try{var o=document.createElement("style");o.appendChild(document.createTextNode("._overlay_5x3op_1{--swui-modal-animation-time: var(--swui-animation-time-fast);--swui-modal-overlay-bg-color: var(--swui-overlay-bg-color);--swui-modal-content-bg-color: var(--swui-white);--swui-modal-width: 960px;--swui-modal-max-width: 100%;--swui-modal-header-border-color: var(--lhds-color-ui-300);--swui-modal-shadow: var(--swui-shadow-modal);--swui-modal-footer-shadow: var(--swui-shadow-modal);position:fixed;z-index:10;top:0;left:0;right:0;bottom:0;background-color:var(--swui-modal-overlay-bg-color);overflow:auto;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;-webkit-animation:_fadeIn_5x3op_1 var(--swui-modal-animation-time) cubic-bezier(.645,.045,.355,1) both;animation:_fadeIn_5x3op_1 var(--swui-modal-animation-time) cubic-bezier(.645,.045,.355,1) both}@media print{._overlay_5x3op_1{background-color:#fff}}._overlay_5x3op_1 ._modal_5x3op_31{max-width:100%;outline:none;pointer-events:none}@media (max-width: 768px){._overlay_5x3op_1 ._modal_5x3op_31{width:100%}}._overlay_5x3op_1 ._content_5x3op_41{position:relative;display:block;background:var(--swui-modal-content-bg-color);box-shadow:var(--swui-modal-shadow);pointer-events:all;top:calc(var(--swui-metrics-space) * 2);width:var(--swui-modal-width);max-width:var(--swui-modal-max-width)}@media (max-width: 768px){._overlay_5x3op_1 ._content_5x3op_41{top:0;width:100%;max-width:100%}}._overlay_5x3op_1 ._content_5x3op_41{-webkit-animation:_appear_5x3op_1 var(--swui-animation-time-fast) cubic-bezier(.645,.045,.355,1) both;animation:_appear_5x3op_1 var(--swui-animation-time-fast) cubic-bezier(.645,.045,.355,1) both}@media print{._overlay_5x3op_1 ._content_5x3op_41{box-shadow:none;top:0}}._overlay_5x3op_1 ._content_5x3op_41 :focus{outline:0}._overlay_5x3op_1 ._content_5x3op_41._isDraggable_5x3op_70 .draggable-modal-handle{cursor:move}._overlay_5x3op_1 ._content_5x3op_41._isDraggable_5x3op_70 .draggable-modal-handle .draggable-modal-cancel,._overlay_5x3op_1 ._content_5x3op_41._isDraggable_5x3op_70 .draggable-modal-handle [role=tooltip]{cursor:initial}@-webkit-keyframes _fadeIn_5x3op_1{0%{background-color:var(--swui-hidden)}to{background-color:var(--swui-modal-overlay-bg-color)}}@keyframes _fadeIn_5x3op_1{0%{background-color:var(--swui-hidden)}to{background-color:var(--swui-modal-overlay-bg-color)}}@-webkit-keyframes _appear_5x3op_1{0%{opacity:0}to{opacity:1}}@keyframes _appear_5x3op_1{0%{opacity:0}to{opacity:1}}._footer_5x3op_101{background-color:var(--swui-modal-content-bg-color)}._stickyFooter_5x3op_105{position:-webkit-sticky;position:sticky;bottom:0;box-shadow:var(--swui-modal-footer-shadow)}@media print{._stickyFooter_5x3op_105{position:static;box-shadow:none}}._portal_b436j_1 ._overlay_b436j_2{position:fixed;inset:0}._portal_b436j_1 ._content_b436j_7{box-shadow:var(--swui-shadow-modal);background:white;position:absolute;transition:-webkit-transform var(--swui-animation-time-medium) ease-in-out;transition:transform var(--swui-animation-time-medium) ease-in-out;transition:transform var(--swui-animation-time-medium) ease-in-out,-webkit-transform var(--swui-animation-time-medium) ease-in-out}._portal_b436j_1 ._content_b436j_7:focus-visible{outline:unset}._portal_b436j_1 ._content_b436j_7._slideFromLeft_b436j_17,._portal_b436j_1 ._content_b436j_7._slideFromRight_b436j_18{-webkit-transform:translateX(var(--translate-x-outside-screen, 0));transform:translate(var(--translate-x-outside-screen, 0));overflow-y:auto;top:0;bottom:0}._portal_b436j_1 ._content_b436j_7._slideFromLeft_b436j_17._afterOpen_b436j_24,._portal_b436j_1 ._content_b436j_7._slideFromRight_b436j_18._afterOpen_b436j_24{-webkit-transform:translateX(0);transform:translate(0)}._portal_b436j_1 ._content_b436j_7._slideFromLeft_b436j_17._beforeClose_b436j_28,._portal_b436j_1 ._content_b436j_7._slideFromRight_b436j_18._beforeClose_b436j_28{-webkit-transform:translateX(var(--translate-x-outside-screen));transform:translate(var(--translate-x-outside-screen))}._portal_b436j_1 ._content_b436j_7._slideFromTop_b436j_33,._portal_b436j_1 ._content_b436j_7._slideFromBottom_b436j_34{-webkit-transform:translateY(var(--translate-y-outside-screen, 0));transform:translateY(var(--translate-y-outside-screen, 0));overflow-x:auto;left:0;right:0}._portal_b436j_1 ._content_b436j_7._slideFromTop_b436j_33._afterOpen_b436j_24,._portal_b436j_1 ._content_b436j_7._slideFromBottom_b436j_34._afterOpen_b436j_24{-webkit-transform:translateY(0);transform:translateY(0)}._portal_b436j_1 ._content_b436j_7._slideFromTop_b436j_33._beforeClose_b436j_28,._portal_b436j_1 ._content_b436j_7._slideFromBottom_b436j_34._beforeClose_b436j_28{-webkit-transform:translateY(var(--translate-y-outside-screen));transform:translateY(var(--translate-y-outside-screen))}._portal_b436j_1 ._content_b436j_7._slideFromLeft_b436j_17{--translate-x-outside-screen: -100%;width:370px;left:0}._portal_b436j_1 ._content_b436j_7._slideFromRight_b436j_18{--translate-x-outside-screen: 100%;width:370px;right:0}._portal_b436j_1 ._content_b436j_7._slideFromTop_b436j_33{--translate-y-outside-screen: -100%;height:370px;top:0}._portal_b436j_1 ._content_b436j_7._slideFromBottom_b436j_34{--translate-y-outside-screen: 100%;height:370px;bottom:0}._modal_4fwgb_1{display:flex;justify-content:center;align-items:center;position:fixed;top:0;left:0;right:0;bottom:0;background-color:transparent}._overlay_4fwgb_13{position:fixed;top:0;left:0;right:0;bottom:0;background-color:var(--swui-overlay-bg-color)}")),document.head.appendChild(o)}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
|
|
2
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const N=require("react-modal"),M=require("react-draggable"),A=require("classnames"),e=require("react/jsx-runtime"),t=require("@stenajs-webui/core"),_=require("@stenajs-webui/elements"),f=o=>o&&typeof o=="object"&&"default"in o?o:{default:o},m=f(N),L=f(M),x=f(A),S="_overlay_5x3op_1",B="_fadeIn_5x3op_1",D="_modal_5x3op_31",R="_content_5x3op_41",E="_appear_5x3op_1",O="_isDraggable_5x3op_70",G="_footer_5x3op_101",I="_stickyFooter_5x3op_105",n={overlay:S,fadeIn:B,modal:D,content:R,appear:E,isDraggable:O,footer:G,stickyFooter:I},p="draggable-modal-handle",b="draggable-modal-cancel",y=({width:o,maxWidth:s,draggable:l=!1,children:r,...c})=>e.jsx(m.default,{overlayClassName:n.overlay,className:n.modal,...c,children:e.jsx(L.default,{handle:`.${p}`,cancel:`.${b}, button, [role="tooltip"]`,bounds:".ReactModal__Overlay",disabled:!l,children:e.jsx("div",{style:{["--swui-modal-width"]:o,["--swui-modal-max-width"]:s},className:x.default(n.content,{[n.isDraggable]:l}),children:r})})}),$="_portal_b436j_1",k="_overlay_b436j_2",q="_content_b436j_7",H="_slideFromLeft_b436j_17",T="_slideFromRight_b436j_18",z="_afterOpen_b436j_24",J="_beforeClose_b436j_28",K="_slideFromTop_b436j_33",P="_slideFromBottom_b436j_34",a={portal:$,overlay:k,content:q,slideFromLeft:H,slideFromRight:T,afterOpen:z,beforeClose:J,slideFromTop:K,slideFromBottom:P},Q=({background:o,zIndex:s,children:l,slideFrom:r="left",portalTarget:c,...i})=>{const{height:d,width:u}=i;return e.jsx(m.default,{closeTimeoutMS:250,portalClassName:a.portal,overlayClassName:{base:a.overlay,afterOpen:a.afterOpen,beforeClose:a.beforeClose},className:{base:x.default(a.content,U(r)),afterOpen:a.afterOpen,beforeClose:a.beforeClose},style:{content:{width:u,height:d,background:o},overlay:{zIndex:s}},parentSelector:c?()=>c:void 0,...i,children:l})},U=o=>{switch(o){case"left":return a.slideFromLeft;case"right":return a.slideFromRight;case"top":return a.slideFromTop;case"bottom":return a.slideFromBottom;default:return t.exhaustSwitchCase(o,a.slideFromLeft)}},V={overlay:{justifyContent:"center"}},W=({children:o,...s})=>e.jsx(m.default,{overlayClassName:n.overlay,className:n.modal,style:V,...s,children:e.jsx("div",{className:n.content,style:{["--swui-modal-width"]:"fit-content"},children:o})}),X="_modal_4fwgb_1",Y="_overlay_4fwgb_13",j={modal:X,overlay:Y},Z=({headerIconLeft:o,headerText:s,...l})=>e.jsx(m.default,{...l,isOpen:!0,className:j.modal,overlayClassName:j.overlay,children:e.jsxs(t.Column,{spacing:2,alignItems:"center",children:[e.jsx(t.Box,{alignItems:"center",justifyContent:"center",width:"64px",height:"64px",borderRadius:"50%",background:"white",shadow:"modal",children:e.jsx(_.Spinner,{size:"small"})}),(o||s)&&e.jsxs(e.Fragment,{children:[e.jsx(t.Spacing,{}),e.jsxs(t.Row,{indent:2,children:[o&&e.jsxs(e.Fragment,{children:[e.jsx(_.Icon,{size:14,icon:o,color:"white"}),e.jsx(t.Indent,{})]}),s&&e.jsx(t.Heading,{variant:"h4",color:"white",children:s})]})]})]})}),h=({onRequestClose:o,header:s,headerText:l,closeButtonClassName:r})=>e.jsxs(t.Row,{spacing:2,indent:2,borderBottom:"1px solid var(--swui-modal-header-border-color)",className:p,children:[e.jsxs(t.Row,{flex:1,indent:!0,alignItems:"center",children:[l&&e.jsx(t.Txt,{className:b,size:"large",children:l}),s]}),e.jsx(t.Box,{alignSelf:"flex-start",children:e.jsx(_.FlatButton,{className:r,onClick:o,"aria-label":"Close",leftIcon:_.stenaTimes})})]}),ee=({header:o,headerText:s,children:l,spacing:r,indent:c,draggable:i=!1,onRequestClose:d,closeButtonClassName:u,footer:g,disableStickyFooter:v=!1,...C})=>{const F=typeof r=="number"?r:1,w=typeof c=="number"?c:1;return e.jsxs(y,{...C,onRequestClose:d,draggable:i,children:[e.jsx(h,{onRequestClose:d,header:o,headerText:s,closeButtonClassName:u}),e.jsx(t.Box,{spacing:F,indent:w,children:l}),g&&e.jsx(t.Box,{className:x.default(n.footer,{[n.stickyFooter]:!v}),children:g})]})},oe=({children:o})=>e.jsx(t.Column,{indent:2,spacing:2,children:o});exports.BaseModal=y;exports.CenterModal=W;exports.DRAGGABLE_CANCEL_CLASSNAME=b;exports.DRAGGABLE_HANDLE_CLASSNAME=p;exports.Drawer=Q;exports.LoadingModal=Z;exports.Modal=ee;exports.ModalFooter=oe;exports.ModalHeader=h;
|
|
3
3
|
//# sourceMappingURL=index.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stenajs-webui/modal",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "19.0.0-next.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"author": "mattias800",
|
|
6
6
|
"license": "MIT",
|
|
@@ -26,9 +26,9 @@
|
|
|
26
26
|
"deploy": "gh-pages -d example/build"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@stenajs-webui/core": "
|
|
30
|
-
"@stenajs-webui/elements": "
|
|
31
|
-
"@stenajs-webui/theme": "
|
|
29
|
+
"@stenajs-webui/core": "19.0.0-next.0",
|
|
30
|
+
"@stenajs-webui/elements": "19.0.0-next.0",
|
|
31
|
+
"@stenajs-webui/theme": "19.0.0-next.0",
|
|
32
32
|
"@types/react-modal": "^3.13.1",
|
|
33
33
|
"classnames": "^2.3.1",
|
|
34
34
|
"react-draggable": "^4.4.5",
|
|
@@ -58,5 +58,5 @@
|
|
|
58
58
|
"files": [
|
|
59
59
|
"dist"
|
|
60
60
|
],
|
|
61
|
-
"gitHead": "
|
|
61
|
+
"gitHead": "835ed29571c4902a9bc9ecb45646fe15d7316c1e"
|
|
62
62
|
}
|