@gopowerteam/modal-render 0.0.36 → 0.0.38
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/cjs/components/modal-container.vue.d.ts +14 -6
- package/dist/cjs/components/modal-dialog.vue.d.ts +2 -2
- package/dist/cjs/components/modal-footer.vue.d.ts +1 -1
- package/dist/cjs/components/modal-header.vue.d.ts +1 -1
- package/dist/cjs/components/modal-provider.vue.d.ts +12 -11
- package/dist/cjs/constants.d.ts +3 -2
- package/dist/cjs/hooks/on-submit.d.ts +2 -1
- package/dist/cjs/hooks/use-modal.d.ts +3 -2
- package/dist/cjs/index.cjs +1 -1
- package/dist/cjs/index.d.ts +6 -5
- package/dist/cjs/interfaces.d.ts +5 -2
- package/dist/cjs/utils/find-container.d.ts +2 -1
- package/dist/es/components/modal-container.vue.d.ts +14 -6
- package/dist/es/components/modal-dialog.vue.d.ts +2 -2
- package/dist/es/components/modal-footer.vue.d.ts +1 -1
- package/dist/es/components/modal-header.vue.d.ts +1 -1
- package/dist/es/components/modal-provider.vue.d.ts +12 -11
- package/dist/es/constants.d.ts +3 -2
- package/dist/es/hooks/on-submit.d.ts +2 -1
- package/dist/es/hooks/use-modal.d.ts +3 -2
- package/dist/es/index.d.ts +6 -5
- package/dist/es/index.mjs +270 -260
- package/dist/es/interfaces.d.ts +5 -2
- package/dist/es/utils/find-container.d.ts +2 -1
- package/dist/style.css +1 -1
- package/package.json +13 -13
package/dist/es/index.mjs
CHANGED
|
@@ -1,221 +1,224 @@
|
|
|
1
|
-
import { unref as he, isRef as me, toRefs as
|
|
1
|
+
import { unref as he, isRef as me, toRefs as ve, customRef as ge, onMounted as Y, nextTick as ye, getCurrentScope as be, onScopeDispose as we, getCurrentInstance as F, ref as H, computed as E, watch as Z, defineComponent as ee, useCssVars as _e, inject as te, shallowRef as O, onUnmounted as xe, openBlock as y, createElementBlock as S, normalizeStyle as W, withModifiers as Ce, createElementVNode as g, normalizeClass as ke, toDisplayString as T, createCommentVNode as P, createBlock as N, resolveDynamicComponent as ie, normalizeProps as Me, guardReactiveProps as Se, triggerRef as D, pushScopeId as $e, popScopeId as Ee, Fragment as Q, provide as Le, renderSlot as oe, Teleport as ne, createVNode as Ae, TransitionGroup as Re, withCtx as Oe, renderList as Te, mergeProps as Be, defineAsyncComponent as He } from "vue";
|
|
2
2
|
const K = Symbol("__MODAL__");
|
|
3
|
-
function
|
|
3
|
+
function le(t) {
|
|
4
4
|
return be() ? (we(t), !0) : !1;
|
|
5
5
|
}
|
|
6
|
-
function
|
|
6
|
+
function w(t) {
|
|
7
7
|
return typeof t == "function" ? t() : he(t);
|
|
8
8
|
}
|
|
9
|
-
const
|
|
9
|
+
const ae = typeof window < "u" && typeof document < "u";
|
|
10
10
|
typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
|
|
11
|
-
const
|
|
11
|
+
const ze = Object.prototype.toString, Pe = (t) => ze.call(t) === "[object Object]", Ne = () => {
|
|
12
12
|
};
|
|
13
|
-
function
|
|
13
|
+
function Ie(t) {
|
|
14
|
+
return F();
|
|
15
|
+
}
|
|
16
|
+
function We(t, r = {}) {
|
|
14
17
|
if (!me(t))
|
|
15
|
-
return
|
|
16
|
-
const
|
|
18
|
+
return ve(t);
|
|
19
|
+
const n = Array.isArray(t.value) ? Array.from({ length: t.value.length }) : {};
|
|
17
20
|
for (const e in t.value)
|
|
18
|
-
|
|
21
|
+
n[e] = ge(() => ({
|
|
19
22
|
get() {
|
|
20
23
|
return t.value[e];
|
|
21
24
|
},
|
|
22
25
|
set(a) {
|
|
23
26
|
var i;
|
|
24
|
-
if ((i =
|
|
27
|
+
if ((i = w(r.replaceRef)) != null ? i : !0)
|
|
25
28
|
if (Array.isArray(t.value)) {
|
|
26
|
-
const
|
|
27
|
-
|
|
29
|
+
const h = [...t.value];
|
|
30
|
+
h[e] = a, t.value = h;
|
|
28
31
|
} else {
|
|
29
|
-
const
|
|
30
|
-
Object.setPrototypeOf(
|
|
32
|
+
const h = { ...t.value, [e]: a };
|
|
33
|
+
Object.setPrototypeOf(h, Object.getPrototypeOf(t.value)), t.value = h;
|
|
31
34
|
}
|
|
32
35
|
else
|
|
33
36
|
t.value[e] = a;
|
|
34
37
|
}
|
|
35
38
|
}));
|
|
36
|
-
return
|
|
39
|
+
return n;
|
|
37
40
|
}
|
|
38
|
-
function
|
|
39
|
-
|
|
41
|
+
function De(t, r = !0, n) {
|
|
42
|
+
Ie() ? Y(t, n) : r ? t() : ye(t);
|
|
40
43
|
}
|
|
41
|
-
function
|
|
44
|
+
function B(t) {
|
|
42
45
|
var r;
|
|
43
|
-
const
|
|
44
|
-
return (r =
|
|
46
|
+
const n = w(t);
|
|
47
|
+
return (r = n == null ? void 0 : n.$el) != null ? r : n;
|
|
45
48
|
}
|
|
46
|
-
const U =
|
|
49
|
+
const U = ae ? window : void 0;
|
|
47
50
|
function J(...t) {
|
|
48
|
-
let r,
|
|
49
|
-
if (typeof t[0] == "string" || Array.isArray(t[0]) ? ([
|
|
50
|
-
return
|
|
51
|
-
Array.isArray(
|
|
51
|
+
let r, n, e, a;
|
|
52
|
+
if (typeof t[0] == "string" || Array.isArray(t[0]) ? ([n, e, a] = t, r = U) : [r, n, e, a] = t, !r)
|
|
53
|
+
return Ne;
|
|
54
|
+
Array.isArray(n) || (n = [n]), Array.isArray(e) || (e = [e]);
|
|
52
55
|
const i = [], c = () => {
|
|
53
|
-
i.forEach((
|
|
54
|
-
},
|
|
55
|
-
() => [
|
|
56
|
-
([
|
|
57
|
-
if (c(), !
|
|
56
|
+
i.forEach((m) => m()), i.length = 0;
|
|
57
|
+
}, h = (m, d, s, u) => (m.addEventListener(d, s, u), () => m.removeEventListener(d, s, u)), _ = Z(
|
|
58
|
+
() => [B(r), w(a)],
|
|
59
|
+
([m, d]) => {
|
|
60
|
+
if (c(), !m)
|
|
58
61
|
return;
|
|
59
|
-
const s =
|
|
62
|
+
const s = Pe(d) ? { ...d } : d;
|
|
60
63
|
i.push(
|
|
61
|
-
...
|
|
64
|
+
...n.flatMap((u) => e.map((l) => h(m, u, l, s)))
|
|
62
65
|
);
|
|
63
66
|
},
|
|
64
67
|
{ immediate: !0, flush: "post" }
|
|
65
|
-
),
|
|
66
|
-
|
|
68
|
+
), b = () => {
|
|
69
|
+
_(), c();
|
|
67
70
|
};
|
|
68
|
-
return
|
|
71
|
+
return le(b), b;
|
|
69
72
|
}
|
|
70
|
-
function
|
|
71
|
-
const t =
|
|
72
|
-
return
|
|
73
|
+
function Fe() {
|
|
74
|
+
const t = H(!1), r = F();
|
|
75
|
+
return r && Y(() => {
|
|
73
76
|
t.value = !0;
|
|
74
|
-
}), t;
|
|
77
|
+
}, r), t;
|
|
75
78
|
}
|
|
76
79
|
function Ve(t) {
|
|
77
|
-
const r =
|
|
78
|
-
return
|
|
80
|
+
const r = Fe();
|
|
81
|
+
return E(() => (r.value, !!t()));
|
|
79
82
|
}
|
|
80
83
|
function je(t, r = {}) {
|
|
81
|
-
var
|
|
84
|
+
var n, e;
|
|
82
85
|
const {
|
|
83
86
|
pointerTypes: a,
|
|
84
87
|
preventDefault: i,
|
|
85
88
|
stopPropagation: c,
|
|
86
|
-
exact:
|
|
87
|
-
onMove:
|
|
88
|
-
onEnd:
|
|
89
|
-
onStart:
|
|
89
|
+
exact: h,
|
|
90
|
+
onMove: _,
|
|
91
|
+
onEnd: b,
|
|
92
|
+
onStart: m,
|
|
90
93
|
initialValue: d,
|
|
91
94
|
axis: s = "both",
|
|
92
95
|
draggingElement: u = U,
|
|
93
96
|
containerElement: l,
|
|
94
|
-
handle:
|
|
95
|
-
} = r, f =
|
|
96
|
-
(
|
|
97
|
-
), C =
|
|
98
|
-
|
|
99
|
-
},
|
|
100
|
-
var
|
|
101
|
-
if (!R(
|
|
97
|
+
handle: v = t
|
|
98
|
+
} = r, f = H(
|
|
99
|
+
(n = w(d)) != null ? n : { x: 0, y: 0 }
|
|
100
|
+
), C = H(), R = (p) => a ? a.includes(p.pointerType) : !0, $ = (p) => {
|
|
101
|
+
w(i) && p.preventDefault(), w(c) && p.stopPropagation();
|
|
102
|
+
}, I = (p) => {
|
|
103
|
+
var L;
|
|
104
|
+
if (w(r.disabled) || !R(p) || w(h) && p.target !== w(t))
|
|
102
105
|
return;
|
|
103
|
-
const
|
|
104
|
-
x:
|
|
105
|
-
y:
|
|
106
|
+
const x = w(l), A = (L = x == null ? void 0 : x.getBoundingClientRect) == null ? void 0 : L.call(x), k = w(t).getBoundingClientRect(), G = {
|
|
107
|
+
x: p.clientX - (x ? k.left - A.left + x.scrollLeft : k.left),
|
|
108
|
+
y: p.clientY - (x ? k.top - A.top + x.scrollTop : k.top)
|
|
106
109
|
};
|
|
107
|
-
(
|
|
108
|
-
}, q = (
|
|
109
|
-
|
|
110
|
-
if (!R(v) || !C.value)
|
|
110
|
+
(m == null ? void 0 : m(G, p)) !== !1 && (C.value = G, $(p));
|
|
111
|
+
}, q = (p) => {
|
|
112
|
+
if (w(r.disabled) || !R(p) || !C.value)
|
|
111
113
|
return;
|
|
112
|
-
const
|
|
113
|
-
let { x:
|
|
114
|
-
(s === "x" || s === "both") && (
|
|
115
|
-
x:
|
|
116
|
-
y:
|
|
117
|
-
},
|
|
118
|
-
},
|
|
119
|
-
R(
|
|
114
|
+
const L = w(l), x = w(t).getBoundingClientRect();
|
|
115
|
+
let { x: A, y: k } = f.value;
|
|
116
|
+
(s === "x" || s === "both") && (A = p.clientX - C.value.x, L && (A = Math.min(Math.max(0, A), L.scrollWidth - x.width))), (s === "y" || s === "both") && (k = p.clientY - C.value.y, L && (k = Math.min(Math.max(0, k), L.scrollHeight - x.height))), f.value = {
|
|
117
|
+
x: A,
|
|
118
|
+
y: k
|
|
119
|
+
}, _ == null || _(f.value, p), $(p);
|
|
120
|
+
}, j = (p) => {
|
|
121
|
+
w(r.disabled) || !R(p) || C.value && (C.value = void 0, b == null || b(f.value, p), $(p));
|
|
120
122
|
};
|
|
121
|
-
if (
|
|
122
|
-
const
|
|
123
|
-
J(
|
|
123
|
+
if (ae) {
|
|
124
|
+
const p = { capture: (e = r.capture) != null ? e : !0 };
|
|
125
|
+
J(v, "pointerdown", I, p), J(u, "pointermove", q, p), J(u, "pointerup", j, p);
|
|
124
126
|
}
|
|
125
127
|
return {
|
|
126
|
-
...
|
|
128
|
+
...We(f),
|
|
127
129
|
position: f,
|
|
128
|
-
isDragging:
|
|
129
|
-
style:
|
|
130
|
+
isDragging: E(() => !!C.value),
|
|
131
|
+
style: E(
|
|
130
132
|
() => `left:${f.value.x}px;top:${f.value.y}px;`
|
|
131
133
|
)
|
|
132
134
|
};
|
|
133
135
|
}
|
|
134
|
-
function Ge(t, r,
|
|
135
|
-
const { window: e = U, ...a } =
|
|
136
|
+
function Ge(t, r, n = {}) {
|
|
137
|
+
const { window: e = U, ...a } = n;
|
|
136
138
|
let i;
|
|
137
|
-
const c = Ve(() => e && "ResizeObserver" in e),
|
|
139
|
+
const c = Ve(() => e && "ResizeObserver" in e), h = () => {
|
|
138
140
|
i && (i.disconnect(), i = void 0);
|
|
139
|
-
},
|
|
140
|
-
|
|
141
|
+
}, _ = E(() => Array.isArray(t) ? t.map((d) => B(d)) : [B(t)]), b = Z(
|
|
142
|
+
_,
|
|
141
143
|
(d) => {
|
|
142
|
-
if (
|
|
144
|
+
if (h(), c.value && e) {
|
|
143
145
|
i = new ResizeObserver(r);
|
|
144
146
|
for (const s of d)
|
|
145
147
|
s && i.observe(s, a);
|
|
146
148
|
}
|
|
147
149
|
},
|
|
148
|
-
{ immediate: !0, flush: "post"
|
|
149
|
-
),
|
|
150
|
-
|
|
150
|
+
{ immediate: !0, flush: "post" }
|
|
151
|
+
), m = () => {
|
|
152
|
+
h(), b();
|
|
151
153
|
};
|
|
152
|
-
return
|
|
154
|
+
return le(m), {
|
|
153
155
|
isSupported: c,
|
|
154
|
-
stop:
|
|
156
|
+
stop: m
|
|
155
157
|
};
|
|
156
158
|
}
|
|
157
|
-
function
|
|
158
|
-
const { window: e = U, box: a = "content-box" } =
|
|
159
|
+
function z(t, r = { width: 0, height: 0 }, n = {}) {
|
|
160
|
+
const { window: e = U, box: a = "content-box" } = n, i = E(() => {
|
|
159
161
|
var d, s;
|
|
160
|
-
return (s = (d =
|
|
161
|
-
}), c =
|
|
162
|
+
return (s = (d = B(t)) == null ? void 0 : d.namespaceURI) == null ? void 0 : s.includes("svg");
|
|
163
|
+
}), c = H(r.width), h = H(r.height), { stop: _ } = Ge(
|
|
162
164
|
t,
|
|
163
165
|
([d]) => {
|
|
164
166
|
const s = a === "border-box" ? d.borderBoxSize : a === "content-box" ? d.contentBoxSize : d.devicePixelContentBoxSize;
|
|
165
167
|
if (e && i.value) {
|
|
166
|
-
const u =
|
|
168
|
+
const u = B(t);
|
|
167
169
|
if (u) {
|
|
168
170
|
const l = e.getComputedStyle(u);
|
|
169
|
-
c.value = Number.parseFloat(l.width),
|
|
171
|
+
c.value = Number.parseFloat(l.width), h.value = Number.parseFloat(l.height);
|
|
170
172
|
}
|
|
171
173
|
} else if (s) {
|
|
172
174
|
const u = Array.isArray(s) ? s : [s];
|
|
173
|
-
c.value = u.reduce((l, { inlineSize:
|
|
175
|
+
c.value = u.reduce((l, { inlineSize: v }) => l + v, 0), h.value = u.reduce((l, { blockSize: v }) => l + v, 0);
|
|
174
176
|
} else
|
|
175
|
-
c.value = d.contentRect.width,
|
|
177
|
+
c.value = d.contentRect.width, h.value = d.contentRect.height;
|
|
176
178
|
},
|
|
177
|
-
|
|
179
|
+
n
|
|
178
180
|
);
|
|
179
|
-
|
|
180
|
-
const d =
|
|
181
|
-
d && (c.value = "offsetWidth" in d ? d.offsetWidth : r.width,
|
|
181
|
+
De(() => {
|
|
182
|
+
const d = B(t);
|
|
183
|
+
d && (c.value = "offsetWidth" in d ? d.offsetWidth : r.width, h.value = "offsetHeight" in d ? d.offsetHeight : r.height);
|
|
182
184
|
});
|
|
183
|
-
const
|
|
184
|
-
() =>
|
|
185
|
+
const b = Z(
|
|
186
|
+
() => B(t),
|
|
185
187
|
(d) => {
|
|
186
|
-
c.value = d ? r.width : 0,
|
|
188
|
+
c.value = d ? r.width : 0, h.value = d ? r.height : 0;
|
|
187
189
|
}
|
|
188
190
|
);
|
|
189
|
-
function
|
|
190
|
-
|
|
191
|
+
function m() {
|
|
192
|
+
_(), b();
|
|
191
193
|
}
|
|
192
194
|
return {
|
|
193
195
|
width: c,
|
|
194
|
-
height:
|
|
195
|
-
stop:
|
|
196
|
+
height: h,
|
|
197
|
+
stop: m
|
|
196
198
|
};
|
|
197
199
|
}
|
|
198
|
-
const Xe = (t) => ($e("data-v-
|
|
200
|
+
const Xe = (t) => ($e("data-v-a1713ed1"), t = t(), Ee(), t), Ye = { class: "title text-16px font-bold" }, Ke = { class: "action" }, Ue = ["form"], qe = {
|
|
199
201
|
key: 2,
|
|
200
202
|
class: "modal-loading"
|
|
201
|
-
},
|
|
203
|
+
}, Je = /* @__PURE__ */ Xe(() => /* @__PURE__ */ g("div", { class: "lds-ring" }, [
|
|
202
204
|
/* @__PURE__ */ g("div"),
|
|
203
205
|
/* @__PURE__ */ g("div"),
|
|
204
206
|
/* @__PURE__ */ g("div"),
|
|
205
207
|
/* @__PURE__ */ g("div")
|
|
206
|
-
], -1)),
|
|
207
|
-
|
|
208
|
-
],
|
|
208
|
+
], -1)), Qe = [
|
|
209
|
+
Je
|
|
210
|
+
], Ze = {
|
|
209
211
|
name: "ModalContainer",
|
|
210
212
|
inheritAttrs: !0
|
|
211
|
-
}, et = /* @__PURE__ */
|
|
212
|
-
...
|
|
213
|
+
}, et = /* @__PURE__ */ ee({
|
|
214
|
+
...Ze,
|
|
213
215
|
props: {
|
|
214
216
|
id: {},
|
|
215
217
|
form: {},
|
|
216
218
|
component: {},
|
|
217
219
|
componentProps: {},
|
|
218
220
|
width: {},
|
|
221
|
+
height: {},
|
|
219
222
|
maxWidth: {},
|
|
220
223
|
maxHeight: { default: 90 },
|
|
221
224
|
sizes: {},
|
|
@@ -229,6 +232,7 @@ const Xe = (t) => ($e("data-v-8dfa7cd4"), t = t(), Ae(), t), Ye = { class: "titl
|
|
|
229
232
|
maskClosable: { type: Boolean, default: !1 },
|
|
230
233
|
draggable: { type: Boolean, default: !1 },
|
|
231
234
|
mode: { default: "dialog" },
|
|
235
|
+
position: { default: "right" },
|
|
232
236
|
type: {},
|
|
233
237
|
offset: {},
|
|
234
238
|
backgroundColor: {},
|
|
@@ -238,105 +242,116 @@ const Xe = (t) => ($e("data-v-8dfa7cd4"), t = t(), Ae(), t), Ye = { class: "titl
|
|
|
238
242
|
zIndex: { default: 1e3 }
|
|
239
243
|
},
|
|
240
244
|
emits: ["submit"],
|
|
241
|
-
setup(t, { expose: r, emit:
|
|
242
|
-
|
|
243
|
-
"
|
|
244
|
-
"635715bb": F.value
|
|
245
|
+
setup(t, { expose: r, emit: n }) {
|
|
246
|
+
_e((o) => ({
|
|
247
|
+
"1c652152": o.zIndex
|
|
245
248
|
}));
|
|
246
|
-
const e = t, a =
|
|
247
|
-
let
|
|
248
|
-
const
|
|
249
|
+
const e = t, a = n, i = te(K), c = H(!1);
|
|
250
|
+
let h = 0, _ = 0;
|
|
251
|
+
const b = O(), m = O(), d = O(), s = O(), u = O(), l = O(), { height: v } = z(b);
|
|
252
|
+
z(m);
|
|
253
|
+
const { height: f } = z(d, void 0, { box: "border-box" }), { height: C } = z(s, void 0, { box: "border-box" }), { height: R } = z(u), { height: $ } = z(l), { x: I, y: q } = je(d, {
|
|
249
254
|
initialValue: { x: 0, y: 0 }
|
|
250
255
|
});
|
|
251
|
-
function
|
|
256
|
+
function j() {
|
|
252
257
|
i == null || i.close(e.id);
|
|
253
258
|
}
|
|
254
|
-
function
|
|
255
|
-
return typeof
|
|
259
|
+
function p(o) {
|
|
260
|
+
return typeof o == "number" ? `${o}px` : o;
|
|
256
261
|
}
|
|
257
|
-
const
|
|
258
|
-
const
|
|
259
|
-
return e.mode === "dialog" && (
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
262
|
+
const L = E(() => {
|
|
263
|
+
const o = {};
|
|
264
|
+
return e.mode === "dialog" && (o.justifyContent = "center"), e.mode === "drawer" && (o.justifyContent = {
|
|
265
|
+
left: "flex-start",
|
|
266
|
+
right: "flex-end",
|
|
267
|
+
top: "flex-start",
|
|
268
|
+
bottom: "flex-end"
|
|
269
|
+
}[e.position], o.flexDirection = {
|
|
270
|
+
left: "row",
|
|
271
|
+
right: "row",
|
|
272
|
+
top: "column",
|
|
273
|
+
bottom: "column"
|
|
274
|
+
}[e.position]), o;
|
|
275
|
+
}), x = E(() => {
|
|
276
|
+
const o = {};
|
|
277
|
+
return e.mode === "drawer" && ["top", "bottom"].includes(e.position) ? o.maxHeight = p(e.maxHeight) : (o.width = p(e.sizes[e.size]), o.maxWidth = p(e.maxWidth)), e.width && (o.width = p(e.width)), e.height && (o.height = p(e.height)), e.fullscreen && (o.maxWidth = "unset", o.width = "100%", o.position = "fixed", o.top = 0, o.left = 0, o.bottom = 0, o.right = 0, o.borderRadius = 0), e.draggable && !e.fullscreen && e.mode === "dialog" && (o.transform = `translate3d(${I.value - h}px, ${q.value - _}px, 0px)`), e.mode === "drawer" && (o.borderRadius = 0, ["left", "right"].includes(e.position) ? o.height = "100%" : o.width = "100%"), e.offset && e.mode === "dialog" && (o.marginLeft = `${e.offset.x || 0}px`, o.marginTop = `${e.offset.y || 0}px`), e.backgroundColor && (o.backgroundColor = e.backgroundColor), o;
|
|
278
|
+
}), A = E(() => {
|
|
279
|
+
const o = {};
|
|
280
|
+
return e.draggable && !e.fullscreen && e.mode === "dialog" && (o.cursor = "move"), o;
|
|
281
|
+
}), k = E(() => {
|
|
282
|
+
const o = {}, M = R.value + $.value + f.value + C.value, se = Math.floor(v.value * (Number(p(e.maxHeight).replace("%", "")) / 100));
|
|
283
|
+
return e.maxHeight && (o.maxHeight = `${se - M}px`), e.mode === "drawer" && (o.maxHeight = "unset", ["left", "right"].includes(e.position) && (o.height = `${v.value - M}px`)), e.fullscreen && (o.maxHeight = "unset", o.height = `calc(100% - ${M}px)`), e.type !== "component" && (o.padding = "0"), e.bodyStyle && Object.assign(o, e.bodyStyle), o;
|
|
269
284
|
});
|
|
270
|
-
function
|
|
271
|
-
const
|
|
272
|
-
if (e.form &&
|
|
273
|
-
const
|
|
274
|
-
|
|
285
|
+
function G() {
|
|
286
|
+
const o = m.value;
|
|
287
|
+
if (e.form && o) {
|
|
288
|
+
const M = o.querySelector(`form[name="${e.form}"]`);
|
|
289
|
+
M && M.dispatchEvent(new Event("submit"));
|
|
275
290
|
}
|
|
276
291
|
a("submit");
|
|
277
292
|
}
|
|
278
|
-
function
|
|
293
|
+
function de() {
|
|
279
294
|
i == null || i.close(e.id);
|
|
280
295
|
}
|
|
281
|
-
function
|
|
296
|
+
function ce() {
|
|
282
297
|
window && window.addEventListener("resize", () => {
|
|
283
|
-
|
|
298
|
+
D(b), D(m), m.value && (h = m.value.offsetLeft, _ = m.value.offsetTop);
|
|
284
299
|
});
|
|
285
300
|
}
|
|
286
|
-
function
|
|
301
|
+
function ue() {
|
|
287
302
|
if (e.closeable && e.esc) {
|
|
288
|
-
const
|
|
289
|
-
|
|
303
|
+
const o = ({ key: M }) => {
|
|
304
|
+
M === "Escape" && (i == null || i.close(e.id), window.removeEventListener("keydown", o));
|
|
290
305
|
};
|
|
291
|
-
window.addEventListener("keydown",
|
|
306
|
+
window.addEventListener("keydown", o);
|
|
292
307
|
}
|
|
293
308
|
}
|
|
294
|
-
function
|
|
295
|
-
|
|
309
|
+
function fe() {
|
|
310
|
+
h = m.value.offsetLeft, _ = m.value.offsetTop;
|
|
296
311
|
}
|
|
297
312
|
Y(() => {
|
|
298
|
-
|
|
299
|
-
}),
|
|
313
|
+
ue(), ce();
|
|
314
|
+
}), xe(() => {
|
|
300
315
|
});
|
|
301
|
-
function
|
|
316
|
+
function pe() {
|
|
302
317
|
return c.value = !0, () => re();
|
|
303
318
|
}
|
|
304
319
|
function re() {
|
|
305
320
|
c.value = !1;
|
|
306
321
|
}
|
|
307
322
|
return r({
|
|
308
|
-
showLoading:
|
|
323
|
+
showLoading: pe,
|
|
309
324
|
hideLoading: re
|
|
310
|
-
}), (
|
|
325
|
+
}), (o, M) => (y(), S("div", {
|
|
311
326
|
ref_key: "wrapperRef",
|
|
312
|
-
ref:
|
|
327
|
+
ref: b,
|
|
313
328
|
class: "modal-wrapper",
|
|
314
|
-
style:
|
|
315
|
-
onClick:
|
|
329
|
+
style: W(L.value),
|
|
330
|
+
onClick: M[0] || (M[0] = Ce((se) => o.maskClosable && j(), ["self"]))
|
|
316
331
|
}, [
|
|
317
332
|
g("div", {
|
|
318
333
|
ref_key: "contentRef",
|
|
319
|
-
ref:
|
|
320
|
-
class:
|
|
321
|
-
style:
|
|
334
|
+
ref: m,
|
|
335
|
+
class: ke(["modal-content", { [`${o.mode}-mode`]: !0, [`${o.position}-position`]: !0 }]),
|
|
336
|
+
style: W(x.value)
|
|
322
337
|
}, [
|
|
323
|
-
|
|
338
|
+
o.header ? (y(), S("div", {
|
|
324
339
|
key: 0,
|
|
325
340
|
ref_key: "headerRef",
|
|
326
341
|
ref: d,
|
|
327
342
|
class: "modal-header",
|
|
328
|
-
style:
|
|
329
|
-
onMousedown:
|
|
343
|
+
style: W(A.value),
|
|
344
|
+
onMousedown: fe
|
|
330
345
|
}, [
|
|
331
|
-
g("div", Ye,
|
|
346
|
+
g("div", Ye, T(o.title), 1),
|
|
332
347
|
g("div", Ke, [
|
|
333
|
-
|
|
348
|
+
o.closeable ? (y(), S("div", {
|
|
334
349
|
key: 0,
|
|
335
350
|
class: "i-icon-park-outline:close block cursor-pointer",
|
|
336
|
-
onClick:
|
|
337
|
-
})) :
|
|
351
|
+
onClick: j
|
|
352
|
+
})) : P("", !0)
|
|
338
353
|
])
|
|
339
|
-
], 36)) :
|
|
354
|
+
], 36)) : P("", !0),
|
|
340
355
|
g("div", {
|
|
341
356
|
id: "modal-header-slot",
|
|
342
357
|
ref_key: "headerSlotRef",
|
|
@@ -344,16 +359,16 @@ const Xe = (t) => ($e("data-v-8dfa7cd4"), t = t(), Ae(), t), Ye = { class: "titl
|
|
|
344
359
|
}, null, 512),
|
|
345
360
|
g("div", {
|
|
346
361
|
class: "modal-body",
|
|
347
|
-
style:
|
|
362
|
+
style: W(k.value)
|
|
348
363
|
}, [
|
|
349
|
-
(y(),
|
|
364
|
+
(y(), N(ie(o.component), Me(Se(o.componentProps)), null, 16))
|
|
350
365
|
], 4),
|
|
351
366
|
g("div", {
|
|
352
367
|
id: "modal-footer-slot",
|
|
353
368
|
ref_key: "footerSlotRef",
|
|
354
369
|
ref: l
|
|
355
370
|
}, null, 512),
|
|
356
|
-
|
|
371
|
+
o.footer ? (y(), S("div", {
|
|
357
372
|
key: 1,
|
|
358
373
|
ref_key: "footerRef",
|
|
359
374
|
ref: s,
|
|
@@ -362,26 +377,25 @@ const Xe = (t) => ($e("data-v-8dfa7cd4"), t = t(), Ae(), t), Ye = { class: "titl
|
|
|
362
377
|
g("button", {
|
|
363
378
|
class: "cancel-button",
|
|
364
379
|
type: "button",
|
|
365
|
-
onClick:
|
|
366
|
-
},
|
|
380
|
+
onClick: de
|
|
381
|
+
}, T(o.cancelText), 1),
|
|
367
382
|
g("button", {
|
|
368
383
|
class: "submit-button",
|
|
369
|
-
form:
|
|
384
|
+
form: o.form,
|
|
370
385
|
type: "submit",
|
|
371
|
-
onClick:
|
|
372
|
-
},
|
|
373
|
-
], 512)) :
|
|
374
|
-
c.value ? (y(), S("div", qe,
|
|
386
|
+
onClick: G
|
|
387
|
+
}, T(o.submitText), 9, Ue)
|
|
388
|
+
], 512)) : P("", !0),
|
|
389
|
+
c.value ? (y(), S("div", qe, Qe)) : P("", !0)
|
|
375
390
|
], 6)
|
|
376
391
|
], 4));
|
|
377
392
|
}
|
|
378
|
-
})
|
|
379
|
-
const
|
|
380
|
-
const o = t.__vccOpts || t;
|
|
393
|
+
}), V = (t, r) => {
|
|
394
|
+
const n = t.__vccOpts || t;
|
|
381
395
|
for (const [e, a] of r)
|
|
382
|
-
|
|
383
|
-
return
|
|
384
|
-
}, tt = /* @__PURE__ */
|
|
396
|
+
n[e] = a;
|
|
397
|
+
return n;
|
|
398
|
+
}, tt = /* @__PURE__ */ V(et, [["__scopeId", "data-v-a1713ed1"]]), ot = { class: "modal-dialog" }, nt = { class: "dialog-body" }, rt = { class: "dialog-title" }, st = { class: "dialog-content" }, it = /* @__PURE__ */ ee({
|
|
385
399
|
__name: "modal-dialog",
|
|
386
400
|
props: {
|
|
387
401
|
type: {},
|
|
@@ -394,7 +408,7 @@ const G = (t, r) => {
|
|
|
394
408
|
footer: {}
|
|
395
409
|
},
|
|
396
410
|
setup(t) {
|
|
397
|
-
const r = t,
|
|
411
|
+
const r = t, n = gt(), e = E(() => r.title ? r.title : {
|
|
398
412
|
confirm: "提示",
|
|
399
413
|
info: "提示",
|
|
400
414
|
warning: "警告",
|
|
@@ -402,107 +416,106 @@ const G = (t, r) => {
|
|
|
402
416
|
success: "成功"
|
|
403
417
|
}[r.type]);
|
|
404
418
|
async function a() {
|
|
405
|
-
r.onOk && await r.onOk(),
|
|
419
|
+
r.onOk && await r.onOk(), n.close();
|
|
406
420
|
}
|
|
407
421
|
async function i() {
|
|
408
|
-
r.onCancel && await r.onCancel(),
|
|
422
|
+
r.onCancel && await r.onCancel(), n.close();
|
|
409
423
|
}
|
|
410
|
-
return (c,
|
|
424
|
+
return (c, h) => (y(), S("section", ot, [
|
|
411
425
|
g("div", nt, [
|
|
412
|
-
g("div",
|
|
413
|
-
g("div",
|
|
426
|
+
g("div", rt, T(e.value), 1),
|
|
427
|
+
g("div", st, T(c.content), 1)
|
|
414
428
|
]),
|
|
415
429
|
g("div", {
|
|
416
430
|
class: "dialog-footer space-x-2",
|
|
417
|
-
style:
|
|
431
|
+
style: W(c.type === "confirm" ? { "justify-content": "end" } : { "border-top": "none" })
|
|
418
432
|
}, [
|
|
419
|
-
c.footer ? (y(),
|
|
433
|
+
c.footer ? (y(), N(ie(c.footer), { key: 0 })) : (y(), S(Q, { key: 1 }, [
|
|
420
434
|
g("button", {
|
|
421
435
|
class: "submit-button",
|
|
422
436
|
type: "submit",
|
|
423
437
|
onClick: a
|
|
424
|
-
},
|
|
438
|
+
}, T(c.okText), 1),
|
|
425
439
|
c.type === "confirm" ? (y(), S("button", {
|
|
426
440
|
key: 0,
|
|
427
441
|
class: "cancel-button",
|
|
428
442
|
type: "button",
|
|
429
443
|
onClick: i
|
|
430
|
-
},
|
|
444
|
+
}, T(c.cancelText), 1)) : P("", !0)
|
|
431
445
|
], 64))
|
|
432
446
|
], 4)
|
|
433
447
|
]));
|
|
434
448
|
}
|
|
435
|
-
})
|
|
436
|
-
const lt = /* @__PURE__ */ G(it, [["__scopeId", "data-v-8326e5a5"]]), at = {
|
|
449
|
+
}), lt = /* @__PURE__ */ V(it, [["__scopeId", "data-v-8326e5a5"]]), at = {
|
|
437
450
|
key: 0,
|
|
438
451
|
class: "modal-teleport"
|
|
439
452
|
}, dt = {
|
|
440
453
|
name: "ModalProvider",
|
|
441
454
|
inheritAttrs: !0
|
|
442
|
-
}, ct = /* @__PURE__ */
|
|
455
|
+
}, ct = /* @__PURE__ */ ee({
|
|
443
456
|
...dt,
|
|
444
457
|
props: {
|
|
445
458
|
appendToBody: { type: [Boolean, String], default: !1 },
|
|
446
459
|
sizes: { default: () => ({
|
|
447
|
-
small:
|
|
448
|
-
middle:
|
|
449
|
-
large:
|
|
460
|
+
small: "50%",
|
|
461
|
+
middle: "70%",
|
|
462
|
+
large: "90%"
|
|
450
463
|
}) },
|
|
451
464
|
maxWidth: { default: "90%" },
|
|
452
465
|
maxHeight: { default: "90%" },
|
|
453
466
|
offset: { default: () => ({ x: 0, y: 0 }) }
|
|
454
467
|
},
|
|
455
468
|
setup(t, { expose: r }) {
|
|
456
|
-
const
|
|
469
|
+
const n = O([]), e = H(!1), a = F();
|
|
457
470
|
function i(s, u = {}, l = {}) {
|
|
458
|
-
const
|
|
471
|
+
const v = He(
|
|
459
472
|
() => Promise.resolve(typeof s == "string" ? lt : s)
|
|
460
473
|
);
|
|
461
474
|
typeof s == "string" && (u.type = s, l.size = "small", l.fullscreen = !1, l.mode = "dialog", l.footer = !1, l.header = !1);
|
|
462
475
|
const f = Math.random().toString(32).slice(2), C = Object.assign({
|
|
463
|
-
zIndex: typeof s == "string" ?
|
|
464
|
-
}, l), R = new Promise((
|
|
465
|
-
|
|
476
|
+
zIndex: typeof s == "string" ? 1100 : 1e3
|
|
477
|
+
}, l), R = new Promise(($, I) => {
|
|
478
|
+
n.value.push({
|
|
466
479
|
id: f,
|
|
467
|
-
component:
|
|
480
|
+
component: v,
|
|
468
481
|
props: u || {},
|
|
469
482
|
options: {
|
|
470
483
|
...C,
|
|
471
484
|
type: typeof s == "string" ? s : "component"
|
|
472
485
|
},
|
|
473
|
-
resolve:
|
|
474
|
-
reject:
|
|
486
|
+
resolve: $,
|
|
487
|
+
reject: I,
|
|
475
488
|
listeners: []
|
|
476
|
-
}),
|
|
477
|
-
}).catch((
|
|
478
|
-
}) : Promise.reject(
|
|
489
|
+
}), D(n);
|
|
490
|
+
}).catch(($) => $ === "CANCEL" ? new Promise(() => {
|
|
491
|
+
}) : Promise.reject($));
|
|
479
492
|
return Object.assign(R, {
|
|
480
493
|
close: () => c(f)
|
|
481
494
|
});
|
|
482
495
|
}
|
|
483
496
|
function c(s, u) {
|
|
484
|
-
const l =
|
|
497
|
+
const l = n.value.findIndex((f) => f.id === s);
|
|
485
498
|
if (l < 0)
|
|
486
499
|
return;
|
|
487
|
-
const
|
|
488
|
-
u === void 0 ?
|
|
500
|
+
const v = n.value[l];
|
|
501
|
+
u === void 0 ? v == null || v.reject("CANCEL") : v == null || v.resolve(u), n.value.splice(l, 1), D(n);
|
|
489
502
|
}
|
|
490
|
-
function
|
|
491
|
-
!
|
|
503
|
+
function h() {
|
|
504
|
+
!n.value || n.value.length === 0 || (n.value.forEach((s) => {
|
|
492
505
|
s == null || s.reject("CANCEL");
|
|
493
|
-
}),
|
|
506
|
+
}), n.value = [], D(n));
|
|
494
507
|
}
|
|
495
|
-
function
|
|
496
|
-
const l =
|
|
508
|
+
function _(s, u) {
|
|
509
|
+
const l = n.value.find((f) => f.id === s);
|
|
497
510
|
if (!l)
|
|
498
511
|
return;
|
|
499
|
-
const
|
|
500
|
-
|
|
512
|
+
const v = l.listeners.find((f) => f.event === u);
|
|
513
|
+
v && v.callback({
|
|
501
514
|
open: i,
|
|
502
515
|
close: (f) => c(l.id, f),
|
|
503
|
-
closeAll:
|
|
504
|
-
showLoading: () =>
|
|
505
|
-
hideLoading: () =>
|
|
516
|
+
closeAll: h,
|
|
517
|
+
showLoading: () => b(l.id),
|
|
518
|
+
hideLoading: () => m(l.id),
|
|
506
519
|
confirm: (f) => i("confirm", f),
|
|
507
520
|
success: (f) => i("success", f),
|
|
508
521
|
error: (f) => i("error", f),
|
|
@@ -510,14 +523,14 @@ const lt = /* @__PURE__ */ G(it, [["__scopeId", "data-v-8326e5a5"]]), at = {
|
|
|
510
523
|
info: (f) => i("info", f)
|
|
511
524
|
});
|
|
512
525
|
}
|
|
513
|
-
function
|
|
526
|
+
function b(s) {
|
|
514
527
|
if (!a)
|
|
515
528
|
return;
|
|
516
529
|
const [u] = a.refs[`modal-container_${s}`];
|
|
517
530
|
if (u)
|
|
518
531
|
return u.showLoading();
|
|
519
532
|
}
|
|
520
|
-
function
|
|
533
|
+
function m(s) {
|
|
521
534
|
if (!a)
|
|
522
535
|
return;
|
|
523
536
|
const [u] = a.refs[`modal-container_${s}`];
|
|
@@ -525,8 +538,8 @@ const lt = /* @__PURE__ */ G(it, [["__scopeId", "data-v-8326e5a5"]]), at = {
|
|
|
525
538
|
return u.hideLoading();
|
|
526
539
|
}
|
|
527
540
|
function d(s, u, l) {
|
|
528
|
-
const
|
|
529
|
-
|
|
541
|
+
const v = n.value.find((f) => f.id === s);
|
|
542
|
+
v && v.listeners.push({
|
|
530
543
|
event: u,
|
|
531
544
|
callback: l
|
|
532
545
|
});
|
|
@@ -534,25 +547,25 @@ const lt = /* @__PURE__ */ G(it, [["__scopeId", "data-v-8326e5a5"]]), at = {
|
|
|
534
547
|
return Le(K, {
|
|
535
548
|
open: i,
|
|
536
549
|
close: c,
|
|
537
|
-
closeAll:
|
|
550
|
+
closeAll: h,
|
|
538
551
|
addEventListener: d
|
|
539
552
|
}), r({
|
|
540
|
-
elements:
|
|
553
|
+
elements: n,
|
|
541
554
|
open: i,
|
|
542
555
|
close: c,
|
|
543
|
-
closeAll:
|
|
556
|
+
closeAll: h
|
|
544
557
|
}), Y(() => {
|
|
545
558
|
e.value = !0;
|
|
546
559
|
}), (s, u) => (y(), S(Q, null, [
|
|
547
|
-
|
|
560
|
+
oe(s.$slots, "default", {}, void 0, !0),
|
|
548
561
|
e.value ? (y(), S("div", at, [
|
|
549
|
-
(y(),
|
|
562
|
+
(y(), N(ne, {
|
|
550
563
|
disabled: !s.appendToBody,
|
|
551
564
|
to: typeof s.appendToBody == "string" ? s.appendToBody : "body"
|
|
552
565
|
}, [
|
|
553
|
-
Re
|
|
554
|
-
default:
|
|
555
|
-
(y(!0), S(Q, null,
|
|
566
|
+
Ae(Re, { name: "modal-fade" }, {
|
|
567
|
+
default: Oe(() => [
|
|
568
|
+
(y(!0), S(Q, null, Te(n.value, (l) => (y(), N(tt, Be({
|
|
556
569
|
id: l.id,
|
|
557
570
|
key: l.id,
|
|
558
571
|
ref_for: !0,
|
|
@@ -564,51 +577,48 @@ const lt = /* @__PURE__ */ G(it, [["__scopeId", "data-v-8326e5a5"]]), at = {
|
|
|
564
577
|
offset: s.offset,
|
|
565
578
|
sizes: s.sizes
|
|
566
579
|
}, l.options, {
|
|
567
|
-
onSubmit: () =>
|
|
580
|
+
onSubmit: () => _(l.id, "submit")
|
|
568
581
|
}), null, 16, ["id", "component", "component-props", "max-height", "max-width", "offset", "sizes", "onSubmit"]))), 128))
|
|
569
582
|
]),
|
|
570
583
|
_: 1
|
|
571
584
|
})
|
|
572
585
|
], 8, ["disabled", "to"]))
|
|
573
|
-
])) :
|
|
586
|
+
])) : P("", !0)
|
|
574
587
|
], 64));
|
|
575
588
|
}
|
|
576
|
-
});
|
|
577
|
-
const _t = /* @__PURE__ */ G(ct, [["__scopeId", "data-v-c32d730b"]]);
|
|
578
|
-
const ut = {}, ft = { class: "modal-footer" };
|
|
589
|
+
}), bt = /* @__PURE__ */ V(ct, [["__scopeId", "data-v-756481fe"]]), ut = {}, ft = { class: "modal-footer" };
|
|
579
590
|
function pt(t, r) {
|
|
580
|
-
return y(),
|
|
591
|
+
return y(), N(ne, { to: "#modal-footer-slot" }, [
|
|
581
592
|
g("div", ft, [
|
|
582
|
-
|
|
593
|
+
oe(t.$slots, "default", {}, void 0, !0)
|
|
583
594
|
])
|
|
584
595
|
]);
|
|
585
596
|
}
|
|
586
|
-
const
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
ne(t.$slots, "default", {}, void 0, !0)
|
|
597
|
+
const wt = /* @__PURE__ */ V(ut, [["render", pt], ["__scopeId", "data-v-2080a86e"]]), ht = {}, mt = { class: "modal-header" };
|
|
598
|
+
function vt(t, r) {
|
|
599
|
+
return y(), N(ne, { to: "#modal-header-slot" }, [
|
|
600
|
+
g("div", mt, [
|
|
601
|
+
oe(t.$slots, "default", {}, void 0, !0)
|
|
592
602
|
])
|
|
593
603
|
]);
|
|
594
604
|
}
|
|
595
|
-
const
|
|
605
|
+
const _t = /* @__PURE__ */ V(ht, [["render", vt], ["__scopeId", "data-v-d0247172"]]);
|
|
596
606
|
function X(t, r) {
|
|
597
607
|
var e, a;
|
|
598
|
-
let
|
|
599
|
-
for (;
|
|
600
|
-
|
|
601
|
-
return ((a =
|
|
608
|
+
let n = t == null ? void 0 : t.parent;
|
|
609
|
+
for (; n && ((e = n == null ? void 0 : n.type) == null ? void 0 : e.name) !== r; )
|
|
610
|
+
n = n.parent;
|
|
611
|
+
return ((a = n == null ? void 0 : n.type) == null ? void 0 : a.name) === r ? n : null;
|
|
602
612
|
}
|
|
603
613
|
function gt() {
|
|
604
|
-
const t =
|
|
605
|
-
function
|
|
614
|
+
const t = te(K), r = F();
|
|
615
|
+
function n(e, a, i) {
|
|
606
616
|
if (!t)
|
|
607
617
|
throw new Error("Not Found Modal Provider Component");
|
|
608
618
|
return t.open(e, a, i);
|
|
609
619
|
}
|
|
610
620
|
return {
|
|
611
|
-
open:
|
|
621
|
+
open: n,
|
|
612
622
|
close(e) {
|
|
613
623
|
var c;
|
|
614
624
|
if (!t)
|
|
@@ -660,15 +670,15 @@ function gt() {
|
|
|
660
670
|
}
|
|
661
671
|
function xt(t) {
|
|
662
672
|
var i;
|
|
663
|
-
const r =
|
|
673
|
+
const r = te(K), n = F(), e = X(n, "ModalContainer"), a = (i = e == null ? void 0 : e.props) == null ? void 0 : i.id;
|
|
664
674
|
r && a && r.addEventListener(a, "submit", t);
|
|
665
675
|
}
|
|
666
676
|
export {
|
|
667
677
|
tt as ModalContainer,
|
|
668
|
-
|
|
669
|
-
|
|
678
|
+
wt as ModalFooter,
|
|
679
|
+
_t as ModalHeader,
|
|
670
680
|
K as ModalKey,
|
|
671
|
-
|
|
681
|
+
bt as ModalProvider,
|
|
672
682
|
xt as onSubmit,
|
|
673
683
|
gt as useModal
|
|
674
684
|
};
|