@stenajs-webui/modal 19.0.0-next.16 → 19.0.0-next.18
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.js +2 -2
- package/package.json +5 -5
package/dist/index.es.js
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
(function(){"use strict";try{var
|
|
2
|
-
import { jsx as e, jsxs as l, Fragment as
|
|
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_17ze5_1{--drawer-width: 370px}._portal_17ze5_1 ._overlay_17ze5_4{position:fixed;inset:0}._portal_17ze5_1 ._content_17ze5_9{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_17ze5_1 ._content_17ze5_9._floating_17ze5_15{margin:var(--swui-metrics-space);border-radius:var(--swui-border-radius)}@media (max-width: 768px){._portal_17ze5_1 ._content_17ze5_9._floating_17ze5_15{margin:0;border-radius:0}}._portal_17ze5_1 ._content_17ze5_9:focus-visible{outline:unset}._portal_17ze5_1 ._content_17ze5_9._slideFromLeft_17ze5_29,._portal_17ze5_1 ._content_17ze5_9._slideFromRight_17ze5_30{-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_17ze5_1 ._content_17ze5_9._slideFromLeft_17ze5_29._afterOpen_17ze5_36,._portal_17ze5_1 ._content_17ze5_9._slideFromRight_17ze5_30._afterOpen_17ze5_36{-webkit-transform:translateX(0);transform:translate(0)}._portal_17ze5_1 ._content_17ze5_9._slideFromLeft_17ze5_29._beforeClose_17ze5_40,._portal_17ze5_1 ._content_17ze5_9._slideFromRight_17ze5_30._beforeClose_17ze5_40{-webkit-transform:translateX(var(--translate-x-outside-screen));transform:translate(var(--translate-x-outside-screen))}._portal_17ze5_1 ._content_17ze5_9._slideFromTop_17ze5_45,._portal_17ze5_1 ._content_17ze5_9._slideFromBottom_17ze5_46{-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_17ze5_1 ._content_17ze5_9._slideFromTop_17ze5_45._afterOpen_17ze5_36,._portal_17ze5_1 ._content_17ze5_9._slideFromBottom_17ze5_46._afterOpen_17ze5_36{-webkit-transform:translateY(0);transform:translateY(0)}._portal_17ze5_1 ._content_17ze5_9._slideFromTop_17ze5_45._beforeClose_17ze5_40,._portal_17ze5_1 ._content_17ze5_9._slideFromBottom_17ze5_46._beforeClose_17ze5_40{-webkit-transform:translateY(var(--translate-y-outside-screen));transform:translateY(var(--translate-y-outside-screen))}._portal_17ze5_1 ._content_17ze5_9._slideFromLeft_17ze5_29{--translate-x-outside-screen: -100%;width:var(--drawer-width);left:0}._portal_17ze5_1 ._content_17ze5_9._slideFromRight_17ze5_30{--translate-x-outside-screen: 100%;width:var(--drawer-width);right:0}._portal_17ze5_1 ._content_17ze5_9._slideFromTop_17ze5_45{--translate-y-outside-screen: -100%;height:var(--drawer-width);top:0}._portal_17ze5_1 ._content_17ze5_9._slideFromBottom_17ze5_46{--translate-y-outside-screen: 100%;height:var(--drawer-width);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(e){console.error("vite-plugin-css-injected-by-js",e)}})();
|
|
2
|
+
import { jsx as e, jsxs as l, Fragment as y } from "react/jsx-runtime";
|
|
3
3
|
import p from "react-modal";
|
|
4
|
-
import
|
|
4
|
+
import B from "react-draggable";
|
|
5
5
|
import h from "classnames";
|
|
6
|
-
import { exhaustSwitchCase as
|
|
7
|
-
import { Icon as w, FlatButton as x, stenaTimes as N, Spinner as
|
|
8
|
-
import { cssColor as
|
|
9
|
-
const
|
|
10
|
-
overlay:
|
|
11
|
-
fadeIn:
|
|
12
|
-
modal:
|
|
13
|
-
content:
|
|
6
|
+
import { exhaustSwitchCase as D, Spacing as b, Row as c, Space as u, Heading as C, Column as F, Box as _, Indent as L, Txt as M } from "@stenajs-webui/core";
|
|
7
|
+
import { Icon as w, FlatButton as x, stenaTimes as N, Spinner as k } from "@stenajs-webui/elements";
|
|
8
|
+
import { cssColor as O } from "@stenajs-webui/theme";
|
|
9
|
+
const R = "_overlay_5x3op_1", $ = "_fadeIn_5x3op_1", E = "_modal_5x3op_31", j = "_content_5x3op_41", G = "_appear_5x3op_1", H = "_isDraggable_5x3op_70", T = "_footer_5x3op_101", J = "_stickyFooter_5x3op_105", s = {
|
|
10
|
+
overlay: R,
|
|
11
|
+
fadeIn: $,
|
|
12
|
+
modal: E,
|
|
13
|
+
content: j,
|
|
14
14
|
appear: G,
|
|
15
15
|
isDraggable: H,
|
|
16
16
|
footer: T,
|
|
17
17
|
stickyFooter: J
|
|
18
|
-
},
|
|
18
|
+
}, z = "draggable-modal-handle", S = "draggable-modal-cancel", K = ({
|
|
19
19
|
width: o,
|
|
20
20
|
maxWidth: t,
|
|
21
21
|
draggable: n = !1,
|
|
@@ -28,10 +28,10 @@ const $ = "_overlay_5x3op_1", E = "_fadeIn_5x3op_1", j = "_modal_5x3op_31", z =
|
|
|
28
28
|
className: s.modal,
|
|
29
29
|
...i,
|
|
30
30
|
children: /* @__PURE__ */ e(
|
|
31
|
-
|
|
31
|
+
B,
|
|
32
32
|
{
|
|
33
|
-
handle: `.${
|
|
34
|
-
cancel: `.${
|
|
33
|
+
handle: `.${z}`,
|
|
34
|
+
cancel: `.${S}, button, [role="tooltip"]`,
|
|
35
35
|
bounds: ".ReactModal__Overlay",
|
|
36
36
|
disabled: !n,
|
|
37
37
|
children: /* @__PURE__ */ e(
|
|
@@ -50,7 +50,7 @@ const $ = "_overlay_5x3op_1", E = "_fadeIn_5x3op_1", j = "_modal_5x3op_31", z =
|
|
|
50
50
|
}
|
|
51
51
|
)
|
|
52
52
|
}
|
|
53
|
-
), Q = "
|
|
53
|
+
), Q = "_portal_17ze5_1", U = "_overlay_17ze5_4", V = "_content_17ze5_9", W = "_floating_17ze5_15", X = "_slideFromLeft_17ze5_29", Y = "_slideFromRight_17ze5_30", Z = "_afterOpen_17ze5_36", q = "_beforeClose_17ze5_40", P = "_slideFromTop_17ze5_45", ee = "_slideFromBottom_17ze5_46", a = {
|
|
54
54
|
portal: Q,
|
|
55
55
|
overlay: U,
|
|
56
56
|
content: V,
|
|
@@ -107,7 +107,7 @@ const $ = "_overlay_5x3op_1", E = "_fadeIn_5x3op_1", j = "_modal_5x3op_31", z =
|
|
|
107
107
|
case "bottom":
|
|
108
108
|
return a.slideFromBottom;
|
|
109
109
|
default:
|
|
110
|
-
return
|
|
110
|
+
return D(o, a.slideFromLeft);
|
|
111
111
|
}
|
|
112
112
|
}, he = ({
|
|
113
113
|
header: o,
|
|
@@ -115,12 +115,12 @@ const $ = "_overlay_5x3op_1", E = "_fadeIn_5x3op_1", j = "_modal_5x3op_31", z =
|
|
|
115
115
|
onRequestClose: n,
|
|
116
116
|
icon: r
|
|
117
117
|
}) => /* @__PURE__ */ e(
|
|
118
|
-
|
|
118
|
+
b,
|
|
119
119
|
{
|
|
120
120
|
position: "sticky",
|
|
121
121
|
top: 0,
|
|
122
122
|
zIndex: 100,
|
|
123
|
-
background:
|
|
123
|
+
background: O("--lhds-color-ui-50"),
|
|
124
124
|
children: /* @__PURE__ */ l(
|
|
125
125
|
c,
|
|
126
126
|
{
|
|
@@ -129,7 +129,7 @@ const $ = "_overlay_5x3op_1", E = "_fadeIn_5x3op_1", j = "_modal_5x3op_31", z =
|
|
|
129
129
|
height: "48px",
|
|
130
130
|
children: [
|
|
131
131
|
/* @__PURE__ */ l(c, { alignItems: "center", gap: 2, children: [
|
|
132
|
-
/* @__PURE__ */ e(
|
|
132
|
+
/* @__PURE__ */ e(u, { num: 1 }),
|
|
133
133
|
r && /* @__PURE__ */ e(w, { icon: r, size: 24 }),
|
|
134
134
|
/* @__PURE__ */ e(C, { variant: "h4", children: o })
|
|
135
135
|
] }),
|
|
@@ -143,13 +143,13 @@ const $ = "_overlay_5x3op_1", E = "_fadeIn_5x3op_1", j = "_modal_5x3op_31", z =
|
|
|
143
143
|
variant: "danger"
|
|
144
144
|
}
|
|
145
145
|
),
|
|
146
|
-
/* @__PURE__ */ e(
|
|
146
|
+
/* @__PURE__ */ e(u, { num: 0.5 })
|
|
147
147
|
] })
|
|
148
148
|
]
|
|
149
149
|
}
|
|
150
150
|
)
|
|
151
151
|
}
|
|
152
|
-
), te = { overlay: { justifyContent: "center" } },
|
|
152
|
+
), te = { overlay: { justifyContent: "center" } }, ye = ({
|
|
153
153
|
children: o,
|
|
154
154
|
...t
|
|
155
155
|
}) => /* @__PURE__ */ e(
|
|
@@ -168,10 +168,10 @@ const $ = "_overlay_5x3op_1", E = "_fadeIn_5x3op_1", j = "_modal_5x3op_31", z =
|
|
|
168
168
|
}
|
|
169
169
|
)
|
|
170
170
|
}
|
|
171
|
-
), ne = "_modal_4fwgb_1", ae = "_overlay_4fwgb_13",
|
|
171
|
+
), ne = "_modal_4fwgb_1", ae = "_overlay_4fwgb_13", v = {
|
|
172
172
|
modal: ne,
|
|
173
173
|
overlay: ae
|
|
174
|
-
},
|
|
174
|
+
}, ue = ({
|
|
175
175
|
headerIconLeft: o,
|
|
176
176
|
headerText: t,
|
|
177
177
|
...n
|
|
@@ -180,8 +180,8 @@ const $ = "_overlay_5x3op_1", E = "_fadeIn_5x3op_1", j = "_modal_5x3op_31", z =
|
|
|
180
180
|
{
|
|
181
181
|
...n,
|
|
182
182
|
isOpen: !0,
|
|
183
|
-
className:
|
|
184
|
-
overlayClassName:
|
|
183
|
+
className: v.modal,
|
|
184
|
+
overlayClassName: v.overlay,
|
|
185
185
|
children: /* @__PURE__ */ l(F, { spacing: 2, alignItems: "center", children: [
|
|
186
186
|
/* @__PURE__ */ e(
|
|
187
187
|
_,
|
|
@@ -193,15 +193,15 @@ const $ = "_overlay_5x3op_1", E = "_fadeIn_5x3op_1", j = "_modal_5x3op_31", z =
|
|
|
193
193
|
borderRadius: "50%",
|
|
194
194
|
background: "white",
|
|
195
195
|
shadow: "modal",
|
|
196
|
-
children: /* @__PURE__ */ e(
|
|
196
|
+
children: /* @__PURE__ */ e(k, { size: "small" })
|
|
197
197
|
}
|
|
198
198
|
),
|
|
199
|
-
(o || t) && /* @__PURE__ */ l(
|
|
200
|
-
/* @__PURE__ */ e(
|
|
199
|
+
(o || t) && /* @__PURE__ */ l(y, { children: [
|
|
200
|
+
/* @__PURE__ */ e(b, {}),
|
|
201
201
|
/* @__PURE__ */ l(c, { indent: 2, children: [
|
|
202
|
-
o && /* @__PURE__ */ l(
|
|
202
|
+
o && /* @__PURE__ */ l(y, { children: [
|
|
203
203
|
/* @__PURE__ */ e(w, { size: 14, icon: o, color: "white" }),
|
|
204
|
-
/* @__PURE__ */ e(
|
|
204
|
+
/* @__PURE__ */ e(L, {})
|
|
205
205
|
] }),
|
|
206
206
|
t && /* @__PURE__ */ e(C, { variant: "h4", color: "white", children: t })
|
|
207
207
|
] })
|
|
@@ -219,10 +219,10 @@ const $ = "_overlay_5x3op_1", E = "_fadeIn_5x3op_1", j = "_modal_5x3op_31", z =
|
|
|
219
219
|
spacing: 2,
|
|
220
220
|
indent: 2,
|
|
221
221
|
borderBottom: "1px solid var(--swui-modal-header-border-color)",
|
|
222
|
-
className:
|
|
222
|
+
className: z,
|
|
223
223
|
children: [
|
|
224
224
|
/* @__PURE__ */ l(c, { flex: 1, indent: !0, alignItems: "center", children: [
|
|
225
|
-
n && /* @__PURE__ */ e(
|
|
225
|
+
n && /* @__PURE__ */ e(M, { className: S, size: "large", children: n }),
|
|
226
226
|
t
|
|
227
227
|
] }),
|
|
228
228
|
/* @__PURE__ */ e(_, { alignSelf: "flex-start", children: /* @__PURE__ */ e(
|
|
@@ -236,7 +236,7 @@ const $ = "_overlay_5x3op_1", E = "_fadeIn_5x3op_1", j = "_modal_5x3op_31", z =
|
|
|
236
236
|
) })
|
|
237
237
|
]
|
|
238
238
|
}
|
|
239
|
-
),
|
|
239
|
+
), ve = ({
|
|
240
240
|
header: o,
|
|
241
241
|
headerText: t,
|
|
242
242
|
children: n,
|
|
@@ -246,9 +246,9 @@ const $ = "_overlay_5x3op_1", E = "_fadeIn_5x3op_1", j = "_modal_5x3op_31", z =
|
|
|
246
246
|
onRequestClose: d,
|
|
247
247
|
closeButtonClassName: g,
|
|
248
248
|
footer: m,
|
|
249
|
-
disableStickyFooter:
|
|
250
|
-
...
|
|
251
|
-
}) => /* @__PURE__ */ l(K, { ...
|
|
249
|
+
disableStickyFooter: I = !1,
|
|
250
|
+
...A
|
|
251
|
+
}) => /* @__PURE__ */ l(K, { ...A, onRequestClose: d, draggable: f, children: [
|
|
252
252
|
/* @__PURE__ */ e(
|
|
253
253
|
re,
|
|
254
254
|
{
|
|
@@ -263,22 +263,22 @@ const $ = "_overlay_5x3op_1", E = "_fadeIn_5x3op_1", j = "_modal_5x3op_31", z =
|
|
|
263
263
|
_,
|
|
264
264
|
{
|
|
265
265
|
className: h(s.footer, {
|
|
266
|
-
[s.stickyFooter]: !
|
|
266
|
+
[s.stickyFooter]: !I
|
|
267
267
|
}),
|
|
268
268
|
children: m
|
|
269
269
|
}
|
|
270
270
|
)
|
|
271
|
-
] }),
|
|
271
|
+
] }), be = ({ children: o }) => /* @__PURE__ */ e(F, { indent: 2, spacing: 2, children: o });
|
|
272
272
|
export {
|
|
273
273
|
K as BaseModal,
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
274
|
+
ye as CenterModal,
|
|
275
|
+
S as DRAGGABLE_CANCEL_CLASSNAME,
|
|
276
|
+
z as DRAGGABLE_HANDLE_CLASSNAME,
|
|
277
277
|
ge as Drawer,
|
|
278
278
|
he as DrawerHeader,
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
279
|
+
ue as LoadingModal,
|
|
280
|
+
ve as Modal,
|
|
281
|
+
be as ModalFooter,
|
|
282
282
|
re as ModalHeader
|
|
283
283
|
};
|
|
284
284
|
//# sourceMappingURL=index.es.js.map
|
package/dist/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
(function(){"use strict";try{var
|
|
2
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),N=require("react-modal"),M=require("react-draggable"),S=require("classnames"),o=require("@stenajs-webui/core"),i=require("@stenajs-webui/elements"),A=require("@stenajs-webui/theme"),x=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},_=x(N),L=x(M),g=x(S),R="_overlay_5x3op_1",B="_fadeIn_5x3op_1",D="_modal_5x3op_31",
|
|
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_17ze5_1{--drawer-width: 370px}._portal_17ze5_1 ._overlay_17ze5_4{position:fixed;inset:0}._portal_17ze5_1 ._content_17ze5_9{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_17ze5_1 ._content_17ze5_9._floating_17ze5_15{margin:var(--swui-metrics-space);border-radius:var(--swui-border-radius)}@media (max-width: 768px){._portal_17ze5_1 ._content_17ze5_9._floating_17ze5_15{margin:0;border-radius:0}}._portal_17ze5_1 ._content_17ze5_9:focus-visible{outline:unset}._portal_17ze5_1 ._content_17ze5_9._slideFromLeft_17ze5_29,._portal_17ze5_1 ._content_17ze5_9._slideFromRight_17ze5_30{-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_17ze5_1 ._content_17ze5_9._slideFromLeft_17ze5_29._afterOpen_17ze5_36,._portal_17ze5_1 ._content_17ze5_9._slideFromRight_17ze5_30._afterOpen_17ze5_36{-webkit-transform:translateX(0);transform:translate(0)}._portal_17ze5_1 ._content_17ze5_9._slideFromLeft_17ze5_29._beforeClose_17ze5_40,._portal_17ze5_1 ._content_17ze5_9._slideFromRight_17ze5_30._beforeClose_17ze5_40{-webkit-transform:translateX(var(--translate-x-outside-screen));transform:translate(var(--translate-x-outside-screen))}._portal_17ze5_1 ._content_17ze5_9._slideFromTop_17ze5_45,._portal_17ze5_1 ._content_17ze5_9._slideFromBottom_17ze5_46{-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_17ze5_1 ._content_17ze5_9._slideFromTop_17ze5_45._afterOpen_17ze5_36,._portal_17ze5_1 ._content_17ze5_9._slideFromBottom_17ze5_46._afterOpen_17ze5_36{-webkit-transform:translateY(0);transform:translateY(0)}._portal_17ze5_1 ._content_17ze5_9._slideFromTop_17ze5_45._beforeClose_17ze5_40,._portal_17ze5_1 ._content_17ze5_9._slideFromBottom_17ze5_46._beforeClose_17ze5_40{-webkit-transform:translateY(var(--translate-y-outside-screen));transform:translateY(var(--translate-y-outside-screen))}._portal_17ze5_1 ._content_17ze5_9._slideFromLeft_17ze5_29{--translate-x-outside-screen: -100%;width:var(--drawer-width);left:0}._portal_17ze5_1 ._content_17ze5_9._slideFromRight_17ze5_30{--translate-x-outside-screen: 100%;width:var(--drawer-width);right:0}._portal_17ze5_1 ._content_17ze5_9._slideFromTop_17ze5_45{--translate-y-outside-screen: -100%;height:var(--drawer-width);top:0}._portal_17ze5_1 ._content_17ze5_9._slideFromBottom_17ze5_46{--translate-y-outside-screen: 100%;height:var(--drawer-width);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(e){console.error("vite-plugin-css-injected-by-js",e)}})();
|
|
2
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),N=require("react-modal"),M=require("react-draggable"),S=require("classnames"),o=require("@stenajs-webui/core"),i=require("@stenajs-webui/elements"),A=require("@stenajs-webui/theme"),x=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},_=x(N),L=x(M),g=x(S),R="_overlay_5x3op_1",B="_fadeIn_5x3op_1",D="_modal_5x3op_31",z="_content_5x3op_41",I="_appear_5x3op_1",E="_isDraggable_5x3op_70",O="_footer_5x3op_101",k="_stickyFooter_5x3op_105",r={overlay:R,fadeIn:B,modal:D,content:z,appear:I,isDraggable:E,footer:O,stickyFooter:k},p="draggable-modal-handle",h="draggable-modal-cancel",y=({width:t,maxWidth:s,draggable:a=!1,children:l,...c})=>e.jsx(_.default,{overlayClassName:r.overlay,className:r.modal,...c,children:e.jsx(L.default,{handle:`.${p}`,cancel:`.${h}, button, [role="tooltip"]`,bounds:".ReactModal__Overlay",disabled:!a,children:e.jsx("div",{style:{["--swui-modal-width"]:t,["--swui-modal-max-width"]:s},className:g.default(r.content,{[r.isDraggable]:a}),children:l})})}),G="_portal_17ze5_1",H="_overlay_17ze5_4",$="_content_17ze5_9",q="_floating_17ze5_15",T="_slideFromLeft_17ze5_29",J="_slideFromRight_17ze5_30",K="_afterOpen_17ze5_36",P="_beforeClose_17ze5_40",Q="_slideFromTop_17ze5_45",U="_slideFromBottom_17ze5_46",n={portal:G,overlay:H,content:$,floating:q,slideFromLeft:T,slideFromRight:J,afterOpen:K,beforeClose:P,slideFromTop:Q,slideFromBottom:U},V=({background:t,zIndex:s,children:a,slideFrom:l="left",portalTarget:c,floating:u,...d})=>{const{height:f,width:m}=d;return e.jsx(_.default,{closeTimeoutMS:250,portalClassName:n.portal,overlayClassName:{base:n.overlay,afterOpen:n.afterOpen,beforeClose:n.beforeClose},className:{base:g.default(n.content,W(l),u&&n.floating),afterOpen:n.afterOpen,beforeClose:n.beforeClose},style:{content:{width:m,height:f,background:t},overlay:{zIndex:s}},parentSelector:c?()=>c:void 0,...d,children:a})},W=t=>{switch(t){case"left":return n.slideFromLeft;case"right":return n.slideFromRight;case"top":return n.slideFromTop;case"bottom":return n.slideFromBottom;default:return o.exhaustSwitchCase(t,n.slideFromLeft)}},X=({header:t,contentRight:s,onRequestClose:a,icon:l})=>e.jsx(o.Spacing,{position:"sticky",top:0,zIndex:100,background:A.cssColor("--lhds-color-ui-50"),children:e.jsxs(o.Row,{justifyContent:"space-between",alignItems:"center",height:"48px",children:[e.jsxs(o.Row,{alignItems:"center",gap:2,children:[e.jsx(o.Space,{num:1}),l&&e.jsx(i.Icon,{icon:l,size:24}),e.jsx(o.Heading,{variant:"h4",children:t})]}),e.jsxs(o.Row,{gap:1,children:[s,e.jsx(i.FlatButton,{leftIcon:i.stenaTimes,onClick:a,variant:"danger"}),e.jsx(o.Space,{num:.5})]})]})}),Y={overlay:{justifyContent:"center"}},Z=({children:t,...s})=>e.jsx(_.default,{overlayClassName:r.overlay,className:r.modal,style:Y,...s,children:e.jsx("div",{className:r.content,style:{["--swui-modal-width"]:"fit-content"},children:t})}),ee="_modal_4fwgb_1",te="_overlay_4fwgb_13",j={modal:ee,overlay:te},oe=({headerIconLeft:t,headerText:s,...a})=>e.jsx(_.default,{...a,isOpen:!0,className:j.modal,overlayClassName:j.overlay,children:e.jsxs(o.Column,{spacing:2,alignItems:"center",children:[e.jsx(o.Box,{alignItems:"center",justifyContent:"center",width:"64px",height:"64px",borderRadius:"50%",background:"white",shadow:"modal",children:e.jsx(i.Spinner,{size:"small"})}),(t||s)&&e.jsxs(e.Fragment,{children:[e.jsx(o.Spacing,{}),e.jsxs(o.Row,{indent:2,children:[t&&e.jsxs(e.Fragment,{children:[e.jsx(i.Icon,{size:14,icon:t,color:"white"}),e.jsx(o.Indent,{})]}),s&&e.jsx(o.Heading,{variant:"h4",color:"white",children:s})]})]})]})}),b=({onRequestClose:t,header:s,headerText:a,closeButtonClassName:l})=>e.jsxs(o.Row,{spacing:2,indent:2,borderBottom:"1px solid var(--swui-modal-header-border-color)",className:p,children:[e.jsxs(o.Row,{flex:1,indent:!0,alignItems:"center",children:[a&&e.jsx(o.Txt,{className:h,size:"large",children:a}),s]}),e.jsx(o.Box,{alignSelf:"flex-start",children:e.jsx(i.FlatButton,{className:l,onClick:t,"aria-label":"Close",leftIcon:i.stenaTimes})})]}),se=({header:t,headerText:s,children:a,spacing:l,indent:c,draggable:u=!1,onRequestClose:d,closeButtonClassName:f,footer:m,disableStickyFooter:C=!1,...v})=>{const w=typeof l=="number"?l:1,F=typeof c=="number"?c:1;return e.jsxs(y,{...v,onRequestClose:d,draggable:u,children:[e.jsx(b,{onRequestClose:d,header:t,headerText:s,closeButtonClassName:f}),e.jsx(o.Box,{spacing:w,indent:F,children:a}),m&&e.jsx(o.Box,{className:g.default(r.footer,{[r.stickyFooter]:!C}),children:m})]})},ae=({children:t})=>e.jsx(o.Column,{indent:2,spacing:2,children:t});exports.BaseModal=y;exports.CenterModal=Z;exports.DRAGGABLE_CANCEL_CLASSNAME=h;exports.DRAGGABLE_HANDLE_CLASSNAME=p;exports.Drawer=V;exports.DrawerHeader=X;exports.LoadingModal=oe;exports.Modal=se;exports.ModalFooter=ae;exports.ModalHeader=b;
|
|
3
3
|
//# sourceMappingURL=index.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stenajs-webui/modal",
|
|
3
|
-
"version": "19.0.0-next.
|
|
3
|
+
"version": "19.0.0-next.18",
|
|
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": "19.0.0-next.
|
|
30
|
-
"@stenajs-webui/elements": "19.0.0-next.
|
|
31
|
-
"@stenajs-webui/theme": "19.0.0-next.
|
|
29
|
+
"@stenajs-webui/core": "19.0.0-next.18",
|
|
30
|
+
"@stenajs-webui/elements": "19.0.0-next.18",
|
|
31
|
+
"@stenajs-webui/theme": "19.0.0-next.18",
|
|
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": "89c522919922198955a3e68fb7c60066c56de4dd"
|
|
62
62
|
}
|