sweetalert2 11.5.1 → 11.6.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/sweetalert2.all.js +365 -719
- package/dist/sweetalert2.all.min.js +1 -1
- package/dist/sweetalert2.js +365 -719
- package/dist/sweetalert2.min.js +1 -1
- package/package.json +6 -6
- package/src/SweetAlert.js +1 -1
- package/src/staticMethods/dom.js +1 -0
- package/src/utils/dom/getters.js +5 -0
- package/src/utils/params.js +1 -1
package/dist/sweetalert2.all.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* sweetalert2 v11.
|
|
2
|
+
* sweetalert2 v11.6.0
|
|
3
3
|
* Released under the MIT License.
|
|
4
4
|
*/
|
|
5
5
|
(function (global, factory) {
|
|
@@ -17,6 +17,7 @@
|
|
|
17
17
|
* Once we have the changes from that PR in Babel, and our core class fits reasonable in *one module*
|
|
18
18
|
* then we can use that language feature.
|
|
19
19
|
*/
|
|
20
|
+
|
|
20
21
|
var privateProps = {
|
|
21
22
|
awaitingPromise: new WeakMap(),
|
|
22
23
|
promise: new WeakMap(),
|
|
@@ -25,98 +26,95 @@
|
|
|
25
26
|
};
|
|
26
27
|
|
|
27
28
|
const swalPrefix = 'swal2-';
|
|
29
|
+
|
|
28
30
|
/**
|
|
29
31
|
* @param {string[]} items
|
|
30
32
|
* @returns {object}
|
|
31
33
|
*/
|
|
32
|
-
|
|
33
34
|
const prefix = items => {
|
|
34
35
|
const result = {};
|
|
35
|
-
|
|
36
36
|
for (const i in items) {
|
|
37
37
|
result[items[i]] = swalPrefix + items[i];
|
|
38
38
|
}
|
|
39
|
-
|
|
40
39
|
return result;
|
|
41
40
|
};
|
|
42
41
|
const swalClasses = prefix(['container', 'shown', 'height-auto', 'iosfix', 'popup', 'modal', 'no-backdrop', 'no-transition', 'toast', 'toast-shown', 'show', 'hide', 'close', 'title', 'html-container', 'actions', 'confirm', 'deny', 'cancel', 'default-outline', 'footer', 'icon', 'icon-content', 'image', 'input', 'file', 'range', 'select', 'radio', 'checkbox', 'label', 'textarea', 'inputerror', 'input-label', 'validation-message', 'progress-steps', 'active-progress-step', 'progress-step', 'progress-step-line', 'loader', 'loading', 'styled', 'top', 'top-start', 'top-end', 'top-left', 'top-right', 'center', 'center-start', 'center-end', 'center-left', 'center-right', 'bottom', 'bottom-start', 'bottom-end', 'bottom-left', 'bottom-right', 'grow-row', 'grow-column', 'grow-fullscreen', 'rtl', 'timer-progress-bar', 'timer-progress-bar-container', 'scrollbar-measure', 'icon-success', 'icon-warning', 'icon-info', 'icon-question', 'icon-error', 'no-war']);
|
|
43
42
|
const iconTypes = prefix(['success', 'warning', 'info', 'question', 'error']);
|
|
44
43
|
|
|
45
44
|
const consolePrefix = 'SweetAlert2:';
|
|
45
|
+
|
|
46
46
|
/**
|
|
47
47
|
* Filter the unique values into a new array
|
|
48
48
|
*
|
|
49
49
|
* @param {Array} arr
|
|
50
50
|
* @returns {Array}
|
|
51
51
|
*/
|
|
52
|
-
|
|
53
52
|
const uniqueArray = arr => {
|
|
54
53
|
const result = [];
|
|
55
|
-
|
|
56
54
|
for (let i = 0; i < arr.length; i++) {
|
|
57
55
|
if (result.indexOf(arr[i]) === -1) {
|
|
58
56
|
result.push(arr[i]);
|
|
59
57
|
}
|
|
60
58
|
}
|
|
61
|
-
|
|
62
59
|
return result;
|
|
63
60
|
};
|
|
61
|
+
|
|
64
62
|
/**
|
|
65
63
|
* Capitalize the first letter of a string
|
|
66
64
|
*
|
|
67
65
|
* @param {string} str
|
|
68
66
|
* @returns {string}
|
|
69
67
|
*/
|
|
70
|
-
|
|
71
68
|
const capitalizeFirstLetter = str => str.charAt(0).toUpperCase() + str.slice(1);
|
|
69
|
+
|
|
72
70
|
/**
|
|
73
71
|
* Standardize console warnings
|
|
74
72
|
*
|
|
75
73
|
* @param {string | Array} message
|
|
76
74
|
*/
|
|
77
|
-
|
|
78
75
|
const warn = message => {
|
|
79
76
|
console.warn("".concat(consolePrefix, " ").concat(typeof message === 'object' ? message.join(' ') : message));
|
|
80
77
|
};
|
|
78
|
+
|
|
81
79
|
/**
|
|
82
80
|
* Standardize console errors
|
|
83
81
|
*
|
|
84
82
|
* @param {string} message
|
|
85
83
|
*/
|
|
86
|
-
|
|
87
84
|
const error = message => {
|
|
88
85
|
console.error("".concat(consolePrefix, " ").concat(message));
|
|
89
86
|
};
|
|
87
|
+
|
|
90
88
|
/**
|
|
91
89
|
* Private global state for `warnOnce`
|
|
92
90
|
*
|
|
93
91
|
* @type {Array}
|
|
94
92
|
* @private
|
|
95
93
|
*/
|
|
96
|
-
|
|
97
94
|
const previousWarnOnceMessages = [];
|
|
95
|
+
|
|
98
96
|
/**
|
|
99
97
|
* Show a console warning, but only if it hasn't already been shown
|
|
100
98
|
*
|
|
101
99
|
* @param {string} message
|
|
102
100
|
*/
|
|
103
|
-
|
|
104
101
|
const warnOnce = message => {
|
|
105
102
|
if (!previousWarnOnceMessages.includes(message)) {
|
|
106
103
|
previousWarnOnceMessages.push(message);
|
|
107
104
|
warn(message);
|
|
108
105
|
}
|
|
109
106
|
};
|
|
107
|
+
|
|
110
108
|
/**
|
|
111
109
|
* Show a one-time console warning about deprecated params/methods
|
|
112
110
|
*
|
|
113
111
|
* @param {string} deprecatedParam
|
|
114
112
|
* @param {string} useInstead
|
|
115
113
|
*/
|
|
116
|
-
|
|
117
114
|
const warnAboutDeprecation = (deprecatedParam, useInstead) => {
|
|
118
115
|
warnOnce("\"".concat(deprecatedParam, "\" is deprecated and will be removed in the next major release. Please use \"").concat(useInstead, "\" instead."));
|
|
119
116
|
};
|
|
117
|
+
|
|
120
118
|
/**
|
|
121
119
|
* If `arg` is a function, call it (with no arguments or context) and return the result.
|
|
122
120
|
* Otherwise, just pass the value through
|
|
@@ -124,25 +122,24 @@
|
|
|
124
122
|
* @param {Function | any} arg
|
|
125
123
|
* @returns {any}
|
|
126
124
|
*/
|
|
127
|
-
|
|
128
125
|
const callIfFunction = arg => typeof arg === 'function' ? arg() : arg;
|
|
126
|
+
|
|
129
127
|
/**
|
|
130
128
|
* @param {any} arg
|
|
131
129
|
* @returns {boolean}
|
|
132
130
|
*/
|
|
133
|
-
|
|
134
131
|
const hasToPromiseFn = arg => arg && typeof arg.toPromise === 'function';
|
|
132
|
+
|
|
135
133
|
/**
|
|
136
134
|
* @param {any} arg
|
|
137
135
|
* @returns {Promise}
|
|
138
136
|
*/
|
|
139
|
-
|
|
140
137
|
const asPromise = arg => hasToPromiseFn(arg) ? arg.toPromise() : Promise.resolve(arg);
|
|
138
|
+
|
|
141
139
|
/**
|
|
142
140
|
* @param {any} arg
|
|
143
141
|
* @returns {boolean}
|
|
144
142
|
*/
|
|
145
|
-
|
|
146
143
|
const isPromise = arg => arg && Promise.resolve(arg) === arg;
|
|
147
144
|
|
|
148
145
|
/**
|
|
@@ -150,154 +147,158 @@
|
|
|
150
147
|
*
|
|
151
148
|
* @returns {HTMLElement | null}
|
|
152
149
|
*/
|
|
153
|
-
|
|
154
150
|
const getContainer = () => document.body.querySelector(".".concat(swalClasses.container));
|
|
151
|
+
|
|
155
152
|
/**
|
|
156
153
|
* @param {string} selectorString
|
|
157
154
|
* @returns {HTMLElement | null}
|
|
158
155
|
*/
|
|
159
|
-
|
|
160
156
|
const elementBySelector = selectorString => {
|
|
161
157
|
const container = getContainer();
|
|
162
158
|
return container ? container.querySelector(selectorString) : null;
|
|
163
159
|
};
|
|
160
|
+
|
|
164
161
|
/**
|
|
165
162
|
* @param {string} className
|
|
166
163
|
* @returns {HTMLElement | null}
|
|
167
164
|
*/
|
|
168
|
-
|
|
169
165
|
const elementByClass = className => {
|
|
170
166
|
return elementBySelector(".".concat(className));
|
|
171
167
|
};
|
|
168
|
+
|
|
172
169
|
/**
|
|
173
170
|
* @returns {HTMLElement | null}
|
|
174
171
|
*/
|
|
175
|
-
|
|
176
|
-
|
|
177
172
|
const getPopup = () => elementByClass(swalClasses.popup);
|
|
173
|
+
|
|
178
174
|
/**
|
|
179
175
|
* @returns {HTMLElement | null}
|
|
180
176
|
*/
|
|
181
|
-
|
|
182
177
|
const getIcon = () => elementByClass(swalClasses.icon);
|
|
178
|
+
|
|
183
179
|
/**
|
|
184
180
|
* @returns {HTMLElement | null}
|
|
185
181
|
*/
|
|
182
|
+
const getIconContent = () => elementByClass(swalClasses['icon-content']);
|
|
186
183
|
|
|
187
|
-
const getTitle = () => elementByClass(swalClasses.title);
|
|
188
184
|
/**
|
|
189
185
|
* @returns {HTMLElement | null}
|
|
190
186
|
*/
|
|
187
|
+
const getTitle = () => elementByClass(swalClasses.title);
|
|
191
188
|
|
|
192
|
-
const getHtmlContainer = () => elementByClass(swalClasses['html-container']);
|
|
193
189
|
/**
|
|
194
190
|
* @returns {HTMLElement | null}
|
|
195
191
|
*/
|
|
192
|
+
const getHtmlContainer = () => elementByClass(swalClasses['html-container']);
|
|
196
193
|
|
|
197
|
-
const getImage = () => elementByClass(swalClasses.image);
|
|
198
194
|
/**
|
|
199
195
|
* @returns {HTMLElement | null}
|
|
200
196
|
*/
|
|
197
|
+
const getImage = () => elementByClass(swalClasses.image);
|
|
201
198
|
|
|
202
|
-
const getProgressSteps = () => elementByClass(swalClasses['progress-steps']);
|
|
203
199
|
/**
|
|
204
200
|
* @returns {HTMLElement | null}
|
|
205
201
|
*/
|
|
202
|
+
const getProgressSteps = () => elementByClass(swalClasses['progress-steps']);
|
|
206
203
|
|
|
207
|
-
const getValidationMessage = () => elementByClass(swalClasses['validation-message']);
|
|
208
204
|
/**
|
|
209
205
|
* @returns {HTMLElement | null}
|
|
210
206
|
*/
|
|
207
|
+
const getValidationMessage = () => elementByClass(swalClasses['validation-message']);
|
|
211
208
|
|
|
212
|
-
const getConfirmButton = () => elementBySelector(".".concat(swalClasses.actions, " .").concat(swalClasses.confirm));
|
|
213
209
|
/**
|
|
214
210
|
* @returns {HTMLElement | null}
|
|
215
211
|
*/
|
|
212
|
+
const getConfirmButton = () => elementBySelector(".".concat(swalClasses.actions, " .").concat(swalClasses.confirm));
|
|
216
213
|
|
|
217
|
-
const getDenyButton = () => elementBySelector(".".concat(swalClasses.actions, " .").concat(swalClasses.deny));
|
|
218
214
|
/**
|
|
219
215
|
* @returns {HTMLElement | null}
|
|
220
216
|
*/
|
|
217
|
+
const getDenyButton = () => elementBySelector(".".concat(swalClasses.actions, " .").concat(swalClasses.deny));
|
|
221
218
|
|
|
222
|
-
const getInputLabel = () => elementByClass(swalClasses['input-label']);
|
|
223
219
|
/**
|
|
224
220
|
* @returns {HTMLElement | null}
|
|
225
221
|
*/
|
|
222
|
+
const getInputLabel = () => elementByClass(swalClasses['input-label']);
|
|
226
223
|
|
|
227
|
-
const getLoader = () => elementBySelector(".".concat(swalClasses.loader));
|
|
228
224
|
/**
|
|
229
225
|
* @returns {HTMLElement | null}
|
|
230
226
|
*/
|
|
227
|
+
const getLoader = () => elementBySelector(".".concat(swalClasses.loader));
|
|
231
228
|
|
|
232
|
-
const getCancelButton = () => elementBySelector(".".concat(swalClasses.actions, " .").concat(swalClasses.cancel));
|
|
233
229
|
/**
|
|
234
230
|
* @returns {HTMLElement | null}
|
|
235
231
|
*/
|
|
232
|
+
const getCancelButton = () => elementBySelector(".".concat(swalClasses.actions, " .").concat(swalClasses.cancel));
|
|
236
233
|
|
|
237
|
-
const getActions = () => elementByClass(swalClasses.actions);
|
|
238
234
|
/**
|
|
239
235
|
* @returns {HTMLElement | null}
|
|
240
236
|
*/
|
|
237
|
+
const getActions = () => elementByClass(swalClasses.actions);
|
|
241
238
|
|
|
242
|
-
const getFooter = () => elementByClass(swalClasses.footer);
|
|
243
239
|
/**
|
|
244
240
|
* @returns {HTMLElement | null}
|
|
245
241
|
*/
|
|
242
|
+
const getFooter = () => elementByClass(swalClasses.footer);
|
|
246
243
|
|
|
247
|
-
const getTimerProgressBar = () => elementByClass(swalClasses['timer-progress-bar']);
|
|
248
244
|
/**
|
|
249
245
|
* @returns {HTMLElement | null}
|
|
250
246
|
*/
|
|
247
|
+
const getTimerProgressBar = () => elementByClass(swalClasses['timer-progress-bar']);
|
|
251
248
|
|
|
252
|
-
|
|
249
|
+
/**
|
|
250
|
+
* @returns {HTMLElement | null}
|
|
251
|
+
*/
|
|
252
|
+
const getCloseButton = () => elementByClass(swalClasses.close);
|
|
253
253
|
|
|
254
|
+
// https://github.com/jkup/focusable/blob/master/index.js
|
|
254
255
|
const focusable = "\n a[href],\n area[href],\n input:not([disabled]),\n select:not([disabled]),\n textarea:not([disabled]),\n button:not([disabled]),\n iframe,\n object,\n embed,\n [tabindex=\"0\"],\n [contenteditable],\n audio[controls],\n video[controls],\n summary\n";
|
|
255
256
|
/**
|
|
256
257
|
* @returns {HTMLElement[]}
|
|
257
258
|
*/
|
|
258
|
-
|
|
259
259
|
const getFocusableElements = () => {
|
|
260
|
-
const focusableElementsWithTabindex = Array.from(getPopup().querySelectorAll('[tabindex]:not([tabindex="-1"]):not([tabindex="0"])'))
|
|
260
|
+
const focusableElementsWithTabindex = Array.from(getPopup().querySelectorAll('[tabindex]:not([tabindex="-1"]):not([tabindex="0"])'))
|
|
261
|
+
// sort according to tabindex
|
|
261
262
|
.sort((a, b) => {
|
|
262
263
|
const tabindexA = parseInt(a.getAttribute('tabindex'));
|
|
263
264
|
const tabindexB = parseInt(b.getAttribute('tabindex'));
|
|
264
|
-
|
|
265
265
|
if (tabindexA > tabindexB) {
|
|
266
266
|
return 1;
|
|
267
267
|
} else if (tabindexA < tabindexB) {
|
|
268
268
|
return -1;
|
|
269
269
|
}
|
|
270
|
-
|
|
271
270
|
return 0;
|
|
272
271
|
});
|
|
273
272
|
const otherFocusableElements = Array.from(getPopup().querySelectorAll(focusable)).filter(el => el.getAttribute('tabindex') !== '-1');
|
|
274
273
|
return uniqueArray(focusableElementsWithTabindex.concat(otherFocusableElements)).filter(el => isVisible(el));
|
|
275
274
|
};
|
|
275
|
+
|
|
276
276
|
/**
|
|
277
277
|
* @returns {boolean}
|
|
278
278
|
*/
|
|
279
|
-
|
|
280
279
|
const isModal = () => {
|
|
281
280
|
return hasClass(document.body, swalClasses.shown) && !hasClass(document.body, swalClasses['toast-shown']) && !hasClass(document.body, swalClasses['no-backdrop']);
|
|
282
281
|
};
|
|
282
|
+
|
|
283
283
|
/**
|
|
284
284
|
* @returns {boolean}
|
|
285
285
|
*/
|
|
286
|
-
|
|
287
286
|
const isToast = () => {
|
|
288
287
|
return getPopup() && hasClass(getPopup(), swalClasses.toast);
|
|
289
288
|
};
|
|
289
|
+
|
|
290
290
|
/**
|
|
291
291
|
* @returns {boolean}
|
|
292
292
|
*/
|
|
293
|
-
|
|
294
293
|
const isLoading = () => {
|
|
295
294
|
return getPopup().hasAttribute('data-loading');
|
|
296
295
|
};
|
|
297
296
|
|
|
297
|
+
// Remember state in cases where opening and handling a modal will fiddle with it.
|
|
298
298
|
const states = {
|
|
299
299
|
previousBodyPadding: null
|
|
300
300
|
};
|
|
301
|
+
|
|
301
302
|
/**
|
|
302
303
|
* Securely set innerHTML of an element
|
|
303
304
|
* https://github.com/sweetalert2/sweetalert2/issues/1926
|
|
@@ -305,10 +306,8 @@
|
|
|
305
306
|
* @param {HTMLElement} elem
|
|
306
307
|
* @param {string} html
|
|
307
308
|
*/
|
|
308
|
-
|
|
309
309
|
const setInnerHtml = (elem, html) => {
|
|
310
310
|
elem.textContent = '';
|
|
311
|
-
|
|
312
311
|
if (html) {
|
|
313
312
|
const parser = new DOMParser();
|
|
314
313
|
const parsed = parser.parseFromString(html, "text/html");
|
|
@@ -324,32 +323,29 @@
|
|
|
324
323
|
});
|
|
325
324
|
}
|
|
326
325
|
};
|
|
326
|
+
|
|
327
327
|
/**
|
|
328
328
|
* @param {HTMLElement} elem
|
|
329
329
|
* @param {string} className
|
|
330
330
|
* @returns {boolean}
|
|
331
331
|
*/
|
|
332
|
-
|
|
333
332
|
const hasClass = (elem, className) => {
|
|
334
333
|
if (!className) {
|
|
335
334
|
return false;
|
|
336
335
|
}
|
|
337
|
-
|
|
338
336
|
const classList = className.split(/\s+/);
|
|
339
|
-
|
|
340
337
|
for (let i = 0; i < classList.length; i++) {
|
|
341
338
|
if (!elem.classList.contains(classList[i])) {
|
|
342
339
|
return false;
|
|
343
340
|
}
|
|
344
341
|
}
|
|
345
|
-
|
|
346
342
|
return true;
|
|
347
343
|
};
|
|
344
|
+
|
|
348
345
|
/**
|
|
349
346
|
* @param {HTMLElement} elem
|
|
350
347
|
* @param {SweetAlertOptions} params
|
|
351
348
|
*/
|
|
352
|
-
|
|
353
349
|
const removeCustomClasses = (elem, params) => {
|
|
354
350
|
Array.from(elem.classList).forEach(className => {
|
|
355
351
|
if (!Object.values(swalClasses).includes(className) && !Object.values(iconTypes).includes(className) && !Object.values(params.showClass).includes(className)) {
|
|
@@ -357,62 +353,55 @@
|
|
|
357
353
|
}
|
|
358
354
|
});
|
|
359
355
|
};
|
|
356
|
+
|
|
360
357
|
/**
|
|
361
358
|
* @param {HTMLElement} elem
|
|
362
359
|
* @param {SweetAlertOptions} params
|
|
363
360
|
* @param {string} className
|
|
364
361
|
*/
|
|
365
|
-
|
|
366
|
-
|
|
367
362
|
const applyCustomClass = (elem, params, className) => {
|
|
368
363
|
removeCustomClasses(elem, params);
|
|
369
|
-
|
|
370
364
|
if (params.customClass && params.customClass[className]) {
|
|
371
365
|
if (typeof params.customClass[className] !== 'string' && !params.customClass[className].forEach) {
|
|
372
366
|
warn("Invalid type of customClass.".concat(className, "! Expected string or iterable object, got \"").concat(typeof params.customClass[className], "\""));
|
|
373
367
|
return;
|
|
374
368
|
}
|
|
375
|
-
|
|
376
369
|
addClass(elem, params.customClass[className]);
|
|
377
370
|
}
|
|
378
371
|
};
|
|
372
|
+
|
|
379
373
|
/**
|
|
380
374
|
* @param {HTMLElement} popup
|
|
381
375
|
* @param {import('./renderers/renderInput').InputClass} inputClass
|
|
382
376
|
* @returns {HTMLInputElement | null}
|
|
383
377
|
*/
|
|
384
|
-
|
|
385
378
|
const getInput = (popup, inputClass) => {
|
|
386
379
|
if (!inputClass) {
|
|
387
380
|
return null;
|
|
388
381
|
}
|
|
389
|
-
|
|
390
382
|
switch (inputClass) {
|
|
391
383
|
case 'select':
|
|
392
384
|
case 'textarea':
|
|
393
385
|
case 'file':
|
|
394
386
|
return popup.querySelector(".".concat(swalClasses.popup, " > .").concat(swalClasses[inputClass]));
|
|
395
|
-
|
|
396
387
|
case 'checkbox':
|
|
397
388
|
return popup.querySelector(".".concat(swalClasses.popup, " > .").concat(swalClasses.checkbox, " input"));
|
|
398
|
-
|
|
399
389
|
case 'radio':
|
|
400
390
|
return popup.querySelector(".".concat(swalClasses.popup, " > .").concat(swalClasses.radio, " input:checked")) || popup.querySelector(".".concat(swalClasses.popup, " > .").concat(swalClasses.radio, " input:first-child"));
|
|
401
|
-
|
|
402
391
|
case 'range':
|
|
403
392
|
return popup.querySelector(".".concat(swalClasses.popup, " > .").concat(swalClasses.range, " input"));
|
|
404
|
-
|
|
405
393
|
default:
|
|
406
394
|
return popup.querySelector(".".concat(swalClasses.popup, " > .").concat(swalClasses.input));
|
|
407
395
|
}
|
|
408
396
|
};
|
|
397
|
+
|
|
409
398
|
/**
|
|
410
399
|
* @param {HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement} input
|
|
411
400
|
*/
|
|
412
|
-
|
|
413
401
|
const focusInput = input => {
|
|
414
|
-
input.focus();
|
|
402
|
+
input.focus();
|
|
415
403
|
|
|
404
|
+
// place cursor at end of text in text input
|
|
416
405
|
if (input.type !== 'file') {
|
|
417
406
|
// http://stackoverflow.com/a/2345915
|
|
418
407
|
const val = input.value;
|
|
@@ -420,21 +409,19 @@
|
|
|
420
409
|
input.value = val;
|
|
421
410
|
}
|
|
422
411
|
};
|
|
412
|
+
|
|
423
413
|
/**
|
|
424
414
|
* @param {HTMLElement | HTMLElement[] | null} target
|
|
425
415
|
* @param {string | string[] | readonly string[]} classList
|
|
426
416
|
* @param {boolean} condition
|
|
427
417
|
*/
|
|
428
|
-
|
|
429
418
|
const toggleClass = (target, classList, condition) => {
|
|
430
419
|
if (!target || !classList) {
|
|
431
420
|
return;
|
|
432
421
|
}
|
|
433
|
-
|
|
434
422
|
if (typeof classList === 'string') {
|
|
435
423
|
classList = classList.split(/\s+/).filter(Boolean);
|
|
436
424
|
}
|
|
437
|
-
|
|
438
425
|
classList.forEach(className => {
|
|
439
426
|
if (Array.isArray(target)) {
|
|
440
427
|
target.forEach(elem => {
|
|
@@ -445,22 +432,23 @@
|
|
|
445
432
|
}
|
|
446
433
|
});
|
|
447
434
|
};
|
|
435
|
+
|
|
448
436
|
/**
|
|
449
437
|
* @param {HTMLElement | HTMLElement[] | null} target
|
|
450
438
|
* @param {string | string[] | readonly string[]} classList
|
|
451
439
|
*/
|
|
452
|
-
|
|
453
440
|
const addClass = (target, classList) => {
|
|
454
441
|
toggleClass(target, classList, true);
|
|
455
442
|
};
|
|
443
|
+
|
|
456
444
|
/**
|
|
457
445
|
* @param {HTMLElement | HTMLElement[] | null} target
|
|
458
446
|
* @param {string | string[] | readonly string[]} classList
|
|
459
447
|
*/
|
|
460
|
-
|
|
461
448
|
const removeClass = (target, classList) => {
|
|
462
449
|
toggleClass(target, classList, false);
|
|
463
450
|
};
|
|
451
|
+
|
|
464
452
|
/**
|
|
465
453
|
* Get direct child of an element by class name
|
|
466
454
|
*
|
|
@@ -468,123 +456,116 @@
|
|
|
468
456
|
* @param {string} className
|
|
469
457
|
* @returns {HTMLElement | null}
|
|
470
458
|
*/
|
|
471
|
-
|
|
472
459
|
const getDirectChildByClass = (elem, className) => {
|
|
473
460
|
const children = Array.from(elem.children);
|
|
474
|
-
|
|
475
461
|
for (let i = 0; i < children.length; i++) {
|
|
476
462
|
const child = children[i];
|
|
477
|
-
|
|
478
463
|
if (child instanceof HTMLElement && hasClass(child, className)) {
|
|
479
464
|
return child;
|
|
480
465
|
}
|
|
481
466
|
}
|
|
482
467
|
};
|
|
468
|
+
|
|
483
469
|
/**
|
|
484
470
|
* @param {HTMLElement} elem
|
|
485
471
|
* @param {string} property
|
|
486
472
|
* @param {*} value
|
|
487
473
|
*/
|
|
488
|
-
|
|
489
474
|
const applyNumericalStyle = (elem, property, value) => {
|
|
490
475
|
if (value === "".concat(parseInt(value))) {
|
|
491
476
|
value = parseInt(value);
|
|
492
477
|
}
|
|
493
|
-
|
|
494
478
|
if (value || parseInt(value) === 0) {
|
|
495
479
|
elem.style[property] = typeof value === 'number' ? "".concat(value, "px") : value;
|
|
496
480
|
} else {
|
|
497
481
|
elem.style.removeProperty(property);
|
|
498
482
|
}
|
|
499
483
|
};
|
|
484
|
+
|
|
500
485
|
/**
|
|
501
486
|
* @param {HTMLElement} elem
|
|
502
487
|
* @param {string} display
|
|
503
488
|
*/
|
|
504
|
-
|
|
505
489
|
const show = function (elem) {
|
|
506
490
|
let display = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'flex';
|
|
507
491
|
elem.style.display = display;
|
|
508
492
|
};
|
|
493
|
+
|
|
509
494
|
/**
|
|
510
495
|
* @param {HTMLElement} elem
|
|
511
496
|
*/
|
|
512
|
-
|
|
513
497
|
const hide = elem => {
|
|
514
498
|
elem.style.display = 'none';
|
|
515
499
|
};
|
|
500
|
+
|
|
516
501
|
/**
|
|
517
502
|
* @param {HTMLElement} parent
|
|
518
503
|
* @param {string} selector
|
|
519
504
|
* @param {string} property
|
|
520
505
|
* @param {string} value
|
|
521
506
|
*/
|
|
522
|
-
|
|
523
507
|
const setStyle = (parent, selector, property, value) => {
|
|
524
508
|
/** @type {HTMLElement} */
|
|
525
509
|
const el = parent.querySelector(selector);
|
|
526
|
-
|
|
527
510
|
if (el) {
|
|
528
511
|
el.style[property] = value;
|
|
529
512
|
}
|
|
530
513
|
};
|
|
514
|
+
|
|
531
515
|
/**
|
|
532
516
|
* @param {HTMLElement} elem
|
|
533
517
|
* @param {any} condition
|
|
534
518
|
* @param {string} display
|
|
535
519
|
*/
|
|
536
|
-
|
|
537
520
|
const toggle = function (elem, condition) {
|
|
538
521
|
let display = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'flex';
|
|
539
522
|
condition ? show(elem, display) : hide(elem);
|
|
540
523
|
};
|
|
524
|
+
|
|
541
525
|
/**
|
|
542
526
|
* borrowed from jquery $(elem).is(':visible') implementation
|
|
543
527
|
*
|
|
544
528
|
* @param {HTMLElement} elem
|
|
545
529
|
* @returns {boolean}
|
|
546
530
|
*/
|
|
547
|
-
|
|
548
531
|
const isVisible = elem => !!(elem && (elem.offsetWidth || elem.offsetHeight || elem.getClientRects().length));
|
|
532
|
+
|
|
549
533
|
/**
|
|
550
534
|
* @returns {boolean}
|
|
551
535
|
*/
|
|
552
|
-
|
|
553
536
|
const allButtonsAreHidden = () => !isVisible(getConfirmButton()) && !isVisible(getDenyButton()) && !isVisible(getCancelButton());
|
|
537
|
+
|
|
554
538
|
/**
|
|
555
539
|
* @param {HTMLElement} elem
|
|
556
540
|
* @returns {boolean}
|
|
557
541
|
*/
|
|
558
|
-
|
|
559
542
|
const isScrollable = elem => !!(elem.scrollHeight > elem.clientHeight);
|
|
543
|
+
|
|
560
544
|
/**
|
|
561
545
|
* borrowed from https://stackoverflow.com/a/46352119
|
|
562
546
|
*
|
|
563
547
|
* @param {HTMLElement} elem
|
|
564
548
|
* @returns {boolean}
|
|
565
549
|
*/
|
|
566
|
-
|
|
567
550
|
const hasCssAnimation = elem => {
|
|
568
551
|
const style = window.getComputedStyle(elem);
|
|
569
552
|
const animDuration = parseFloat(style.getPropertyValue('animation-duration') || '0');
|
|
570
553
|
const transDuration = parseFloat(style.getPropertyValue('transition-duration') || '0');
|
|
571
554
|
return animDuration > 0 || transDuration > 0;
|
|
572
555
|
};
|
|
556
|
+
|
|
573
557
|
/**
|
|
574
558
|
* @param {number} timer
|
|
575
559
|
* @param {boolean} reset
|
|
576
560
|
*/
|
|
577
|
-
|
|
578
561
|
const animateTimerProgressBar = function (timer) {
|
|
579
562
|
let reset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
580
563
|
const timerProgressBar = getTimerProgressBar();
|
|
581
|
-
|
|
582
564
|
if (isVisible(timerProgressBar)) {
|
|
583
565
|
if (reset) {
|
|
584
566
|
timerProgressBar.style.transition = 'none';
|
|
585
567
|
timerProgressBar.style.width = '100%';
|
|
586
568
|
}
|
|
587
|
-
|
|
588
569
|
setTimeout(() => {
|
|
589
570
|
timerProgressBar.style.transition = "width ".concat(timer / 1000, "s linear");
|
|
590
571
|
timerProgressBar.style.width = '0%';
|
|
@@ -605,9 +586,7 @@
|
|
|
605
586
|
const RESTORE_FOCUS_TIMEOUT = 100;
|
|
606
587
|
|
|
607
588
|
/** @type {GlobalState} */
|
|
608
|
-
|
|
609
589
|
const globalState = {};
|
|
610
|
-
|
|
611
590
|
const focusPreviousActiveElement = () => {
|
|
612
591
|
if (globalState.previousActiveElement instanceof HTMLElement) {
|
|
613
592
|
globalState.previousActiveElement.focus();
|
|
@@ -616,20 +595,18 @@
|
|
|
616
595
|
document.body.focus();
|
|
617
596
|
}
|
|
618
597
|
};
|
|
598
|
+
|
|
619
599
|
/**
|
|
620
600
|
* Restore previous active (focused) element
|
|
621
601
|
*
|
|
622
602
|
* @param {boolean} returnFocus
|
|
623
603
|
* @returns {Promise}
|
|
624
604
|
*/
|
|
625
|
-
|
|
626
|
-
|
|
627
605
|
const restoreActiveElement = returnFocus => {
|
|
628
606
|
return new Promise(resolve => {
|
|
629
607
|
if (!returnFocus) {
|
|
630
608
|
return resolve();
|
|
631
609
|
}
|
|
632
|
-
|
|
633
610
|
const x = window.scrollX;
|
|
634
611
|
const y = window.scrollY;
|
|
635
612
|
globalState.restoreFocusTimeout = setTimeout(() => {
|
|
@@ -649,39 +626,32 @@
|
|
|
649
626
|
const isNodeEnv = () => typeof window === 'undefined' || typeof document === 'undefined';
|
|
650
627
|
|
|
651
628
|
const sweetHTML = "\n <div aria-labelledby=\"".concat(swalClasses.title, "\" aria-describedby=\"").concat(swalClasses['html-container'], "\" class=\"").concat(swalClasses.popup, "\" tabindex=\"-1\">\n <button type=\"button\" class=\"").concat(swalClasses.close, "\"></button>\n <ul class=\"").concat(swalClasses['progress-steps'], "\"></ul>\n <div class=\"").concat(swalClasses.icon, "\"></div>\n <img class=\"").concat(swalClasses.image, "\" />\n <h2 class=\"").concat(swalClasses.title, "\" id=\"").concat(swalClasses.title, "\"></h2>\n <div class=\"").concat(swalClasses['html-container'], "\" id=\"").concat(swalClasses['html-container'], "\"></div>\n <input class=\"").concat(swalClasses.input, "\" />\n <input type=\"file\" class=\"").concat(swalClasses.file, "\" />\n <div class=\"").concat(swalClasses.range, "\">\n <input type=\"range\" />\n <output></output>\n </div>\n <select class=\"").concat(swalClasses.select, "\"></select>\n <div class=\"").concat(swalClasses.radio, "\"></div>\n <label for=\"").concat(swalClasses.checkbox, "\" class=\"").concat(swalClasses.checkbox, "\">\n <input type=\"checkbox\" />\n <span class=\"").concat(swalClasses.label, "\"></span>\n </label>\n <textarea class=\"").concat(swalClasses.textarea, "\"></textarea>\n <div class=\"").concat(swalClasses['validation-message'], "\" id=\"").concat(swalClasses['validation-message'], "\"></div>\n <div class=\"").concat(swalClasses.actions, "\">\n <div class=\"").concat(swalClasses.loader, "\"></div>\n <button type=\"button\" class=\"").concat(swalClasses.confirm, "\"></button>\n <button type=\"button\" class=\"").concat(swalClasses.deny, "\"></button>\n <button type=\"button\" class=\"").concat(swalClasses.cancel, "\"></button>\n </div>\n <div class=\"").concat(swalClasses.footer, "\"></div>\n <div class=\"").concat(swalClasses['timer-progress-bar-container'], "\">\n <div class=\"").concat(swalClasses['timer-progress-bar'], "\"></div>\n </div>\n </div>\n").replace(/(^|\n)\s*/g, '');
|
|
629
|
+
|
|
652
630
|
/**
|
|
653
631
|
* @returns {boolean}
|
|
654
632
|
*/
|
|
655
|
-
|
|
656
633
|
const resetOldContainer = () => {
|
|
657
634
|
const oldContainer = getContainer();
|
|
658
|
-
|
|
659
635
|
if (!oldContainer) {
|
|
660
636
|
return false;
|
|
661
637
|
}
|
|
662
|
-
|
|
663
638
|
oldContainer.remove();
|
|
664
639
|
removeClass([document.documentElement, document.body], [swalClasses['no-backdrop'], swalClasses['toast-shown'], swalClasses['has-column']]);
|
|
665
640
|
return true;
|
|
666
641
|
};
|
|
667
|
-
|
|
668
642
|
const resetValidationMessage = () => {
|
|
669
643
|
globalState.currentInstance.resetValidationMessage();
|
|
670
644
|
};
|
|
671
|
-
|
|
672
645
|
const addInputChangeListeners = () => {
|
|
673
646
|
const popup = getPopup();
|
|
674
647
|
const input = getDirectChildByClass(popup, swalClasses.input);
|
|
675
648
|
const file = getDirectChildByClass(popup, swalClasses.file);
|
|
676
649
|
/** @type {HTMLInputElement} */
|
|
677
|
-
|
|
678
650
|
const range = popup.querySelector(".".concat(swalClasses.range, " input"));
|
|
679
651
|
/** @type {HTMLOutputElement} */
|
|
680
|
-
|
|
681
652
|
const rangeOutput = popup.querySelector(".".concat(swalClasses.range, " output"));
|
|
682
653
|
const select = getDirectChildByClass(popup, swalClasses.select);
|
|
683
654
|
/** @type {HTMLInputElement} */
|
|
684
|
-
|
|
685
655
|
const checkbox = popup.querySelector(".".concat(swalClasses.checkbox, " input"));
|
|
686
656
|
const textarea = getDirectChildByClass(popup, swalClasses.textarea);
|
|
687
657
|
input.oninput = resetValidationMessage;
|
|
@@ -689,72 +659,62 @@
|
|
|
689
659
|
select.onchange = resetValidationMessage;
|
|
690
660
|
checkbox.onchange = resetValidationMessage;
|
|
691
661
|
textarea.oninput = resetValidationMessage;
|
|
692
|
-
|
|
693
662
|
range.oninput = () => {
|
|
694
663
|
resetValidationMessage();
|
|
695
664
|
rangeOutput.value = range.value;
|
|
696
665
|
};
|
|
697
|
-
|
|
698
666
|
range.onchange = () => {
|
|
699
667
|
resetValidationMessage();
|
|
700
668
|
rangeOutput.value = range.value;
|
|
701
669
|
};
|
|
702
670
|
};
|
|
671
|
+
|
|
703
672
|
/**
|
|
704
673
|
* @param {string | HTMLElement} target
|
|
705
674
|
* @returns {HTMLElement}
|
|
706
675
|
*/
|
|
707
|
-
|
|
708
|
-
|
|
709
676
|
const getTarget = target => typeof target === 'string' ? document.querySelector(target) : target;
|
|
677
|
+
|
|
710
678
|
/**
|
|
711
679
|
* @param {SweetAlertOptions} params
|
|
712
680
|
*/
|
|
713
|
-
|
|
714
|
-
|
|
715
681
|
const setupAccessibility = params => {
|
|
716
682
|
const popup = getPopup();
|
|
717
683
|
popup.setAttribute('role', params.toast ? 'alert' : 'dialog');
|
|
718
684
|
popup.setAttribute('aria-live', params.toast ? 'polite' : 'assertive');
|
|
719
|
-
|
|
720
685
|
if (!params.toast) {
|
|
721
686
|
popup.setAttribute('aria-modal', 'true');
|
|
722
687
|
}
|
|
723
688
|
};
|
|
689
|
+
|
|
724
690
|
/**
|
|
725
691
|
* @param {HTMLElement} targetElement
|
|
726
692
|
*/
|
|
727
|
-
|
|
728
|
-
|
|
729
693
|
const setupRTL = targetElement => {
|
|
730
694
|
if (window.getComputedStyle(targetElement).direction === 'rtl') {
|
|
731
695
|
addClass(getContainer(), swalClasses.rtl);
|
|
732
696
|
}
|
|
733
697
|
};
|
|
698
|
+
|
|
734
699
|
/**
|
|
735
700
|
* Add modal + backdrop + no-war message for Russians to DOM
|
|
736
701
|
*
|
|
737
702
|
* @param {SweetAlertOptions} params
|
|
738
703
|
*/
|
|
739
|
-
|
|
740
|
-
|
|
741
704
|
const init = params => {
|
|
742
705
|
// Clean up the old popup container if it exists
|
|
743
706
|
const oldContainerExisted = resetOldContainer();
|
|
744
|
-
/* istanbul ignore if */
|
|
745
707
|
|
|
708
|
+
/* istanbul ignore if */
|
|
746
709
|
if (isNodeEnv()) {
|
|
747
710
|
error('SweetAlert2 requires document to initialize');
|
|
748
711
|
return;
|
|
749
712
|
}
|
|
750
|
-
|
|
751
713
|
const container = document.createElement('div');
|
|
752
714
|
container.className = swalClasses.container;
|
|
753
|
-
|
|
754
715
|
if (oldContainerExisted) {
|
|
755
716
|
addClass(container, swalClasses['no-transition']);
|
|
756
717
|
}
|
|
757
|
-
|
|
758
718
|
setInnerHtml(container, sweetHTML);
|
|
759
719
|
const targetElement = getTarget(params.target);
|
|
760
720
|
targetElement.appendChild(container);
|
|
@@ -767,42 +727,45 @@
|
|
|
767
727
|
* @param {HTMLElement | object | string} param
|
|
768
728
|
* @param {HTMLElement} target
|
|
769
729
|
*/
|
|
770
|
-
|
|
771
730
|
const parseHtmlToContainer = (param, target) => {
|
|
772
731
|
// DOM element
|
|
773
732
|
if (param instanceof HTMLElement) {
|
|
774
733
|
target.appendChild(param);
|
|
775
|
-
}
|
|
734
|
+
}
|
|
735
|
+
|
|
736
|
+
// Object
|
|
776
737
|
else if (typeof param === 'object') {
|
|
777
738
|
handleObject(param, target);
|
|
778
|
-
}
|
|
739
|
+
}
|
|
740
|
+
|
|
741
|
+
// Plain string
|
|
779
742
|
else if (param) {
|
|
780
743
|
setInnerHtml(target, param);
|
|
781
744
|
}
|
|
782
745
|
};
|
|
746
|
+
|
|
783
747
|
/**
|
|
784
748
|
* @param {object} param
|
|
785
749
|
* @param {HTMLElement} target
|
|
786
750
|
*/
|
|
787
|
-
|
|
788
751
|
const handleObject = (param, target) => {
|
|
789
752
|
// JQuery element(s)
|
|
790
753
|
if (param.jquery) {
|
|
791
754
|
handleJqueryElem(target, param);
|
|
792
|
-
}
|
|
755
|
+
}
|
|
756
|
+
|
|
757
|
+
// For other objects use their string representation
|
|
793
758
|
else {
|
|
794
759
|
setInnerHtml(target, param.toString());
|
|
795
760
|
}
|
|
796
761
|
};
|
|
762
|
+
|
|
797
763
|
/**
|
|
798
764
|
* @param {HTMLElement} target
|
|
799
765
|
* @param {HTMLElement} elem
|
|
800
766
|
*/
|
|
801
|
-
|
|
802
|
-
|
|
803
767
|
const handleJqueryElem = (target, elem) => {
|
|
804
768
|
target.textContent = '';
|
|
805
|
-
|
|
806
769
|
if (0 in elem) {
|
|
807
770
|
for (let i = 0; (i in elem); i++) {
|
|
808
771
|
target.appendChild(elem[i].cloneNode(true));
|
|
@@ -815,21 +778,17 @@
|
|
|
815
778
|
/**
|
|
816
779
|
* @returns {'webkitAnimationEnd' | 'animationend' | false}
|
|
817
780
|
*/
|
|
818
|
-
|
|
819
781
|
const animationEndEvent = (() => {
|
|
820
782
|
// Prevent run in Node env
|
|
821
|
-
|
|
822
783
|
/* istanbul ignore if */
|
|
823
784
|
if (isNodeEnv()) {
|
|
824
785
|
return false;
|
|
825
786
|
}
|
|
826
|
-
|
|
827
787
|
const testEl = document.createElement('div');
|
|
828
788
|
const transEndEventNames = {
|
|
829
789
|
WebkitAnimation: 'webkitAnimationEnd',
|
|
830
790
|
// Chrome, Safari and Opera
|
|
831
791
|
animation: 'animationend' // Standard syntax
|
|
832
|
-
|
|
833
792
|
};
|
|
834
793
|
|
|
835
794
|
for (const i in transEndEventNames) {
|
|
@@ -837,7 +796,6 @@
|
|
|
837
796
|
return transEndEventNames[i];
|
|
838
797
|
}
|
|
839
798
|
}
|
|
840
|
-
|
|
841
799
|
return false;
|
|
842
800
|
})();
|
|
843
801
|
|
|
@@ -847,7 +805,6 @@
|
|
|
847
805
|
*
|
|
848
806
|
* @returns {number}
|
|
849
807
|
*/
|
|
850
|
-
|
|
851
808
|
const measureScrollbar = () => {
|
|
852
809
|
const scrollDiv = document.createElement('div');
|
|
853
810
|
scrollDiv.className = swalClasses['scrollbar-measure'];
|
|
@@ -861,41 +818,43 @@
|
|
|
861
818
|
* @param {SweetAlert2} instance
|
|
862
819
|
* @param {SweetAlertOptions} params
|
|
863
820
|
*/
|
|
864
|
-
|
|
865
821
|
const renderActions = (instance, params) => {
|
|
866
822
|
const actions = getActions();
|
|
867
|
-
const loader = getLoader();
|
|
823
|
+
const loader = getLoader();
|
|
868
824
|
|
|
825
|
+
// Actions (buttons) wrapper
|
|
869
826
|
if (!params.showConfirmButton && !params.showDenyButton && !params.showCancelButton) {
|
|
870
827
|
hide(actions);
|
|
871
828
|
} else {
|
|
872
829
|
show(actions);
|
|
873
|
-
}
|
|
874
|
-
|
|
830
|
+
}
|
|
875
831
|
|
|
876
|
-
|
|
832
|
+
// Custom class
|
|
833
|
+
applyCustomClass(actions, params, 'actions');
|
|
877
834
|
|
|
878
|
-
|
|
835
|
+
// Render all the buttons
|
|
836
|
+
renderButtons(actions, loader, params);
|
|
879
837
|
|
|
838
|
+
// Loader
|
|
880
839
|
setInnerHtml(loader, params.loaderHtml);
|
|
881
840
|
applyCustomClass(loader, params, 'loader');
|
|
882
841
|
};
|
|
842
|
+
|
|
883
843
|
/**
|
|
884
844
|
* @param {HTMLElement} actions
|
|
885
845
|
* @param {HTMLElement} loader
|
|
886
846
|
* @param {SweetAlertOptions} params
|
|
887
847
|
*/
|
|
888
|
-
|
|
889
848
|
function renderButtons(actions, loader, params) {
|
|
890
849
|
const confirmButton = getConfirmButton();
|
|
891
850
|
const denyButton = getDenyButton();
|
|
892
|
-
const cancelButton = getCancelButton();
|
|
851
|
+
const cancelButton = getCancelButton();
|
|
893
852
|
|
|
853
|
+
// Render buttons
|
|
894
854
|
renderButton(confirmButton, 'confirm', params);
|
|
895
855
|
renderButton(denyButton, 'deny', params);
|
|
896
856
|
renderButton(cancelButton, 'cancel', params);
|
|
897
857
|
handleButtonsStyling(confirmButton, denyButton, cancelButton, params);
|
|
898
|
-
|
|
899
858
|
if (params.reverseButtons) {
|
|
900
859
|
if (params.toast) {
|
|
901
860
|
actions.insertBefore(cancelButton, confirmButton);
|
|
@@ -907,51 +866,46 @@
|
|
|
907
866
|
}
|
|
908
867
|
}
|
|
909
868
|
}
|
|
869
|
+
|
|
910
870
|
/**
|
|
911
871
|
* @param {HTMLElement} confirmButton
|
|
912
872
|
* @param {HTMLElement} denyButton
|
|
913
873
|
* @param {HTMLElement} cancelButton
|
|
914
874
|
* @param {SweetAlertOptions} params
|
|
915
875
|
*/
|
|
916
|
-
|
|
917
|
-
|
|
918
876
|
function handleButtonsStyling(confirmButton, denyButton, cancelButton, params) {
|
|
919
877
|
if (!params.buttonsStyling) {
|
|
920
878
|
removeClass([confirmButton, denyButton, cancelButton], swalClasses.styled);
|
|
921
879
|
return;
|
|
922
880
|
}
|
|
881
|
+
addClass([confirmButton, denyButton, cancelButton], swalClasses.styled);
|
|
923
882
|
|
|
924
|
-
|
|
925
|
-
|
|
883
|
+
// Buttons background colors
|
|
926
884
|
if (params.confirmButtonColor) {
|
|
927
885
|
confirmButton.style.backgroundColor = params.confirmButtonColor;
|
|
928
886
|
addClass(confirmButton, swalClasses['default-outline']);
|
|
929
887
|
}
|
|
930
|
-
|
|
931
888
|
if (params.denyButtonColor) {
|
|
932
889
|
denyButton.style.backgroundColor = params.denyButtonColor;
|
|
933
890
|
addClass(denyButton, swalClasses['default-outline']);
|
|
934
891
|
}
|
|
935
|
-
|
|
936
892
|
if (params.cancelButtonColor) {
|
|
937
893
|
cancelButton.style.backgroundColor = params.cancelButtonColor;
|
|
938
894
|
addClass(cancelButton, swalClasses['default-outline']);
|
|
939
895
|
}
|
|
940
896
|
}
|
|
897
|
+
|
|
941
898
|
/**
|
|
942
899
|
* @param {HTMLElement} button
|
|
943
900
|
* @param {'confirm' | 'deny' | 'cancel'} buttonType
|
|
944
901
|
* @param {SweetAlertOptions} params
|
|
945
902
|
*/
|
|
946
|
-
|
|
947
|
-
|
|
948
903
|
function renderButton(button, buttonType, params) {
|
|
949
904
|
toggle(button, params["show".concat(capitalizeFirstLetter(buttonType), "Button")], 'inline-block');
|
|
950
905
|
setInnerHtml(button, params["".concat(buttonType, "ButtonText")]); // Set caption text
|
|
951
|
-
|
|
952
906
|
button.setAttribute('aria-label', params["".concat(buttonType, "ButtonAriaLabel")]); // ARIA label
|
|
953
|
-
// Add buttons custom classes
|
|
954
907
|
|
|
908
|
+
// Add buttons custom classes
|
|
955
909
|
button.className = swalClasses[buttonType];
|
|
956
910
|
applyCustomClass(button, params, "".concat(buttonType, "Button"));
|
|
957
911
|
addClass(button, params["".concat(buttonType, "ButtonClass")]);
|
|
@@ -961,11 +915,11 @@
|
|
|
961
915
|
* @param {SweetAlert2} instance
|
|
962
916
|
* @param {SweetAlertOptions} params
|
|
963
917
|
*/
|
|
964
|
-
|
|
965
918
|
const renderCloseButton = (instance, params) => {
|
|
966
919
|
const closeButton = getCloseButton();
|
|
967
|
-
setInnerHtml(closeButton, params.closeButtonHtml);
|
|
920
|
+
setInnerHtml(closeButton, params.closeButtonHtml);
|
|
968
921
|
|
|
922
|
+
// Custom class
|
|
969
923
|
applyCustomClass(closeButton, params, 'closeButton');
|
|
970
924
|
toggle(closeButton, params.showCloseButton);
|
|
971
925
|
closeButton.setAttribute('aria-label', params.closeButtonAriaLabel);
|
|
@@ -975,25 +929,23 @@
|
|
|
975
929
|
* @param {SweetAlert2} instance
|
|
976
930
|
* @param {SweetAlertOptions} params
|
|
977
931
|
*/
|
|
978
|
-
|
|
979
932
|
const renderContainer = (instance, params) => {
|
|
980
933
|
const container = getContainer();
|
|
981
|
-
|
|
982
934
|
if (!container) {
|
|
983
935
|
return;
|
|
984
936
|
}
|
|
985
|
-
|
|
986
937
|
handleBackdropParam(container, params.backdrop);
|
|
987
938
|
handlePositionParam(container, params.position);
|
|
988
|
-
handleGrowParam(container, params.grow);
|
|
939
|
+
handleGrowParam(container, params.grow);
|
|
989
940
|
|
|
941
|
+
// Custom class
|
|
990
942
|
applyCustomClass(container, params, 'container');
|
|
991
943
|
};
|
|
944
|
+
|
|
992
945
|
/**
|
|
993
946
|
* @param {HTMLElement} container
|
|
994
947
|
* @param {SweetAlertOptions['backdrop']} backdrop
|
|
995
948
|
*/
|
|
996
|
-
|
|
997
949
|
function handleBackdropParam(container, backdrop) {
|
|
998
950
|
if (typeof backdrop === 'string') {
|
|
999
951
|
container.style.background = backdrop;
|
|
@@ -1001,12 +953,11 @@
|
|
|
1001
953
|
addClass([document.documentElement, document.body], swalClasses['no-backdrop']);
|
|
1002
954
|
}
|
|
1003
955
|
}
|
|
956
|
+
|
|
1004
957
|
/**
|
|
1005
958
|
* @param {HTMLElement} container
|
|
1006
959
|
* @param {SweetAlertOptions['position']} position
|
|
1007
960
|
*/
|
|
1008
|
-
|
|
1009
|
-
|
|
1010
961
|
function handlePositionParam(container, position) {
|
|
1011
962
|
if (position in swalClasses) {
|
|
1012
963
|
addClass(container, swalClasses[position]);
|
|
@@ -1015,16 +966,14 @@
|
|
|
1015
966
|
addClass(container, swalClasses.center);
|
|
1016
967
|
}
|
|
1017
968
|
}
|
|
969
|
+
|
|
1018
970
|
/**
|
|
1019
971
|
* @param {HTMLElement} container
|
|
1020
972
|
* @param {SweetAlertOptions['grow']} grow
|
|
1021
973
|
*/
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
974
|
function handleGrowParam(container, grow) {
|
|
1025
975
|
if (grow && typeof grow === 'string') {
|
|
1026
976
|
const growClass = "grow-".concat(grow);
|
|
1027
|
-
|
|
1028
977
|
if (growClass in swalClasses) {
|
|
1029
978
|
addClass(container, swalClasses[growClass]);
|
|
1030
979
|
}
|
|
@@ -1032,120 +981,109 @@
|
|
|
1032
981
|
}
|
|
1033
982
|
|
|
1034
983
|
/// <reference path="../../../../sweetalert2.d.ts"/>
|
|
1035
|
-
/** @type {InputClass[]} */
|
|
1036
984
|
|
|
985
|
+
/** @type {InputClass[]} */
|
|
1037
986
|
const inputClasses = ['input', 'file', 'range', 'select', 'radio', 'checkbox', 'textarea'];
|
|
987
|
+
|
|
1038
988
|
/**
|
|
1039
989
|
* @param {SweetAlert2} instance
|
|
1040
990
|
* @param {SweetAlertOptions} params
|
|
1041
991
|
*/
|
|
1042
|
-
|
|
1043
992
|
const renderInput = (instance, params) => {
|
|
1044
993
|
const popup = getPopup();
|
|
1045
994
|
const innerParams = privateProps.innerParams.get(instance);
|
|
1046
995
|
const rerender = !innerParams || params.input !== innerParams.input;
|
|
1047
996
|
inputClasses.forEach(inputClass => {
|
|
1048
|
-
const inputContainer = getDirectChildByClass(popup, swalClasses[inputClass]);
|
|
997
|
+
const inputContainer = getDirectChildByClass(popup, swalClasses[inputClass]);
|
|
1049
998
|
|
|
1050
|
-
|
|
999
|
+
// set attributes
|
|
1000
|
+
setAttributes(inputClass, params.inputAttributes);
|
|
1051
1001
|
|
|
1002
|
+
// set class
|
|
1052
1003
|
inputContainer.className = swalClasses[inputClass];
|
|
1053
|
-
|
|
1054
1004
|
if (rerender) {
|
|
1055
1005
|
hide(inputContainer);
|
|
1056
1006
|
}
|
|
1057
1007
|
});
|
|
1058
|
-
|
|
1059
1008
|
if (params.input) {
|
|
1060
1009
|
if (rerender) {
|
|
1061
1010
|
showInput(params);
|
|
1062
|
-
}
|
|
1063
|
-
|
|
1064
|
-
|
|
1011
|
+
}
|
|
1012
|
+
// set custom class
|
|
1065
1013
|
setCustomClass(params);
|
|
1066
1014
|
}
|
|
1067
1015
|
};
|
|
1016
|
+
|
|
1068
1017
|
/**
|
|
1069
1018
|
* @param {SweetAlertOptions} params
|
|
1070
1019
|
*/
|
|
1071
|
-
|
|
1072
1020
|
const showInput = params => {
|
|
1073
1021
|
if (!renderInputType[params.input]) {
|
|
1074
1022
|
error("Unexpected type of input! Expected \"text\", \"email\", \"password\", \"number\", \"tel\", \"select\", \"radio\", \"checkbox\", \"textarea\", \"file\" or \"url\", got \"".concat(params.input, "\""));
|
|
1075
1023
|
return;
|
|
1076
1024
|
}
|
|
1077
|
-
|
|
1078
1025
|
const inputContainer = getInputContainer(params.input);
|
|
1079
1026
|
const input = renderInputType[params.input](inputContainer, params);
|
|
1080
|
-
show(inputContainer);
|
|
1027
|
+
show(inputContainer);
|
|
1081
1028
|
|
|
1029
|
+
// input autofocus
|
|
1082
1030
|
setTimeout(() => {
|
|
1083
1031
|
focusInput(input);
|
|
1084
1032
|
});
|
|
1085
1033
|
};
|
|
1034
|
+
|
|
1086
1035
|
/**
|
|
1087
1036
|
* @param {HTMLInputElement} input
|
|
1088
1037
|
*/
|
|
1089
|
-
|
|
1090
|
-
|
|
1091
1038
|
const removeAttributes = input => {
|
|
1092
1039
|
for (let i = 0; i < input.attributes.length; i++) {
|
|
1093
1040
|
const attrName = input.attributes[i].name;
|
|
1094
|
-
|
|
1095
1041
|
if (!['type', 'value', 'style'].includes(attrName)) {
|
|
1096
1042
|
input.removeAttribute(attrName);
|
|
1097
1043
|
}
|
|
1098
1044
|
}
|
|
1099
1045
|
};
|
|
1046
|
+
|
|
1100
1047
|
/**
|
|
1101
1048
|
* @param {InputClass} inputClass
|
|
1102
1049
|
* @param {SweetAlertOptions['inputAttributes']} inputAttributes
|
|
1103
1050
|
*/
|
|
1104
|
-
|
|
1105
|
-
|
|
1106
1051
|
const setAttributes = (inputClass, inputAttributes) => {
|
|
1107
1052
|
const input = getInput(getPopup(), inputClass);
|
|
1108
|
-
|
|
1109
1053
|
if (!input) {
|
|
1110
1054
|
return;
|
|
1111
1055
|
}
|
|
1112
|
-
|
|
1113
1056
|
removeAttributes(input);
|
|
1114
|
-
|
|
1115
1057
|
for (const attr in inputAttributes) {
|
|
1116
1058
|
input.setAttribute(attr, inputAttributes[attr]);
|
|
1117
1059
|
}
|
|
1118
1060
|
};
|
|
1061
|
+
|
|
1119
1062
|
/**
|
|
1120
1063
|
* @param {SweetAlertOptions} params
|
|
1121
1064
|
*/
|
|
1122
|
-
|
|
1123
|
-
|
|
1124
1065
|
const setCustomClass = params => {
|
|
1125
1066
|
const inputContainer = getInputContainer(params.input);
|
|
1126
|
-
|
|
1127
1067
|
if (typeof params.customClass === 'object') {
|
|
1128
1068
|
addClass(inputContainer, params.customClass.input);
|
|
1129
1069
|
}
|
|
1130
1070
|
};
|
|
1071
|
+
|
|
1131
1072
|
/**
|
|
1132
1073
|
* @param {HTMLInputElement | HTMLTextAreaElement} input
|
|
1133
1074
|
* @param {SweetAlertOptions} params
|
|
1134
1075
|
*/
|
|
1135
|
-
|
|
1136
|
-
|
|
1137
1076
|
const setInputPlaceholder = (input, params) => {
|
|
1138
1077
|
if (!input.placeholder || params.inputPlaceholder) {
|
|
1139
1078
|
input.placeholder = params.inputPlaceholder;
|
|
1140
1079
|
}
|
|
1141
1080
|
};
|
|
1081
|
+
|
|
1142
1082
|
/**
|
|
1143
1083
|
* @param {Input} input
|
|
1144
1084
|
* @param {Input} prependTo
|
|
1145
1085
|
* @param {SweetAlertOptions} params
|
|
1146
1086
|
*/
|
|
1147
|
-
|
|
1148
|
-
|
|
1149
1087
|
const setInputLabel = (input, prependTo, params) => {
|
|
1150
1088
|
if (params.inputLabel) {
|
|
1151
1089
|
input.id = swalClasses.input;
|
|
@@ -1153,30 +1091,26 @@
|
|
|
1153
1091
|
const labelClass = swalClasses['input-label'];
|
|
1154
1092
|
label.setAttribute('for', input.id);
|
|
1155
1093
|
label.className = labelClass;
|
|
1156
|
-
|
|
1157
1094
|
if (typeof params.customClass === 'object') {
|
|
1158
1095
|
addClass(label, params.customClass.inputLabel);
|
|
1159
1096
|
}
|
|
1160
|
-
|
|
1161
1097
|
label.innerText = params.inputLabel;
|
|
1162
1098
|
prependTo.insertAdjacentElement('beforebegin', label);
|
|
1163
1099
|
}
|
|
1164
1100
|
};
|
|
1101
|
+
|
|
1165
1102
|
/**
|
|
1166
1103
|
* @param {SweetAlertOptions['input']} inputType
|
|
1167
1104
|
* @returns {HTMLElement}
|
|
1168
1105
|
*/
|
|
1169
|
-
|
|
1170
|
-
|
|
1171
1106
|
const getInputContainer = inputType => {
|
|
1172
1107
|
return getDirectChildByClass(getPopup(), swalClasses[inputType] || swalClasses.input);
|
|
1173
1108
|
};
|
|
1109
|
+
|
|
1174
1110
|
/**
|
|
1175
1111
|
* @param {HTMLInputElement | HTMLOutputElement | HTMLTextAreaElement} input
|
|
1176
1112
|
* @param {SweetAlertOptions['inputValue']} inputValue
|
|
1177
1113
|
*/
|
|
1178
|
-
|
|
1179
|
-
|
|
1180
1114
|
const checkAndSetInputValue = (input, inputValue) => {
|
|
1181
1115
|
if (['string', 'number'].includes(typeof inputValue)) {
|
|
1182
1116
|
input.value = "".concat(inputValue);
|
|
@@ -1184,16 +1118,15 @@
|
|
|
1184
1118
|
warn("Unexpected type of inputValue! Expected \"string\", \"number\" or \"Promise\", got \"".concat(typeof inputValue, "\""));
|
|
1185
1119
|
}
|
|
1186
1120
|
};
|
|
1187
|
-
/** @type {Record<string, (input: Input | HTMLElement, params: SweetAlertOptions) => Input>} */
|
|
1188
|
-
|
|
1189
1121
|
|
|
1122
|
+
/** @type {Record<string, (input: Input | HTMLElement, params: SweetAlertOptions) => Input>} */
|
|
1190
1123
|
const renderInputType = {};
|
|
1124
|
+
|
|
1191
1125
|
/**
|
|
1192
1126
|
* @param {HTMLInputElement} input
|
|
1193
1127
|
* @param {SweetAlertOptions} params
|
|
1194
1128
|
* @returns {HTMLInputElement}
|
|
1195
1129
|
*/
|
|
1196
|
-
|
|
1197
1130
|
renderInputType.text = renderInputType.email = renderInputType.password = renderInputType.number = renderInputType.tel = renderInputType.url = (input, params) => {
|
|
1198
1131
|
checkAndSetInputValue(input, params.inputValue);
|
|
1199
1132
|
setInputLabel(input, input, params);
|
|
@@ -1201,25 +1134,23 @@
|
|
|
1201
1134
|
input.type = params.input;
|
|
1202
1135
|
return input;
|
|
1203
1136
|
};
|
|
1137
|
+
|
|
1204
1138
|
/**
|
|
1205
1139
|
* @param {HTMLInputElement} input
|
|
1206
1140
|
* @param {SweetAlertOptions} params
|
|
1207
1141
|
* @returns {HTMLInputElement}
|
|
1208
1142
|
*/
|
|
1209
|
-
|
|
1210
|
-
|
|
1211
1143
|
renderInputType.file = (input, params) => {
|
|
1212
1144
|
setInputLabel(input, input, params);
|
|
1213
1145
|
setInputPlaceholder(input, params);
|
|
1214
1146
|
return input;
|
|
1215
1147
|
};
|
|
1148
|
+
|
|
1216
1149
|
/**
|
|
1217
1150
|
* @param {HTMLInputElement} range
|
|
1218
1151
|
* @param {SweetAlertOptions} params
|
|
1219
1152
|
* @returns {HTMLInputElement}
|
|
1220
1153
|
*/
|
|
1221
|
-
|
|
1222
|
-
|
|
1223
1154
|
renderInputType.range = (range, params) => {
|
|
1224
1155
|
const rangeInput = range.querySelector('input');
|
|
1225
1156
|
const rangeOutput = range.querySelector('output');
|
|
@@ -1229,16 +1160,14 @@
|
|
|
1229
1160
|
setInputLabel(rangeInput, range, params);
|
|
1230
1161
|
return range;
|
|
1231
1162
|
};
|
|
1163
|
+
|
|
1232
1164
|
/**
|
|
1233
1165
|
* @param {HTMLSelectElement} select
|
|
1234
1166
|
* @param {SweetAlertOptions} params
|
|
1235
1167
|
* @returns {HTMLSelectElement}
|
|
1236
1168
|
*/
|
|
1237
|
-
|
|
1238
|
-
|
|
1239
1169
|
renderInputType.select = (select, params) => {
|
|
1240
1170
|
select.textContent = '';
|
|
1241
|
-
|
|
1242
1171
|
if (params.inputPlaceholder) {
|
|
1243
1172
|
const placeholder = document.createElement('option');
|
|
1244
1173
|
setInnerHtml(placeholder, params.inputPlaceholder);
|
|
@@ -1247,27 +1176,24 @@
|
|
|
1247
1176
|
placeholder.selected = true;
|
|
1248
1177
|
select.appendChild(placeholder);
|
|
1249
1178
|
}
|
|
1250
|
-
|
|
1251
1179
|
setInputLabel(select, select, params);
|
|
1252
1180
|
return select;
|
|
1253
1181
|
};
|
|
1182
|
+
|
|
1254
1183
|
/**
|
|
1255
1184
|
* @param {HTMLInputElement} radio
|
|
1256
1185
|
* @returns {HTMLInputElement}
|
|
1257
1186
|
*/
|
|
1258
|
-
|
|
1259
|
-
|
|
1260
1187
|
renderInputType.radio = radio => {
|
|
1261
1188
|
radio.textContent = '';
|
|
1262
1189
|
return radio;
|
|
1263
1190
|
};
|
|
1191
|
+
|
|
1264
1192
|
/**
|
|
1265
1193
|
* @param {HTMLLabelElement} checkboxContainer
|
|
1266
1194
|
* @param {SweetAlertOptions} params
|
|
1267
1195
|
* @returns {HTMLInputElement}
|
|
1268
1196
|
*/
|
|
1269
|
-
|
|
1270
|
-
|
|
1271
1197
|
renderInputType.checkbox = (checkboxContainer, params) => {
|
|
1272
1198
|
const checkbox = getInput(getPopup(), 'checkbox');
|
|
1273
1199
|
checkbox.value = '1';
|
|
@@ -1277,40 +1203,36 @@
|
|
|
1277
1203
|
setInnerHtml(label, params.inputPlaceholder);
|
|
1278
1204
|
return checkbox;
|
|
1279
1205
|
};
|
|
1206
|
+
|
|
1280
1207
|
/**
|
|
1281
1208
|
* @param {HTMLTextAreaElement} textarea
|
|
1282
1209
|
* @param {SweetAlertOptions} params
|
|
1283
1210
|
* @returns {HTMLTextAreaElement}
|
|
1284
1211
|
*/
|
|
1285
|
-
|
|
1286
|
-
|
|
1287
1212
|
renderInputType.textarea = (textarea, params) => {
|
|
1288
1213
|
checkAndSetInputValue(textarea, params.inputValue);
|
|
1289
1214
|
setInputPlaceholder(textarea, params);
|
|
1290
1215
|
setInputLabel(textarea, textarea, params);
|
|
1216
|
+
|
|
1291
1217
|
/**
|
|
1292
1218
|
* @param {HTMLElement} el
|
|
1293
1219
|
* @returns {number}
|
|
1294
1220
|
*/
|
|
1221
|
+
const getMargin = el => parseInt(window.getComputedStyle(el).marginLeft) + parseInt(window.getComputedStyle(el).marginRight);
|
|
1295
1222
|
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1223
|
+
// https://github.com/sweetalert2/sweetalert2/issues/2291
|
|
1299
1224
|
setTimeout(() => {
|
|
1300
1225
|
// https://github.com/sweetalert2/sweetalert2/issues/1699
|
|
1301
1226
|
if ('MutationObserver' in window) {
|
|
1302
1227
|
const initialPopupWidth = parseInt(window.getComputedStyle(getPopup()).width);
|
|
1303
|
-
|
|
1304
1228
|
const textareaResizeHandler = () => {
|
|
1305
1229
|
const textareaWidth = textarea.offsetWidth + getMargin(textarea);
|
|
1306
|
-
|
|
1307
1230
|
if (textareaWidth > initialPopupWidth) {
|
|
1308
1231
|
getPopup().style.width = "".concat(textareaWidth, "px");
|
|
1309
1232
|
} else {
|
|
1310
1233
|
getPopup().style.width = null;
|
|
1311
1234
|
}
|
|
1312
1235
|
};
|
|
1313
|
-
|
|
1314
1236
|
new MutationObserver(textareaResizeHandler).observe(textarea, {
|
|
1315
1237
|
attributes: true,
|
|
1316
1238
|
attributeFilter: ['style']
|
|
@@ -1324,23 +1246,26 @@
|
|
|
1324
1246
|
* @param {SweetAlert2} instance
|
|
1325
1247
|
* @param {SweetAlertOptions} params
|
|
1326
1248
|
*/
|
|
1327
|
-
|
|
1328
1249
|
const renderContent = (instance, params) => {
|
|
1329
1250
|
const htmlContainer = getHtmlContainer();
|
|
1330
|
-
applyCustomClass(htmlContainer, params, 'htmlContainer');
|
|
1251
|
+
applyCustomClass(htmlContainer, params, 'htmlContainer');
|
|
1331
1252
|
|
|
1253
|
+
// Content as HTML
|
|
1332
1254
|
if (params.html) {
|
|
1333
1255
|
parseHtmlToContainer(params.html, htmlContainer);
|
|
1334
1256
|
show(htmlContainer, 'block');
|
|
1335
|
-
}
|
|
1257
|
+
}
|
|
1258
|
+
|
|
1259
|
+
// Content as plain text
|
|
1336
1260
|
else if (params.text) {
|
|
1337
1261
|
htmlContainer.textContent = params.text;
|
|
1338
1262
|
show(htmlContainer, 'block');
|
|
1339
|
-
}
|
|
1263
|
+
}
|
|
1264
|
+
|
|
1265
|
+
// No content
|
|
1340
1266
|
else {
|
|
1341
1267
|
hide(htmlContainer);
|
|
1342
1268
|
}
|
|
1343
|
-
|
|
1344
1269
|
renderInput(instance, params);
|
|
1345
1270
|
};
|
|
1346
1271
|
|
|
@@ -1348,16 +1273,14 @@
|
|
|
1348
1273
|
* @param {SweetAlert2} instance
|
|
1349
1274
|
* @param {SweetAlertOptions} params
|
|
1350
1275
|
*/
|
|
1351
|
-
|
|
1352
1276
|
const renderFooter = (instance, params) => {
|
|
1353
1277
|
const footer = getFooter();
|
|
1354
1278
|
toggle(footer, params.footer);
|
|
1355
|
-
|
|
1356
1279
|
if (params.footer) {
|
|
1357
1280
|
parseHtmlToContainer(params.footer, footer);
|
|
1358
|
-
}
|
|
1359
|
-
|
|
1281
|
+
}
|
|
1360
1282
|
|
|
1283
|
+
// Custom class
|
|
1361
1284
|
applyCustomClass(footer, params, 'footer');
|
|
1362
1285
|
};
|
|
1363
1286
|
|
|
@@ -1365,81 +1288,78 @@
|
|
|
1365
1288
|
* @param {SweetAlert2} instance
|
|
1366
1289
|
* @param {SweetAlertOptions} params
|
|
1367
1290
|
*/
|
|
1368
|
-
|
|
1369
1291
|
const renderIcon = (instance, params) => {
|
|
1370
1292
|
const innerParams = privateProps.innerParams.get(instance);
|
|
1371
|
-
const icon = getIcon();
|
|
1293
|
+
const icon = getIcon();
|
|
1372
1294
|
|
|
1295
|
+
// if the given icon already rendered, apply the styling without re-rendering the icon
|
|
1373
1296
|
if (innerParams && params.icon === innerParams.icon) {
|
|
1374
1297
|
// Custom or default content
|
|
1375
1298
|
setContent(icon, params);
|
|
1376
1299
|
applyStyles(icon, params);
|
|
1377
1300
|
return;
|
|
1378
1301
|
}
|
|
1379
|
-
|
|
1380
1302
|
if (!params.icon && !params.iconHtml) {
|
|
1381
1303
|
hide(icon);
|
|
1382
1304
|
return;
|
|
1383
1305
|
}
|
|
1384
|
-
|
|
1385
1306
|
if (params.icon && Object.keys(iconTypes).indexOf(params.icon) === -1) {
|
|
1386
1307
|
error("Unknown icon! Expected \"success\", \"error\", \"warning\", \"info\" or \"question\", got \"".concat(params.icon, "\""));
|
|
1387
1308
|
hide(icon);
|
|
1388
1309
|
return;
|
|
1389
1310
|
}
|
|
1311
|
+
show(icon);
|
|
1390
1312
|
|
|
1391
|
-
|
|
1392
|
-
|
|
1313
|
+
// Custom or default content
|
|
1393
1314
|
setContent(icon, params);
|
|
1394
|
-
applyStyles(icon, params);
|
|
1315
|
+
applyStyles(icon, params);
|
|
1395
1316
|
|
|
1317
|
+
// Animate icon
|
|
1396
1318
|
addClass(icon, params.showClass.icon);
|
|
1397
1319
|
};
|
|
1320
|
+
|
|
1398
1321
|
/**
|
|
1399
1322
|
* @param {HTMLElement} icon
|
|
1400
1323
|
* @param {SweetAlertOptions} params
|
|
1401
1324
|
*/
|
|
1402
|
-
|
|
1403
1325
|
const applyStyles = (icon, params) => {
|
|
1404
1326
|
for (const iconType in iconTypes) {
|
|
1405
1327
|
if (params.icon !== iconType) {
|
|
1406
1328
|
removeClass(icon, iconTypes[iconType]);
|
|
1407
1329
|
}
|
|
1408
1330
|
}
|
|
1331
|
+
addClass(icon, iconTypes[params.icon]);
|
|
1409
1332
|
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
setColor(icon, params); // Success icon background color
|
|
1333
|
+
// Icon color
|
|
1334
|
+
setColor(icon, params);
|
|
1413
1335
|
|
|
1414
|
-
|
|
1336
|
+
// Success icon background color
|
|
1337
|
+
adjustSuccessIconBackgroundColor();
|
|
1415
1338
|
|
|
1339
|
+
// Custom class
|
|
1416
1340
|
applyCustomClass(icon, params, 'icon');
|
|
1417
|
-
};
|
|
1418
|
-
|
|
1341
|
+
};
|
|
1419
1342
|
|
|
1343
|
+
// Adjust success icon background color to match the popup background color
|
|
1420
1344
|
const adjustSuccessIconBackgroundColor = () => {
|
|
1421
1345
|
const popup = getPopup();
|
|
1422
1346
|
const popupBackgroundColor = window.getComputedStyle(popup).getPropertyValue('background-color');
|
|
1423
1347
|
/** @type {NodeListOf<HTMLElement>} */
|
|
1424
|
-
|
|
1425
1348
|
const successIconParts = popup.querySelectorAll('[class^=swal2-success-circular-line], .swal2-success-fix');
|
|
1426
|
-
|
|
1427
1349
|
for (let i = 0; i < successIconParts.length; i++) {
|
|
1428
1350
|
successIconParts[i].style.backgroundColor = popupBackgroundColor;
|
|
1429
1351
|
}
|
|
1430
1352
|
};
|
|
1431
|
-
|
|
1432
1353
|
const successIconHtml = "\n <div class=\"swal2-success-circular-line-left\"></div>\n <span class=\"swal2-success-line-tip\"></span> <span class=\"swal2-success-line-long\"></span>\n <div class=\"swal2-success-ring\"></div> <div class=\"swal2-success-fix\"></div>\n <div class=\"swal2-success-circular-line-right\"></div>\n";
|
|
1433
1354
|
const errorIconHtml = "\n <span class=\"swal2-x-mark\">\n <span class=\"swal2-x-mark-line-left\"></span>\n <span class=\"swal2-x-mark-line-right\"></span>\n </span>\n";
|
|
1355
|
+
|
|
1434
1356
|
/**
|
|
1435
1357
|
* @param {HTMLElement} icon
|
|
1436
1358
|
* @param {SweetAlertOptions} params
|
|
1437
1359
|
*/
|
|
1438
|
-
|
|
1439
1360
|
const setContent = (icon, params) => {
|
|
1440
1361
|
let oldContent = icon.innerHTML;
|
|
1441
1362
|
let newContent;
|
|
1442
|
-
|
|
1443
1363
|
if (params.iconHtml) {
|
|
1444
1364
|
newContent = iconContent(params.iconHtml);
|
|
1445
1365
|
} else if (params.icon === 'success') {
|
|
@@ -1455,60 +1375,54 @@
|
|
|
1455
1375
|
};
|
|
1456
1376
|
newContent = iconContent(defaultIconHtml[params.icon]);
|
|
1457
1377
|
}
|
|
1458
|
-
|
|
1459
1378
|
if (oldContent.trim() !== newContent.trim()) {
|
|
1460
1379
|
setInnerHtml(icon, newContent);
|
|
1461
1380
|
}
|
|
1462
1381
|
};
|
|
1382
|
+
|
|
1463
1383
|
/**
|
|
1464
1384
|
* @param {HTMLElement} icon
|
|
1465
1385
|
* @param {SweetAlertOptions} params
|
|
1466
1386
|
*/
|
|
1467
|
-
|
|
1468
|
-
|
|
1469
1387
|
const setColor = (icon, params) => {
|
|
1470
1388
|
if (!params.iconColor) {
|
|
1471
1389
|
return;
|
|
1472
1390
|
}
|
|
1473
|
-
|
|
1474
1391
|
icon.style.color = params.iconColor;
|
|
1475
1392
|
icon.style.borderColor = params.iconColor;
|
|
1476
|
-
|
|
1477
1393
|
for (const sel of ['.swal2-success-line-tip', '.swal2-success-line-long', '.swal2-x-mark-line-left', '.swal2-x-mark-line-right']) {
|
|
1478
1394
|
setStyle(icon, sel, 'backgroundColor', params.iconColor);
|
|
1479
1395
|
}
|
|
1480
|
-
|
|
1481
1396
|
setStyle(icon, '.swal2-success-ring', 'borderColor', params.iconColor);
|
|
1482
1397
|
};
|
|
1398
|
+
|
|
1483
1399
|
/**
|
|
1484
1400
|
* @param {string} content
|
|
1485
1401
|
* @returns {string}
|
|
1486
1402
|
*/
|
|
1487
|
-
|
|
1488
|
-
|
|
1489
1403
|
const iconContent = content => "<div class=\"".concat(swalClasses['icon-content'], "\">").concat(content, "</div>");
|
|
1490
1404
|
|
|
1491
1405
|
/**
|
|
1492
1406
|
* @param {SweetAlert2} instance
|
|
1493
1407
|
* @param {SweetAlertOptions} params
|
|
1494
1408
|
*/
|
|
1495
|
-
|
|
1496
1409
|
const renderImage = (instance, params) => {
|
|
1497
1410
|
const image = getImage();
|
|
1498
|
-
|
|
1499
1411
|
if (!params.imageUrl) {
|
|
1500
1412
|
hide(image);
|
|
1501
1413
|
return;
|
|
1502
1414
|
}
|
|
1415
|
+
show(image, '');
|
|
1503
1416
|
|
|
1504
|
-
|
|
1505
|
-
|
|
1417
|
+
// Src, alt
|
|
1506
1418
|
image.setAttribute('src', params.imageUrl);
|
|
1507
|
-
image.setAttribute('alt', params.imageAlt);
|
|
1419
|
+
image.setAttribute('alt', params.imageAlt);
|
|
1508
1420
|
|
|
1421
|
+
// Width, height
|
|
1509
1422
|
applyNumericalStyle(image, 'width', params.imageWidth);
|
|
1510
|
-
applyNumericalStyle(image, 'height', params.imageHeight);
|
|
1423
|
+
applyNumericalStyle(image, 'height', params.imageHeight);
|
|
1511
1424
|
|
|
1425
|
+
// Class
|
|
1512
1426
|
image.className = swalClasses.image;
|
|
1513
1427
|
applyCustomClass(image, params, 'image');
|
|
1514
1428
|
};
|
|
@@ -1517,60 +1431,59 @@
|
|
|
1517
1431
|
* @param {SweetAlert2} instance
|
|
1518
1432
|
* @param {SweetAlertOptions} params
|
|
1519
1433
|
*/
|
|
1520
|
-
|
|
1521
1434
|
const renderPopup = (instance, params) => {
|
|
1522
1435
|
const container = getContainer();
|
|
1523
|
-
const popup = getPopup();
|
|
1524
|
-
// https://github.com/sweetalert2/sweetalert2/issues/2170
|
|
1436
|
+
const popup = getPopup();
|
|
1525
1437
|
|
|
1438
|
+
// Width
|
|
1439
|
+
// https://github.com/sweetalert2/sweetalert2/issues/2170
|
|
1526
1440
|
if (params.toast) {
|
|
1527
1441
|
applyNumericalStyle(container, 'width', params.width);
|
|
1528
1442
|
popup.style.width = '100%';
|
|
1529
1443
|
popup.insertBefore(getLoader(), getIcon());
|
|
1530
1444
|
} else {
|
|
1531
1445
|
applyNumericalStyle(popup, 'width', params.width);
|
|
1532
|
-
}
|
|
1533
|
-
|
|
1446
|
+
}
|
|
1534
1447
|
|
|
1535
|
-
|
|
1448
|
+
// Padding
|
|
1449
|
+
applyNumericalStyle(popup, 'padding', params.padding);
|
|
1536
1450
|
|
|
1451
|
+
// Color
|
|
1537
1452
|
if (params.color) {
|
|
1538
1453
|
popup.style.color = params.color;
|
|
1539
|
-
}
|
|
1540
|
-
|
|
1454
|
+
}
|
|
1541
1455
|
|
|
1456
|
+
// Background
|
|
1542
1457
|
if (params.background) {
|
|
1543
1458
|
popup.style.background = params.background;
|
|
1544
1459
|
}
|
|
1460
|
+
hide(getValidationMessage());
|
|
1545
1461
|
|
|
1546
|
-
|
|
1547
|
-
|
|
1462
|
+
// Classes
|
|
1548
1463
|
addClasses(popup, params);
|
|
1549
1464
|
};
|
|
1465
|
+
|
|
1550
1466
|
/**
|
|
1551
1467
|
* @param {HTMLElement} popup
|
|
1552
1468
|
* @param {SweetAlertOptions} params
|
|
1553
1469
|
*/
|
|
1554
|
-
|
|
1555
1470
|
const addClasses = (popup, params) => {
|
|
1556
1471
|
// Default Class + showClass when updating Swal.update({})
|
|
1557
1472
|
popup.className = "".concat(swalClasses.popup, " ").concat(isVisible(popup) ? params.showClass.popup : '');
|
|
1558
|
-
|
|
1559
1473
|
if (params.toast) {
|
|
1560
1474
|
addClass([document.documentElement, document.body], swalClasses['toast-shown']);
|
|
1561
1475
|
addClass(popup, swalClasses.toast);
|
|
1562
1476
|
} else {
|
|
1563
1477
|
addClass(popup, swalClasses.modal);
|
|
1564
|
-
}
|
|
1565
|
-
|
|
1478
|
+
}
|
|
1566
1479
|
|
|
1480
|
+
// Custom class
|
|
1567
1481
|
applyCustomClass(popup, params, 'popup');
|
|
1568
|
-
|
|
1569
1482
|
if (typeof params.customClass === 'string') {
|
|
1570
1483
|
addClass(popup, params.customClass);
|
|
1571
|
-
}
|
|
1572
|
-
|
|
1484
|
+
}
|
|
1573
1485
|
|
|
1486
|
+
// Icon class (#1842)
|
|
1574
1487
|
if (params.icon) {
|
|
1575
1488
|
addClass(popup, swalClasses["icon-".concat(params.icon)]);
|
|
1576
1489
|
}
|
|
@@ -1580,61 +1493,51 @@
|
|
|
1580
1493
|
* @param {SweetAlert2} instance
|
|
1581
1494
|
* @param {SweetAlertOptions} params
|
|
1582
1495
|
*/
|
|
1583
|
-
|
|
1584
1496
|
const renderProgressSteps = (instance, params) => {
|
|
1585
1497
|
const progressStepsContainer = getProgressSteps();
|
|
1586
|
-
|
|
1587
1498
|
if (!params.progressSteps || params.progressSteps.length === 0) {
|
|
1588
1499
|
hide(progressStepsContainer);
|
|
1589
1500
|
return;
|
|
1590
1501
|
}
|
|
1591
|
-
|
|
1592
1502
|
show(progressStepsContainer);
|
|
1593
1503
|
progressStepsContainer.textContent = '';
|
|
1594
|
-
|
|
1595
1504
|
if (params.currentProgressStep >= params.progressSteps.length) {
|
|
1596
1505
|
warn('Invalid currentProgressStep parameter, it should be less than progressSteps.length ' + '(currentProgressStep like JS arrays starts from 0)');
|
|
1597
1506
|
}
|
|
1598
|
-
|
|
1599
1507
|
params.progressSteps.forEach((step, index) => {
|
|
1600
1508
|
const stepEl = createStepElement(step);
|
|
1601
1509
|
progressStepsContainer.appendChild(stepEl);
|
|
1602
|
-
|
|
1603
1510
|
if (index === params.currentProgressStep) {
|
|
1604
1511
|
addClass(stepEl, swalClasses['active-progress-step']);
|
|
1605
1512
|
}
|
|
1606
|
-
|
|
1607
1513
|
if (index !== params.progressSteps.length - 1) {
|
|
1608
1514
|
const lineEl = createLineElement(params);
|
|
1609
1515
|
progressStepsContainer.appendChild(lineEl);
|
|
1610
1516
|
}
|
|
1611
1517
|
});
|
|
1612
1518
|
};
|
|
1519
|
+
|
|
1613
1520
|
/**
|
|
1614
1521
|
* @param {string} step
|
|
1615
1522
|
* @returns {HTMLLIElement}
|
|
1616
1523
|
*/
|
|
1617
|
-
|
|
1618
1524
|
const createStepElement = step => {
|
|
1619
1525
|
const stepEl = document.createElement('li');
|
|
1620
1526
|
addClass(stepEl, swalClasses['progress-step']);
|
|
1621
1527
|
setInnerHtml(stepEl, step);
|
|
1622
1528
|
return stepEl;
|
|
1623
1529
|
};
|
|
1530
|
+
|
|
1624
1531
|
/**
|
|
1625
1532
|
* @param {SweetAlertOptions} params
|
|
1626
1533
|
* @returns {HTMLLIElement}
|
|
1627
1534
|
*/
|
|
1628
|
-
|
|
1629
|
-
|
|
1630
1535
|
const createLineElement = params => {
|
|
1631
1536
|
const lineEl = document.createElement('li');
|
|
1632
1537
|
addClass(lineEl, swalClasses['progress-step-line']);
|
|
1633
|
-
|
|
1634
1538
|
if (params.progressStepsDistance) {
|
|
1635
1539
|
applyNumericalStyle(lineEl, 'width', params.progressStepsDistance);
|
|
1636
1540
|
}
|
|
1637
|
-
|
|
1638
1541
|
return lineEl;
|
|
1639
1542
|
};
|
|
1640
1543
|
|
|
@@ -1642,20 +1545,17 @@
|
|
|
1642
1545
|
* @param {SweetAlert2} instance
|
|
1643
1546
|
* @param {SweetAlertOptions} params
|
|
1644
1547
|
*/
|
|
1645
|
-
|
|
1646
1548
|
const renderTitle = (instance, params) => {
|
|
1647
1549
|
const title = getTitle();
|
|
1648
1550
|
toggle(title, params.title || params.titleText, 'block');
|
|
1649
|
-
|
|
1650
1551
|
if (params.title) {
|
|
1651
1552
|
parseHtmlToContainer(params.title, title);
|
|
1652
1553
|
}
|
|
1653
|
-
|
|
1654
1554
|
if (params.titleText) {
|
|
1655
1555
|
title.innerText = params.titleText;
|
|
1656
|
-
}
|
|
1657
|
-
|
|
1556
|
+
}
|
|
1658
1557
|
|
|
1558
|
+
// Custom class
|
|
1659
1559
|
applyCustomClass(title, params, 'title');
|
|
1660
1560
|
};
|
|
1661
1561
|
|
|
@@ -1663,7 +1563,6 @@
|
|
|
1663
1563
|
* @param {SweetAlert2} instance
|
|
1664
1564
|
* @param {SweetAlertOptions} params
|
|
1665
1565
|
*/
|
|
1666
|
-
|
|
1667
1566
|
const render = (instance, params) => {
|
|
1668
1567
|
renderPopup(instance, params);
|
|
1669
1568
|
renderContainer(instance, params);
|
|
@@ -1675,7 +1574,6 @@
|
|
|
1675
1574
|
renderContent(instance, params);
|
|
1676
1575
|
renderActions(instance, params);
|
|
1677
1576
|
renderFooter(instance, params);
|
|
1678
|
-
|
|
1679
1577
|
if (typeof params.didRender === 'function') {
|
|
1680
1578
|
params.didRender(getPopup());
|
|
1681
1579
|
}
|
|
@@ -1684,18 +1582,14 @@
|
|
|
1684
1582
|
/**
|
|
1685
1583
|
* Hides loader and shows back the button which was hidden by .showLoading()
|
|
1686
1584
|
*/
|
|
1687
|
-
|
|
1688
1585
|
function hideLoading() {
|
|
1689
1586
|
// do nothing if popup is closed
|
|
1690
1587
|
const innerParams = privateProps.innerParams.get(this);
|
|
1691
|
-
|
|
1692
1588
|
if (!innerParams) {
|
|
1693
1589
|
return;
|
|
1694
1590
|
}
|
|
1695
|
-
|
|
1696
1591
|
const domCache = privateProps.domCache.get(this);
|
|
1697
1592
|
hide(domCache.loader);
|
|
1698
|
-
|
|
1699
1593
|
if (isToast()) {
|
|
1700
1594
|
if (innerParams.icon) {
|
|
1701
1595
|
show(getIcon());
|
|
@@ -1703,7 +1597,6 @@
|
|
|
1703
1597
|
} else {
|
|
1704
1598
|
showRelatedButton(domCache);
|
|
1705
1599
|
}
|
|
1706
|
-
|
|
1707
1600
|
removeClass([domCache.popup, domCache.actions], swalClasses.loading);
|
|
1708
1601
|
domCache.popup.removeAttribute('aria-busy');
|
|
1709
1602
|
domCache.popup.removeAttribute('data-loading');
|
|
@@ -1711,10 +1604,8 @@
|
|
|
1711
1604
|
domCache.denyButton.disabled = false;
|
|
1712
1605
|
domCache.cancelButton.disabled = false;
|
|
1713
1606
|
}
|
|
1714
|
-
|
|
1715
1607
|
const showRelatedButton = domCache => {
|
|
1716
1608
|
const buttonToReplace = domCache.popup.getElementsByClassName(domCache.loader.getAttribute('data-button-to-replace'));
|
|
1717
|
-
|
|
1718
1609
|
if (buttonToReplace.length) {
|
|
1719
1610
|
show(buttonToReplace[0], 'inline-block');
|
|
1720
1611
|
} else if (allButtonsAreHidden()) {
|
|
@@ -1726,39 +1617,35 @@
|
|
|
1726
1617
|
* Gets the input DOM node, this method works with input parameter.
|
|
1727
1618
|
* @returns {HTMLElement | null}
|
|
1728
1619
|
*/
|
|
1729
|
-
|
|
1730
1620
|
function getInput$1(instance) {
|
|
1731
1621
|
const innerParams = privateProps.innerParams.get(instance || this);
|
|
1732
1622
|
const domCache = privateProps.domCache.get(instance || this);
|
|
1733
|
-
|
|
1734
1623
|
if (!domCache) {
|
|
1735
1624
|
return null;
|
|
1736
1625
|
}
|
|
1737
|
-
|
|
1738
1626
|
return getInput(domCache.popup, innerParams.input);
|
|
1739
1627
|
}
|
|
1740
1628
|
|
|
1741
1629
|
/*
|
|
1742
1630
|
* Global function to determine if SweetAlert2 popup is shown
|
|
1743
1631
|
*/
|
|
1744
|
-
|
|
1745
1632
|
const isVisible$1 = () => {
|
|
1746
1633
|
return isVisible(getPopup());
|
|
1747
1634
|
};
|
|
1635
|
+
|
|
1748
1636
|
/*
|
|
1749
1637
|
* Global function to click 'Confirm' button
|
|
1750
1638
|
*/
|
|
1751
|
-
|
|
1752
1639
|
const clickConfirm = () => getConfirmButton() && getConfirmButton().click();
|
|
1640
|
+
|
|
1753
1641
|
/*
|
|
1754
1642
|
* Global function to click 'Deny' button
|
|
1755
1643
|
*/
|
|
1756
|
-
|
|
1757
1644
|
const clickDeny = () => getDenyButton() && getDenyButton().click();
|
|
1645
|
+
|
|
1758
1646
|
/*
|
|
1759
1647
|
* Global function to click 'Cancel' button
|
|
1760
1648
|
*/
|
|
1761
|
-
|
|
1762
1649
|
const clickCancel = () => getCancelButton() && getCancelButton().click();
|
|
1763
1650
|
|
|
1764
1651
|
const DismissReason = Object.freeze({
|
|
@@ -1772,7 +1659,6 @@
|
|
|
1772
1659
|
/**
|
|
1773
1660
|
* @param {GlobalState} globalState
|
|
1774
1661
|
*/
|
|
1775
|
-
|
|
1776
1662
|
const removeKeydownHandler = globalState => {
|
|
1777
1663
|
if (globalState.keydownTarget && globalState.keydownHandlerAdded) {
|
|
1778
1664
|
globalState.keydownTarget.removeEventListener('keydown', globalState.keydownHandler, {
|
|
@@ -1781,19 +1667,17 @@
|
|
|
1781
1667
|
globalState.keydownHandlerAdded = false;
|
|
1782
1668
|
}
|
|
1783
1669
|
};
|
|
1670
|
+
|
|
1784
1671
|
/**
|
|
1785
1672
|
* @param {SweetAlert2} instance
|
|
1786
1673
|
* @param {GlobalState} globalState
|
|
1787
1674
|
* @param {SweetAlertOptions} innerParams
|
|
1788
1675
|
* @param {*} dismissWith
|
|
1789
1676
|
*/
|
|
1790
|
-
|
|
1791
1677
|
const addKeydownHandler = (instance, globalState, innerParams, dismissWith) => {
|
|
1792
1678
|
removeKeydownHandler(globalState);
|
|
1793
|
-
|
|
1794
1679
|
if (!innerParams.toast) {
|
|
1795
1680
|
globalState.keydownHandler = e => keydownHandler(instance, e, dismissWith);
|
|
1796
|
-
|
|
1797
1681
|
globalState.keydownTarget = innerParams.keydownListenerCapture ? window : getPopup();
|
|
1798
1682
|
globalState.keydownListenerCapture = innerParams.keydownListenerCapture;
|
|
1799
1683
|
globalState.keydownTarget.addEventListener('keydown', globalState.keydownHandler, {
|
|
@@ -1802,84 +1686,87 @@
|
|
|
1802
1686
|
globalState.keydownHandlerAdded = true;
|
|
1803
1687
|
}
|
|
1804
1688
|
};
|
|
1689
|
+
|
|
1805
1690
|
/**
|
|
1806
1691
|
* @param {SweetAlertOptions} innerParams
|
|
1807
1692
|
* @param {number} index
|
|
1808
1693
|
* @param {number} increment
|
|
1809
1694
|
*/
|
|
1810
|
-
|
|
1811
1695
|
const setFocus = (innerParams, index, increment) => {
|
|
1812
|
-
const focusableElements = getFocusableElements();
|
|
1813
|
-
|
|
1696
|
+
const focusableElements = getFocusableElements();
|
|
1697
|
+
// search for visible elements and select the next possible match
|
|
1814
1698
|
if (focusableElements.length) {
|
|
1815
|
-
index = index + increment;
|
|
1699
|
+
index = index + increment;
|
|
1816
1700
|
|
|
1701
|
+
// rollover to first item
|
|
1817
1702
|
if (index === focusableElements.length) {
|
|
1818
|
-
index = 0;
|
|
1703
|
+
index = 0;
|
|
1704
|
+
|
|
1705
|
+
// go to last item
|
|
1819
1706
|
} else if (index === -1) {
|
|
1820
1707
|
index = focusableElements.length - 1;
|
|
1821
1708
|
}
|
|
1822
|
-
|
|
1823
1709
|
return focusableElements[index].focus();
|
|
1824
|
-
}
|
|
1825
|
-
|
|
1826
|
-
|
|
1710
|
+
}
|
|
1711
|
+
// no visible focusable elements, focus the popup
|
|
1827
1712
|
getPopup().focus();
|
|
1828
1713
|
};
|
|
1829
1714
|
const arrowKeysNextButton = ['ArrowRight', 'ArrowDown'];
|
|
1830
1715
|
const arrowKeysPreviousButton = ['ArrowLeft', 'ArrowUp'];
|
|
1716
|
+
|
|
1831
1717
|
/**
|
|
1832
1718
|
* @param {SweetAlert2} instance
|
|
1833
1719
|
* @param {KeyboardEvent} e
|
|
1834
1720
|
* @param {function} dismissWith
|
|
1835
1721
|
*/
|
|
1836
|
-
|
|
1837
1722
|
const keydownHandler = (instance, e, dismissWith) => {
|
|
1838
1723
|
const innerParams = privateProps.innerParams.get(instance);
|
|
1839
|
-
|
|
1840
1724
|
if (!innerParams) {
|
|
1841
1725
|
return; // This instance has already been destroyed
|
|
1842
|
-
}
|
|
1726
|
+
}
|
|
1727
|
+
|
|
1728
|
+
// Ignore keydown during IME composition
|
|
1843
1729
|
// https://developer.mozilla.org/en-US/docs/Web/API/Document/keydown_event#ignoring_keydown_during_ime_composition
|
|
1844
1730
|
// https://github.com/sweetalert2/sweetalert2/issues/720
|
|
1845
1731
|
// https://github.com/sweetalert2/sweetalert2/issues/2406
|
|
1846
|
-
|
|
1847
|
-
|
|
1848
1732
|
if (e.isComposing || e.keyCode === 229) {
|
|
1849
1733
|
return;
|
|
1850
1734
|
}
|
|
1851
|
-
|
|
1852
1735
|
if (innerParams.stopKeydownPropagation) {
|
|
1853
1736
|
e.stopPropagation();
|
|
1854
|
-
}
|
|
1855
|
-
|
|
1737
|
+
}
|
|
1856
1738
|
|
|
1739
|
+
// ENTER
|
|
1857
1740
|
if (e.key === 'Enter') {
|
|
1858
1741
|
handleEnter(instance, e, innerParams);
|
|
1859
|
-
}
|
|
1742
|
+
}
|
|
1743
|
+
|
|
1744
|
+
// TAB
|
|
1860
1745
|
else if (e.key === 'Tab') {
|
|
1861
1746
|
handleTab(e, innerParams);
|
|
1862
|
-
}
|
|
1747
|
+
}
|
|
1748
|
+
|
|
1749
|
+
// ARROWS - switch focus between buttons
|
|
1863
1750
|
else if ([...arrowKeysNextButton, ...arrowKeysPreviousButton].includes(e.key)) {
|
|
1864
1751
|
handleArrows(e.key);
|
|
1865
|
-
}
|
|
1752
|
+
}
|
|
1753
|
+
|
|
1754
|
+
// ESC
|
|
1866
1755
|
else if (e.key === 'Escape') {
|
|
1867
1756
|
handleEsc(e, innerParams, dismissWith);
|
|
1868
1757
|
}
|
|
1869
1758
|
};
|
|
1759
|
+
|
|
1870
1760
|
/**
|
|
1871
1761
|
* @param {SweetAlert2} instance
|
|
1872
1762
|
* @param {KeyboardEvent} e
|
|
1873
1763
|
* @param {SweetAlertOptions} innerParams
|
|
1874
1764
|
*/
|
|
1875
|
-
|
|
1876
|
-
|
|
1877
1765
|
const handleEnter = (instance, e, innerParams) => {
|
|
1878
1766
|
// https://github.com/sweetalert2/sweetalert2/issues/2386
|
|
1879
1767
|
if (!callIfFunction(innerParams.allowEnterKey)) {
|
|
1880
1768
|
return;
|
|
1881
1769
|
}
|
|
1882
|
-
|
|
1883
1770
|
if (e.target && instance.getInput() && e.target instanceof HTMLElement && e.target.outerHTML === instance.getInput().outerHTML) {
|
|
1884
1771
|
if (['textarea', 'file'].includes(innerParams.input)) {
|
|
1885
1772
|
return; // do not submit
|
|
@@ -1889,75 +1776,66 @@
|
|
|
1889
1776
|
e.preventDefault();
|
|
1890
1777
|
}
|
|
1891
1778
|
};
|
|
1779
|
+
|
|
1892
1780
|
/**
|
|
1893
1781
|
* @param {KeyboardEvent} e
|
|
1894
1782
|
* @param {SweetAlertOptions} innerParams
|
|
1895
1783
|
*/
|
|
1896
|
-
|
|
1897
|
-
|
|
1898
1784
|
const handleTab = (e, innerParams) => {
|
|
1899
1785
|
const targetElement = e.target;
|
|
1900
1786
|
const focusableElements = getFocusableElements();
|
|
1901
1787
|
let btnIndex = -1;
|
|
1902
|
-
|
|
1903
1788
|
for (let i = 0; i < focusableElements.length; i++) {
|
|
1904
1789
|
if (targetElement === focusableElements[i]) {
|
|
1905
1790
|
btnIndex = i;
|
|
1906
1791
|
break;
|
|
1907
1792
|
}
|
|
1908
|
-
}
|
|
1909
|
-
|
|
1793
|
+
}
|
|
1910
1794
|
|
|
1795
|
+
// Cycle to the next button
|
|
1911
1796
|
if (!e.shiftKey) {
|
|
1912
1797
|
setFocus(innerParams, btnIndex, 1);
|
|
1913
|
-
}
|
|
1798
|
+
}
|
|
1799
|
+
|
|
1800
|
+
// Cycle to the prev button
|
|
1914
1801
|
else {
|
|
1915
1802
|
setFocus(innerParams, btnIndex, -1);
|
|
1916
1803
|
}
|
|
1917
|
-
|
|
1918
1804
|
e.stopPropagation();
|
|
1919
1805
|
e.preventDefault();
|
|
1920
1806
|
};
|
|
1807
|
+
|
|
1921
1808
|
/**
|
|
1922
1809
|
* @param {string} key
|
|
1923
1810
|
*/
|
|
1924
|
-
|
|
1925
|
-
|
|
1926
1811
|
const handleArrows = key => {
|
|
1927
1812
|
const confirmButton = getConfirmButton();
|
|
1928
1813
|
const denyButton = getDenyButton();
|
|
1929
1814
|
const cancelButton = getCancelButton();
|
|
1930
|
-
|
|
1931
1815
|
if (document.activeElement instanceof HTMLElement && ![confirmButton, denyButton, cancelButton].includes(document.activeElement)) {
|
|
1932
1816
|
return;
|
|
1933
1817
|
}
|
|
1934
|
-
|
|
1935
1818
|
const sibling = arrowKeysNextButton.includes(key) ? 'nextElementSibling' : 'previousElementSibling';
|
|
1936
1819
|
let buttonToFocus = document.activeElement;
|
|
1937
|
-
|
|
1938
1820
|
for (let i = 0; i < getActions().children.length; i++) {
|
|
1939
1821
|
buttonToFocus = buttonToFocus[sibling];
|
|
1940
|
-
|
|
1941
1822
|
if (!buttonToFocus) {
|
|
1942
1823
|
return;
|
|
1943
1824
|
}
|
|
1944
|
-
|
|
1945
1825
|
if (buttonToFocus instanceof HTMLButtonElement && isVisible(buttonToFocus)) {
|
|
1946
1826
|
break;
|
|
1947
1827
|
}
|
|
1948
1828
|
}
|
|
1949
|
-
|
|
1950
1829
|
if (buttonToFocus instanceof HTMLButtonElement) {
|
|
1951
1830
|
buttonToFocus.focus();
|
|
1952
1831
|
}
|
|
1953
1832
|
};
|
|
1833
|
+
|
|
1954
1834
|
/**
|
|
1955
1835
|
* @param {KeyboardEvent} e
|
|
1956
1836
|
* @param {SweetAlertOptions} innerParams
|
|
1957
1837
|
* @param {function} dismissWith
|
|
1958
1838
|
*/
|
|
1959
|
-
|
|
1960
|
-
|
|
1961
1839
|
const handleEsc = (e, innerParams, dismissWith) => {
|
|
1962
1840
|
if (callIfFunction(innerParams.allowEscapeKey)) {
|
|
1963
1841
|
e.preventDefault();
|
|
@@ -1974,11 +1852,13 @@
|
|
|
1974
1852
|
* Once we have the changes from that PR in Babel, and our core class fits reasonable in *one module*
|
|
1975
1853
|
* then we can use that language feature.
|
|
1976
1854
|
*/
|
|
1855
|
+
|
|
1977
1856
|
var privateMethods = {
|
|
1978
1857
|
swalPromiseResolve: new WeakMap(),
|
|
1979
1858
|
swalPromiseReject: new WeakMap()
|
|
1980
1859
|
};
|
|
1981
1860
|
|
|
1861
|
+
// From https://developer.paciellogroup.com/blog/2018/06/the-current-state-of-modal-dialog-accessibility/
|
|
1982
1862
|
// Adding aria-hidden="true" to elements outside of the active modal dialog ensures that
|
|
1983
1863
|
// elements not within the active modal dialog will not be surfaced if a user opens a screen
|
|
1984
1864
|
// reader’s list of elements (headings, form controls, landmarks, etc.) in the document.
|
|
@@ -1989,11 +1869,9 @@
|
|
|
1989
1869
|
if (el === getContainer() || el.contains(getContainer())) {
|
|
1990
1870
|
return;
|
|
1991
1871
|
}
|
|
1992
|
-
|
|
1993
1872
|
if (el.hasAttribute('aria-hidden')) {
|
|
1994
1873
|
el.setAttribute('data-previous-aria-hidden', el.getAttribute('aria-hidden'));
|
|
1995
1874
|
}
|
|
1996
|
-
|
|
1997
1875
|
el.setAttribute('aria-hidden', 'true');
|
|
1998
1876
|
});
|
|
1999
1877
|
};
|
|
@@ -2011,10 +1889,12 @@
|
|
|
2011
1889
|
|
|
2012
1890
|
/* istanbul ignore file */
|
|
2013
1891
|
|
|
1892
|
+
// Fix iOS scrolling http://stackoverflow.com/q/39626302
|
|
1893
|
+
|
|
2014
1894
|
const iOSfix = () => {
|
|
2015
|
-
const iOS =
|
|
1895
|
+
const iOS =
|
|
1896
|
+
// @ts-ignore
|
|
2016
1897
|
/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream || navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1;
|
|
2017
|
-
|
|
2018
1898
|
if (iOS && !hasClass(document.body, swalClasses.iosfix)) {
|
|
2019
1899
|
const offset = document.body.scrollTop;
|
|
2020
1900
|
document.body.style.top = "".concat(offset * -1, "px");
|
|
@@ -2023,44 +1903,38 @@
|
|
|
2023
1903
|
addBottomPaddingForTallPopups();
|
|
2024
1904
|
}
|
|
2025
1905
|
};
|
|
1906
|
+
|
|
2026
1907
|
/**
|
|
2027
1908
|
* https://github.com/sweetalert2/sweetalert2/issues/1948
|
|
2028
1909
|
*/
|
|
2029
|
-
|
|
2030
1910
|
const addBottomPaddingForTallPopups = () => {
|
|
2031
1911
|
const ua = navigator.userAgent;
|
|
2032
1912
|
const iOS = !!ua.match(/iPad/i) || !!ua.match(/iPhone/i);
|
|
2033
1913
|
const webkit = !!ua.match(/WebKit/i);
|
|
2034
1914
|
const iOSSafari = iOS && webkit && !ua.match(/CriOS/i);
|
|
2035
|
-
|
|
2036
1915
|
if (iOSSafari) {
|
|
2037
1916
|
const bottomPanelHeight = 44;
|
|
2038
|
-
|
|
2039
1917
|
if (getPopup().scrollHeight > window.innerHeight - bottomPanelHeight) {
|
|
2040
1918
|
getContainer().style.paddingBottom = "".concat(bottomPanelHeight, "px");
|
|
2041
1919
|
}
|
|
2042
1920
|
}
|
|
2043
1921
|
};
|
|
1922
|
+
|
|
2044
1923
|
/**
|
|
2045
1924
|
* https://github.com/sweetalert2/sweetalert2/issues/1246
|
|
2046
1925
|
*/
|
|
2047
|
-
|
|
2048
|
-
|
|
2049
1926
|
const lockBodyScroll = () => {
|
|
2050
1927
|
const container = getContainer();
|
|
2051
1928
|
let preventTouchMove;
|
|
2052
1929
|
/**
|
|
2053
1930
|
* @param {TouchEvent} e
|
|
2054
1931
|
*/
|
|
2055
|
-
|
|
2056
1932
|
container.ontouchstart = e => {
|
|
2057
1933
|
preventTouchMove = shouldPreventTouchMove(e);
|
|
2058
1934
|
};
|
|
2059
1935
|
/**
|
|
2060
1936
|
* @param {TouchEvent} e
|
|
2061
1937
|
*/
|
|
2062
|
-
|
|
2063
|
-
|
|
2064
1938
|
container.ontouchmove = e => {
|
|
2065
1939
|
if (preventTouchMove) {
|
|
2066
1940
|
e.preventDefault();
|
|
@@ -2068,56 +1942,51 @@
|
|
|
2068
1942
|
}
|
|
2069
1943
|
};
|
|
2070
1944
|
};
|
|
1945
|
+
|
|
2071
1946
|
/**
|
|
2072
1947
|
* @param {TouchEvent} event
|
|
2073
1948
|
* @returns {boolean}
|
|
2074
1949
|
*/
|
|
2075
|
-
|
|
2076
|
-
|
|
2077
1950
|
const shouldPreventTouchMove = event => {
|
|
2078
1951
|
const target = event.target;
|
|
2079
1952
|
const container = getContainer();
|
|
2080
|
-
|
|
2081
1953
|
if (isStylus(event) || isZoom(event)) {
|
|
2082
1954
|
return false;
|
|
2083
1955
|
}
|
|
2084
|
-
|
|
2085
1956
|
if (target === container) {
|
|
2086
1957
|
return true;
|
|
2087
1958
|
}
|
|
2088
|
-
|
|
2089
|
-
|
|
2090
|
-
target.tagName !== 'TEXTAREA' &&
|
|
2091
|
-
|
|
1959
|
+
if (!isScrollable(container) && target instanceof HTMLElement && target.tagName !== 'INPUT' &&
|
|
1960
|
+
// #1603
|
|
1961
|
+
target.tagName !== 'TEXTAREA' &&
|
|
1962
|
+
// #2266
|
|
1963
|
+
!(isScrollable(getHtmlContainer()) &&
|
|
1964
|
+
// #1944
|
|
2092
1965
|
getHtmlContainer().contains(target))) {
|
|
2093
1966
|
return true;
|
|
2094
1967
|
}
|
|
2095
|
-
|
|
2096
1968
|
return false;
|
|
2097
1969
|
};
|
|
1970
|
+
|
|
2098
1971
|
/**
|
|
2099
1972
|
* https://github.com/sweetalert2/sweetalert2/issues/1786
|
|
2100
1973
|
*
|
|
2101
1974
|
* @param {*} event
|
|
2102
1975
|
* @returns {boolean}
|
|
2103
1976
|
*/
|
|
2104
|
-
|
|
2105
|
-
|
|
2106
1977
|
const isStylus = event => {
|
|
2107
1978
|
return event.touches && event.touches.length && event.touches[0].touchType === 'stylus';
|
|
2108
1979
|
};
|
|
1980
|
+
|
|
2109
1981
|
/**
|
|
2110
1982
|
* https://github.com/sweetalert2/sweetalert2/issues/1891
|
|
2111
1983
|
*
|
|
2112
1984
|
* @param {TouchEvent} event
|
|
2113
1985
|
* @returns {boolean}
|
|
2114
1986
|
*/
|
|
2115
|
-
|
|
2116
|
-
|
|
2117
1987
|
const isZoom = event => {
|
|
2118
1988
|
return event.touches && event.touches.length > 1;
|
|
2119
1989
|
};
|
|
2120
|
-
|
|
2121
1990
|
const undoIOSfix = () => {
|
|
2122
1991
|
if (hasClass(document.body, swalClasses.iosfix)) {
|
|
2123
1992
|
const offset = parseInt(document.body.style.top, 10);
|
|
@@ -2131,9 +2000,8 @@
|
|
|
2131
2000
|
// for queues, do not do this more than once
|
|
2132
2001
|
if (states.previousBodyPadding !== null) {
|
|
2133
2002
|
return;
|
|
2134
|
-
}
|
|
2135
|
-
|
|
2136
|
-
|
|
2003
|
+
}
|
|
2004
|
+
// if the body has overflow
|
|
2137
2005
|
if (document.body.scrollHeight > window.innerHeight) {
|
|
2138
2006
|
// add padding so the content doesn't shift after removal of scrollbar
|
|
2139
2007
|
states.previousBodyPadding = parseInt(window.getComputedStyle(document.body).getPropertyValue('padding-right'));
|
|
@@ -2158,10 +2026,9 @@
|
|
|
2158
2026
|
restoreActiveElement(returnFocus).then(() => triggerDidCloseAndDispose(instance, didClose));
|
|
2159
2027
|
removeKeydownHandler(globalState);
|
|
2160
2028
|
}
|
|
2161
|
-
|
|
2162
|
-
|
|
2029
|
+
const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
|
|
2030
|
+
// workaround for #2088
|
|
2163
2031
|
// for some reason removing the container in Safari will scroll the document to bottom
|
|
2164
|
-
|
|
2165
2032
|
if (isSafari) {
|
|
2166
2033
|
container.setAttribute('style', 'display:none !important');
|
|
2167
2034
|
container.removeAttribute('class');
|
|
@@ -2169,25 +2036,20 @@
|
|
|
2169
2036
|
} else {
|
|
2170
2037
|
container.remove();
|
|
2171
2038
|
}
|
|
2172
|
-
|
|
2173
2039
|
if (isModal()) {
|
|
2174
2040
|
undoScrollbar();
|
|
2175
2041
|
undoIOSfix();
|
|
2176
2042
|
unsetAriaHidden();
|
|
2177
2043
|
}
|
|
2178
|
-
|
|
2179
2044
|
removeBodyClasses();
|
|
2180
2045
|
}
|
|
2181
|
-
|
|
2182
2046
|
function removeBodyClasses() {
|
|
2183
2047
|
removeClass([document.documentElement, document.body], [swalClasses.shown, swalClasses['height-auto'], swalClasses['no-backdrop'], swalClasses['toast-shown']]);
|
|
2184
2048
|
}
|
|
2185
|
-
|
|
2186
2049
|
function close(resolveValue) {
|
|
2187
2050
|
resolveValue = prepareResolveValue(resolveValue);
|
|
2188
2051
|
const swalPromiseResolve = privateMethods.swalPromiseResolve.get(this);
|
|
2189
2052
|
const didClose = triggerClosePopup(this);
|
|
2190
|
-
|
|
2191
2053
|
if (this.isAwaitingPromise()) {
|
|
2192
2054
|
// A swal awaiting for a promise (after a click on Confirm or Deny) cannot be dismissed anymore #2335
|
|
2193
2055
|
if (!resolveValue.isDismissed) {
|
|
@@ -2202,20 +2064,15 @@
|
|
|
2202
2064
|
function isAwaitingPromise() {
|
|
2203
2065
|
return !!privateProps.awaitingPromise.get(this);
|
|
2204
2066
|
}
|
|
2205
|
-
|
|
2206
2067
|
const triggerClosePopup = instance => {
|
|
2207
2068
|
const popup = getPopup();
|
|
2208
|
-
|
|
2209
2069
|
if (!popup) {
|
|
2210
2070
|
return false;
|
|
2211
2071
|
}
|
|
2212
|
-
|
|
2213
2072
|
const innerParams = privateProps.innerParams.get(instance);
|
|
2214
|
-
|
|
2215
2073
|
if (!innerParams || hasClass(popup, innerParams.hideClass.popup)) {
|
|
2216
2074
|
return false;
|
|
2217
2075
|
}
|
|
2218
|
-
|
|
2219
2076
|
removeClass(popup, innerParams.showClass.popup);
|
|
2220
2077
|
addClass(popup, innerParams.hideClass.popup);
|
|
2221
2078
|
const backdrop = getContainer();
|
|
@@ -2224,11 +2081,9 @@
|
|
|
2224
2081
|
handlePopupAnimation(instance, popup, innerParams);
|
|
2225
2082
|
return true;
|
|
2226
2083
|
};
|
|
2227
|
-
|
|
2228
2084
|
function rejectPromise(error) {
|
|
2229
2085
|
const rejectPromise = privateMethods.swalPromiseReject.get(this);
|
|
2230
2086
|
handleAwaitingPromise(this);
|
|
2231
|
-
|
|
2232
2087
|
if (rejectPromise) {
|
|
2233
2088
|
// Reject Swal promise
|
|
2234
2089
|
rejectPromise(error);
|
|
@@ -2236,14 +2091,13 @@
|
|
|
2236
2091
|
}
|
|
2237
2092
|
const handleAwaitingPromise = instance => {
|
|
2238
2093
|
if (instance.isAwaitingPromise()) {
|
|
2239
|
-
privateProps.awaitingPromise.delete(instance);
|
|
2240
|
-
|
|
2094
|
+
privateProps.awaitingPromise.delete(instance);
|
|
2095
|
+
// The instance might have been previously partly destroyed, we must resume the destroy process in this case #2335
|
|
2241
2096
|
if (!privateProps.innerParams.get(instance)) {
|
|
2242
2097
|
instance._destroy();
|
|
2243
2098
|
}
|
|
2244
2099
|
}
|
|
2245
2100
|
};
|
|
2246
|
-
|
|
2247
2101
|
const prepareResolveValue = resolveValue => {
|
|
2248
2102
|
// When user calls Swal.close()
|
|
2249
2103
|
if (typeof resolveValue === 'undefined') {
|
|
@@ -2253,23 +2107,19 @@
|
|
|
2253
2107
|
isDismissed: true
|
|
2254
2108
|
};
|
|
2255
2109
|
}
|
|
2256
|
-
|
|
2257
2110
|
return Object.assign({
|
|
2258
2111
|
isConfirmed: false,
|
|
2259
2112
|
isDenied: false,
|
|
2260
2113
|
isDismissed: false
|
|
2261
2114
|
}, resolveValue);
|
|
2262
2115
|
};
|
|
2263
|
-
|
|
2264
2116
|
const handlePopupAnimation = (instance, popup, innerParams) => {
|
|
2265
|
-
const container = getContainer();
|
|
2266
|
-
|
|
2117
|
+
const container = getContainer();
|
|
2118
|
+
// If animation is supported, animate
|
|
2267
2119
|
const animationIsSupported = animationEndEvent && hasCssAnimation(popup);
|
|
2268
|
-
|
|
2269
2120
|
if (typeof innerParams.willClose === 'function') {
|
|
2270
2121
|
innerParams.willClose(popup);
|
|
2271
2122
|
}
|
|
2272
|
-
|
|
2273
2123
|
if (animationIsSupported) {
|
|
2274
2124
|
animatePopup(instance, popup, container, innerParams.returnFocus, innerParams.didClose);
|
|
2275
2125
|
} else {
|
|
@@ -2277,7 +2127,6 @@
|
|
|
2277
2127
|
removePopupAndResetState(instance, container, innerParams.returnFocus, innerParams.didClose);
|
|
2278
2128
|
}
|
|
2279
2129
|
};
|
|
2280
|
-
|
|
2281
2130
|
const animatePopup = (instance, popup, container, returnFocus, didClose) => {
|
|
2282
2131
|
globalState.swalCloseEventFinishedCallback = removePopupAndResetState.bind(null, instance, container, returnFocus, didClose);
|
|
2283
2132
|
popup.addEventListener(animationEndEvent, function (e) {
|
|
@@ -2287,13 +2136,11 @@
|
|
|
2287
2136
|
}
|
|
2288
2137
|
});
|
|
2289
2138
|
};
|
|
2290
|
-
|
|
2291
2139
|
const triggerDidCloseAndDispose = (instance, didClose) => {
|
|
2292
2140
|
setTimeout(() => {
|
|
2293
2141
|
if (typeof didClose === 'function') {
|
|
2294
2142
|
didClose.bind(instance.params)();
|
|
2295
2143
|
}
|
|
2296
|
-
|
|
2297
2144
|
instance._destroy();
|
|
2298
2145
|
});
|
|
2299
2146
|
};
|
|
@@ -2303,28 +2150,24 @@
|
|
|
2303
2150
|
* @param {string[]} buttons
|
|
2304
2151
|
* @param {boolean} disabled
|
|
2305
2152
|
*/
|
|
2306
|
-
|
|
2307
2153
|
function setButtonsDisabled(instance, buttons, disabled) {
|
|
2308
2154
|
const domCache = privateProps.domCache.get(instance);
|
|
2309
2155
|
buttons.forEach(button => {
|
|
2310
2156
|
domCache[button].disabled = disabled;
|
|
2311
2157
|
});
|
|
2312
2158
|
}
|
|
2159
|
+
|
|
2313
2160
|
/**
|
|
2314
2161
|
* @param {HTMLInputElement} input
|
|
2315
2162
|
* @param {boolean} disabled
|
|
2316
2163
|
*/
|
|
2317
|
-
|
|
2318
|
-
|
|
2319
2164
|
function setInputDisabled(input, disabled) {
|
|
2320
2165
|
if (!input) {
|
|
2321
2166
|
return;
|
|
2322
2167
|
}
|
|
2323
|
-
|
|
2324
2168
|
if (input.type === 'radio') {
|
|
2325
2169
|
const radiosContainer = input.parentNode.parentNode;
|
|
2326
2170
|
const radios = radiosContainer.querySelectorAll('input');
|
|
2327
|
-
|
|
2328
2171
|
for (let i = 0; i < radios.length; i++) {
|
|
2329
2172
|
radios[i].disabled = disabled;
|
|
2330
2173
|
}
|
|
@@ -2332,7 +2175,6 @@
|
|
|
2332
2175
|
input.disabled = disabled;
|
|
2333
2176
|
}
|
|
2334
2177
|
}
|
|
2335
|
-
|
|
2336
2178
|
function enableButtons() {
|
|
2337
2179
|
setButtonsDisabled(this, ['confirmButton', 'denyButton', 'cancelButton'], false);
|
|
2338
2180
|
}
|
|
@@ -2346,36 +2188,32 @@
|
|
|
2346
2188
|
setInputDisabled(this.getInput(), true);
|
|
2347
2189
|
}
|
|
2348
2190
|
|
|
2191
|
+
// Show block with validation message
|
|
2349
2192
|
function showValidationMessage(error) {
|
|
2350
2193
|
const domCache = privateProps.domCache.get(this);
|
|
2351
2194
|
const params = privateProps.innerParams.get(this);
|
|
2352
2195
|
setInnerHtml(domCache.validationMessage, error);
|
|
2353
2196
|
domCache.validationMessage.className = swalClasses['validation-message'];
|
|
2354
|
-
|
|
2355
2197
|
if (params.customClass && params.customClass.validationMessage) {
|
|
2356
2198
|
addClass(domCache.validationMessage, params.customClass.validationMessage);
|
|
2357
2199
|
}
|
|
2358
|
-
|
|
2359
2200
|
show(domCache.validationMessage);
|
|
2360
2201
|
const input = this.getInput();
|
|
2361
|
-
|
|
2362
2202
|
if (input) {
|
|
2363
2203
|
input.setAttribute('aria-invalid', true);
|
|
2364
2204
|
input.setAttribute('aria-describedby', swalClasses['validation-message']);
|
|
2365
2205
|
focusInput(input);
|
|
2366
2206
|
addClass(input, swalClasses.inputerror);
|
|
2367
2207
|
}
|
|
2368
|
-
}
|
|
2208
|
+
}
|
|
2369
2209
|
|
|
2210
|
+
// Hide block with validation message
|
|
2370
2211
|
function resetValidationMessage$1() {
|
|
2371
2212
|
const domCache = privateProps.domCache.get(this);
|
|
2372
|
-
|
|
2373
2213
|
if (domCache.validationMessage) {
|
|
2374
2214
|
hide(domCache.validationMessage);
|
|
2375
2215
|
}
|
|
2376
|
-
|
|
2377
2216
|
const input = this.getInput();
|
|
2378
|
-
|
|
2379
2217
|
if (input) {
|
|
2380
2218
|
input.removeAttribute('aria-invalid');
|
|
2381
2219
|
input.removeAttribute('aria-describedby');
|
|
@@ -2480,84 +2318,78 @@
|
|
|
2480
2318
|
const updatableParams = ['allowEscapeKey', 'allowOutsideClick', 'background', 'buttonsStyling', 'cancelButtonAriaLabel', 'cancelButtonColor', 'cancelButtonText', 'closeButtonAriaLabel', 'closeButtonHtml', 'color', 'confirmButtonAriaLabel', 'confirmButtonColor', 'confirmButtonText', 'currentProgressStep', 'customClass', 'denyButtonAriaLabel', 'denyButtonColor', 'denyButtonText', 'didClose', 'didDestroy', 'footer', 'hideClass', 'html', 'icon', 'iconColor', 'iconHtml', 'imageAlt', 'imageHeight', 'imageUrl', 'imageWidth', 'preConfirm', 'preDeny', 'progressSteps', 'returnFocus', 'reverseButtons', 'showCancelButton', 'showCloseButton', 'showConfirmButton', 'showDenyButton', 'text', 'title', 'titleText', 'willClose'];
|
|
2481
2319
|
const deprecatedParams = {};
|
|
2482
2320
|
const toastIncompatibleParams = ['allowOutsideClick', 'allowEnterKey', 'backdrop', 'focusConfirm', 'focusDeny', 'focusCancel', 'returnFocus', 'heightAuto', 'keydownListenerCapture'];
|
|
2321
|
+
|
|
2483
2322
|
/**
|
|
2484
2323
|
* Is valid parameter
|
|
2485
2324
|
*
|
|
2486
2325
|
* @param {string} paramName
|
|
2487
2326
|
* @returns {boolean}
|
|
2488
2327
|
*/
|
|
2489
|
-
|
|
2490
2328
|
const isValidParameter = paramName => {
|
|
2491
2329
|
return Object.prototype.hasOwnProperty.call(defaultParams, paramName);
|
|
2492
2330
|
};
|
|
2331
|
+
|
|
2493
2332
|
/**
|
|
2494
2333
|
* Is valid parameter for Swal.update() method
|
|
2495
2334
|
*
|
|
2496
2335
|
* @param {string} paramName
|
|
2497
2336
|
* @returns {boolean}
|
|
2498
2337
|
*/
|
|
2499
|
-
|
|
2500
2338
|
const isUpdatableParameter = paramName => {
|
|
2501
2339
|
return updatableParams.indexOf(paramName) !== -1;
|
|
2502
2340
|
};
|
|
2341
|
+
|
|
2503
2342
|
/**
|
|
2504
2343
|
* Is deprecated parameter
|
|
2505
2344
|
*
|
|
2506
2345
|
* @param {string} paramName
|
|
2507
2346
|
* @returns {string | undefined}
|
|
2508
2347
|
*/
|
|
2509
|
-
|
|
2510
2348
|
const isDeprecatedParameter = paramName => {
|
|
2511
2349
|
return deprecatedParams[paramName];
|
|
2512
2350
|
};
|
|
2351
|
+
|
|
2513
2352
|
/**
|
|
2514
2353
|
* @param {string} param
|
|
2515
2354
|
*/
|
|
2516
|
-
|
|
2517
2355
|
const checkIfParamIsValid = param => {
|
|
2518
2356
|
if (!isValidParameter(param)) {
|
|
2519
2357
|
warn("Unknown parameter \"".concat(param, "\""));
|
|
2520
2358
|
}
|
|
2521
2359
|
};
|
|
2360
|
+
|
|
2522
2361
|
/**
|
|
2523
2362
|
* @param {string} param
|
|
2524
2363
|
*/
|
|
2525
|
-
|
|
2526
|
-
|
|
2527
2364
|
const checkIfToastParamIsValid = param => {
|
|
2528
2365
|
if (toastIncompatibleParams.includes(param)) {
|
|
2529
2366
|
warn("The parameter \"".concat(param, "\" is incompatible with toasts"));
|
|
2530
2367
|
}
|
|
2531
2368
|
};
|
|
2369
|
+
|
|
2532
2370
|
/**
|
|
2533
2371
|
* @param {string} param
|
|
2534
2372
|
*/
|
|
2535
|
-
|
|
2536
|
-
|
|
2537
2373
|
const checkIfParamIsDeprecated = param => {
|
|
2538
2374
|
if (isDeprecatedParameter(param)) {
|
|
2539
2375
|
warnAboutDeprecation(param, isDeprecatedParameter(param));
|
|
2540
2376
|
}
|
|
2541
2377
|
};
|
|
2378
|
+
|
|
2542
2379
|
/**
|
|
2543
2380
|
* Show relevant warnings for given params
|
|
2544
2381
|
*
|
|
2545
2382
|
* @param {SweetAlertOptions} params
|
|
2546
2383
|
*/
|
|
2547
|
-
|
|
2548
|
-
|
|
2549
2384
|
const showWarningsForParams = params => {
|
|
2550
|
-
if (
|
|
2385
|
+
if (params.backdrop === false && params.allowOutsideClick) {
|
|
2551
2386
|
warn('"allowOutsideClick" parameter requires `backdrop` parameter to be set to `true`');
|
|
2552
2387
|
}
|
|
2553
|
-
|
|
2554
2388
|
for (const param in params) {
|
|
2555
2389
|
checkIfParamIsValid(param);
|
|
2556
|
-
|
|
2557
2390
|
if (params.toast) {
|
|
2558
2391
|
checkIfToastParamIsValid(param);
|
|
2559
2392
|
}
|
|
2560
|
-
|
|
2561
2393
|
checkIfParamIsDeprecated(param);
|
|
2562
2394
|
}
|
|
2563
2395
|
};
|
|
@@ -2565,15 +2397,12 @@
|
|
|
2565
2397
|
/**
|
|
2566
2398
|
* Updates popup parameters.
|
|
2567
2399
|
*/
|
|
2568
|
-
|
|
2569
2400
|
function update(params) {
|
|
2570
2401
|
const popup = getPopup();
|
|
2571
2402
|
const innerParams = privateProps.innerParams.get(this);
|
|
2572
|
-
|
|
2573
2403
|
if (!popup || hasClass(popup, innerParams.hideClass.popup)) {
|
|
2574
2404
|
return warn("You're trying to update the closed or closing popup, that won't work. Use the update() method in preConfirm parameter or show a new popup.");
|
|
2575
2405
|
}
|
|
2576
|
-
|
|
2577
2406
|
const validUpdatableParams = filterValidParams(params);
|
|
2578
2407
|
const updatedParams = Object.assign({}, innerParams, validUpdatableParams);
|
|
2579
2408
|
render(this, updatedParams);
|
|
@@ -2586,7 +2415,6 @@
|
|
|
2586
2415
|
}
|
|
2587
2416
|
});
|
|
2588
2417
|
}
|
|
2589
|
-
|
|
2590
2418
|
const filterValidParams = params => {
|
|
2591
2419
|
const validUpdatableParams = {};
|
|
2592
2420
|
Object.keys(params).forEach(param => {
|
|
@@ -2602,45 +2430,40 @@
|
|
|
2602
2430
|
function _destroy() {
|
|
2603
2431
|
const domCache = privateProps.domCache.get(this);
|
|
2604
2432
|
const innerParams = privateProps.innerParams.get(this);
|
|
2605
|
-
|
|
2606
2433
|
if (!innerParams) {
|
|
2607
2434
|
disposeWeakMaps(this); // The WeakMaps might have been partly destroyed, we must recall it to dispose any remaining WeakMaps #2335
|
|
2608
|
-
|
|
2609
2435
|
return; // This instance has already been destroyed
|
|
2610
|
-
}
|
|
2611
|
-
|
|
2436
|
+
}
|
|
2612
2437
|
|
|
2438
|
+
// Check if there is another Swal closing
|
|
2613
2439
|
if (domCache.popup && globalState.swalCloseEventFinishedCallback) {
|
|
2614
2440
|
globalState.swalCloseEventFinishedCallback();
|
|
2615
2441
|
delete globalState.swalCloseEventFinishedCallback;
|
|
2616
2442
|
}
|
|
2617
|
-
|
|
2618
2443
|
if (typeof innerParams.didDestroy === 'function') {
|
|
2619
2444
|
innerParams.didDestroy();
|
|
2620
2445
|
}
|
|
2621
|
-
|
|
2622
2446
|
disposeSwal(this);
|
|
2623
2447
|
}
|
|
2448
|
+
|
|
2624
2449
|
/**
|
|
2625
2450
|
* @param {SweetAlert2} instance
|
|
2626
2451
|
*/
|
|
2627
|
-
|
|
2628
2452
|
const disposeSwal = instance => {
|
|
2629
|
-
disposeWeakMaps(instance);
|
|
2453
|
+
disposeWeakMaps(instance);
|
|
2454
|
+
// Unset this.params so GC will dispose it (#1569)
|
|
2630
2455
|
// @ts-ignore
|
|
2631
|
-
|
|
2632
|
-
|
|
2633
|
-
|
|
2456
|
+
delete instance.params;
|
|
2457
|
+
// Unset globalState props so GC will dispose globalState (#1569)
|
|
2634
2458
|
delete globalState.keydownHandler;
|
|
2635
|
-
delete globalState.keydownTarget;
|
|
2636
|
-
|
|
2459
|
+
delete globalState.keydownTarget;
|
|
2460
|
+
// Unset currentInstance
|
|
2637
2461
|
delete globalState.currentInstance;
|
|
2638
2462
|
};
|
|
2463
|
+
|
|
2639
2464
|
/**
|
|
2640
2465
|
* @param {SweetAlert2} instance
|
|
2641
2466
|
*/
|
|
2642
|
-
|
|
2643
|
-
|
|
2644
2467
|
const disposeWeakMaps = instance => {
|
|
2645
2468
|
// If the current instance is awaiting a promise result, we keep the privateMethods to call them once the promise result is retrieved #2335
|
|
2646
2469
|
// @ts-ignore
|
|
@@ -2652,12 +2475,11 @@
|
|
|
2652
2475
|
unsetWeakMaps(privateProps, instance);
|
|
2653
2476
|
}
|
|
2654
2477
|
};
|
|
2478
|
+
|
|
2655
2479
|
/**
|
|
2656
2480
|
* @param {object} obj
|
|
2657
2481
|
* @param {SweetAlert2} instance
|
|
2658
2482
|
*/
|
|
2659
|
-
|
|
2660
|
-
|
|
2661
2483
|
const unsetWeakMaps = (obj, instance) => {
|
|
2662
2484
|
for (const i in obj) {
|
|
2663
2485
|
obj[i].delete(instance);
|
|
@@ -2692,44 +2514,35 @@
|
|
|
2692
2514
|
* Shows loader (spinner), this is useful with AJAX requests.
|
|
2693
2515
|
* By default the loader be shown instead of the "Confirm" button.
|
|
2694
2516
|
*/
|
|
2695
|
-
|
|
2696
2517
|
const showLoading = buttonToReplace => {
|
|
2697
2518
|
let popup = getPopup();
|
|
2698
|
-
|
|
2699
2519
|
if (!popup) {
|
|
2700
2520
|
new Swal(); // eslint-disable-line no-new
|
|
2701
2521
|
}
|
|
2702
2522
|
|
|
2703
2523
|
popup = getPopup();
|
|
2704
2524
|
const loader = getLoader();
|
|
2705
|
-
|
|
2706
2525
|
if (isToast()) {
|
|
2707
2526
|
hide(getIcon());
|
|
2708
2527
|
} else {
|
|
2709
2528
|
replaceButton(popup, buttonToReplace);
|
|
2710
2529
|
}
|
|
2711
|
-
|
|
2712
2530
|
show(loader);
|
|
2713
2531
|
popup.setAttribute('data-loading', 'true');
|
|
2714
2532
|
popup.setAttribute('aria-busy', 'true');
|
|
2715
2533
|
popup.focus();
|
|
2716
2534
|
};
|
|
2717
|
-
|
|
2718
2535
|
const replaceButton = (popup, buttonToReplace) => {
|
|
2719
2536
|
const actions = getActions();
|
|
2720
2537
|
const loader = getLoader();
|
|
2721
|
-
|
|
2722
2538
|
if (!buttonToReplace && isVisible(getConfirmButton())) {
|
|
2723
2539
|
buttonToReplace = getConfirmButton();
|
|
2724
2540
|
}
|
|
2725
|
-
|
|
2726
2541
|
show(actions);
|
|
2727
|
-
|
|
2728
2542
|
if (buttonToReplace) {
|
|
2729
2543
|
hide(buttonToReplace);
|
|
2730
2544
|
loader.setAttribute('data-button-to-replace', buttonToReplace.className);
|
|
2731
2545
|
}
|
|
2732
|
-
|
|
2733
2546
|
loader.parentNode.insertBefore(loader, buttonToReplace);
|
|
2734
2547
|
addClass([popup, actions], swalClasses.loading);
|
|
2735
2548
|
};
|
|
@@ -2742,7 +2555,6 @@
|
|
|
2742
2555
|
* @param {SweetAlert2} instance
|
|
2743
2556
|
* @param {SweetAlertOptions} params
|
|
2744
2557
|
*/
|
|
2745
|
-
|
|
2746
2558
|
const handleInputOptionsAndValue = (instance, params) => {
|
|
2747
2559
|
if (params.input === 'select' || params.input === 'radio') {
|
|
2748
2560
|
handleInputOptions(instance, params);
|
|
@@ -2751,69 +2563,59 @@
|
|
|
2751
2563
|
handleInputValue(instance, params);
|
|
2752
2564
|
}
|
|
2753
2565
|
};
|
|
2566
|
+
|
|
2754
2567
|
/**
|
|
2755
2568
|
* @param {SweetAlert2} instance
|
|
2756
2569
|
* @param {SweetAlertOptions} innerParams
|
|
2757
2570
|
* @returns {string | number | File | FileList | null}
|
|
2758
2571
|
*/
|
|
2759
|
-
|
|
2760
2572
|
const getInputValue = (instance, innerParams) => {
|
|
2761
2573
|
const input = instance.getInput();
|
|
2762
|
-
|
|
2763
2574
|
if (!input) {
|
|
2764
2575
|
return null;
|
|
2765
2576
|
}
|
|
2766
|
-
|
|
2767
2577
|
switch (innerParams.input) {
|
|
2768
2578
|
case 'checkbox':
|
|
2769
2579
|
return getCheckboxValue(input);
|
|
2770
|
-
|
|
2771
2580
|
case 'radio':
|
|
2772
2581
|
return getRadioValue(input);
|
|
2773
|
-
|
|
2774
2582
|
case 'file':
|
|
2775
2583
|
return getFileValue(input);
|
|
2776
|
-
|
|
2777
2584
|
default:
|
|
2778
2585
|
return innerParams.inputAutoTrim ? input.value.trim() : input.value;
|
|
2779
2586
|
}
|
|
2780
2587
|
};
|
|
2588
|
+
|
|
2781
2589
|
/**
|
|
2782
2590
|
* @param {HTMLInputElement} input
|
|
2783
2591
|
* @returns {number}
|
|
2784
2592
|
*/
|
|
2785
|
-
|
|
2786
2593
|
const getCheckboxValue = input => input.checked ? 1 : 0;
|
|
2594
|
+
|
|
2787
2595
|
/**
|
|
2788
2596
|
* @param {HTMLInputElement} input
|
|
2789
2597
|
* @returns {string | null}
|
|
2790
2598
|
*/
|
|
2791
|
-
|
|
2792
|
-
|
|
2793
2599
|
const getRadioValue = input => input.checked ? input.value : null;
|
|
2600
|
+
|
|
2794
2601
|
/**
|
|
2795
2602
|
* @param {HTMLInputElement} input
|
|
2796
2603
|
* @returns {FileList | File | null}
|
|
2797
2604
|
*/
|
|
2798
|
-
|
|
2799
|
-
|
|
2800
2605
|
const getFileValue = input => input.files.length ? input.getAttribute('multiple') !== null ? input.files : input.files[0] : null;
|
|
2606
|
+
|
|
2801
2607
|
/**
|
|
2802
2608
|
* @param {SweetAlert2} instance
|
|
2803
2609
|
* @param {SweetAlertOptions} params
|
|
2804
2610
|
*/
|
|
2805
|
-
|
|
2806
|
-
|
|
2807
2611
|
const handleInputOptions = (instance, params) => {
|
|
2808
2612
|
const popup = getPopup();
|
|
2809
2613
|
/**
|
|
2810
2614
|
* @param {Record<string, any>} inputOptions
|
|
2811
2615
|
*/
|
|
2812
|
-
|
|
2813
2616
|
const processInputOptions = inputOptions => {
|
|
2814
2617
|
populateInputOptions[params.input](popup, formatInputOptions(inputOptions), params);
|
|
2815
2618
|
};
|
|
2816
|
-
|
|
2817
2619
|
if (hasToPromiseFn(params.inputOptions) || isPromise(params.inputOptions)) {
|
|
2818
2620
|
showLoading(getConfirmButton());
|
|
2819
2621
|
asPromise(params.inputOptions).then(inputOptions => {
|
|
@@ -2826,12 +2628,11 @@
|
|
|
2826
2628
|
error("Unexpected type of inputOptions! Expected object, Map or Promise, got ".concat(typeof params.inputOptions));
|
|
2827
2629
|
}
|
|
2828
2630
|
};
|
|
2631
|
+
|
|
2829
2632
|
/**
|
|
2830
2633
|
* @param {SweetAlert2} instance
|
|
2831
2634
|
* @param {SweetAlertOptions} params
|
|
2832
2635
|
*/
|
|
2833
|
-
|
|
2834
|
-
|
|
2835
2636
|
const handleInputValue = (instance, params) => {
|
|
2836
2637
|
const input = instance.getInput();
|
|
2837
2638
|
hide(input);
|
|
@@ -2848,7 +2649,6 @@
|
|
|
2848
2649
|
instance.hideLoading();
|
|
2849
2650
|
});
|
|
2850
2651
|
};
|
|
2851
|
-
|
|
2852
2652
|
const populateInputOptions = {
|
|
2853
2653
|
/**
|
|
2854
2654
|
* @param {HTMLElement} popup
|
|
@@ -2862,7 +2662,6 @@
|
|
|
2862
2662
|
* @param {string} optionLabel
|
|
2863
2663
|
* @param {string} optionValue
|
|
2864
2664
|
*/
|
|
2865
|
-
|
|
2866
2665
|
const renderOption = (parent, optionLabel, optionValue) => {
|
|
2867
2666
|
const option = document.createElement('option');
|
|
2868
2667
|
option.value = optionValue;
|
|
@@ -2870,20 +2669,18 @@
|
|
|
2870
2669
|
option.selected = isSelected(optionValue, params.inputValue);
|
|
2871
2670
|
parent.appendChild(option);
|
|
2872
2671
|
};
|
|
2873
|
-
|
|
2874
2672
|
inputOptions.forEach(inputOption => {
|
|
2875
2673
|
const optionValue = inputOption[0];
|
|
2876
|
-
const optionLabel = inputOption[1];
|
|
2674
|
+
const optionLabel = inputOption[1];
|
|
2675
|
+
// <optgroup> spec:
|
|
2877
2676
|
// https://www.w3.org/TR/html401/interact/forms.html#h-17.6
|
|
2878
2677
|
// "...all OPTGROUP elements must be specified directly within a SELECT element (i.e., groups may not be nested)..."
|
|
2879
2678
|
// check whether this is a <optgroup>
|
|
2880
|
-
|
|
2881
2679
|
if (Array.isArray(optionLabel)) {
|
|
2882
2680
|
// if it is an array, then it is an <optgroup>
|
|
2883
2681
|
const optgroup = document.createElement('optgroup');
|
|
2884
2682
|
optgroup.label = optionValue;
|
|
2885
2683
|
optgroup.disabled = false; // not configurable for now
|
|
2886
|
-
|
|
2887
2684
|
select.appendChild(optgroup);
|
|
2888
2685
|
optionLabel.forEach(o => renderOption(optgroup, o[1], o[0]));
|
|
2889
2686
|
} else {
|
|
@@ -2893,7 +2690,6 @@
|
|
|
2893
2690
|
});
|
|
2894
2691
|
select.focus();
|
|
2895
2692
|
},
|
|
2896
|
-
|
|
2897
2693
|
/**
|
|
2898
2694
|
* @param {HTMLElement} popup
|
|
2899
2695
|
* @param {Record<string, any>} inputOptions
|
|
@@ -2909,11 +2705,9 @@
|
|
|
2909
2705
|
radioInput.type = 'radio';
|
|
2910
2706
|
radioInput.name = swalClasses.radio;
|
|
2911
2707
|
radioInput.value = radioValue;
|
|
2912
|
-
|
|
2913
2708
|
if (isSelected(radioValue, params.inputValue)) {
|
|
2914
2709
|
radioInput.checked = true;
|
|
2915
2710
|
}
|
|
2916
|
-
|
|
2917
2711
|
const label = document.createElement('span');
|
|
2918
2712
|
setInnerHtml(label, radioLabel);
|
|
2919
2713
|
label.className = swalClasses.label;
|
|
@@ -2922,55 +2716,47 @@
|
|
|
2922
2716
|
radio.appendChild(radioLabelElement);
|
|
2923
2717
|
});
|
|
2924
2718
|
const radios = radio.querySelectorAll('input');
|
|
2925
|
-
|
|
2926
2719
|
if (radios.length) {
|
|
2927
2720
|
radios[0].focus();
|
|
2928
2721
|
}
|
|
2929
2722
|
}
|
|
2930
2723
|
};
|
|
2724
|
+
|
|
2931
2725
|
/**
|
|
2932
2726
|
* Converts `inputOptions` into an array of `[value, label]`s
|
|
2933
2727
|
*
|
|
2934
2728
|
* @param {Record<string, any>} inputOptions
|
|
2935
2729
|
* @returns {Array<Array<string>>}
|
|
2936
2730
|
*/
|
|
2937
|
-
|
|
2938
2731
|
const formatInputOptions = inputOptions => {
|
|
2939
2732
|
const result = [];
|
|
2940
|
-
|
|
2941
2733
|
if (typeof Map !== 'undefined' && inputOptions instanceof Map) {
|
|
2942
2734
|
inputOptions.forEach((value, key) => {
|
|
2943
2735
|
let valueFormatted = value;
|
|
2944
|
-
|
|
2945
2736
|
if (typeof valueFormatted === 'object') {
|
|
2946
2737
|
// case of <optgroup>
|
|
2947
2738
|
valueFormatted = formatInputOptions(valueFormatted);
|
|
2948
2739
|
}
|
|
2949
|
-
|
|
2950
2740
|
result.push([key, valueFormatted]);
|
|
2951
2741
|
});
|
|
2952
2742
|
} else {
|
|
2953
2743
|
Object.keys(inputOptions).forEach(key => {
|
|
2954
2744
|
let valueFormatted = inputOptions[key];
|
|
2955
|
-
|
|
2956
2745
|
if (typeof valueFormatted === 'object') {
|
|
2957
2746
|
// case of <optgroup>
|
|
2958
2747
|
valueFormatted = formatInputOptions(valueFormatted);
|
|
2959
2748
|
}
|
|
2960
|
-
|
|
2961
2749
|
result.push([key, valueFormatted]);
|
|
2962
2750
|
});
|
|
2963
2751
|
}
|
|
2964
|
-
|
|
2965
2752
|
return result;
|
|
2966
2753
|
};
|
|
2754
|
+
|
|
2967
2755
|
/**
|
|
2968
2756
|
* @param {string} optionValue
|
|
2969
2757
|
* @param {InputValue | Promise<InputValue> | { toPromise: () => InputValue }} inputValue
|
|
2970
2758
|
* @returns {boolean}
|
|
2971
2759
|
*/
|
|
2972
|
-
|
|
2973
|
-
|
|
2974
2760
|
const isSelected = (optionValue, inputValue) => {
|
|
2975
2761
|
return inputValue && inputValue.toString() === optionValue.toString();
|
|
2976
2762
|
};
|
|
@@ -2978,55 +2764,49 @@
|
|
|
2978
2764
|
/**
|
|
2979
2765
|
* @param {SweetAlert2} instance
|
|
2980
2766
|
*/
|
|
2981
|
-
|
|
2982
2767
|
const handleConfirmButtonClick = instance => {
|
|
2983
2768
|
const innerParams = privateProps.innerParams.get(instance);
|
|
2984
2769
|
instance.disableButtons();
|
|
2985
|
-
|
|
2986
2770
|
if (innerParams.input) {
|
|
2987
2771
|
handleConfirmOrDenyWithInput(instance, 'confirm');
|
|
2988
2772
|
} else {
|
|
2989
2773
|
confirm(instance, true);
|
|
2990
2774
|
}
|
|
2991
2775
|
};
|
|
2776
|
+
|
|
2992
2777
|
/**
|
|
2993
2778
|
* @param {SweetAlert2} instance
|
|
2994
2779
|
*/
|
|
2995
|
-
|
|
2996
2780
|
const handleDenyButtonClick = instance => {
|
|
2997
2781
|
const innerParams = privateProps.innerParams.get(instance);
|
|
2998
2782
|
instance.disableButtons();
|
|
2999
|
-
|
|
3000
2783
|
if (innerParams.returnInputValueOnDeny) {
|
|
3001
2784
|
handleConfirmOrDenyWithInput(instance, 'deny');
|
|
3002
2785
|
} else {
|
|
3003
2786
|
deny(instance, false);
|
|
3004
2787
|
}
|
|
3005
2788
|
};
|
|
2789
|
+
|
|
3006
2790
|
/**
|
|
3007
2791
|
* @param {SweetAlert2} instance
|
|
3008
2792
|
* @param {Function} dismissWith
|
|
3009
2793
|
*/
|
|
3010
|
-
|
|
3011
2794
|
const handleCancelButtonClick = (instance, dismissWith) => {
|
|
3012
2795
|
instance.disableButtons();
|
|
3013
2796
|
dismissWith(DismissReason.cancel);
|
|
3014
2797
|
};
|
|
2798
|
+
|
|
3015
2799
|
/**
|
|
3016
2800
|
* @param {SweetAlert2} instance
|
|
3017
2801
|
* @param {'confirm' | 'deny'} type
|
|
3018
2802
|
*/
|
|
3019
|
-
|
|
3020
2803
|
const handleConfirmOrDenyWithInput = (instance, type) => {
|
|
3021
2804
|
const innerParams = privateProps.innerParams.get(instance);
|
|
3022
|
-
|
|
3023
2805
|
if (!innerParams.input) {
|
|
3024
2806
|
error("The \"input\" parameter is needed to be set when using returnInputValueOn".concat(capitalizeFirstLetter(type)));
|
|
3025
2807
|
return;
|
|
3026
2808
|
}
|
|
3027
|
-
|
|
3028
2809
|
const inputValue = getInputValue(instance, innerParams);
|
|
3029
|
-
|
|
3030
2810
|
if (innerParams.inputValidator) {
|
|
3031
2811
|
handleInputValidator(instance, inputValue, type);
|
|
3032
2812
|
} else if (!instance.getInput().checkValidity()) {
|
|
@@ -3038,13 +2818,12 @@
|
|
|
3038
2818
|
confirm(instance, inputValue);
|
|
3039
2819
|
}
|
|
3040
2820
|
};
|
|
2821
|
+
|
|
3041
2822
|
/**
|
|
3042
2823
|
* @param {SweetAlert2} instance
|
|
3043
2824
|
* @param {string | number | File | FileList | null} inputValue
|
|
3044
2825
|
* @param {'confirm' | 'deny'} type
|
|
3045
2826
|
*/
|
|
3046
|
-
|
|
3047
|
-
|
|
3048
2827
|
const handleInputValidator = (instance, inputValue, type) => {
|
|
3049
2828
|
const innerParams = privateProps.innerParams.get(instance);
|
|
3050
2829
|
instance.disableInput();
|
|
@@ -3052,7 +2831,6 @@
|
|
|
3052
2831
|
validationPromise.then(validationMessage => {
|
|
3053
2832
|
instance.enableButtons();
|
|
3054
2833
|
instance.enableInput();
|
|
3055
|
-
|
|
3056
2834
|
if (validationMessage) {
|
|
3057
2835
|
instance.showValidationMessage(validationMessage);
|
|
3058
2836
|
} else if (type === 'deny') {
|
|
@@ -3062,22 +2840,18 @@
|
|
|
3062
2840
|
}
|
|
3063
2841
|
});
|
|
3064
2842
|
};
|
|
2843
|
+
|
|
3065
2844
|
/**
|
|
3066
2845
|
* @param {SweetAlert2} instance
|
|
3067
2846
|
* @param {any} value
|
|
3068
2847
|
*/
|
|
3069
|
-
|
|
3070
|
-
|
|
3071
2848
|
const deny = (instance, value) => {
|
|
3072
2849
|
const innerParams = privateProps.innerParams.get(instance || undefined);
|
|
3073
|
-
|
|
3074
2850
|
if (innerParams.showLoaderOnDeny) {
|
|
3075
2851
|
showLoading(getDenyButton());
|
|
3076
2852
|
}
|
|
3077
|
-
|
|
3078
2853
|
if (innerParams.preDeny) {
|
|
3079
2854
|
privateProps.awaitingPromise.set(instance || undefined, true); // Flagging the instance as awaiting a promise so it's own promise's reject/resolve methods doesn't get destroyed until the result from this preDeny's promise is received
|
|
3080
|
-
|
|
3081
2855
|
const preDenyPromise = Promise.resolve().then(() => asPromise(innerParams.preDeny(value, innerParams.validationMessage)));
|
|
3082
2856
|
preDenyPromise.then(preDenyValue => {
|
|
3083
2857
|
if (preDenyValue === false) {
|
|
@@ -3097,47 +2871,41 @@
|
|
|
3097
2871
|
});
|
|
3098
2872
|
}
|
|
3099
2873
|
};
|
|
2874
|
+
|
|
3100
2875
|
/**
|
|
3101
2876
|
* @param {SweetAlert2} instance
|
|
3102
2877
|
* @param {any} value
|
|
3103
2878
|
*/
|
|
3104
|
-
|
|
3105
|
-
|
|
3106
2879
|
const succeedWith = (instance, value) => {
|
|
3107
2880
|
instance.close({
|
|
3108
2881
|
isConfirmed: true,
|
|
3109
2882
|
value
|
|
3110
2883
|
});
|
|
3111
2884
|
};
|
|
2885
|
+
|
|
3112
2886
|
/**
|
|
3113
2887
|
*
|
|
3114
2888
|
* @param {SweetAlert2} instance
|
|
3115
2889
|
* @param {string} error
|
|
3116
2890
|
*/
|
|
3117
|
-
|
|
3118
|
-
|
|
3119
2891
|
const rejectWith = (instance, error$$1) => {
|
|
3120
2892
|
// @ts-ignore
|
|
3121
2893
|
instance.rejectPromise(error$$1);
|
|
3122
2894
|
};
|
|
2895
|
+
|
|
3123
2896
|
/**
|
|
3124
2897
|
*
|
|
3125
2898
|
* @param {SweetAlert2} instance
|
|
3126
2899
|
* @param {any} value
|
|
3127
2900
|
*/
|
|
3128
|
-
|
|
3129
|
-
|
|
3130
2901
|
const confirm = (instance, value) => {
|
|
3131
2902
|
const innerParams = privateProps.innerParams.get(instance || undefined);
|
|
3132
|
-
|
|
3133
2903
|
if (innerParams.showLoaderOnConfirm) {
|
|
3134
2904
|
showLoading();
|
|
3135
2905
|
}
|
|
3136
|
-
|
|
3137
2906
|
if (innerParams.preConfirm) {
|
|
3138
2907
|
instance.resetValidationMessage();
|
|
3139
2908
|
privateProps.awaitingPromise.set(instance || undefined, true); // Flagging the instance as awaiting a promise so it's own promise's reject/resolve methods doesn't get destroyed until the result from this preConfirm's promise is received
|
|
3140
|
-
|
|
3141
2909
|
const preConfirmPromise = Promise.resolve().then(() => asPromise(innerParams.preConfirm(value, innerParams.validationMessage)));
|
|
3142
2910
|
preConfirmPromise.then(preConfirmValue => {
|
|
3143
2911
|
if (isVisible(getValidationMessage()) || preConfirmValue === false) {
|
|
@@ -3154,77 +2922,67 @@
|
|
|
3154
2922
|
|
|
3155
2923
|
const handlePopupClick = (instance, domCache, dismissWith) => {
|
|
3156
2924
|
const innerParams = privateProps.innerParams.get(instance);
|
|
3157
|
-
|
|
3158
2925
|
if (innerParams.toast) {
|
|
3159
2926
|
handleToastClick(instance, domCache, dismissWith);
|
|
3160
2927
|
} else {
|
|
3161
2928
|
// Ignore click events that had mousedown on the popup but mouseup on the container
|
|
3162
2929
|
// This can happen when the user drags a slider
|
|
3163
|
-
handleModalMousedown(domCache);
|
|
2930
|
+
handleModalMousedown(domCache);
|
|
3164
2931
|
|
|
2932
|
+
// Ignore click events that had mousedown on the container but mouseup on the popup
|
|
3165
2933
|
handleContainerMousedown(domCache);
|
|
3166
2934
|
handleModalClick(instance, domCache, dismissWith);
|
|
3167
2935
|
}
|
|
3168
2936
|
};
|
|
3169
|
-
|
|
3170
2937
|
const handleToastClick = (instance, domCache, dismissWith) => {
|
|
3171
2938
|
// Closing toast by internal click
|
|
3172
2939
|
domCache.popup.onclick = () => {
|
|
3173
2940
|
const innerParams = privateProps.innerParams.get(instance);
|
|
3174
|
-
|
|
3175
2941
|
if (innerParams && (isAnyButtonShown(innerParams) || innerParams.timer || innerParams.input)) {
|
|
3176
2942
|
return;
|
|
3177
2943
|
}
|
|
3178
|
-
|
|
3179
2944
|
dismissWith(DismissReason.close);
|
|
3180
2945
|
};
|
|
3181
2946
|
};
|
|
2947
|
+
|
|
3182
2948
|
/**
|
|
3183
2949
|
* @param {*} innerParams
|
|
3184
2950
|
* @returns {boolean}
|
|
3185
2951
|
*/
|
|
3186
|
-
|
|
3187
|
-
|
|
3188
2952
|
const isAnyButtonShown = innerParams => {
|
|
3189
2953
|
return innerParams.showConfirmButton || innerParams.showDenyButton || innerParams.showCancelButton || innerParams.showCloseButton;
|
|
3190
2954
|
};
|
|
3191
|
-
|
|
3192
2955
|
let ignoreOutsideClick = false;
|
|
3193
|
-
|
|
3194
2956
|
const handleModalMousedown = domCache => {
|
|
3195
2957
|
domCache.popup.onmousedown = () => {
|
|
3196
2958
|
domCache.container.onmouseup = function (e) {
|
|
3197
|
-
domCache.container.onmouseup = undefined;
|
|
2959
|
+
domCache.container.onmouseup = undefined;
|
|
2960
|
+
// We only check if the mouseup target is the container because usually it doesn't
|
|
3198
2961
|
// have any other direct children aside of the popup
|
|
3199
|
-
|
|
3200
2962
|
if (e.target === domCache.container) {
|
|
3201
2963
|
ignoreOutsideClick = true;
|
|
3202
2964
|
}
|
|
3203
2965
|
};
|
|
3204
2966
|
};
|
|
3205
2967
|
};
|
|
3206
|
-
|
|
3207
2968
|
const handleContainerMousedown = domCache => {
|
|
3208
2969
|
domCache.container.onmousedown = () => {
|
|
3209
2970
|
domCache.popup.onmouseup = function (e) {
|
|
3210
|
-
domCache.popup.onmouseup = undefined;
|
|
3211
|
-
|
|
2971
|
+
domCache.popup.onmouseup = undefined;
|
|
2972
|
+
// We also need to check if the mouseup target is a child of the popup
|
|
3212
2973
|
if (e.target === domCache.popup || domCache.popup.contains(e.target)) {
|
|
3213
2974
|
ignoreOutsideClick = true;
|
|
3214
2975
|
}
|
|
3215
2976
|
};
|
|
3216
2977
|
};
|
|
3217
2978
|
};
|
|
3218
|
-
|
|
3219
2979
|
const handleModalClick = (instance, domCache, dismissWith) => {
|
|
3220
2980
|
domCache.container.onclick = e => {
|
|
3221
2981
|
const innerParams = privateProps.innerParams.get(instance);
|
|
3222
|
-
|
|
3223
2982
|
if (ignoreOutsideClick) {
|
|
3224
2983
|
ignoreOutsideClick = false;
|
|
3225
2984
|
return;
|
|
3226
2985
|
}
|
|
3227
|
-
|
|
3228
2986
|
if (e.target === domCache.container && callIfFunction(innerParams.allowOutsideClick)) {
|
|
3229
2987
|
dismissWith(DismissReason.backdrop);
|
|
3230
2988
|
}
|
|
@@ -3232,18 +2990,14 @@
|
|
|
3232
2990
|
};
|
|
3233
2991
|
|
|
3234
2992
|
const isJqueryElement = elem => typeof elem === 'object' && elem.jquery;
|
|
3235
|
-
|
|
3236
2993
|
const isElement = elem => elem instanceof Element || isJqueryElement(elem);
|
|
3237
|
-
|
|
3238
2994
|
const argsToParams = args => {
|
|
3239
2995
|
const params = {};
|
|
3240
|
-
|
|
3241
2996
|
if (typeof args[0] === 'object' && !isElement(args[0])) {
|
|
3242
2997
|
Object.assign(params, args[0]);
|
|
3243
2998
|
} else {
|
|
3244
2999
|
['title', 'html', 'icon'].forEach((name, index) => {
|
|
3245
3000
|
const arg = args[index];
|
|
3246
|
-
|
|
3247
3001
|
if (typeof arg === 'string' || isElement(arg)) {
|
|
3248
3002
|
params[name] = arg;
|
|
3249
3003
|
} else if (arg !== undefined) {
|
|
@@ -3251,17 +3005,14 @@
|
|
|
3251
3005
|
}
|
|
3252
3006
|
});
|
|
3253
3007
|
}
|
|
3254
|
-
|
|
3255
3008
|
return params;
|
|
3256
3009
|
};
|
|
3257
3010
|
|
|
3258
3011
|
function fire() {
|
|
3259
3012
|
const Swal = this; // eslint-disable-line @typescript-eslint/no-this-alias
|
|
3260
|
-
|
|
3261
3013
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
3262
3014
|
args[_key] = arguments[_key];
|
|
3263
3015
|
}
|
|
3264
|
-
|
|
3265
3016
|
return new Swal(...args);
|
|
3266
3017
|
}
|
|
3267
3018
|
|
|
@@ -3288,9 +3039,7 @@
|
|
|
3288
3039
|
_main(params, priorityMixinParams) {
|
|
3289
3040
|
return super._main(params, Object.assign({}, mixinParams, priorityMixinParams));
|
|
3290
3041
|
}
|
|
3291
|
-
|
|
3292
3042
|
}
|
|
3293
|
-
|
|
3294
3043
|
return MixinSwal;
|
|
3295
3044
|
}
|
|
3296
3045
|
|
|
@@ -3300,30 +3049,29 @@
|
|
|
3300
3049
|
*
|
|
3301
3050
|
* @returns {number | undefined}
|
|
3302
3051
|
*/
|
|
3303
|
-
|
|
3304
3052
|
const getTimerLeft = () => {
|
|
3305
3053
|
return globalState.timeout && globalState.timeout.getTimerLeft();
|
|
3306
3054
|
};
|
|
3055
|
+
|
|
3307
3056
|
/**
|
|
3308
3057
|
* Stop timer. Returns number of milliseconds of timer remained.
|
|
3309
3058
|
* If `timer` parameter isn't set, returns undefined.
|
|
3310
3059
|
*
|
|
3311
3060
|
* @returns {number | undefined}
|
|
3312
3061
|
*/
|
|
3313
|
-
|
|
3314
3062
|
const stopTimer = () => {
|
|
3315
3063
|
if (globalState.timeout) {
|
|
3316
3064
|
stopTimerProgressBar();
|
|
3317
3065
|
return globalState.timeout.stop();
|
|
3318
3066
|
}
|
|
3319
3067
|
};
|
|
3068
|
+
|
|
3320
3069
|
/**
|
|
3321
3070
|
* Resume timer. Returns number of milliseconds of timer remained.
|
|
3322
3071
|
* If `timer` parameter isn't set, returns undefined.
|
|
3323
3072
|
*
|
|
3324
3073
|
* @returns {number | undefined}
|
|
3325
3074
|
*/
|
|
3326
|
-
|
|
3327
3075
|
const resumeTimer = () => {
|
|
3328
3076
|
if (globalState.timeout) {
|
|
3329
3077
|
const remaining = globalState.timeout.start();
|
|
@@ -3331,17 +3079,18 @@
|
|
|
3331
3079
|
return remaining;
|
|
3332
3080
|
}
|
|
3333
3081
|
};
|
|
3082
|
+
|
|
3334
3083
|
/**
|
|
3335
3084
|
* Resume timer. Returns number of milliseconds of timer remained.
|
|
3336
3085
|
* If `timer` parameter isn't set, returns undefined.
|
|
3337
3086
|
*
|
|
3338
3087
|
* @returns {number | undefined}
|
|
3339
3088
|
*/
|
|
3340
|
-
|
|
3341
3089
|
const toggleTimer = () => {
|
|
3342
3090
|
const timer = globalState.timeout;
|
|
3343
3091
|
return timer && (timer.running ? stopTimer() : resumeTimer());
|
|
3344
3092
|
};
|
|
3093
|
+
|
|
3345
3094
|
/**
|
|
3346
3095
|
* Increase timer. Returns number of milliseconds of an updated timer.
|
|
3347
3096
|
* If `timer` parameter isn't set, returns undefined.
|
|
@@ -3349,7 +3098,6 @@
|
|
|
3349
3098
|
* @param {number} n
|
|
3350
3099
|
* @returns {number | undefined}
|
|
3351
3100
|
*/
|
|
3352
|
-
|
|
3353
3101
|
const increaseTimer = n => {
|
|
3354
3102
|
if (globalState.timeout) {
|
|
3355
3103
|
const remaining = globalState.timeout.increase(n);
|
|
@@ -3357,6 +3105,7 @@
|
|
|
3357
3105
|
return remaining;
|
|
3358
3106
|
}
|
|
3359
3107
|
};
|
|
3108
|
+
|
|
3360
3109
|
/**
|
|
3361
3110
|
* Check if timer is running. Returns true if timer is running
|
|
3362
3111
|
* or false if timer is paused or stopped.
|
|
@@ -3364,7 +3113,6 @@
|
|
|
3364
3113
|
*
|
|
3365
3114
|
* @returns {boolean}
|
|
3366
3115
|
*/
|
|
3367
|
-
|
|
3368
3116
|
const isTimerRunning = () => {
|
|
3369
3117
|
return globalState.timeout && globalState.timeout.isRunning();
|
|
3370
3118
|
};
|
|
@@ -3374,18 +3122,15 @@
|
|
|
3374
3122
|
function bindClickHandler() {
|
|
3375
3123
|
let attr = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'data-swal-template';
|
|
3376
3124
|
clickHandlers[attr] = this;
|
|
3377
|
-
|
|
3378
3125
|
if (!bodyClickListenerAdded) {
|
|
3379
3126
|
document.body.addEventListener('click', bodyClickListener);
|
|
3380
3127
|
bodyClickListenerAdded = true;
|
|
3381
3128
|
}
|
|
3382
3129
|
}
|
|
3383
|
-
|
|
3384
3130
|
const bodyClickListener = event => {
|
|
3385
3131
|
for (let el = event.target; el && el !== document; el = el.parentNode) {
|
|
3386
3132
|
for (const attr in clickHandlers) {
|
|
3387
3133
|
const template = el.getAttribute(attr);
|
|
3388
|
-
|
|
3389
3134
|
if (template) {
|
|
3390
3135
|
clickHandlers[attr].fire({
|
|
3391
3136
|
template
|
|
@@ -3413,6 +3158,7 @@
|
|
|
3413
3158
|
getHtmlContainer: getHtmlContainer,
|
|
3414
3159
|
getImage: getImage,
|
|
3415
3160
|
getIcon: getIcon,
|
|
3161
|
+
getIconContent: getIconContent,
|
|
3416
3162
|
getInputLabel: getInputLabel,
|
|
3417
3163
|
getCloseButton: getCloseButton,
|
|
3418
3164
|
getActions: getActions,
|
|
@@ -3449,94 +3195,76 @@
|
|
|
3449
3195
|
this.running = false;
|
|
3450
3196
|
this.start();
|
|
3451
3197
|
}
|
|
3452
|
-
|
|
3453
3198
|
start() {
|
|
3454
3199
|
if (!this.running) {
|
|
3455
3200
|
this.running = true;
|
|
3456
3201
|
this.started = new Date();
|
|
3457
3202
|
this.id = setTimeout(this.callback, this.remaining);
|
|
3458
3203
|
}
|
|
3459
|
-
|
|
3460
3204
|
return this.remaining;
|
|
3461
3205
|
}
|
|
3462
|
-
|
|
3463
3206
|
stop() {
|
|
3464
3207
|
if (this.running) {
|
|
3465
3208
|
this.running = false;
|
|
3466
3209
|
clearTimeout(this.id);
|
|
3467
3210
|
this.remaining -= new Date().getTime() - this.started.getTime();
|
|
3468
3211
|
}
|
|
3469
|
-
|
|
3470
3212
|
return this.remaining;
|
|
3471
3213
|
}
|
|
3472
|
-
|
|
3473
3214
|
increase(n) {
|
|
3474
3215
|
const running = this.running;
|
|
3475
|
-
|
|
3476
3216
|
if (running) {
|
|
3477
3217
|
this.stop();
|
|
3478
3218
|
}
|
|
3479
|
-
|
|
3480
3219
|
this.remaining += n;
|
|
3481
|
-
|
|
3482
3220
|
if (running) {
|
|
3483
3221
|
this.start();
|
|
3484
3222
|
}
|
|
3485
|
-
|
|
3486
3223
|
return this.remaining;
|
|
3487
3224
|
}
|
|
3488
|
-
|
|
3489
3225
|
getTimerLeft() {
|
|
3490
3226
|
if (this.running) {
|
|
3491
3227
|
this.stop();
|
|
3492
3228
|
this.start();
|
|
3493
3229
|
}
|
|
3494
|
-
|
|
3495
3230
|
return this.remaining;
|
|
3496
3231
|
}
|
|
3497
|
-
|
|
3498
3232
|
isRunning() {
|
|
3499
3233
|
return this.running;
|
|
3500
3234
|
}
|
|
3501
|
-
|
|
3502
3235
|
}
|
|
3503
3236
|
|
|
3504
3237
|
const swalStringParams = ['swal-title', 'swal-html', 'swal-footer'];
|
|
3238
|
+
|
|
3505
3239
|
/**
|
|
3506
3240
|
* @param {SweetAlertOptions} params
|
|
3507
3241
|
* @returns {SweetAlertOptions}
|
|
3508
3242
|
*/
|
|
3509
|
-
|
|
3510
3243
|
const getTemplateParams = params => {
|
|
3511
3244
|
/** @type {HTMLTemplateElement} */
|
|
3512
3245
|
const template = typeof params.template === 'string' ? document.querySelector(params.template) : params.template;
|
|
3513
|
-
|
|
3514
3246
|
if (!template) {
|
|
3515
3247
|
return {};
|
|
3516
3248
|
}
|
|
3517
3249
|
/** @type {DocumentFragment} */
|
|
3518
|
-
|
|
3519
|
-
|
|
3520
3250
|
const templateContent = template.content;
|
|
3521
3251
|
showWarningsForElements(templateContent);
|
|
3522
3252
|
const result = Object.assign(getSwalParams(templateContent), getSwalFunctionParams(templateContent), getSwalButtons(templateContent), getSwalImage(templateContent), getSwalIcon(templateContent), getSwalInput(templateContent), getSwalStringParams(templateContent, swalStringParams));
|
|
3523
3253
|
return result;
|
|
3524
3254
|
};
|
|
3255
|
+
|
|
3525
3256
|
/**
|
|
3526
3257
|
* @param {DocumentFragment} templateContent
|
|
3527
3258
|
* @returns {SweetAlertOptions}
|
|
3528
3259
|
*/
|
|
3529
|
-
|
|
3530
3260
|
const getSwalParams = templateContent => {
|
|
3531
3261
|
const result = {};
|
|
3532
3262
|
/** @type {HTMLElement[]} */
|
|
3533
|
-
|
|
3534
3263
|
const swalParams = Array.from(templateContent.querySelectorAll('swal-param'));
|
|
3535
3264
|
swalParams.forEach(param => {
|
|
3536
3265
|
showWarningsForAttributes(param, ['name', 'value']);
|
|
3537
3266
|
const paramName = param.getAttribute('name');
|
|
3538
3267
|
const value = param.getAttribute('value');
|
|
3539
|
-
|
|
3540
3268
|
if (typeof defaultParams[paramName] === 'boolean') {
|
|
3541
3269
|
result[paramName] = value !== 'false';
|
|
3542
3270
|
} else if (typeof defaultParams[paramName] === 'object') {
|
|
@@ -3547,16 +3275,14 @@
|
|
|
3547
3275
|
});
|
|
3548
3276
|
return result;
|
|
3549
3277
|
};
|
|
3278
|
+
|
|
3550
3279
|
/**
|
|
3551
3280
|
* @param {DocumentFragment} templateContent
|
|
3552
3281
|
* @returns {SweetAlertOptions}
|
|
3553
3282
|
*/
|
|
3554
|
-
|
|
3555
|
-
|
|
3556
3283
|
const getSwalFunctionParams = templateContent => {
|
|
3557
3284
|
const result = {};
|
|
3558
3285
|
/** @type {HTMLElement[]} */
|
|
3559
|
-
|
|
3560
3286
|
const swalFunctions = Array.from(templateContent.querySelectorAll('swal-function-param'));
|
|
3561
3287
|
swalFunctions.forEach(param => {
|
|
3562
3288
|
const paramName = param.getAttribute('name');
|
|
@@ -3565,133 +3291,104 @@
|
|
|
3565
3291
|
});
|
|
3566
3292
|
return result;
|
|
3567
3293
|
};
|
|
3294
|
+
|
|
3568
3295
|
/**
|
|
3569
3296
|
* @param {DocumentFragment} templateContent
|
|
3570
3297
|
* @returns {SweetAlertOptions}
|
|
3571
3298
|
*/
|
|
3572
|
-
|
|
3573
|
-
|
|
3574
3299
|
const getSwalButtons = templateContent => {
|
|
3575
3300
|
const result = {};
|
|
3576
3301
|
/** @type {HTMLElement[]} */
|
|
3577
|
-
|
|
3578
3302
|
const swalButtons = Array.from(templateContent.querySelectorAll('swal-button'));
|
|
3579
3303
|
swalButtons.forEach(button => {
|
|
3580
3304
|
showWarningsForAttributes(button, ['type', 'color', 'aria-label']);
|
|
3581
3305
|
const type = button.getAttribute('type');
|
|
3582
3306
|
result["".concat(type, "ButtonText")] = button.innerHTML;
|
|
3583
3307
|
result["show".concat(capitalizeFirstLetter(type), "Button")] = true;
|
|
3584
|
-
|
|
3585
3308
|
if (button.hasAttribute('color')) {
|
|
3586
3309
|
result["".concat(type, "ButtonColor")] = button.getAttribute('color');
|
|
3587
3310
|
}
|
|
3588
|
-
|
|
3589
3311
|
if (button.hasAttribute('aria-label')) {
|
|
3590
3312
|
result["".concat(type, "ButtonAriaLabel")] = button.getAttribute('aria-label');
|
|
3591
3313
|
}
|
|
3592
3314
|
});
|
|
3593
3315
|
return result;
|
|
3594
3316
|
};
|
|
3317
|
+
|
|
3595
3318
|
/**
|
|
3596
3319
|
* @param {DocumentFragment} templateContent
|
|
3597
3320
|
* @returns {SweetAlertOptions}
|
|
3598
3321
|
*/
|
|
3599
|
-
|
|
3600
|
-
|
|
3601
3322
|
const getSwalImage = templateContent => {
|
|
3602
3323
|
const result = {};
|
|
3603
3324
|
/** @type {HTMLElement} */
|
|
3604
|
-
|
|
3605
3325
|
const image = templateContent.querySelector('swal-image');
|
|
3606
|
-
|
|
3607
3326
|
if (image) {
|
|
3608
3327
|
showWarningsForAttributes(image, ['src', 'width', 'height', 'alt']);
|
|
3609
|
-
|
|
3610
3328
|
if (image.hasAttribute('src')) {
|
|
3611
3329
|
result.imageUrl = image.getAttribute('src');
|
|
3612
3330
|
}
|
|
3613
|
-
|
|
3614
3331
|
if (image.hasAttribute('width')) {
|
|
3615
3332
|
result.imageWidth = image.getAttribute('width');
|
|
3616
3333
|
}
|
|
3617
|
-
|
|
3618
3334
|
if (image.hasAttribute('height')) {
|
|
3619
3335
|
result.imageHeight = image.getAttribute('height');
|
|
3620
3336
|
}
|
|
3621
|
-
|
|
3622
3337
|
if (image.hasAttribute('alt')) {
|
|
3623
3338
|
result.imageAlt = image.getAttribute('alt');
|
|
3624
3339
|
}
|
|
3625
3340
|
}
|
|
3626
|
-
|
|
3627
3341
|
return result;
|
|
3628
3342
|
};
|
|
3343
|
+
|
|
3629
3344
|
/**
|
|
3630
3345
|
* @param {DocumentFragment} templateContent
|
|
3631
3346
|
* @returns {SweetAlertOptions}
|
|
3632
3347
|
*/
|
|
3633
|
-
|
|
3634
|
-
|
|
3635
3348
|
const getSwalIcon = templateContent => {
|
|
3636
3349
|
const result = {};
|
|
3637
3350
|
/** @type {HTMLElement} */
|
|
3638
|
-
|
|
3639
3351
|
const icon = templateContent.querySelector('swal-icon');
|
|
3640
|
-
|
|
3641
3352
|
if (icon) {
|
|
3642
3353
|
showWarningsForAttributes(icon, ['type', 'color']);
|
|
3643
|
-
|
|
3644
3354
|
if (icon.hasAttribute('type')) {
|
|
3645
3355
|
/** @type {SweetAlertIcon} */
|
|
3646
3356
|
// @ts-ignore
|
|
3647
3357
|
result.icon = icon.getAttribute('type');
|
|
3648
3358
|
}
|
|
3649
|
-
|
|
3650
3359
|
if (icon.hasAttribute('color')) {
|
|
3651
3360
|
result.iconColor = icon.getAttribute('color');
|
|
3652
3361
|
}
|
|
3653
|
-
|
|
3654
3362
|
result.iconHtml = icon.innerHTML;
|
|
3655
3363
|
}
|
|
3656
|
-
|
|
3657
3364
|
return result;
|
|
3658
3365
|
};
|
|
3366
|
+
|
|
3659
3367
|
/**
|
|
3660
3368
|
* @param {DocumentFragment} templateContent
|
|
3661
3369
|
* @returns {SweetAlertOptions}
|
|
3662
3370
|
*/
|
|
3663
|
-
|
|
3664
|
-
|
|
3665
3371
|
const getSwalInput = templateContent => {
|
|
3666
3372
|
const result = {};
|
|
3667
3373
|
/** @type {HTMLElement} */
|
|
3668
|
-
|
|
3669
3374
|
const input = templateContent.querySelector('swal-input');
|
|
3670
|
-
|
|
3671
3375
|
if (input) {
|
|
3672
3376
|
showWarningsForAttributes(input, ['type', 'label', 'placeholder', 'value']);
|
|
3673
3377
|
/** @type {SweetAlertInput} */
|
|
3674
3378
|
// @ts-ignore
|
|
3675
|
-
|
|
3676
3379
|
result.input = input.getAttribute('type') || 'text';
|
|
3677
|
-
|
|
3678
3380
|
if (input.hasAttribute('label')) {
|
|
3679
3381
|
result.inputLabel = input.getAttribute('label');
|
|
3680
3382
|
}
|
|
3681
|
-
|
|
3682
3383
|
if (input.hasAttribute('placeholder')) {
|
|
3683
3384
|
result.inputPlaceholder = input.getAttribute('placeholder');
|
|
3684
3385
|
}
|
|
3685
|
-
|
|
3686
3386
|
if (input.hasAttribute('value')) {
|
|
3687
3387
|
result.inputValue = input.getAttribute('value');
|
|
3688
3388
|
}
|
|
3689
3389
|
}
|
|
3690
3390
|
/** @type {HTMLElement[]} */
|
|
3691
|
-
|
|
3692
|
-
|
|
3693
3391
|
const inputOptions = Array.from(templateContent.querySelectorAll('swal-input-option'));
|
|
3694
|
-
|
|
3695
3392
|
if (inputOptions.length) {
|
|
3696
3393
|
result.inputOptions = {};
|
|
3697
3394
|
inputOptions.forEach(option => {
|
|
@@ -3701,54 +3398,45 @@
|
|
|
3701
3398
|
result.inputOptions[optionValue] = optionName;
|
|
3702
3399
|
});
|
|
3703
3400
|
}
|
|
3704
|
-
|
|
3705
3401
|
return result;
|
|
3706
3402
|
};
|
|
3403
|
+
|
|
3707
3404
|
/**
|
|
3708
3405
|
* @param {DocumentFragment} templateContent
|
|
3709
3406
|
* @param {string[]} paramNames
|
|
3710
3407
|
* @returns {SweetAlertOptions}
|
|
3711
3408
|
*/
|
|
3712
|
-
|
|
3713
|
-
|
|
3714
3409
|
const getSwalStringParams = (templateContent, paramNames) => {
|
|
3715
3410
|
const result = {};
|
|
3716
|
-
|
|
3717
3411
|
for (const i in paramNames) {
|
|
3718
3412
|
const paramName = paramNames[i];
|
|
3719
3413
|
/** @type {HTMLElement} */
|
|
3720
|
-
|
|
3721
3414
|
const tag = templateContent.querySelector(paramName);
|
|
3722
|
-
|
|
3723
3415
|
if (tag) {
|
|
3724
3416
|
showWarningsForAttributes(tag, []);
|
|
3725
3417
|
result[paramName.replace(/^swal-/, '')] = tag.innerHTML.trim();
|
|
3726
3418
|
}
|
|
3727
3419
|
}
|
|
3728
|
-
|
|
3729
3420
|
return result;
|
|
3730
3421
|
};
|
|
3422
|
+
|
|
3731
3423
|
/**
|
|
3732
3424
|
* @param {DocumentFragment} templateContent
|
|
3733
3425
|
*/
|
|
3734
|
-
|
|
3735
|
-
|
|
3736
3426
|
const showWarningsForElements = templateContent => {
|
|
3737
3427
|
const allowedElements = swalStringParams.concat(['swal-param', 'swal-function-param', 'swal-button', 'swal-image', 'swal-icon', 'swal-input', 'swal-input-option']);
|
|
3738
3428
|
Array.from(templateContent.children).forEach(el => {
|
|
3739
3429
|
const tagName = el.tagName.toLowerCase();
|
|
3740
|
-
|
|
3741
3430
|
if (!allowedElements.includes(tagName)) {
|
|
3742
3431
|
warn("Unrecognized element <".concat(tagName, ">"));
|
|
3743
3432
|
}
|
|
3744
3433
|
});
|
|
3745
3434
|
};
|
|
3435
|
+
|
|
3746
3436
|
/**
|
|
3747
3437
|
* @param {HTMLElement} el
|
|
3748
3438
|
* @param {string[]} allowedAttributes
|
|
3749
3439
|
*/
|
|
3750
|
-
|
|
3751
|
-
|
|
3752
3440
|
const showWarningsForAttributes = (el, allowedAttributes) => {
|
|
3753
3441
|
Array.from(el.attributes).forEach(attribute => {
|
|
3754
3442
|
if (allowedAttributes.indexOf(attribute.name) === -1) {
|
|
@@ -3758,64 +3446,56 @@
|
|
|
3758
3446
|
};
|
|
3759
3447
|
|
|
3760
3448
|
const SHOW_CLASS_TIMEOUT = 10;
|
|
3449
|
+
|
|
3761
3450
|
/**
|
|
3762
3451
|
* Open popup, add necessary classes and styles, fix scrollbar
|
|
3763
3452
|
*
|
|
3764
3453
|
* @param {SweetAlertOptions} params
|
|
3765
3454
|
*/
|
|
3766
|
-
|
|
3767
3455
|
const openPopup = params => {
|
|
3768
3456
|
const container = getContainer();
|
|
3769
3457
|
const popup = getPopup();
|
|
3770
|
-
|
|
3771
3458
|
if (typeof params.willOpen === 'function') {
|
|
3772
3459
|
params.willOpen(popup);
|
|
3773
3460
|
}
|
|
3774
|
-
|
|
3775
3461
|
const bodyStyles = window.getComputedStyle(document.body);
|
|
3776
3462
|
const initialBodyOverflow = bodyStyles.overflowY;
|
|
3777
|
-
addClasses$1(container, popup, params);
|
|
3463
|
+
addClasses$1(container, popup, params);
|
|
3778
3464
|
|
|
3465
|
+
// scrolling is 'hidden' until animation is done, after that 'auto'
|
|
3779
3466
|
setTimeout(() => {
|
|
3780
3467
|
setScrollingVisibility(container, popup);
|
|
3781
3468
|
}, SHOW_CLASS_TIMEOUT);
|
|
3782
|
-
|
|
3783
3469
|
if (isModal()) {
|
|
3784
3470
|
fixScrollContainer(container, params.scrollbarPadding, initialBodyOverflow);
|
|
3785
3471
|
setAriaHidden();
|
|
3786
3472
|
}
|
|
3787
|
-
|
|
3788
3473
|
if (!isToast() && !globalState.previousActiveElement) {
|
|
3789
3474
|
globalState.previousActiveElement = document.activeElement;
|
|
3790
3475
|
}
|
|
3791
|
-
|
|
3792
3476
|
if (typeof params.didOpen === 'function') {
|
|
3793
3477
|
setTimeout(() => params.didOpen(popup));
|
|
3794
3478
|
}
|
|
3795
|
-
|
|
3796
3479
|
removeClass(container, swalClasses['no-transition']);
|
|
3797
3480
|
};
|
|
3481
|
+
|
|
3798
3482
|
/**
|
|
3799
3483
|
* @param {AnimationEvent} event
|
|
3800
3484
|
*/
|
|
3801
|
-
|
|
3802
3485
|
const swalOpenAnimationFinished = event => {
|
|
3803
3486
|
const popup = getPopup();
|
|
3804
|
-
|
|
3805
3487
|
if (event.target !== popup) {
|
|
3806
3488
|
return;
|
|
3807
3489
|
}
|
|
3808
|
-
|
|
3809
3490
|
const container = getContainer();
|
|
3810
3491
|
popup.removeEventListener(animationEndEvent, swalOpenAnimationFinished);
|
|
3811
3492
|
container.style.overflowY = 'auto';
|
|
3812
3493
|
};
|
|
3494
|
+
|
|
3813
3495
|
/**
|
|
3814
3496
|
* @param {HTMLElement} container
|
|
3815
3497
|
* @param {HTMLElement} popup
|
|
3816
3498
|
*/
|
|
3817
|
-
|
|
3818
|
-
|
|
3819
3499
|
const setScrollingVisibility = (container, popup) => {
|
|
3820
3500
|
if (animationEndEvent && hasCssAnimation(popup)) {
|
|
3821
3501
|
container.style.overflowY = 'hidden';
|
|
@@ -3824,46 +3504,42 @@
|
|
|
3824
3504
|
container.style.overflowY = 'auto';
|
|
3825
3505
|
}
|
|
3826
3506
|
};
|
|
3507
|
+
|
|
3827
3508
|
/**
|
|
3828
3509
|
* @param {HTMLElement} container
|
|
3829
3510
|
* @param {boolean} scrollbarPadding
|
|
3830
3511
|
* @param {string} initialBodyOverflow
|
|
3831
3512
|
*/
|
|
3832
|
-
|
|
3833
|
-
|
|
3834
3513
|
const fixScrollContainer = (container, scrollbarPadding, initialBodyOverflow) => {
|
|
3835
3514
|
iOSfix();
|
|
3836
|
-
|
|
3837
3515
|
if (scrollbarPadding && initialBodyOverflow !== 'hidden') {
|
|
3838
3516
|
fixScrollbar();
|
|
3839
|
-
}
|
|
3840
|
-
|
|
3517
|
+
}
|
|
3841
3518
|
|
|
3519
|
+
// sweetalert2/issues/1247
|
|
3842
3520
|
setTimeout(() => {
|
|
3843
3521
|
container.scrollTop = 0;
|
|
3844
3522
|
});
|
|
3845
3523
|
};
|
|
3524
|
+
|
|
3846
3525
|
/**
|
|
3847
3526
|
* @param {HTMLElement} container
|
|
3848
3527
|
* @param {HTMLElement} popup
|
|
3849
3528
|
* @param {SweetAlertOptions} params
|
|
3850
3529
|
*/
|
|
3851
|
-
|
|
3852
|
-
|
|
3853
3530
|
const addClasses$1 = (container, popup, params) => {
|
|
3854
|
-
addClass(container, params.showClass.backdrop);
|
|
3855
|
-
|
|
3531
|
+
addClass(container, params.showClass.backdrop);
|
|
3532
|
+
// this workaround with opacity is needed for https://github.com/sweetalert2/sweetalert2/issues/2059
|
|
3856
3533
|
popup.style.setProperty('opacity', '0', 'important');
|
|
3857
3534
|
show(popup, 'grid');
|
|
3858
3535
|
setTimeout(() => {
|
|
3859
3536
|
// Animate popup right after showing it
|
|
3860
|
-
addClass(popup, params.showClass.popup);
|
|
3861
|
-
|
|
3537
|
+
addClass(popup, params.showClass.popup);
|
|
3538
|
+
// and remove the opacity workaround
|
|
3862
3539
|
popup.style.removeProperty('opacity');
|
|
3863
3540
|
}, SHOW_CLASS_TIMEOUT); // 10ms in order to fix #2062
|
|
3864
3541
|
|
|
3865
3542
|
addClass([document.documentElement, document.body], swalClasses.shown);
|
|
3866
|
-
|
|
3867
3543
|
if (params.heightAuto && params.backdrop && !params.toast) {
|
|
3868
3544
|
addClass([document.documentElement, document.body], swalClasses['height-auto']);
|
|
3869
3545
|
}
|
|
@@ -3878,7 +3554,6 @@
|
|
|
3878
3554
|
email: (string, validationMessage) => {
|
|
3879
3555
|
return /^[a-zA-Z0-9.+_-]+@[a-zA-Z0-9.-]+\.[a-zA-Z0-9-]{2,24}$/.test(string) ? Promise.resolve() : Promise.resolve(validationMessage || 'Invalid email address');
|
|
3880
3556
|
},
|
|
3881
|
-
|
|
3882
3557
|
/**
|
|
3883
3558
|
* @param {string} string
|
|
3884
3559
|
* @param {string} validationMessage
|
|
@@ -3893,7 +3568,6 @@
|
|
|
3893
3568
|
/**
|
|
3894
3569
|
* @param {SweetAlertOptions} params
|
|
3895
3570
|
*/
|
|
3896
|
-
|
|
3897
3571
|
function setDefaultInputValidators(params) {
|
|
3898
3572
|
// Use default `inputValidator` for supported input types if not provided
|
|
3899
3573
|
if (!params.inputValidator) {
|
|
@@ -3904,11 +3578,10 @@
|
|
|
3904
3578
|
});
|
|
3905
3579
|
}
|
|
3906
3580
|
}
|
|
3581
|
+
|
|
3907
3582
|
/**
|
|
3908
3583
|
* @param {SweetAlertOptions} params
|
|
3909
3584
|
*/
|
|
3910
|
-
|
|
3911
|
-
|
|
3912
3585
|
function validateCustomTargetElement(params) {
|
|
3913
3586
|
// Determine if the custom target element is valid
|
|
3914
3587
|
if (!params.target || typeof params.target === 'string' && !document.querySelector(params.target) || typeof params.target !== 'string' && !params.target.appendChild) {
|
|
@@ -3916,44 +3589,41 @@
|
|
|
3916
3589
|
params.target = 'body';
|
|
3917
3590
|
}
|
|
3918
3591
|
}
|
|
3592
|
+
|
|
3919
3593
|
/**
|
|
3920
3594
|
* Set type, text and actions on popup
|
|
3921
3595
|
*
|
|
3922
3596
|
* @param {SweetAlertOptions} params
|
|
3923
3597
|
*/
|
|
3924
|
-
|
|
3925
|
-
|
|
3926
3598
|
function setParameters(params) {
|
|
3927
|
-
setDefaultInputValidators(params);
|
|
3599
|
+
setDefaultInputValidators(params);
|
|
3928
3600
|
|
|
3601
|
+
// showLoaderOnConfirm && preConfirm
|
|
3929
3602
|
if (params.showLoaderOnConfirm && !params.preConfirm) {
|
|
3930
3603
|
warn('showLoaderOnConfirm is set to true, but preConfirm is not defined.\n' + 'showLoaderOnConfirm should be used together with preConfirm, see usage example:\n' + 'https://sweetalert2.github.io/#ajax-request');
|
|
3931
3604
|
}
|
|
3605
|
+
validateCustomTargetElement(params);
|
|
3932
3606
|
|
|
3933
|
-
|
|
3934
|
-
|
|
3607
|
+
// Replace newlines with <br> in title
|
|
3935
3608
|
if (typeof params.title === 'string') {
|
|
3936
3609
|
params.title = params.title.split('\n').join('<br />');
|
|
3937
3610
|
}
|
|
3938
|
-
|
|
3939
3611
|
init(params);
|
|
3940
3612
|
}
|
|
3941
3613
|
|
|
3942
3614
|
let currentInstance;
|
|
3943
|
-
|
|
3944
3615
|
class SweetAlert {
|
|
3945
3616
|
constructor() {
|
|
3946
3617
|
// Prevent run in Node env
|
|
3947
3618
|
if (typeof window === 'undefined') {
|
|
3948
3619
|
return;
|
|
3949
3620
|
}
|
|
3621
|
+
currentInstance = this;
|
|
3950
3622
|
|
|
3951
|
-
|
|
3952
|
-
|
|
3623
|
+
// @ts-ignore
|
|
3953
3624
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
3954
3625
|
args[_key] = arguments[_key];
|
|
3955
3626
|
}
|
|
3956
|
-
|
|
3957
3627
|
const outerParams = Object.freeze(this.constructor.argsToParams(args));
|
|
3958
3628
|
Object.defineProperties(this, {
|
|
3959
3629
|
params: {
|
|
@@ -3962,68 +3632,61 @@
|
|
|
3962
3632
|
enumerable: true,
|
|
3963
3633
|
configurable: true
|
|
3964
3634
|
}
|
|
3965
|
-
});
|
|
3635
|
+
});
|
|
3966
3636
|
|
|
3637
|
+
// @ts-ignore
|
|
3967
3638
|
const promise = currentInstance._main(currentInstance.params);
|
|
3968
|
-
|
|
3969
3639
|
privateProps.promise.set(this, promise);
|
|
3970
3640
|
}
|
|
3971
|
-
|
|
3972
3641
|
_main(userParams) {
|
|
3973
3642
|
let mixinParams = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
3974
3643
|
showWarningsForParams(Object.assign({}, mixinParams, userParams));
|
|
3975
|
-
|
|
3976
3644
|
if (globalState.currentInstance) {
|
|
3977
3645
|
// @ts-ignore
|
|
3978
3646
|
globalState.currentInstance._destroy();
|
|
3979
|
-
|
|
3980
3647
|
if (isModal()) {
|
|
3981
3648
|
unsetAriaHidden();
|
|
3982
3649
|
}
|
|
3983
3650
|
}
|
|
3984
|
-
|
|
3985
3651
|
globalState.currentInstance = currentInstance;
|
|
3986
3652
|
const innerParams = prepareParams(userParams, mixinParams);
|
|
3987
3653
|
setParameters(innerParams);
|
|
3988
|
-
Object.freeze(innerParams);
|
|
3654
|
+
Object.freeze(innerParams);
|
|
3989
3655
|
|
|
3656
|
+
// clear the previous timer
|
|
3990
3657
|
if (globalState.timeout) {
|
|
3991
3658
|
globalState.timeout.stop();
|
|
3992
3659
|
delete globalState.timeout;
|
|
3993
|
-
}
|
|
3994
|
-
|
|
3660
|
+
}
|
|
3995
3661
|
|
|
3662
|
+
// clear the restore focus timeout
|
|
3996
3663
|
clearTimeout(globalState.restoreFocusTimeout);
|
|
3997
3664
|
const domCache = populateDomCache(currentInstance);
|
|
3998
3665
|
render(currentInstance, innerParams);
|
|
3999
3666
|
privateProps.innerParams.set(currentInstance, innerParams);
|
|
4000
3667
|
return swalPromise(currentInstance, domCache, innerParams);
|
|
4001
|
-
}
|
|
4002
|
-
|
|
3668
|
+
}
|
|
4003
3669
|
|
|
3670
|
+
// `catch` cannot be the name of a module export, so we define our thenable methods here instead
|
|
4004
3671
|
then(onFulfilled) {
|
|
4005
3672
|
const promise = privateProps.promise.get(this);
|
|
4006
3673
|
return promise.then(onFulfilled);
|
|
4007
3674
|
}
|
|
4008
|
-
|
|
4009
3675
|
finally(onFinally) {
|
|
4010
3676
|
const promise = privateProps.promise.get(this);
|
|
4011
3677
|
return promise.finally(onFinally);
|
|
4012
3678
|
}
|
|
4013
|
-
|
|
4014
3679
|
}
|
|
3680
|
+
|
|
4015
3681
|
/**
|
|
4016
3682
|
* @param {SweetAlert2} instance
|
|
4017
3683
|
* @param {DomCache} domCache
|
|
4018
3684
|
* @param {SweetAlertOptions} innerParams
|
|
4019
3685
|
* @returns {Promise}
|
|
4020
3686
|
*/
|
|
4021
|
-
|
|
4022
|
-
|
|
4023
3687
|
const swalPromise = (instance, domCache, innerParams) => {
|
|
4024
3688
|
return new Promise((resolve, reject) => {
|
|
4025
3689
|
// functions to handle all closings/dismissals
|
|
4026
|
-
|
|
4027
3690
|
/**
|
|
4028
3691
|
* @param {DismissReason} dismiss
|
|
4029
3692
|
*/
|
|
@@ -4034,60 +3697,52 @@
|
|
|
4034
3697
|
dismiss
|
|
4035
3698
|
});
|
|
4036
3699
|
};
|
|
4037
|
-
|
|
4038
3700
|
privateMethods.swalPromiseResolve.set(instance, resolve);
|
|
4039
3701
|
privateMethods.swalPromiseReject.set(instance, reject);
|
|
4040
|
-
|
|
4041
3702
|
domCache.confirmButton.onclick = () => {
|
|
4042
3703
|
handleConfirmButtonClick(instance);
|
|
4043
3704
|
};
|
|
4044
|
-
|
|
4045
3705
|
domCache.denyButton.onclick = () => {
|
|
4046
3706
|
handleDenyButtonClick(instance);
|
|
4047
3707
|
};
|
|
4048
|
-
|
|
4049
3708
|
domCache.cancelButton.onclick = () => {
|
|
4050
3709
|
handleCancelButtonClick(instance, dismissWith);
|
|
4051
3710
|
};
|
|
4052
|
-
|
|
4053
3711
|
domCache.closeButton.onclick = () => {
|
|
4054
3712
|
// @ts-ignore
|
|
4055
3713
|
dismissWith(DismissReason.close);
|
|
4056
3714
|
};
|
|
4057
|
-
|
|
4058
3715
|
handlePopupClick(instance, domCache, dismissWith);
|
|
4059
3716
|
addKeydownHandler(instance, globalState, innerParams, dismissWith);
|
|
4060
3717
|
handleInputOptionsAndValue(instance, innerParams);
|
|
4061
3718
|
openPopup(innerParams);
|
|
4062
3719
|
setupTimer(globalState, innerParams, dismissWith);
|
|
4063
|
-
initFocus(domCache, innerParams);
|
|
3720
|
+
initFocus(domCache, innerParams);
|
|
4064
3721
|
|
|
3722
|
+
// Scroll container to top on open (#1247, #1946)
|
|
4065
3723
|
setTimeout(() => {
|
|
4066
3724
|
domCache.container.scrollTop = 0;
|
|
4067
3725
|
});
|
|
4068
3726
|
});
|
|
4069
3727
|
};
|
|
3728
|
+
|
|
4070
3729
|
/**
|
|
4071
3730
|
* @param {SweetAlertOptions} userParams
|
|
4072
3731
|
* @param {SweetAlertOptions} mixinParams
|
|
4073
3732
|
* @returns {SweetAlertOptions}
|
|
4074
3733
|
*/
|
|
4075
|
-
|
|
4076
|
-
|
|
4077
3734
|
const prepareParams = (userParams, mixinParams) => {
|
|
4078
3735
|
const templateParams = getTemplateParams(userParams);
|
|
4079
3736
|
const params = Object.assign({}, defaultParams, mixinParams, templateParams, userParams); // precedence is described in #2131
|
|
4080
|
-
|
|
4081
3737
|
params.showClass = Object.assign({}, defaultParams.showClass, params.showClass);
|
|
4082
3738
|
params.hideClass = Object.assign({}, defaultParams.hideClass, params.hideClass);
|
|
4083
3739
|
return params;
|
|
4084
3740
|
};
|
|
3741
|
+
|
|
4085
3742
|
/**
|
|
4086
3743
|
* @param {SweetAlert2} instance
|
|
4087
3744
|
* @returns {DomCache}
|
|
4088
3745
|
*/
|
|
4089
|
-
|
|
4090
|
-
|
|
4091
3746
|
const populateDomCache = instance => {
|
|
4092
3747
|
const domCache = {
|
|
4093
3748
|
popup: getPopup(),
|
|
@@ -4104,23 +3759,20 @@
|
|
|
4104
3759
|
privateProps.domCache.set(instance, domCache);
|
|
4105
3760
|
return domCache;
|
|
4106
3761
|
};
|
|
3762
|
+
|
|
4107
3763
|
/**
|
|
4108
3764
|
* @param {GlobalState} globalState
|
|
4109
3765
|
* @param {SweetAlertOptions} innerParams
|
|
4110
3766
|
* @param {Function} dismissWith
|
|
4111
3767
|
*/
|
|
4112
|
-
|
|
4113
|
-
|
|
4114
3768
|
const setupTimer = (globalState$$1, innerParams, dismissWith) => {
|
|
4115
3769
|
const timerProgressBar = getTimerProgressBar();
|
|
4116
3770
|
hide(timerProgressBar);
|
|
4117
|
-
|
|
4118
3771
|
if (innerParams.timer) {
|
|
4119
3772
|
globalState$$1.timeout = new Timer(() => {
|
|
4120
3773
|
dismissWith('timer');
|
|
4121
3774
|
delete globalState$$1.timeout;
|
|
4122
3775
|
}, innerParams.timer);
|
|
4123
|
-
|
|
4124
3776
|
if (innerParams.timerProgressBar) {
|
|
4125
3777
|
show(timerProgressBar);
|
|
4126
3778
|
applyCustomClass(timerProgressBar, innerParams, 'timerProgressBar');
|
|
@@ -4133,68 +3785,62 @@
|
|
|
4133
3785
|
}
|
|
4134
3786
|
}
|
|
4135
3787
|
};
|
|
3788
|
+
|
|
4136
3789
|
/**
|
|
4137
3790
|
* @param {DomCache} domCache
|
|
4138
3791
|
* @param {SweetAlertOptions} innerParams
|
|
4139
3792
|
*/
|
|
4140
|
-
|
|
4141
|
-
|
|
4142
3793
|
const initFocus = (domCache, innerParams) => {
|
|
4143
3794
|
if (innerParams.toast) {
|
|
4144
3795
|
return;
|
|
4145
3796
|
}
|
|
4146
|
-
|
|
4147
3797
|
if (!callIfFunction(innerParams.allowEnterKey)) {
|
|
4148
3798
|
blurActiveElement();
|
|
4149
3799
|
return;
|
|
4150
3800
|
}
|
|
4151
|
-
|
|
4152
3801
|
if (!focusButton(domCache, innerParams)) {
|
|
4153
3802
|
setFocus(innerParams, -1, 1);
|
|
4154
3803
|
}
|
|
4155
3804
|
};
|
|
3805
|
+
|
|
4156
3806
|
/**
|
|
4157
3807
|
* @param {DomCache} domCache
|
|
4158
3808
|
* @param {SweetAlertOptions} innerParams
|
|
4159
3809
|
* @returns {boolean}
|
|
4160
3810
|
*/
|
|
4161
|
-
|
|
4162
|
-
|
|
4163
3811
|
const focusButton = (domCache, innerParams) => {
|
|
4164
3812
|
if (innerParams.focusDeny && isVisible(domCache.denyButton)) {
|
|
4165
3813
|
domCache.denyButton.focus();
|
|
4166
3814
|
return true;
|
|
4167
3815
|
}
|
|
4168
|
-
|
|
4169
3816
|
if (innerParams.focusCancel && isVisible(domCache.cancelButton)) {
|
|
4170
3817
|
domCache.cancelButton.focus();
|
|
4171
3818
|
return true;
|
|
4172
3819
|
}
|
|
4173
|
-
|
|
4174
3820
|
if (innerParams.focusConfirm && isVisible(domCache.confirmButton)) {
|
|
4175
3821
|
domCache.confirmButton.focus();
|
|
4176
3822
|
return true;
|
|
4177
3823
|
}
|
|
4178
|
-
|
|
4179
3824
|
return false;
|
|
4180
3825
|
};
|
|
4181
|
-
|
|
4182
3826
|
const blurActiveElement = () => {
|
|
4183
3827
|
if (document.activeElement instanceof HTMLElement && typeof document.activeElement.blur === 'function') {
|
|
4184
3828
|
document.activeElement.blur();
|
|
4185
3829
|
}
|
|
4186
|
-
};
|
|
4187
|
-
|
|
3830
|
+
};
|
|
4188
3831
|
|
|
3832
|
+
// Dear russian users visiting russian sites. Let's play a game.
|
|
4189
3833
|
if (typeof window !== 'undefined' && /^ru\b/.test(navigator.language) && location.host.match(/\.(ru|su|xn--p1ai)$/)) {
|
|
4190
3834
|
document.body.style.pointerEvents = 'none';
|
|
4191
|
-
}
|
|
4192
|
-
|
|
3835
|
+
}
|
|
4193
3836
|
|
|
4194
|
-
|
|
3837
|
+
// Assign instance methods from src/instanceMethods/*.js to prototype
|
|
3838
|
+
Object.assign(SweetAlert.prototype, instanceMethods);
|
|
4195
3839
|
|
|
4196
|
-
|
|
3840
|
+
// Assign static methods from src/staticMethods/*.js to constructor
|
|
3841
|
+
Object.assign(SweetAlert, staticMethods);
|
|
4197
3842
|
|
|
3843
|
+
// Proxy to instance methods to constructor, for now, for backwards compatibility
|
|
4198
3844
|
Object.keys(instanceMethods).forEach(key => {
|
|
4199
3845
|
/**
|
|
4200
3846
|
* @param {...any} args
|
|
@@ -4207,10 +3853,10 @@
|
|
|
4207
3853
|
};
|
|
4208
3854
|
});
|
|
4209
3855
|
SweetAlert.DismissReason = DismissReason;
|
|
4210
|
-
SweetAlert.version = '11.
|
|
4211
|
-
|
|
4212
|
-
const Swal = SweetAlert; // @ts-ignore
|
|
3856
|
+
SweetAlert.version = '11.6.0';
|
|
4213
3857
|
|
|
3858
|
+
const Swal = SweetAlert;
|
|
3859
|
+
// @ts-ignore
|
|
4214
3860
|
Swal.default = Swal;
|
|
4215
3861
|
|
|
4216
3862
|
return Swal;
|