@stenajs-webui/modal 19.0.0-next.2 → 19.0.0-next.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 +48 -48
- 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_8w3m4_1{--drawer-width: 370px}._portal_8w3m4_1 ._overlay_8w3m4_4{position:fixed;inset:0}._portal_8w3m4_1 ._content_8w3m4_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_8w3m4_1 ._content_8w3m4_9:focus-visible{outline:unset}._portal_8w3m4_1 ._content_8w3m4_9._slideFromLeft_8w3m4_19,._portal_8w3m4_1 ._content_8w3m4_9._slideFromRight_8w3m4_20{-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_8w3m4_1 ._content_8w3m4_9._slideFromLeft_8w3m4_19._afterOpen_8w3m4_26,._portal_8w3m4_1 ._content_8w3m4_9._slideFromRight_8w3m4_20._afterOpen_8w3m4_26{-webkit-transform:translateX(0);transform:translate(0)}._portal_8w3m4_1 ._content_8w3m4_9._slideFromLeft_8w3m4_19._beforeClose_8w3m4_30,._portal_8w3m4_1 ._content_8w3m4_9._slideFromRight_8w3m4_20._beforeClose_8w3m4_30{-webkit-transform:translateX(var(--translate-x-outside-screen));transform:translate(var(--translate-x-outside-screen))}._portal_8w3m4_1 ._content_8w3m4_9._slideFromTop_8w3m4_35,._portal_8w3m4_1 ._content_8w3m4_9._slideFromBottom_8w3m4_36{-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_8w3m4_1 ._content_8w3m4_9._slideFromTop_8w3m4_35._afterOpen_8w3m4_26,._portal_8w3m4_1 ._content_8w3m4_9._slideFromBottom_8w3m4_36._afterOpen_8w3m4_26{-webkit-transform:translateY(0);transform:translateY(0)}._portal_8w3m4_1 ._content_8w3m4_9._slideFromTop_8w3m4_35._beforeClose_8w3m4_30,._portal_8w3m4_1 ._content_8w3m4_9._slideFromBottom_8w3m4_36._beforeClose_8w3m4_30{-webkit-transform:translateY(var(--translate-y-outside-screen));transform:translateY(var(--translate-y-outside-screen))}._portal_8w3m4_1 ._content_8w3m4_9._slideFromLeft_8w3m4_19{--translate-x-outside-screen: -100%;width:var(--drawer-width);left:0}._portal_8w3m4_1 ._content_8w3m4_9._slideFromRight_8w3m4_20{--translate-x-outside-screen: 100%;width:var(--drawer-width);right:0}._portal_8w3m4_1 ._content_8w3m4_9._slideFromTop_8w3m4_35{--translate-y-outside-screen: -100%;height:var(--drawer-width);top:0}._portal_8w3m4_1 ._content_8w3m4_9._slideFromBottom_8w3m4_36{--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(t){console.error("vite-plugin-css-injected-by-js",t)}})();
|
|
2
2
|
import _ from "react-modal";
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import { jsx as e, jsxs as c, Fragment as
|
|
6
|
-
import { exhaustSwitchCase as x, Column as
|
|
7
|
-
import { Spinner as
|
|
8
|
-
const
|
|
9
|
-
overlay:
|
|
10
|
-
fadeIn:
|
|
11
|
-
modal:
|
|
12
|
-
content:
|
|
13
|
-
appear:
|
|
3
|
+
import N from "react-draggable";
|
|
4
|
+
import g from "classnames";
|
|
5
|
+
import { jsx as e, jsxs as c, Fragment as y } from "react/jsx-runtime";
|
|
6
|
+
import { exhaustSwitchCase as x, Column as v, Box as m, Spacing as S, Row as f, Indent as A, Heading as B, Txt as L } from "@stenajs-webui/core";
|
|
7
|
+
import { Spinner as M, Icon as D, FlatButton as I, stenaTimes as O } from "@stenajs-webui/elements";
|
|
8
|
+
const R = "_overlay_5x3op_1", $ = "_fadeIn_5x3op_1", k = "_modal_5x3op_31", E = "_content_5x3op_41", j = "_appear_5x3op_1", G = "_isDraggable_5x3op_70", z = "_footer_5x3op_101", H = "_stickyFooter_5x3op_105", n = {
|
|
9
|
+
overlay: R,
|
|
10
|
+
fadeIn: $,
|
|
11
|
+
modal: k,
|
|
12
|
+
content: E,
|
|
13
|
+
appear: j,
|
|
14
14
|
isDraggable: G,
|
|
15
15
|
footer: z,
|
|
16
16
|
stickyFooter: H
|
|
17
|
-
},
|
|
17
|
+
}, b = "draggable-modal-handle", w = "draggable-modal-cancel", T = ({
|
|
18
18
|
width: o,
|
|
19
19
|
maxWidth: t,
|
|
20
20
|
draggable: l = !1,
|
|
@@ -24,9 +24,9 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
24
24
|
overlayClassName: n.overlay,
|
|
25
25
|
className: n.modal,
|
|
26
26
|
...s,
|
|
27
|
-
children: /* @__PURE__ */ e(
|
|
28
|
-
handle: `.${
|
|
29
|
-
cancel: `.${
|
|
27
|
+
children: /* @__PURE__ */ e(N, {
|
|
28
|
+
handle: `.${b}`,
|
|
29
|
+
cancel: `.${w}, button, [role="tooltip"]`,
|
|
30
30
|
bounds: ".ReactModal__Overlay",
|
|
31
31
|
disabled: !l,
|
|
32
32
|
children: /* @__PURE__ */ e("div", {
|
|
@@ -34,13 +34,13 @@ 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: g(n.content, {
|
|
38
38
|
[n.isDraggable]: l
|
|
39
39
|
}),
|
|
40
40
|
children: r
|
|
41
41
|
})
|
|
42
42
|
})
|
|
43
|
-
}), J = "
|
|
43
|
+
}), J = "_portal_8w3m4_1", K = "_overlay_8w3m4_4", Q = "_content_8w3m4_9", U = "_slideFromLeft_8w3m4_19", V = "_slideFromRight_8w3m4_20", W = "_afterOpen_8w3m4_26", X = "_beforeClose_8w3m4_30", Y = "_slideFromTop_8w3m4_35", Z = "_slideFromBottom_8w3m4_36", a = {
|
|
44
44
|
portal: J,
|
|
45
45
|
overlay: K,
|
|
46
46
|
content: Q,
|
|
@@ -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: g(a.content, q(r)),
|
|
75
75
|
afterOpen: a.afterOpen,
|
|
76
76
|
beforeClose: a.beforeClose
|
|
77
77
|
},
|
|
@@ -121,7 +121,7 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
121
121
|
},
|
|
122
122
|
children: o
|
|
123
123
|
})
|
|
124
|
-
}), ee = "_modal_4fwgb_1", oe = "_overlay_4fwgb_13",
|
|
124
|
+
}), ee = "_modal_4fwgb_1", oe = "_overlay_4fwgb_13", u = {
|
|
125
125
|
modal: ee,
|
|
126
126
|
overlay: oe
|
|
127
127
|
}, pe = ({
|
|
@@ -131,9 +131,9 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
131
131
|
}) => /* @__PURE__ */ e(_, {
|
|
132
132
|
...l,
|
|
133
133
|
isOpen: !0,
|
|
134
|
-
className:
|
|
135
|
-
overlayClassName:
|
|
136
|
-
children: /* @__PURE__ */ c(
|
|
134
|
+
className: u.modal,
|
|
135
|
+
overlayClassName: u.overlay,
|
|
136
|
+
children: /* @__PURE__ */ c(v, {
|
|
137
137
|
spacing: 2,
|
|
138
138
|
alignItems: "center",
|
|
139
139
|
children: [/* @__PURE__ */ e(m, {
|
|
@@ -144,19 +144,19 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
144
144
|
borderRadius: "50%",
|
|
145
145
|
background: "white",
|
|
146
146
|
shadow: "modal",
|
|
147
|
-
children: /* @__PURE__ */ e(
|
|
147
|
+
children: /* @__PURE__ */ e(M, {
|
|
148
148
|
size: "small"
|
|
149
149
|
})
|
|
150
|
-
}), (o || t) && /* @__PURE__ */ c(
|
|
151
|
-
children: [/* @__PURE__ */ e(
|
|
150
|
+
}), (o || t) && /* @__PURE__ */ c(y, {
|
|
151
|
+
children: [/* @__PURE__ */ e(S, {}), /* @__PURE__ */ c(f, {
|
|
152
152
|
indent: 2,
|
|
153
|
-
children: [o && /* @__PURE__ */ c(
|
|
154
|
-
children: [/* @__PURE__ */ e(
|
|
153
|
+
children: [o && /* @__PURE__ */ c(y, {
|
|
154
|
+
children: [/* @__PURE__ */ e(D, {
|
|
155
155
|
size: 14,
|
|
156
156
|
icon: o,
|
|
157
157
|
color: "white"
|
|
158
|
-
}), /* @__PURE__ */ e(
|
|
159
|
-
}), t && /* @__PURE__ */ e(
|
|
158
|
+
}), /* @__PURE__ */ e(A, {})]
|
|
159
|
+
}), t && /* @__PURE__ */ e(B, {
|
|
160
160
|
variant: "h4",
|
|
161
161
|
color: "white",
|
|
162
162
|
children: t
|
|
@@ -173,23 +173,23 @@ 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: b,
|
|
177
177
|
children: [/* @__PURE__ */ c(f, {
|
|
178
178
|
flex: 1,
|
|
179
179
|
indent: !0,
|
|
180
180
|
alignItems: "center",
|
|
181
|
-
children: [l && /* @__PURE__ */ e(
|
|
182
|
-
className:
|
|
181
|
+
children: [l && /* @__PURE__ */ e(L, {
|
|
182
|
+
className: w,
|
|
183
183
|
size: "large",
|
|
184
184
|
children: l
|
|
185
185
|
}), t]
|
|
186
186
|
}), /* @__PURE__ */ e(m, {
|
|
187
187
|
alignSelf: "flex-start",
|
|
188
|
-
children: /* @__PURE__ */ e(
|
|
188
|
+
children: /* @__PURE__ */ e(I, {
|
|
189
189
|
className: r,
|
|
190
190
|
onClick: o,
|
|
191
191
|
"aria-label": "Close",
|
|
192
|
-
leftIcon:
|
|
192
|
+
leftIcon: O
|
|
193
193
|
})
|
|
194
194
|
})]
|
|
195
195
|
}), fe = ({
|
|
@@ -201,11 +201,11 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
201
201
|
draggable: i = !1,
|
|
202
202
|
onRequestClose: d,
|
|
203
203
|
closeButtonClassName: p,
|
|
204
|
-
footer:
|
|
205
|
-
disableStickyFooter:
|
|
206
|
-
...
|
|
204
|
+
footer: h,
|
|
205
|
+
disableStickyFooter: F = !1,
|
|
206
|
+
...C
|
|
207
207
|
}) => /* @__PURE__ */ c(T, {
|
|
208
|
-
...
|
|
208
|
+
...C,
|
|
209
209
|
onRequestClose: d,
|
|
210
210
|
draggable: i,
|
|
211
211
|
children: [/* @__PURE__ */ e(te, {
|
|
@@ -217,15 +217,15 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
217
217
|
spacing: typeof r == "number" ? r : 1,
|
|
218
218
|
indent: typeof s == "number" ? s : 1,
|
|
219
219
|
children: l
|
|
220
|
-
}),
|
|
221
|
-
className:
|
|
222
|
-
[n.stickyFooter]: !
|
|
220
|
+
}), h && /* @__PURE__ */ e(m, {
|
|
221
|
+
className: g(n.footer, {
|
|
222
|
+
[n.stickyFooter]: !F
|
|
223
223
|
}),
|
|
224
|
-
children:
|
|
224
|
+
children: h
|
|
225
225
|
})]
|
|
226
|
-
}),
|
|
226
|
+
}), ge = ({
|
|
227
227
|
children: o
|
|
228
|
-
}) => /* @__PURE__ */ e(
|
|
228
|
+
}) => /* @__PURE__ */ e(v, {
|
|
229
229
|
indent: 2,
|
|
230
230
|
spacing: 2,
|
|
231
231
|
children: o
|
|
@@ -233,12 +233,12 @@ const O = "_overlay_5x3op_1", R = "_fadeIn_5x3op_1", $ = "_modal_5x3op_31", k =
|
|
|
233
233
|
export {
|
|
234
234
|
T as BaseModal,
|
|
235
235
|
_e as CenterModal,
|
|
236
|
-
|
|
237
|
-
|
|
236
|
+
w as DRAGGABLE_CANCEL_CLASSNAME,
|
|
237
|
+
b as DRAGGABLE_HANDLE_CLASSNAME,
|
|
238
238
|
me as Drawer,
|
|
239
239
|
pe as LoadingModal,
|
|
240
240
|
fe as Modal,
|
|
241
|
-
|
|
241
|
+
ge 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"),M=require("react-draggable"),A=require("classnames"),e=require("react/jsx-runtime"),t=require("@stenajs-webui/core"),
|
|
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_8w3m4_1{--drawer-width: 370px}._portal_8w3m4_1 ._overlay_8w3m4_4{position:fixed;inset:0}._portal_8w3m4_1 ._content_8w3m4_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_8w3m4_1 ._content_8w3m4_9:focus-visible{outline:unset}._portal_8w3m4_1 ._content_8w3m4_9._slideFromLeft_8w3m4_19,._portal_8w3m4_1 ._content_8w3m4_9._slideFromRight_8w3m4_20{-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_8w3m4_1 ._content_8w3m4_9._slideFromLeft_8w3m4_19._afterOpen_8w3m4_26,._portal_8w3m4_1 ._content_8w3m4_9._slideFromRight_8w3m4_20._afterOpen_8w3m4_26{-webkit-transform:translateX(0);transform:translate(0)}._portal_8w3m4_1 ._content_8w3m4_9._slideFromLeft_8w3m4_19._beforeClose_8w3m4_30,._portal_8w3m4_1 ._content_8w3m4_9._slideFromRight_8w3m4_20._beforeClose_8w3m4_30{-webkit-transform:translateX(var(--translate-x-outside-screen));transform:translate(var(--translate-x-outside-screen))}._portal_8w3m4_1 ._content_8w3m4_9._slideFromTop_8w3m4_35,._portal_8w3m4_1 ._content_8w3m4_9._slideFromBottom_8w3m4_36{-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_8w3m4_1 ._content_8w3m4_9._slideFromTop_8w3m4_35._afterOpen_8w3m4_26,._portal_8w3m4_1 ._content_8w3m4_9._slideFromBottom_8w3m4_36._afterOpen_8w3m4_26{-webkit-transform:translateY(0);transform:translateY(0)}._portal_8w3m4_1 ._content_8w3m4_9._slideFromTop_8w3m4_35._beforeClose_8w3m4_30,._portal_8w3m4_1 ._content_8w3m4_9._slideFromBottom_8w3m4_36._beforeClose_8w3m4_30{-webkit-transform:translateY(var(--translate-y-outside-screen));transform:translateY(var(--translate-y-outside-screen))}._portal_8w3m4_1 ._content_8w3m4_9._slideFromLeft_8w3m4_19{--translate-x-outside-screen: -100%;width:var(--drawer-width);left:0}._portal_8w3m4_1 ._content_8w3m4_9._slideFromRight_8w3m4_20{--translate-x-outside-screen: 100%;width:var(--drawer-width);right:0}._portal_8w3m4_1 ._content_8w3m4_9._slideFromTop_8w3m4_35{--translate-y-outside-screen: -100%;height:var(--drawer-width);top:0}._portal_8w3m4_1 ._content_8w3m4_9._slideFromBottom_8w3m4_36{--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(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"),m=require("@stenajs-webui/elements"),f=o=>o&&typeof o=="object"&&"default"in o?o:{default:o},_=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",g="draggable-modal-cancel",b=({width:o,maxWidth:s,draggable:l=!1,children:r,...c})=>e.jsx(_.default,{overlayClassName:n.overlay,className:n.modal,...c,children:e.jsx(L.default,{handle:`.${p}`,cancel:`.${g}, 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_8w3m4_1",k="_overlay_8w3m4_4",q="_content_8w3m4_9",H="_slideFromLeft_8w3m4_19",T="_slideFromRight_8w3m4_20",z="_afterOpen_8w3m4_26",J="_beforeClose_8w3m4_30",K="_slideFromTop_8w3m4_35",P="_slideFromBottom_8w3m4_36",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(_.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(_.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",h={modal:X,overlay:Y},Z=({headerIconLeft:o,headerText:s,...l})=>e.jsx(_.default,{...l,isOpen:!0,className:h.modal,overlayClassName:h.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(m.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(m.Icon,{size:14,icon:o,color:"white"}),e.jsx(t.Indent,{})]}),s&&e.jsx(t.Heading,{variant:"h4",color:"white",children:s})]})]})]})}),j=({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:g,size:"large",children:l}),s]}),e.jsx(t.Box,{alignSelf:"flex-start",children:e.jsx(m.FlatButton,{className:r,onClick:o,"aria-label":"Close",leftIcon:m.stenaTimes})})]}),ee=({header:o,headerText:s,children:l,spacing:r,indent:c,draggable:i=!1,onRequestClose:d,closeButtonClassName:u,footer:y,disableStickyFooter:w=!1,...v})=>{const C=typeof r=="number"?r:1,F=typeof c=="number"?c:1;return e.jsxs(b,{...v,onRequestClose:d,draggable:i,children:[e.jsx(j,{onRequestClose:d,header:o,headerText:s,closeButtonClassName:u}),e.jsx(t.Box,{spacing:C,indent:F,children:l}),y&&e.jsx(t.Box,{className:x.default(n.footer,{[n.stickyFooter]:!w}),children:y})]})},oe=({children:o})=>e.jsx(t.Column,{indent:2,spacing:2,children:o});exports.BaseModal=b;exports.CenterModal=W;exports.DRAGGABLE_CANCEL_CLASSNAME=g;exports.DRAGGABLE_HANDLE_CLASSNAME=p;exports.Drawer=Q;exports.LoadingModal=Z;exports.Modal=ee;exports.ModalFooter=oe;exports.ModalHeader=j;
|
|
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.3",
|
|
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.3",
|
|
30
|
+
"@stenajs-webui/elements": "19.0.0-next.3",
|
|
31
|
+
"@stenajs-webui/theme": "19.0.0-next.3",
|
|
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": "c99eaa208caff2d6dc5b095915fdd1a32b292fa0"
|
|
62
62
|
}
|