vrembem 4.0.0-next.2 → 4.0.0-next.20
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/LICENSE +21 -0
- package/README.md +3 -7
- package/base.scss +20 -0
- package/dev/base.css +7036 -0
- package/dev/base.css.map +1 -0
- package/dev/index.css +4283 -2819
- package/dev/index.css.map +1 -1
- package/dev/index.js +2380 -1637
- package/dev/index.js.map +1 -1
- package/dev/index.umd.cjs +2382 -1639
- package/dev/index.umd.cjs.map +1 -1
- package/dev/root.css +487 -0
- package/dev/root.css.map +1 -0
- package/dist/base.css +1 -0
- package/dist/base.css.map +1 -0
- package/dist/index.css +1 -1
- package/dist/index.css.map +1 -1
- package/dist/index.js +1173 -1443
- package/dist/index.js.map +1 -1
- package/dist/index.umd.cjs +6 -2
- package/dist/index.umd.cjs.map +1 -1
- package/dist/root.css +1 -0
- package/dist/root.css.map +1 -0
- package/index.js +4 -6
- package/index.scss +2 -4
- package/package.json +36 -38
- package/root.scss +21 -0
package/dev/index.js
CHANGED
|
@@ -1,99 +1,132 @@
|
|
|
1
|
-
var
|
|
2
|
-
|
|
3
|
-
throw TypeError("Cannot " + n);
|
|
1
|
+
var __typeError = (msg) => {
|
|
2
|
+
throw TypeError(msg);
|
|
4
3
|
};
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
4
|
+
var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
|
|
5
|
+
var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
|
|
6
|
+
var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
|
|
7
|
+
var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
|
|
8
|
+
var _handler, _focusable, _handleFocusTrap, _handleFocusLock, _handleClick, _handleKeydown, _handleClick2, _handleKeydown2, _handleKeydown3;
|
|
9
|
+
class Breakpoint {
|
|
10
|
+
constructor(value, handler) {
|
|
11
|
+
__privateAdd(this, _handler);
|
|
12
|
+
this.value = value;
|
|
13
|
+
__privateSet(this, _handler, handler);
|
|
14
|
+
this.mql = null;
|
|
15
15
|
}
|
|
16
16
|
get handler() {
|
|
17
|
-
return
|
|
17
|
+
return __privateGet(this, _handler);
|
|
18
18
|
}
|
|
19
19
|
// Unmount existing handler before setting a new one.
|
|
20
|
-
set handler(
|
|
21
|
-
|
|
20
|
+
set handler(func) {
|
|
21
|
+
if (this.mql) {
|
|
22
|
+
this.mql.removeEventListener("change", __privateGet(this, _handler));
|
|
23
|
+
}
|
|
24
|
+
__privateSet(this, _handler, func);
|
|
22
25
|
}
|
|
23
|
-
mount(
|
|
24
|
-
|
|
26
|
+
mount(value, handler) {
|
|
27
|
+
if (value) this.value = value;
|
|
28
|
+
if (handler) __privateSet(this, _handler, handler);
|
|
29
|
+
if (!this.value) return this;
|
|
30
|
+
this.mql = window.matchMedia(`(min-width: ${this.value})`);
|
|
31
|
+
this.mql.addEventListener("change", __privateGet(this, _handler));
|
|
32
|
+
__privateGet(this, _handler).call(this, this.mql);
|
|
33
|
+
return this;
|
|
25
34
|
}
|
|
26
35
|
unmount() {
|
|
27
|
-
|
|
36
|
+
if (!this.mql) return this;
|
|
37
|
+
this.mql.removeEventListener("change", __privateGet(this, _handler));
|
|
38
|
+
this.value = null;
|
|
39
|
+
__privateSet(this, _handler, null);
|
|
40
|
+
this.mql = null;
|
|
41
|
+
return this;
|
|
28
42
|
}
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
|
|
43
|
+
}
|
|
44
|
+
_handler = new WeakMap();
|
|
45
|
+
class Collection {
|
|
32
46
|
constructor() {
|
|
33
47
|
this.collection = [];
|
|
34
48
|
}
|
|
35
|
-
async register(
|
|
36
|
-
|
|
49
|
+
async register(item) {
|
|
50
|
+
await this.deregister(item);
|
|
51
|
+
this.collection.push(item);
|
|
52
|
+
return this.collection;
|
|
37
53
|
}
|
|
38
|
-
async deregister(
|
|
39
|
-
const
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
54
|
+
async deregister(ref) {
|
|
55
|
+
const index2 = this.collection.findIndex((entry) => {
|
|
56
|
+
return entry === ref;
|
|
57
|
+
});
|
|
58
|
+
if (index2 >= 0) {
|
|
59
|
+
const entry = this.collection[index2];
|
|
60
|
+
Object.getOwnPropertyNames(entry).forEach((prop) => {
|
|
61
|
+
delete entry[prop];
|
|
62
|
+
});
|
|
63
|
+
this.collection.splice(index2, 1);
|
|
45
64
|
}
|
|
46
65
|
return this.collection;
|
|
47
66
|
}
|
|
48
|
-
async registerCollection(
|
|
49
|
-
|
|
50
|
-
this.register(
|
|
51
|
-
}))
|
|
67
|
+
async registerCollection(items) {
|
|
68
|
+
await Promise.all(Array.from(items, (item) => {
|
|
69
|
+
this.register(item);
|
|
70
|
+
}));
|
|
71
|
+
return this.collection;
|
|
52
72
|
}
|
|
53
73
|
async deregisterCollection() {
|
|
54
|
-
|
|
74
|
+
while (this.collection.length > 0) {
|
|
55
75
|
await this.deregister(this.collection[0]);
|
|
76
|
+
}
|
|
56
77
|
return this.collection;
|
|
57
78
|
}
|
|
58
|
-
get(
|
|
59
|
-
return this.collection.find((
|
|
79
|
+
get(value, key = "id") {
|
|
80
|
+
return this.collection.find((item) => {
|
|
81
|
+
return item[key] === value;
|
|
82
|
+
});
|
|
60
83
|
}
|
|
61
|
-
}
|
|
62
|
-
const
|
|
84
|
+
}
|
|
85
|
+
const not = {
|
|
63
86
|
inert: ":not([inert]):not([inert] *)",
|
|
64
87
|
negTabIndex: ':not([tabindex^="-"])',
|
|
65
88
|
disabled: ":not(:disabled)"
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
`
|
|
69
|
-
`
|
|
70
|
-
`input[type="radio"]${
|
|
71
|
-
`
|
|
72
|
-
`
|
|
73
|
-
`
|
|
74
|
-
`
|
|
89
|
+
};
|
|
90
|
+
const focusableSelectors = [
|
|
91
|
+
`a[href]${not.inert}${not.negTabIndex}`,
|
|
92
|
+
`area[href]${not.inert}${not.negTabIndex}`,
|
|
93
|
+
`input:not([type="hidden"]):not([type="radio"])${not.inert}${not.negTabIndex}${not.disabled}`,
|
|
94
|
+
`input[type="radio"]${not.inert}${not.negTabIndex}${not.disabled}`,
|
|
95
|
+
`select${not.inert}${not.negTabIndex}${not.disabled}`,
|
|
96
|
+
`textarea${not.inert}${not.negTabIndex}${not.disabled}`,
|
|
97
|
+
`button${not.inert}${not.negTabIndex}${not.disabled}`,
|
|
98
|
+
`details${not.inert} > summary:first-of-type${not.negTabIndex}`,
|
|
75
99
|
// Discard until Firefox supports `:has()`
|
|
76
100
|
// See: https://github.com/KittyGiraudel/focusable-selectors/issues/12
|
|
77
101
|
// `details:not(:has(> summary))${not.inert}${not.negTabIndex}`,
|
|
78
|
-
`iframe${
|
|
79
|
-
`audio[controls]${
|
|
80
|
-
`video[controls]${
|
|
81
|
-
`[contenteditable]${
|
|
82
|
-
`[tabindex]${
|
|
102
|
+
`iframe${not.inert}${not.negTabIndex}`,
|
|
103
|
+
`audio[controls]${not.inert}${not.negTabIndex}`,
|
|
104
|
+
`video[controls]${not.inert}${not.negTabIndex}`,
|
|
105
|
+
`[contenteditable]${not.inert}${not.negTabIndex}`,
|
|
106
|
+
`[tabindex]${not.inert}${not.negTabIndex}`
|
|
83
107
|
];
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
this.
|
|
108
|
+
class FocusTrap {
|
|
109
|
+
constructor(el = null, selectorFocus = "[data-focus]") {
|
|
110
|
+
__privateAdd(this, _focusable);
|
|
111
|
+
__privateAdd(this, _handleFocusTrap);
|
|
112
|
+
__privateAdd(this, _handleFocusLock);
|
|
113
|
+
this.el = el;
|
|
114
|
+
this.selectorFocus = selectorFocus;
|
|
115
|
+
__privateSet(this, _handleFocusTrap, handleFocusTrap.bind(this));
|
|
116
|
+
__privateSet(this, _handleFocusLock, handleFocusLock.bind(this));
|
|
91
117
|
}
|
|
92
118
|
get focusable() {
|
|
93
|
-
return
|
|
94
|
-
}
|
|
95
|
-
set focusable(
|
|
96
|
-
|
|
119
|
+
return __privateGet(this, _focusable);
|
|
120
|
+
}
|
|
121
|
+
set focusable(value) {
|
|
122
|
+
__privateSet(this, _focusable, value);
|
|
123
|
+
if (__privateGet(this, _focusable).length) {
|
|
124
|
+
document.removeEventListener("keydown", __privateGet(this, _handleFocusLock));
|
|
125
|
+
document.addEventListener("keydown", __privateGet(this, _handleFocusTrap));
|
|
126
|
+
} else {
|
|
127
|
+
document.removeEventListener("keydown", __privateGet(this, _handleFocusTrap));
|
|
128
|
+
document.addEventListener("keydown", __privateGet(this, _handleFocusLock));
|
|
129
|
+
}
|
|
97
130
|
}
|
|
98
131
|
get focusableFirst() {
|
|
99
132
|
return this.focusable[0];
|
|
@@ -101,299 +134,257 @@ let x$1 = class x {
|
|
|
101
134
|
get focusableLast() {
|
|
102
135
|
return this.focusable[this.focusable.length - 1];
|
|
103
136
|
}
|
|
104
|
-
mount(
|
|
105
|
-
|
|
137
|
+
mount(el, selectorFocus) {
|
|
138
|
+
if (el) this.el = el;
|
|
139
|
+
if (selectorFocus) this.selectorFocus = selectorFocus;
|
|
140
|
+
this.focusable = this.getFocusable();
|
|
141
|
+
this.focus();
|
|
106
142
|
}
|
|
107
143
|
unmount() {
|
|
108
|
-
this.el = null
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
const
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
144
|
+
this.el = null;
|
|
145
|
+
this.focusable = [];
|
|
146
|
+
document.removeEventListener("keydown", __privateGet(this, _handleFocusTrap));
|
|
147
|
+
document.removeEventListener("keydown", __privateGet(this, _handleFocusLock));
|
|
148
|
+
}
|
|
149
|
+
focus(el = this.el, selectorFocus = this.selectorFocus) {
|
|
150
|
+
const result = el.querySelector(selectorFocus) || el;
|
|
151
|
+
result.focus();
|
|
152
|
+
}
|
|
153
|
+
getFocusable(el = this.el) {
|
|
154
|
+
const focusable = [];
|
|
155
|
+
const initFocus = document.activeElement;
|
|
156
|
+
const initScrollTop = el.scrollTop;
|
|
157
|
+
const els = el.querySelectorAll(focusableSelectors.join(","));
|
|
158
|
+
els.forEach((el2) => {
|
|
159
|
+
el2.focus();
|
|
160
|
+
if (document.activeElement === el2) {
|
|
161
|
+
focusable.push(el2);
|
|
162
|
+
}
|
|
163
|
+
});
|
|
164
|
+
el.scrollTop = initScrollTop;
|
|
165
|
+
initFocus.focus();
|
|
166
|
+
return focusable;
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
_focusable = new WeakMap();
|
|
170
|
+
_handleFocusTrap = new WeakMap();
|
|
171
|
+
_handleFocusLock = new WeakMap();
|
|
172
|
+
function handleFocusTrap(event) {
|
|
173
|
+
const isTab = event.key === "Tab" || event.keyCode === 9;
|
|
174
|
+
if (!isTab) return;
|
|
175
|
+
if (event.shiftKey) {
|
|
176
|
+
if (document.activeElement === this.focusableFirst || document.activeElement === this.el) {
|
|
177
|
+
event.preventDefault();
|
|
178
|
+
this.focusableLast.focus();
|
|
179
|
+
}
|
|
180
|
+
} else {
|
|
181
|
+
if (document.activeElement === this.focusableLast || document.activeElement === this.el) {
|
|
182
|
+
event.preventDefault();
|
|
183
|
+
this.focusableFirst.focus();
|
|
184
|
+
}
|
|
118
185
|
}
|
|
119
|
-
};
|
|
120
|
-
f$2 = /* @__PURE__ */ new WeakMap(), d$1 = /* @__PURE__ */ new WeakMap(), u$2 = /* @__PURE__ */ new WeakMap();
|
|
121
|
-
function g$2(t) {
|
|
122
|
-
(t.key === "Tab" || t.keyCode === 9) && (t.shiftKey ? (document.activeElement === this.focusableFirst || document.activeElement === this.el) && (t.preventDefault(), this.focusableLast.focus()) : (document.activeElement === this.focusableLast || document.activeElement === this.el) && (t.preventDefault(), this.focusableFirst.focus()));
|
|
123
186
|
}
|
|
124
|
-
function
|
|
125
|
-
|
|
187
|
+
function handleFocusLock(event) {
|
|
188
|
+
const isTab = event.key === "Tab" || event.keyCode === 9;
|
|
189
|
+
if (isTab) event.preventDefault();
|
|
126
190
|
}
|
|
127
|
-
function
|
|
128
|
-
|
|
129
|
-
return i2 ? JSON.parse(i2) : {};
|
|
191
|
+
function getPrefix() {
|
|
192
|
+
return getComputedStyle(document.body).getPropertyValue("--vb-prefix").trim();
|
|
130
193
|
}
|
|
131
|
-
function
|
|
132
|
-
|
|
194
|
+
function cssVar(property, options) {
|
|
195
|
+
const settings = {
|
|
196
|
+
fallback: null,
|
|
197
|
+
element: document.body,
|
|
198
|
+
...options
|
|
199
|
+
};
|
|
200
|
+
if (property.slice(0, 2) !== "--") {
|
|
201
|
+
const prefixValue = getPrefix();
|
|
202
|
+
if (prefixValue) {
|
|
203
|
+
property = `${prefixValue}${property}`;
|
|
204
|
+
}
|
|
205
|
+
property = `--${property}`;
|
|
206
|
+
}
|
|
207
|
+
const cssValue = getComputedStyle(settings.element).getPropertyValue(property).trim();
|
|
208
|
+
if (cssValue) {
|
|
209
|
+
return cssValue;
|
|
210
|
+
} else {
|
|
211
|
+
if (settings.fallback) {
|
|
212
|
+
return settings.fallback;
|
|
213
|
+
} else {
|
|
214
|
+
throw new Error(`CSS variable "${property}" was not found!`);
|
|
215
|
+
}
|
|
216
|
+
}
|
|
133
217
|
}
|
|
134
|
-
function
|
|
135
|
-
const
|
|
218
|
+
function getConfig$1(el, dataConfig) {
|
|
219
|
+
const string = el.getAttribute(`data-${dataConfig}`) || "";
|
|
220
|
+
const json = string.replace(/'/g, '"');
|
|
221
|
+
return json ? JSON.parse(json) : {};
|
|
222
|
+
}
|
|
223
|
+
function localStore(key, enable = true) {
|
|
224
|
+
const local = localStorage.getItem(key);
|
|
225
|
+
const store = local ? JSON.parse(local) : {};
|
|
136
226
|
return {
|
|
137
|
-
get(
|
|
138
|
-
return
|
|
227
|
+
get(prop) {
|
|
228
|
+
return prop ? store[prop] : store;
|
|
139
229
|
},
|
|
140
|
-
set(
|
|
141
|
-
|
|
230
|
+
set(prop, value) {
|
|
231
|
+
if (value) {
|
|
232
|
+
store[prop] = value;
|
|
233
|
+
} else {
|
|
234
|
+
delete store[prop];
|
|
235
|
+
}
|
|
236
|
+
if (enable) localStorage.setItem(key, JSON.stringify(store));
|
|
237
|
+
return store;
|
|
142
238
|
}
|
|
143
239
|
};
|
|
144
240
|
}
|
|
145
|
-
function
|
|
146
|
-
const
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
if (
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
}
|
|
163
|
-
function
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
}
|
|
173
|
-
function k$3(t, e) {
|
|
174
|
-
L$2(!!t, e.selectorInert), y$2(!!t, e.selectorOverflow);
|
|
175
|
-
}
|
|
176
|
-
const index = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
177
|
-
__proto__: null,
|
|
178
|
-
Breakpoint: $$2,
|
|
179
|
-
Collection: T$2,
|
|
180
|
-
FocusTrap: x$1,
|
|
181
|
-
closeTransition: F$3,
|
|
182
|
-
getConfig: q$2,
|
|
183
|
-
getPrefix: I$3,
|
|
184
|
-
localStore: C$2,
|
|
185
|
-
openTransition: S$3,
|
|
186
|
-
teleport: O$2,
|
|
187
|
-
updateGlobalState: k$3
|
|
188
|
-
}, Symbol.toStringTag, { value: "Module" }));
|
|
189
|
-
const i = {
|
|
190
|
-
autoInit: false,
|
|
191
|
-
stateAttr: "aria-checked",
|
|
192
|
-
stateValue: "mixed"
|
|
193
|
-
};
|
|
194
|
-
let r$2 = class r {
|
|
195
|
-
constructor(t) {
|
|
196
|
-
this.defaults = i, this.settings = { ...this.defaults, ...t }, this.__handlerClick = this.handlerClick.bind(this), this.settings.autoInit && this.init();
|
|
197
|
-
}
|
|
198
|
-
init(t = null) {
|
|
199
|
-
t && (this.settings = { ...this.settings, ...t });
|
|
200
|
-
const e = `[${this.settings.stateAttr}="${this.settings.stateValue}"]`, s2 = document.querySelectorAll(e);
|
|
201
|
-
this.setIndeterminate(s2), document.addEventListener("click", this.__handlerClick, false);
|
|
202
|
-
}
|
|
203
|
-
destroy() {
|
|
204
|
-
document.removeEventListener("click", this.__handlerClick, false);
|
|
205
|
-
}
|
|
206
|
-
handlerClick(t) {
|
|
207
|
-
const e = `[${this.settings.stateAttr}="${this.settings.stateValue}"]`, s2 = t.target.closest(e);
|
|
208
|
-
s2 && (this.removeAriaState(s2), this.setIndeterminate(s2));
|
|
209
|
-
}
|
|
210
|
-
setAriaState(t, e = this.settings.stateValue) {
|
|
211
|
-
t = t.forEach ? t : [t], t.forEach((s2) => {
|
|
212
|
-
s2.setAttribute(this.settings.stateAttr, e);
|
|
213
|
-
});
|
|
214
|
-
}
|
|
215
|
-
removeAriaState(t) {
|
|
216
|
-
t = t.forEach ? t : [t], t.forEach((e) => {
|
|
217
|
-
e.removeAttribute(this.settings.stateAttr);
|
|
218
|
-
});
|
|
219
|
-
}
|
|
220
|
-
setIndeterminate(t) {
|
|
221
|
-
t = t.forEach ? t : [t], t.forEach((e) => {
|
|
222
|
-
e.hasAttribute(this.settings.stateAttr) ? e.indeterminate = true : e.indeterminate = false;
|
|
223
|
-
});
|
|
224
|
-
}
|
|
225
|
-
};
|
|
226
|
-
var S$2 = (t, e, s2) => {
|
|
227
|
-
if (!e.has(t))
|
|
228
|
-
throw TypeError("Cannot " + s2);
|
|
229
|
-
};
|
|
230
|
-
var p$1 = (t, e, s2) => (S$2(t, e, "read from private field"), s2 ? s2.call(t) : e.get(t)), E$1 = (t, e, s2) => {
|
|
231
|
-
if (e.has(t))
|
|
232
|
-
throw TypeError("Cannot add the same private member more than once");
|
|
233
|
-
e instanceof WeakSet ? e.add(t) : e.set(t, s2);
|
|
234
|
-
}, $$1 = (t, e, s2, i2) => (S$2(t, e, "write to private field"), i2 ? i2.call(t, s2) : e.set(t, s2), s2);
|
|
235
|
-
var I$2 = (t, e, s2) => {
|
|
236
|
-
if (!e.has(t))
|
|
237
|
-
throw TypeError("Cannot " + s2);
|
|
238
|
-
}, l = (t, e, s2) => (I$2(t, e, "read from private field"), s2 ? s2.call(t) : e.get(t)), w$1 = (t, e, s2) => {
|
|
239
|
-
if (e.has(t))
|
|
240
|
-
throw TypeError("Cannot add the same private member more than once");
|
|
241
|
-
e instanceof WeakSet ? e.add(t) : e.set(t, s2);
|
|
242
|
-
}, h$1 = (t, e, s2, i2) => (I$2(t, e, "write to private field"), i2 ? i2.call(t, s2) : e.set(t, s2), s2), c$1;
|
|
243
|
-
let M$2 = class M {
|
|
244
|
-
constructor(e, s2) {
|
|
245
|
-
w$1(this, c$1, void 0), this.value = e, h$1(this, c$1, s2), this.mql = null;
|
|
246
|
-
}
|
|
247
|
-
get handler() {
|
|
248
|
-
return l(this, c$1);
|
|
249
|
-
}
|
|
250
|
-
// Unmount existing handler before setting a new one.
|
|
251
|
-
set handler(e) {
|
|
252
|
-
this.mql && (typeof this.mql.removeEventListener == "function" ? this.mql.removeEventListener("change", l(this, c$1)) : this.mql.removeListener(l(this, c$1))), h$1(this, c$1, e);
|
|
253
|
-
}
|
|
254
|
-
mount(e, s2) {
|
|
255
|
-
return e && (this.value = e), s2 && h$1(this, c$1, s2), this.value ? (this.mql = window.matchMedia(`(min-width: ${this.value})`), typeof this.mql.addEventListener == "function" ? this.mql.addEventListener("change", l(this, c$1)) : this.mql.addListener(l(this, c$1)), l(this, c$1).call(this, this.mql), this) : this;
|
|
256
|
-
}
|
|
257
|
-
unmount() {
|
|
258
|
-
return this.mql ? (typeof this.mql.removeEventListener == "function" ? this.mql.removeEventListener("change", l(this, c$1)) : this.mql.removeListener(l(this, c$1)), this.value = null, h$1(this, c$1, null), this.mql = null, this) : this;
|
|
259
|
-
}
|
|
260
|
-
};
|
|
261
|
-
c$1 = /* @__PURE__ */ new WeakMap();
|
|
262
|
-
let P$1 = class P {
|
|
263
|
-
constructor() {
|
|
264
|
-
this.collection = [];
|
|
265
|
-
}
|
|
266
|
-
async register(e) {
|
|
267
|
-
return await this.deregister(e), this.collection.push(e), this.collection;
|
|
268
|
-
}
|
|
269
|
-
async deregister(e) {
|
|
270
|
-
const s2 = this.collection.findIndex((i2) => i2 === e);
|
|
271
|
-
if (s2 >= 0) {
|
|
272
|
-
const i2 = this.collection[s2];
|
|
273
|
-
Object.getOwnPropertyNames(i2).forEach((n) => {
|
|
274
|
-
delete i2[n];
|
|
275
|
-
}), this.collection.splice(s2, 1);
|
|
241
|
+
function teleport(what, where, how) {
|
|
242
|
+
const isComment = where.nodeType === Node.COMMENT_NODE;
|
|
243
|
+
const isElement2 = where.nodeType === Node.ELEMENT_NODE;
|
|
244
|
+
where = isComment || isElement2 ? where : document.querySelector(where);
|
|
245
|
+
if (isComment) how = "after";
|
|
246
|
+
if (!where) throw new Error(`Not a valid teleport reference: '${where}'`);
|
|
247
|
+
if (typeof where[how] != "function") throw new Error(`Not a valid teleport method: '${how}'`);
|
|
248
|
+
let returnRef = null;
|
|
249
|
+
if (!isComment) {
|
|
250
|
+
returnRef = document.createComment("teleported #" + what.id);
|
|
251
|
+
what.before(returnRef);
|
|
252
|
+
}
|
|
253
|
+
where[how](what);
|
|
254
|
+
if (isComment) {
|
|
255
|
+
where.remove();
|
|
256
|
+
}
|
|
257
|
+
return returnRef;
|
|
258
|
+
}
|
|
259
|
+
function themeStore(options) {
|
|
260
|
+
const settings = {
|
|
261
|
+
prefix: cssVar("prefix-themes", { fallback: "vb-theme-" }),
|
|
262
|
+
themes: ["root", "light", "dark"],
|
|
263
|
+
storeKey: "VB:Profile"
|
|
264
|
+
};
|
|
265
|
+
for (const [key] of Object.entries(settings)) {
|
|
266
|
+
if (options && options[key]) {
|
|
267
|
+
settings[key] = options[key];
|
|
276
268
|
}
|
|
277
|
-
return this.collection;
|
|
278
|
-
}
|
|
279
|
-
async registerCollection(e) {
|
|
280
|
-
return await Promise.all(Array.from(e, (s2) => {
|
|
281
|
-
this.register(s2);
|
|
282
|
-
})), this.collection;
|
|
283
|
-
}
|
|
284
|
-
async deregisterCollection() {
|
|
285
|
-
for (; this.collection.length > 0; )
|
|
286
|
-
await this.deregister(this.collection[0]);
|
|
287
|
-
return this.collection;
|
|
288
|
-
}
|
|
289
|
-
get(e, s2 = "id") {
|
|
290
|
-
return this.collection.find((i2) => i2[s2] === e);
|
|
291
|
-
}
|
|
292
|
-
};
|
|
293
|
-
const r$1 = {
|
|
294
|
-
inert: ":not([inert]):not([inert] *)",
|
|
295
|
-
negTabIndex: ':not([tabindex^="-"])',
|
|
296
|
-
disabled: ":not(:disabled)"
|
|
297
|
-
}, F$2 = [
|
|
298
|
-
`a[href]${r$1.inert}${r$1.negTabIndex}`,
|
|
299
|
-
`area[href]${r$1.inert}${r$1.negTabIndex}`,
|
|
300
|
-
`input:not([type="hidden"]):not([type="radio"])${r$1.inert}${r$1.negTabIndex}${r$1.disabled}`,
|
|
301
|
-
`input[type="radio"]${r$1.inert}${r$1.negTabIndex}${r$1.disabled}`,
|
|
302
|
-
`select${r$1.inert}${r$1.negTabIndex}${r$1.disabled}`,
|
|
303
|
-
`textarea${r$1.inert}${r$1.negTabIndex}${r$1.disabled}`,
|
|
304
|
-
`button${r$1.inert}${r$1.negTabIndex}${r$1.disabled}`,
|
|
305
|
-
`details${r$1.inert} > summary:first-of-type${r$1.negTabIndex}`,
|
|
306
|
-
// Discard until Firefox supports `:has()`
|
|
307
|
-
// See: https://github.com/KittyGiraudel/focusable-selectors/issues/12
|
|
308
|
-
// `details:not(:has(> summary))${not.inert}${not.negTabIndex}`,
|
|
309
|
-
`iframe${r$1.inert}${r$1.negTabIndex}`,
|
|
310
|
-
`audio[controls]${r$1.inert}${r$1.negTabIndex}`,
|
|
311
|
-
`video[controls]${r$1.inert}${r$1.negTabIndex}`,
|
|
312
|
-
`[contenteditable]${r$1.inert}${r$1.negTabIndex}`,
|
|
313
|
-
`[tabindex]${r$1.inert}${r$1.negTabIndex}`
|
|
314
|
-
];
|
|
315
|
-
var v$1, u$1, g$1;
|
|
316
|
-
let B$2 = class B {
|
|
317
|
-
constructor(e = null, s2 = "[data-focus]") {
|
|
318
|
-
w$1(this, v$1, void 0), w$1(this, u$1, void 0), w$1(this, g$1, void 0), this.el = e, this.selectorFocus = s2, h$1(this, u$1, _$2.bind(this)), h$1(this, g$1, N$2.bind(this));
|
|
319
|
-
}
|
|
320
|
-
get focusable() {
|
|
321
|
-
return l(this, v$1);
|
|
322
|
-
}
|
|
323
|
-
set focusable(e) {
|
|
324
|
-
h$1(this, v$1, e), l(this, v$1).length ? (document.removeEventListener("keydown", l(this, g$1)), document.addEventListener("keydown", l(this, u$1))) : (document.removeEventListener("keydown", l(this, u$1)), document.addEventListener("keydown", l(this, g$1)));
|
|
325
|
-
}
|
|
326
|
-
get focusableFirst() {
|
|
327
|
-
return this.focusable[0];
|
|
328
|
-
}
|
|
329
|
-
get focusableLast() {
|
|
330
|
-
return this.focusable[this.focusable.length - 1];
|
|
331
|
-
}
|
|
332
|
-
mount(e, s2) {
|
|
333
|
-
e && (this.el = e), s2 && (this.selectorFocus = s2), this.focusable = this.getFocusable(), this.focus();
|
|
334
269
|
}
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
}
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
}), e.scrollTop = n, i2.focus(), s2;
|
|
270
|
+
const callbacks = {
|
|
271
|
+
onInit() {
|
|
272
|
+
},
|
|
273
|
+
onChange() {
|
|
274
|
+
}
|
|
275
|
+
};
|
|
276
|
+
for (const [key] of Object.entries(callbacks)) {
|
|
277
|
+
if (options && options[key]) {
|
|
278
|
+
callbacks[key] = options[key];
|
|
279
|
+
}
|
|
346
280
|
}
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
}
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
}
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
}
|
|
362
|
-
function V(t, e = true) {
|
|
363
|
-
const s2 = localStorage.getItem(t), i2 = s2 ? JSON.parse(s2) : {};
|
|
364
|
-
return {
|
|
365
|
-
get(n) {
|
|
366
|
-
return n ? i2[n] : i2;
|
|
281
|
+
const profile = localStore(settings.storeKey);
|
|
282
|
+
const api = {
|
|
283
|
+
// Store our settings in the API.
|
|
284
|
+
settings,
|
|
285
|
+
// Actions.
|
|
286
|
+
add(value) {
|
|
287
|
+
settings.themes.push(value);
|
|
288
|
+
},
|
|
289
|
+
remove(value) {
|
|
290
|
+
const index2 = settings.themes.indexOf(value);
|
|
291
|
+
~index2 && settings.themes.splice(index2, 1);
|
|
292
|
+
},
|
|
293
|
+
callback(name) {
|
|
294
|
+
callbacks[name].call(this);
|
|
367
295
|
},
|
|
368
|
-
|
|
369
|
-
|
|
296
|
+
// Getters.
|
|
297
|
+
get class() {
|
|
298
|
+
return `${settings.prefix}${this.theme}`;
|
|
299
|
+
},
|
|
300
|
+
get classes() {
|
|
301
|
+
return settings.themes.map((theme) => `${settings.prefix}${theme}`);
|
|
302
|
+
},
|
|
303
|
+
get themes() {
|
|
304
|
+
return settings.themes;
|
|
305
|
+
},
|
|
306
|
+
// Setup the theme get and set methods.
|
|
307
|
+
get theme() {
|
|
308
|
+
return profile.get("theme") || "root";
|
|
309
|
+
},
|
|
310
|
+
set theme(value) {
|
|
311
|
+
if (settings.themes.includes(value)) {
|
|
312
|
+
if (this.theme != value) {
|
|
313
|
+
profile.set("theme", value);
|
|
314
|
+
document.documentElement.classList.remove(...this.classes);
|
|
315
|
+
document.documentElement.classList.add(`${settings.prefix}${value}`);
|
|
316
|
+
this.callback("onChange");
|
|
317
|
+
}
|
|
318
|
+
} else {
|
|
319
|
+
console.error(`Not a valid theme value: "${value}"`);
|
|
320
|
+
}
|
|
370
321
|
}
|
|
371
322
|
};
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
}
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
323
|
+
api.callback("onInit");
|
|
324
|
+
return api;
|
|
325
|
+
}
|
|
326
|
+
function transition(el, from, to, duration = "transition-duration") {
|
|
327
|
+
return new Promise((resolve) => {
|
|
328
|
+
if (typeof duration === "string") {
|
|
329
|
+
const cssValue = cssVar(duration, { element: el });
|
|
330
|
+
const ms = cssValue.includes("ms") ? true : false;
|
|
331
|
+
duration = parseFloat(cssValue) * (ms ? 1 : 1e3);
|
|
332
|
+
}
|
|
333
|
+
el.classList.remove(from.finish);
|
|
334
|
+
el.classList.add(to.start);
|
|
335
|
+
setTimeout(() => {
|
|
336
|
+
el.classList.add(to.finish);
|
|
337
|
+
el.classList.remove(to.start);
|
|
338
|
+
resolve(el);
|
|
339
|
+
}, duration);
|
|
385
340
|
});
|
|
386
341
|
}
|
|
387
|
-
function
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
342
|
+
function setOverflowHidden(state, selector) {
|
|
343
|
+
if (selector) {
|
|
344
|
+
const els = document.querySelectorAll(selector);
|
|
345
|
+
els.forEach((el) => {
|
|
346
|
+
if (state) {
|
|
347
|
+
el.style.overflow = "hidden";
|
|
348
|
+
} else {
|
|
349
|
+
el.style.removeProperty("overflow");
|
|
350
|
+
}
|
|
351
|
+
});
|
|
352
|
+
}
|
|
391
353
|
}
|
|
392
|
-
function
|
|
393
|
-
|
|
354
|
+
function setInert(state, selector) {
|
|
355
|
+
if (selector) {
|
|
356
|
+
const els = document.querySelectorAll(selector);
|
|
357
|
+
els.forEach((el) => {
|
|
358
|
+
if (state) {
|
|
359
|
+
el.inert = true;
|
|
360
|
+
el.setAttribute("aria-hidden", true);
|
|
361
|
+
} else {
|
|
362
|
+
el.inert = null;
|
|
363
|
+
el.removeAttribute("aria-hidden");
|
|
364
|
+
}
|
|
365
|
+
});
|
|
366
|
+
}
|
|
394
367
|
}
|
|
395
|
-
|
|
396
|
-
|
|
368
|
+
function updateGlobalState(state, config) {
|
|
369
|
+
setInert(!!state, config.selectorInert);
|
|
370
|
+
setOverflowHidden(!!state, config.selectorOverflow);
|
|
371
|
+
}
|
|
372
|
+
const index = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
373
|
+
__proto__: null,
|
|
374
|
+
Breakpoint,
|
|
375
|
+
Collection,
|
|
376
|
+
FocusTrap,
|
|
377
|
+
cssVar,
|
|
378
|
+
getConfig: getConfig$1,
|
|
379
|
+
getPrefix,
|
|
380
|
+
localStore,
|
|
381
|
+
teleport,
|
|
382
|
+
themeStore,
|
|
383
|
+
transition,
|
|
384
|
+
updateGlobalState
|
|
385
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
386
|
+
const defaults$2 = {
|
|
387
|
+
autoMount: false,
|
|
397
388
|
// Data attributes
|
|
398
389
|
dataOpen: "drawer-open",
|
|
399
390
|
dataClose: "drawer-close",
|
|
@@ -403,6 +394,7 @@ const Q$1 = {
|
|
|
403
394
|
// Selectors
|
|
404
395
|
selectorDrawer: ".drawer",
|
|
405
396
|
selectorDialog: ".drawer__dialog",
|
|
397
|
+
selectorScreen: ".drawer",
|
|
406
398
|
selectorFocus: "[data-focus]",
|
|
407
399
|
selectorInert: null,
|
|
408
400
|
selectorOverflow: "body",
|
|
@@ -420,364 +412,401 @@ const Q$1 = {
|
|
|
420
412
|
store: true,
|
|
421
413
|
storeKey: "VB:DrawerState",
|
|
422
414
|
setTabindex: true,
|
|
423
|
-
transition: true
|
|
415
|
+
transition: true,
|
|
416
|
+
transitionDuration: "drawer-transition-duration"
|
|
424
417
|
};
|
|
425
|
-
function
|
|
426
|
-
|
|
418
|
+
function applyInitialState(entry) {
|
|
419
|
+
if (entry.store === "opened") {
|
|
420
|
+
entry.open(false, false);
|
|
421
|
+
} else if (entry.store === "closed") {
|
|
422
|
+
entry.close(false, false);
|
|
423
|
+
} else if (entry.store === "indeterminate") {
|
|
424
|
+
entry.state = "indeterminate";
|
|
425
|
+
} else {
|
|
426
|
+
if (entry.el.classList.contains(entry.getSetting("stateOpened"))) {
|
|
427
|
+
entry.open(false, false);
|
|
428
|
+
} else if (entry.el.classList.contains(entry.getSetting("stateClosed"))) {
|
|
429
|
+
entry.close(false, false);
|
|
430
|
+
} else {
|
|
431
|
+
entry.state = "indeterminate";
|
|
432
|
+
}
|
|
433
|
+
}
|
|
434
|
+
}
|
|
435
|
+
async function applyInlineState(entry) {
|
|
436
|
+
if (entry.store === "opened") {
|
|
437
|
+
await entry.open(false, false);
|
|
438
|
+
} else if (entry.store === "closed") {
|
|
439
|
+
await entry.close(false, false);
|
|
440
|
+
} else if (entry.store === "indeterminate") {
|
|
441
|
+
if (entry.state != "indeterminate") {
|
|
442
|
+
entry.state = "indeterminate";
|
|
443
|
+
}
|
|
444
|
+
} else {
|
|
445
|
+
if (entry.state != entry.inlineState) {
|
|
446
|
+
entry.state = entry.inlineState;
|
|
447
|
+
}
|
|
448
|
+
if (entry.inlineState === "opened") {
|
|
449
|
+
await entry.open(false, false);
|
|
450
|
+
} else if (entry.inlineState === "closed") {
|
|
451
|
+
await entry.close(false, false);
|
|
452
|
+
}
|
|
453
|
+
}
|
|
454
|
+
}
|
|
455
|
+
function getBreakpoint(drawer) {
|
|
456
|
+
const prefix = getPrefix();
|
|
457
|
+
const bp = drawer.getAttribute(`data-${this.settings.dataBreakpoint}`);
|
|
458
|
+
if (this.settings.breakpoints && this.settings.breakpoints[bp]) {
|
|
459
|
+
return this.settings.breakpoints[bp];
|
|
460
|
+
} else if (getComputedStyle(document.body).getPropertyValue(`--${prefix}breakpoint-${bp}`).trim()) {
|
|
461
|
+
return getComputedStyle(document.body).getPropertyValue(`--${prefix}breakpoint-${bp}`).trim();
|
|
462
|
+
} else {
|
|
463
|
+
return bp;
|
|
464
|
+
}
|
|
465
|
+
}
|
|
466
|
+
function getDrawer(query) {
|
|
467
|
+
const entry = typeof query === "string" ? this.get(query) : this.get(query.id);
|
|
468
|
+
if (entry) {
|
|
469
|
+
return entry;
|
|
470
|
+
} else {
|
|
471
|
+
throw new Error(`Drawer not found in collection with id of "${query.id || query}".`);
|
|
472
|
+
}
|
|
473
|
+
}
|
|
474
|
+
function updateFocusState$1(entry) {
|
|
475
|
+
if (entry.state === "opened") {
|
|
476
|
+
if (entry.mode === "modal") {
|
|
477
|
+
this.focusTrap.mount(entry.dialog, this.settings.selectorFocus);
|
|
478
|
+
} else {
|
|
479
|
+
this.focusTrap.focus(entry.dialog, this.settings.selectorFocus);
|
|
480
|
+
}
|
|
481
|
+
} else {
|
|
482
|
+
if (entry.trigger) {
|
|
483
|
+
entry.trigger.focus();
|
|
484
|
+
entry.trigger = null;
|
|
485
|
+
}
|
|
486
|
+
this.focusTrap.unmount();
|
|
487
|
+
}
|
|
488
|
+
}
|
|
489
|
+
async function handleClick$2(event) {
|
|
490
|
+
const trigger = event.target.closest(`
|
|
427
491
|
[data-${this.settings.dataOpen}],
|
|
428
492
|
[data-${this.settings.dataToggle}],
|
|
429
493
|
[data-${this.settings.dataClose}]
|
|
430
494
|
`);
|
|
431
|
-
if (
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
495
|
+
if (trigger) {
|
|
496
|
+
event.preventDefault();
|
|
497
|
+
if (trigger.matches(`[data-${this.settings.dataToggle}]`)) {
|
|
498
|
+
const selectors = trigger.getAttribute(`data-${this.settings.dataToggle}`).trim().split(" ");
|
|
499
|
+
selectors.forEach((selector) => {
|
|
500
|
+
const entry = getDrawer.call(this, selector);
|
|
501
|
+
entry.trigger = trigger;
|
|
502
|
+
return entry.toggle();
|
|
503
|
+
});
|
|
504
|
+
}
|
|
505
|
+
if (trigger.matches(`[data-${this.settings.dataOpen}]`)) {
|
|
506
|
+
const selectors = trigger.getAttribute(`data-${this.settings.dataOpen}`).trim().split(" ");
|
|
507
|
+
selectors.forEach((selector) => {
|
|
508
|
+
const entry = getDrawer.call(this, selector);
|
|
509
|
+
entry.trigger = trigger;
|
|
510
|
+
return entry.open();
|
|
511
|
+
});
|
|
512
|
+
}
|
|
513
|
+
if (trigger.matches(`[data-${this.settings.dataClose}]`)) {
|
|
514
|
+
const selectors = trigger.getAttribute(`data-${this.settings.dataClose}`).trim().split(" ");
|
|
515
|
+
selectors.forEach((selector) => {
|
|
516
|
+
if (selector) {
|
|
517
|
+
const entry = getDrawer.call(this, selector);
|
|
518
|
+
entry.trigger = trigger;
|
|
519
|
+
return entry.close();
|
|
520
|
+
} else {
|
|
521
|
+
const parent = event.target.closest(this.settings.selectorDrawer);
|
|
522
|
+
if (parent) return this.close(parent);
|
|
523
|
+
}
|
|
524
|
+
});
|
|
525
|
+
}
|
|
447
526
|
return;
|
|
448
527
|
}
|
|
449
|
-
|
|
528
|
+
if (this.activeModal && event.target.matches(this.settings.selectorScreen)) {
|
|
529
|
+
return this.close(this.activeModal.id);
|
|
530
|
+
}
|
|
450
531
|
}
|
|
451
|
-
function
|
|
452
|
-
if (
|
|
453
|
-
|
|
454
|
-
e && this.close(e);
|
|
532
|
+
function handleKeydown$2(event) {
|
|
533
|
+
if (event.key === "Escape") {
|
|
534
|
+
if (this.activeModal) return this.close(this.activeModal);
|
|
455
535
|
}
|
|
456
536
|
}
|
|
457
|
-
async function
|
|
458
|
-
|
|
459
|
-
return
|
|
460
|
-
|
|
461
|
-
if (
|
|
462
|
-
const
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
}
|
|
537
|
+
async function deregister$2(obj, close2 = true) {
|
|
538
|
+
const index2 = this.collection.findIndex((entry) => {
|
|
539
|
+
return entry.id === obj.id;
|
|
540
|
+
});
|
|
541
|
+
if (index2 >= 0) {
|
|
542
|
+
const entry = this.collection[index2];
|
|
543
|
+
if (close2 && entry.state === "opened") {
|
|
544
|
+
await entry.close(false);
|
|
545
|
+
}
|
|
546
|
+
this.store.set(entry.id);
|
|
547
|
+
entry.unmountBreakpoint();
|
|
548
|
+
Object.getOwnPropertyNames(entry).forEach((prop) => {
|
|
549
|
+
delete entry[prop];
|
|
550
|
+
});
|
|
551
|
+
this.collection.splice(index2, 1);
|
|
466
552
|
}
|
|
467
553
|
return this.collection;
|
|
468
554
|
}
|
|
469
|
-
function
|
|
470
|
-
const
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
}
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
555
|
+
async function open$2(query, enableTransition, focus = true) {
|
|
556
|
+
const entry = getDrawer.call(this, query);
|
|
557
|
+
const config = { ...this.settings, ...entry.settings };
|
|
558
|
+
if (enableTransition !== void 0) config.transition = enableTransition;
|
|
559
|
+
if (entry.state === "closed" || entry.state === "indeterminate") {
|
|
560
|
+
entry.state = "opening";
|
|
561
|
+
if (config.transition) {
|
|
562
|
+
await transition(entry.el, {
|
|
563
|
+
start: config.stateClosing,
|
|
564
|
+
finish: config.stateClosed
|
|
565
|
+
}, {
|
|
566
|
+
start: config.stateOpening,
|
|
567
|
+
finish: config.stateOpened
|
|
568
|
+
}, config.transitionDuration);
|
|
569
|
+
} else {
|
|
570
|
+
entry.el.classList.add(config.stateOpened);
|
|
571
|
+
entry.el.classList.remove(config.stateClosed);
|
|
572
|
+
}
|
|
573
|
+
entry.state = "opened";
|
|
574
|
+
if (entry.mode === "modal") updateGlobalState(true, config);
|
|
575
|
+
if (focus) {
|
|
576
|
+
updateFocusState$1.call(this, entry);
|
|
577
|
+
}
|
|
578
|
+
entry.el.dispatchEvent(new CustomEvent(config.customEventPrefix + "opened", {
|
|
579
|
+
detail: this,
|
|
580
|
+
bubbles: true
|
|
581
|
+
}));
|
|
582
|
+
}
|
|
583
|
+
return entry;
|
|
584
|
+
}
|
|
585
|
+
async function close$2(query, enableTransition, focus = true) {
|
|
586
|
+
const entry = getDrawer.call(this, query);
|
|
587
|
+
const config = { ...this.settings, ...entry.settings };
|
|
588
|
+
if (enableTransition !== void 0) config.transition = enableTransition;
|
|
589
|
+
if (entry.state === "opened" || entry.state === "indeterminate") {
|
|
590
|
+
entry.state = "closing";
|
|
591
|
+
document.activeElement.blur();
|
|
592
|
+
if (config.transition) {
|
|
593
|
+
await transition(entry.el, {
|
|
594
|
+
start: config.stateOpening,
|
|
595
|
+
finish: config.stateOpened
|
|
596
|
+
}, {
|
|
597
|
+
start: config.stateClosing,
|
|
598
|
+
finish: config.stateClosed
|
|
599
|
+
}, config.transitionDuration);
|
|
600
|
+
} else {
|
|
601
|
+
entry.el.classList.add(config.stateClosed);
|
|
602
|
+
entry.el.classList.remove(config.stateOpened);
|
|
603
|
+
}
|
|
604
|
+
entry.state = "closed";
|
|
605
|
+
if (entry.mode === "modal") updateGlobalState(false, config);
|
|
606
|
+
if (focus) {
|
|
607
|
+
updateFocusState$1.call(this, entry);
|
|
608
|
+
}
|
|
609
|
+
entry.el.dispatchEvent(new CustomEvent(config.customEventPrefix + "closed", {
|
|
610
|
+
detail: this,
|
|
611
|
+
bubbles: true
|
|
612
|
+
}));
|
|
613
|
+
}
|
|
614
|
+
return entry;
|
|
509
615
|
}
|
|
510
|
-
async function
|
|
511
|
-
const
|
|
512
|
-
|
|
616
|
+
async function toggle(query, transition2, focus) {
|
|
617
|
+
const entry = getDrawer.call(this, query);
|
|
618
|
+
if (entry.state === "closed") {
|
|
619
|
+
return open$2.call(this, entry, transition2, focus);
|
|
620
|
+
} else {
|
|
621
|
+
return close$2.call(this, entry, transition2, focus);
|
|
622
|
+
}
|
|
513
623
|
}
|
|
514
|
-
function
|
|
515
|
-
switch (
|
|
624
|
+
function switchMode(entry) {
|
|
625
|
+
switch (entry.mode) {
|
|
516
626
|
case "inline":
|
|
517
|
-
return
|
|
627
|
+
return toInline.call(this, entry);
|
|
518
628
|
case "modal":
|
|
519
|
-
return
|
|
629
|
+
return toModal.call(this, entry);
|
|
520
630
|
default:
|
|
521
|
-
throw new Error(`"${
|
|
631
|
+
throw new Error(`"${entry.mode}" is not a valid drawer mode.`);
|
|
522
632
|
}
|
|
523
633
|
}
|
|
524
|
-
async function
|
|
525
|
-
|
|
634
|
+
async function toInline(entry) {
|
|
635
|
+
entry.el.classList.remove(entry.getSetting("classModal"));
|
|
636
|
+
entry.dialog.removeAttribute("aria-modal");
|
|
637
|
+
updateGlobalState(false, { ...this.settings, ...entry.settings });
|
|
638
|
+
this.focusTrap.unmount();
|
|
639
|
+
await applyInlineState(entry);
|
|
640
|
+
entry.el.dispatchEvent(new CustomEvent(entry.getSetting("customEventPrefix") + "switchMode", {
|
|
526
641
|
detail: this,
|
|
527
642
|
bubbles: true
|
|
528
|
-
}))
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
643
|
+
}));
|
|
644
|
+
return entry;
|
|
645
|
+
}
|
|
646
|
+
async function toModal(entry) {
|
|
647
|
+
entry.el.classList.add(entry.getSetting("classModal"));
|
|
648
|
+
entry.dialog.setAttribute("aria-modal", "true");
|
|
649
|
+
await close$2.call(this, entry, false, false);
|
|
650
|
+
entry.el.dispatchEvent(new CustomEvent(entry.getSetting("customEventPrefix") + "switchMode", {
|
|
532
651
|
detail: this,
|
|
533
652
|
bubbles: true
|
|
534
|
-
}))
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
653
|
+
}));
|
|
654
|
+
return entry;
|
|
655
|
+
}
|
|
656
|
+
async function register$2(el, config = {}) {
|
|
657
|
+
await deregister$2.call(this, el, false);
|
|
658
|
+
const root = this;
|
|
659
|
+
const breakpoint = new Breakpoint();
|
|
660
|
+
let _mode, _state = "indeterminate";
|
|
661
|
+
const entry = {
|
|
662
|
+
id: el.id,
|
|
663
|
+
el,
|
|
664
|
+
dialog: null,
|
|
665
|
+
trigger: null,
|
|
666
|
+
settings: { ...getConfig$1(el, this.settings.dataConfig), ...config },
|
|
667
|
+
inlineState: "indeterminate",
|
|
668
|
+
get breakpoint() {
|
|
669
|
+
return getBreakpoint.call(root, el);
|
|
541
670
|
},
|
|
542
|
-
|
|
543
|
-
return
|
|
671
|
+
get store() {
|
|
672
|
+
return root.store.get(this.id);
|
|
544
673
|
},
|
|
545
|
-
|
|
546
|
-
return
|
|
674
|
+
get mode() {
|
|
675
|
+
return _mode;
|
|
547
676
|
},
|
|
548
|
-
|
|
549
|
-
|
|
677
|
+
set mode(value) {
|
|
678
|
+
_mode = value;
|
|
679
|
+
switchMode.call(root, this);
|
|
550
680
|
},
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
return i2.mount(o2, d2), this;
|
|
681
|
+
get state() {
|
|
682
|
+
return _state;
|
|
554
683
|
},
|
|
555
|
-
|
|
556
|
-
|
|
684
|
+
set state(value) {
|
|
685
|
+
_state = value;
|
|
686
|
+
if (this.mode === "inline" && value != "opening" && value != "closing") {
|
|
687
|
+
this.inlineState = value;
|
|
688
|
+
if (this.getSetting("store")) {
|
|
689
|
+
root.store.set(this.id, value);
|
|
690
|
+
}
|
|
691
|
+
}
|
|
692
|
+
if (value === "indeterminate") {
|
|
693
|
+
this.el.classList.remove(this.getSetting("stateOpened"));
|
|
694
|
+
this.el.classList.remove(this.getSetting("stateOpening"));
|
|
695
|
+
this.el.classList.remove(this.getSetting("stateClosed"));
|
|
696
|
+
this.el.classList.remove(this.getSetting("stateClosing"));
|
|
697
|
+
}
|
|
557
698
|
},
|
|
558
|
-
|
|
559
|
-
return
|
|
699
|
+
open(transition2, focus) {
|
|
700
|
+
return open$2.call(root, this, transition2, focus);
|
|
560
701
|
},
|
|
561
|
-
|
|
562
|
-
return
|
|
563
|
-
}
|
|
564
|
-
}, a2 = {
|
|
565
|
-
id: t.id,
|
|
566
|
-
el: t,
|
|
567
|
-
dialog: e,
|
|
568
|
-
trigger: null,
|
|
569
|
-
settings: K$2(t, this.settings.dataConfig),
|
|
570
|
-
get breakpoint() {
|
|
571
|
-
return X.call(s2, t);
|
|
702
|
+
close(transition2, focus) {
|
|
703
|
+
return close$2.call(root, this, transition2, focus);
|
|
572
704
|
},
|
|
573
|
-
|
|
574
|
-
return
|
|
705
|
+
toggle(transition2, focus) {
|
|
706
|
+
return toggle.call(root, this, transition2, focus);
|
|
575
707
|
},
|
|
576
|
-
|
|
577
|
-
|
|
708
|
+
deregister() {
|
|
709
|
+
return deregister$2.call(root, this);
|
|
578
710
|
},
|
|
579
|
-
|
|
580
|
-
|
|
711
|
+
mountBreakpoint() {
|
|
712
|
+
const value = this.breakpoint;
|
|
713
|
+
const handler = this.handleBreakpoint.bind(this);
|
|
714
|
+
breakpoint.mount(value, handler);
|
|
715
|
+
return this;
|
|
581
716
|
},
|
|
582
|
-
|
|
583
|
-
|
|
717
|
+
unmountBreakpoint() {
|
|
718
|
+
breakpoint.unmount();
|
|
719
|
+
return this;
|
|
584
720
|
},
|
|
585
|
-
|
|
721
|
+
handleBreakpoint(event) {
|
|
722
|
+
const bpMode = event.matches ? "inline" : "modal";
|
|
723
|
+
if (this.mode != bpMode) {
|
|
724
|
+
this.mode = bpMode;
|
|
725
|
+
}
|
|
726
|
+
return this;
|
|
727
|
+
},
|
|
728
|
+
getSetting(key) {
|
|
729
|
+
return key in this.settings ? this.settings[key] : root.settings[key];
|
|
730
|
+
}
|
|
586
731
|
};
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
732
|
+
this.collection.push(entry);
|
|
733
|
+
const dialog = el.querySelector(entry.getSetting("selectorDialog"));
|
|
734
|
+
entry.dialog = dialog ? dialog : el;
|
|
735
|
+
if (entry.getSetting("setTabindex")) {
|
|
736
|
+
entry.dialog.setAttribute("tabindex", "-1");
|
|
737
|
+
}
|
|
738
|
+
await applyInitialState(entry);
|
|
739
|
+
entry.inlineState = entry.state;
|
|
740
|
+
entry.mode = el.classList.contains(entry.getSetting("classModal")) ? "modal" : "inline";
|
|
741
|
+
if (entry.breakpoint) {
|
|
742
|
+
entry.mountBreakpoint();
|
|
743
|
+
}
|
|
744
|
+
return entry;
|
|
745
|
+
}
|
|
746
|
+
class Drawer extends Collection {
|
|
747
|
+
constructor(options) {
|
|
593
748
|
super();
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
this.defaults =
|
|
749
|
+
__privateAdd(this, _handleClick);
|
|
750
|
+
__privateAdd(this, _handleKeydown);
|
|
751
|
+
this.defaults = defaults$2;
|
|
752
|
+
this.settings = { ...this.defaults, ...options };
|
|
753
|
+
this.focusTrap = new FocusTrap();
|
|
754
|
+
this.store = localStore(this.settings.storeKey, this.settings.store);
|
|
755
|
+
__privateSet(this, _handleClick, handleClick$2.bind(this));
|
|
756
|
+
__privateSet(this, _handleKeydown, handleKeydown$2.bind(this));
|
|
757
|
+
if (this.settings.autoMount) this.mount();
|
|
597
758
|
}
|
|
598
759
|
get activeModal() {
|
|
599
|
-
return this.collection.find((
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
s2 && (this.settings = { ...this.settings, ...s2 });
|
|
603
|
-
const i2 = document.querySelectorAll(this.settings.selectorDrawer);
|
|
604
|
-
return await this.registerCollection(i2), this.settings.eventListeners && this.initEventListeners(), this;
|
|
605
|
-
}
|
|
606
|
-
async destroy() {
|
|
607
|
-
return await this.deregisterCollection(), this.settings.eventListeners && this.destroyEventListeners(), this;
|
|
608
|
-
}
|
|
609
|
-
initEventListeners() {
|
|
610
|
-
document.addEventListener("click", p$1(this, f$1), false), document.addEventListener("keydown", p$1(this, m$1), false);
|
|
611
|
-
}
|
|
612
|
-
destroyEventListeners() {
|
|
613
|
-
document.removeEventListener("click", p$1(this, f$1), false), document.removeEventListener("keydown", p$1(this, m$1), false);
|
|
614
|
-
}
|
|
615
|
-
register(s2) {
|
|
616
|
-
const i2 = Y.call(this, s2);
|
|
617
|
-
return i2.error ? Promise.reject(i2.error) : et$1.call(this, i2.drawer, i2.dialog);
|
|
618
|
-
}
|
|
619
|
-
deregister(s2) {
|
|
620
|
-
const i2 = this.get(O$1.call(this, s2));
|
|
621
|
-
return L$1.call(this, i2);
|
|
622
|
-
}
|
|
623
|
-
open(s2, i2, n) {
|
|
624
|
-
return C$1.call(this, s2, i2, n);
|
|
625
|
-
}
|
|
626
|
-
close(s2, i2, n) {
|
|
627
|
-
return b$1.call(this, s2, i2, n);
|
|
628
|
-
}
|
|
629
|
-
toggle(s2, i2, n) {
|
|
630
|
-
return q$1.call(this, s2, i2, n);
|
|
631
|
-
}
|
|
632
|
-
};
|
|
633
|
-
f$1 = /* @__PURE__ */ new WeakMap(), m$1 = /* @__PURE__ */ new WeakMap();
|
|
634
|
-
var I$1 = (e, t, s2) => {
|
|
635
|
-
if (!t.has(e))
|
|
636
|
-
throw TypeError("Cannot " + s2);
|
|
637
|
-
};
|
|
638
|
-
var f = (e, t, s2) => (I$1(e, t, "read from private field"), s2 ? s2.call(e) : t.get(e)), v = (e, t, s2) => {
|
|
639
|
-
if (t.has(e))
|
|
640
|
-
throw TypeError("Cannot add the same private member more than once");
|
|
641
|
-
t instanceof WeakSet ? t.add(e) : t.set(e, s2);
|
|
642
|
-
}, b = (e, t, s2, i2) => (I$1(e, t, "write to private field"), i2 ? i2.call(e, s2) : t.set(e, s2), s2);
|
|
643
|
-
var k$1 = (e, t, s2) => {
|
|
644
|
-
if (!t.has(e))
|
|
645
|
-
throw TypeError("Cannot " + s2);
|
|
646
|
-
}, o = (e, t, s2) => (k$1(e, t, "read from private field"), s2 ? s2.call(e) : t.get(e)), y = (e, t, s2) => {
|
|
647
|
-
if (t.has(e))
|
|
648
|
-
throw TypeError("Cannot add the same private member more than once");
|
|
649
|
-
t instanceof WeakSet ? t.add(e) : t.set(e, s2);
|
|
650
|
-
}, E = (e, t, s2, i2) => (k$1(e, t, "write to private field"), i2 ? i2.call(e, s2) : t.set(e, s2), s2);
|
|
651
|
-
class A {
|
|
652
|
-
constructor() {
|
|
653
|
-
this.collection = [];
|
|
654
|
-
}
|
|
655
|
-
async register(t) {
|
|
656
|
-
return await this.deregister(t), this.collection.push(t), this.collection;
|
|
760
|
+
return this.collection.find((entry) => {
|
|
761
|
+
return entry.state === "opened" && entry.mode === "modal";
|
|
762
|
+
});
|
|
657
763
|
}
|
|
658
|
-
async
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
}), this.collection.splice(s2, 1);
|
|
764
|
+
async mount(options = null) {
|
|
765
|
+
if (options) this.settings = { ...this.settings, ...options };
|
|
766
|
+
const drawers = document.querySelectorAll(this.settings.selectorDrawer);
|
|
767
|
+
await this.registerCollection(drawers);
|
|
768
|
+
if (this.settings.eventListeners) {
|
|
769
|
+
this.mountEventListeners();
|
|
665
770
|
}
|
|
666
|
-
return this
|
|
667
|
-
}
|
|
668
|
-
async registerCollection(t) {
|
|
669
|
-
return await Promise.all(Array.from(t, (s2) => {
|
|
670
|
-
this.register(s2);
|
|
671
|
-
})), this.collection;
|
|
672
|
-
}
|
|
673
|
-
async deregisterCollection() {
|
|
674
|
-
for (; this.collection.length > 0; )
|
|
675
|
-
await this.deregister(this.collection[0]);
|
|
676
|
-
return this.collection;
|
|
677
|
-
}
|
|
678
|
-
get(t, s2 = "id") {
|
|
679
|
-
return this.collection.find((i2) => i2[s2] === t);
|
|
771
|
+
return this;
|
|
680
772
|
}
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
`a[href]${r2.inert}${r2.negTabIndex}`,
|
|
688
|
-
`area[href]${r2.inert}${r2.negTabIndex}`,
|
|
689
|
-
`input:not([type="hidden"]):not([type="radio"])${r2.inert}${r2.negTabIndex}${r2.disabled}`,
|
|
690
|
-
`input[type="radio"]${r2.inert}${r2.negTabIndex}${r2.disabled}`,
|
|
691
|
-
`select${r2.inert}${r2.negTabIndex}${r2.disabled}`,
|
|
692
|
-
`textarea${r2.inert}${r2.negTabIndex}${r2.disabled}`,
|
|
693
|
-
`button${r2.inert}${r2.negTabIndex}${r2.disabled}`,
|
|
694
|
-
`details${r2.inert} > summary:first-of-type${r2.negTabIndex}`,
|
|
695
|
-
// Discard until Firefox supports `:has()`
|
|
696
|
-
// See: https://github.com/KittyGiraudel/focusable-selectors/issues/12
|
|
697
|
-
// `details:not(:has(> summary))${not.inert}${not.negTabIndex}`,
|
|
698
|
-
`iframe${r2.inert}${r2.negTabIndex}`,
|
|
699
|
-
`audio[controls]${r2.inert}${r2.negTabIndex}`,
|
|
700
|
-
`video[controls]${r2.inert}${r2.negTabIndex}`,
|
|
701
|
-
`[contenteditable]${r2.inert}${r2.negTabIndex}`,
|
|
702
|
-
`[tabindex]${r2.inert}${r2.negTabIndex}`
|
|
703
|
-
];
|
|
704
|
-
var g, c, d;
|
|
705
|
-
let M$1 = class M2 {
|
|
706
|
-
constructor(t = null, s2 = "[data-focus]") {
|
|
707
|
-
y(this, g, void 0), y(this, c, void 0), y(this, d, void 0), this.el = t, this.selectorFocus = s2, E(this, c, R.bind(this)), E(this, d, N$1.bind(this));
|
|
708
|
-
}
|
|
709
|
-
get focusable() {
|
|
710
|
-
return o(this, g);
|
|
773
|
+
async unmount() {
|
|
774
|
+
await this.deregisterCollection();
|
|
775
|
+
if (this.settings.eventListeners) {
|
|
776
|
+
this.unmountEventListeners();
|
|
777
|
+
}
|
|
778
|
+
return this;
|
|
711
779
|
}
|
|
712
|
-
|
|
713
|
-
|
|
780
|
+
mountEventListeners() {
|
|
781
|
+
document.addEventListener("click", __privateGet(this, _handleClick), false);
|
|
782
|
+
document.addEventListener("keydown", __privateGet(this, _handleKeydown), false);
|
|
714
783
|
}
|
|
715
|
-
|
|
716
|
-
|
|
784
|
+
unmountEventListeners() {
|
|
785
|
+
document.removeEventListener("click", __privateGet(this, _handleClick), false);
|
|
786
|
+
document.removeEventListener("keydown", __privateGet(this, _handleKeydown), false);
|
|
717
787
|
}
|
|
718
|
-
|
|
719
|
-
|
|
788
|
+
register(query, config = {}) {
|
|
789
|
+
let el = typeof query == "string" ? document.getElementById(query) : query;
|
|
790
|
+
return el ? register$2.call(this, el, config) : Promise.reject(new Error(`Failed to register; drawer not found with ID of: "${query.id || query}".`));
|
|
720
791
|
}
|
|
721
|
-
|
|
722
|
-
|
|
792
|
+
deregister(query) {
|
|
793
|
+
let obj = this.get(query.id || query);
|
|
794
|
+
return obj ? deregister$2.call(this, obj) : Promise.reject(new Error(`Failed to deregister; drawer does not exist in collection with ID of: "${query.id || query}".`));
|
|
723
795
|
}
|
|
724
|
-
|
|
725
|
-
|
|
796
|
+
open(id, transition2, focus) {
|
|
797
|
+
return open$2.call(this, id, transition2, focus);
|
|
726
798
|
}
|
|
727
|
-
|
|
728
|
-
|
|
799
|
+
close(id, transition2, focus) {
|
|
800
|
+
return close$2.call(this, id, transition2, focus);
|
|
729
801
|
}
|
|
730
|
-
|
|
731
|
-
|
|
732
|
-
return t.querySelectorAll(S$1.join(",")).forEach((l2) => {
|
|
733
|
-
l2.focus(), document.activeElement === l2 && s2.push(l2);
|
|
734
|
-
}), t.scrollTop = n, i2.focus(), s2;
|
|
802
|
+
toggle(id, transition2, focus) {
|
|
803
|
+
return toggle.call(this, id, transition2, focus);
|
|
735
804
|
}
|
|
736
|
-
};
|
|
737
|
-
g = /* @__PURE__ */ new WeakMap(), c = /* @__PURE__ */ new WeakMap(), d = /* @__PURE__ */ new WeakMap();
|
|
738
|
-
function R(e) {
|
|
739
|
-
(e.key === "Tab" || e.keyCode === 9) && (e.shiftKey ? (document.activeElement === this.focusableFirst || document.activeElement === this.el) && (e.preventDefault(), this.focusableLast.focus()) : (document.activeElement === this.focusableLast || document.activeElement === this.el) && (e.preventDefault(), this.focusableFirst.focus()));
|
|
740
|
-
}
|
|
741
|
-
function N$1(e) {
|
|
742
|
-
(e.key === "Tab" || e.keyCode === 9) && e.preventDefault();
|
|
743
|
-
}
|
|
744
|
-
function P2(e, t) {
|
|
745
|
-
const s2 = (e.getAttribute(`data-${t}`) || "").replace(/'/g, '"');
|
|
746
|
-
return s2 ? JSON.parse(s2) : {};
|
|
747
|
-
}
|
|
748
|
-
function T$1(e, t, s2) {
|
|
749
|
-
const i2 = t.nodeType === Node.COMMENT_NODE, n = t.nodeType === Node.ELEMENT_NODE;
|
|
750
|
-
if (t = i2 || n ? t : document.querySelector(t), i2 && (s2 = "after"), !t)
|
|
751
|
-
throw new Error(`Not a valid teleport reference: '${t}'`);
|
|
752
|
-
if (typeof t[s2] != "function")
|
|
753
|
-
throw new Error(`Not a valid teleport method: '${s2}'`);
|
|
754
|
-
let l2 = null;
|
|
755
|
-
return i2 || (l2 = document.createComment("teleported #" + e.id), e.before(l2)), t[s2](e), i2 && t.remove(), l2;
|
|
756
|
-
}
|
|
757
|
-
const D$1 = (e, t) => new Promise((s2) => {
|
|
758
|
-
t.transition ? (e.classList.remove(t.stateClosed), e.classList.add(t.stateOpening), e.addEventListener("transitionend", function i2(n) {
|
|
759
|
-
n.target == e && (e.classList.add(t.stateOpened), e.classList.remove(t.stateOpening), s2(e), this.removeEventListener("transitionend", i2));
|
|
760
|
-
})) : (e.classList.add(t.stateOpened), e.classList.remove(t.stateClosed), s2(e));
|
|
761
|
-
}), F$1 = (e, t) => new Promise((s2) => {
|
|
762
|
-
t.transition ? (e.classList.add(t.stateClosing), e.classList.remove(t.stateOpened), e.addEventListener("transitionend", function i2(n) {
|
|
763
|
-
n.target == e && (e.classList.remove(t.stateClosing), e.classList.add(t.stateClosed), s2(e), this.removeEventListener("transitionend", i2));
|
|
764
|
-
})) : (e.classList.add(t.stateClosed), e.classList.remove(t.stateOpened), s2(e));
|
|
765
|
-
});
|
|
766
|
-
function q(e, t) {
|
|
767
|
-
t && document.querySelectorAll(t).forEach((s2) => {
|
|
768
|
-
e ? s2.style.overflow = "hidden" : s2.style.removeProperty("overflow");
|
|
769
|
-
});
|
|
770
805
|
}
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
}
|
|
776
|
-
function W(e, t) {
|
|
777
|
-
z(!!e, t.selectorInert), q(!!e, t.selectorOverflow);
|
|
778
|
-
}
|
|
779
|
-
const _$1 = {
|
|
780
|
-
autoInit: false,
|
|
806
|
+
_handleClick = new WeakMap();
|
|
807
|
+
_handleKeydown = new WeakMap();
|
|
808
|
+
const defaults$1 = {
|
|
809
|
+
autoMount: false,
|
|
781
810
|
// Data attributes
|
|
782
811
|
dataOpen: "modal-open",
|
|
783
812
|
dataClose: "modal-close",
|
|
@@ -786,6 +815,7 @@ const _$1 = {
|
|
|
786
815
|
// Selectors
|
|
787
816
|
selectorModal: ".modal",
|
|
788
817
|
selectorDialog: ".modal__dialog",
|
|
818
|
+
selectorScreen: ".modal",
|
|
789
819
|
selectorRequired: '[role="alertdialog"]',
|
|
790
820
|
selectorFocus: "[data-focus]",
|
|
791
821
|
selectorInert: null,
|
|
@@ -801,253 +831,365 @@ const _$1 = {
|
|
|
801
831
|
teleport: null,
|
|
802
832
|
teleportMethod: "append",
|
|
803
833
|
setTabindex: true,
|
|
804
|
-
transition: true
|
|
834
|
+
transition: true,
|
|
835
|
+
transitionDuration: "modal-transition-duration"
|
|
805
836
|
};
|
|
806
|
-
function
|
|
807
|
-
const
|
|
808
|
-
if (
|
|
809
|
-
return
|
|
810
|
-
|
|
811
|
-
}
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
function m() {
|
|
824
|
-
this.active ? this.focusTrap.mount(this.active.dialog, this.settings.selectorFocus) : (this.trigger && (this.trigger.focus(), this.trigger = null), this.focusTrap.unmount());
|
|
825
|
-
}
|
|
826
|
-
async function K$1(e) {
|
|
827
|
-
let t = e.target.closest(
|
|
828
|
-
`[data-${this.settings.dataOpen}], [data-${this.settings.dataReplace}]`
|
|
829
|
-
);
|
|
830
|
-
if (t) {
|
|
831
|
-
e.preventDefault(), e.target.closest(this.settings.selectorModal) || (this.trigger = t);
|
|
832
|
-
const i2 = this.get(p.call(this, t));
|
|
833
|
-
return t.matches(`[data-${this.settings.dataOpen}]`) ? i2.open() : i2.replace();
|
|
837
|
+
function getModal(query) {
|
|
838
|
+
const entry = typeof query === "string" ? this.get(query) : this.get(query.id);
|
|
839
|
+
if (entry) {
|
|
840
|
+
return entry;
|
|
841
|
+
} else {
|
|
842
|
+
throw new Error(`Modal not found in collection with id of "${query.id || query}".`);
|
|
843
|
+
}
|
|
844
|
+
}
|
|
845
|
+
function updateFocusState() {
|
|
846
|
+
if (this.active) {
|
|
847
|
+
this.focusTrap.mount(this.active.dialog, this.settings.selectorFocus);
|
|
848
|
+
} else {
|
|
849
|
+
if (this.trigger) {
|
|
850
|
+
this.trigger.focus();
|
|
851
|
+
this.trigger = null;
|
|
852
|
+
}
|
|
853
|
+
this.focusTrap.unmount();
|
|
834
854
|
}
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
855
|
+
}
|
|
856
|
+
async function handleClick$1(event) {
|
|
857
|
+
const trigger = event.target.closest(`
|
|
858
|
+
[data-${this.settings.dataOpen}],
|
|
859
|
+
[data-${this.settings.dataReplace}],
|
|
860
|
+
[data-${this.settings.dataClose}]
|
|
861
|
+
`);
|
|
862
|
+
if (trigger) {
|
|
863
|
+
event.preventDefault();
|
|
864
|
+
if (trigger.matches(`[data-${this.settings.dataOpen}]`)) {
|
|
865
|
+
const selector = trigger.getAttribute(`data-${this.settings.dataOpen}`).trim();
|
|
866
|
+
const entry = getModal.call(this, selector);
|
|
867
|
+
const fromModal = event.target.closest(this.settings.selectorModal);
|
|
868
|
+
if (!fromModal) this.trigger = trigger;
|
|
869
|
+
return entry.open();
|
|
870
|
+
}
|
|
871
|
+
if (trigger.matches(`[data-${this.settings.dataReplace}]`)) {
|
|
872
|
+
const selector = trigger.getAttribute(`data-${this.settings.dataReplace}`).trim();
|
|
873
|
+
const entry = getModal.call(this, selector);
|
|
874
|
+
const fromModal = event.target.closest(this.settings.selectorModal);
|
|
875
|
+
if (!fromModal) this.trigger = trigger;
|
|
876
|
+
return entry.replace();
|
|
877
|
+
}
|
|
878
|
+
if (trigger.matches(`[data-${this.settings.dataClose}]`)) {
|
|
879
|
+
const selector = trigger.getAttribute(`data-${this.settings.dataClose}`).trim();
|
|
880
|
+
return selector === "*" ? this.closeAll() : this.close(selector);
|
|
881
|
+
}
|
|
882
|
+
}
|
|
883
|
+
if (this.active && event.target.matches(this.settings.selectorScreen) && !this.active.required) {
|
|
884
|
+
return this.close(this.active.id);
|
|
839
885
|
}
|
|
840
|
-
if (e.target.matches(this.settings.selectorModal) && !e.target.querySelector(this.settings.selectorRequired))
|
|
841
|
-
return this.close(p.call(this, e.target));
|
|
842
886
|
}
|
|
843
|
-
function
|
|
844
|
-
if (
|
|
845
|
-
|
|
887
|
+
function handleKeydown$1(event) {
|
|
888
|
+
if (event.key === "Escape") {
|
|
889
|
+
if (this.active && !this.active.dialog.matches(this.settings.selectorRequired)) {
|
|
890
|
+
return this.close();
|
|
891
|
+
}
|
|
892
|
+
}
|
|
846
893
|
}
|
|
847
|
-
async function
|
|
848
|
-
|
|
849
|
-
return
|
|
850
|
-
|
|
851
|
-
if (
|
|
852
|
-
const
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
}
|
|
894
|
+
async function deregister$1(obj, close2 = true) {
|
|
895
|
+
const index2 = this.collection.findIndex((entry) => {
|
|
896
|
+
return entry.id === obj.id;
|
|
897
|
+
});
|
|
898
|
+
if (index2 >= 0) {
|
|
899
|
+
const entry = this.collection[index2];
|
|
900
|
+
if (close2 && entry.state === "opened") {
|
|
901
|
+
await entry.close(false);
|
|
902
|
+
} else {
|
|
903
|
+
this.stack.remove(entry);
|
|
904
|
+
}
|
|
905
|
+
if (entry.getSetting("teleport")) {
|
|
906
|
+
entry.teleportReturn();
|
|
907
|
+
}
|
|
908
|
+
Object.getOwnPropertyNames(entry).forEach((prop) => {
|
|
909
|
+
delete entry[prop];
|
|
910
|
+
});
|
|
911
|
+
this.collection.splice(index2, 1);
|
|
856
912
|
}
|
|
857
913
|
return this.collection;
|
|
858
914
|
}
|
|
859
|
-
async function
|
|
860
|
-
const
|
|
861
|
-
|
|
915
|
+
async function open$1(query, enableTransition, focus = true) {
|
|
916
|
+
const entry = getModal.call(this, query);
|
|
917
|
+
const config = { ...this.settings, ...entry.settings };
|
|
918
|
+
if (enableTransition !== void 0) config.transition = enableTransition;
|
|
919
|
+
this.stack.moveToTop(entry);
|
|
920
|
+
if (entry.state === "closed") {
|
|
921
|
+
entry.state = "opening";
|
|
922
|
+
this.stack.add(entry);
|
|
923
|
+
if (config.transition) {
|
|
924
|
+
await transition(entry.el, {
|
|
925
|
+
start: config.stateClosing,
|
|
926
|
+
finish: config.stateClosed
|
|
927
|
+
}, {
|
|
928
|
+
start: config.stateOpening,
|
|
929
|
+
finish: config.stateOpened
|
|
930
|
+
}, config.transitionDuration);
|
|
931
|
+
} else {
|
|
932
|
+
entry.el.classList.add(config.stateOpened);
|
|
933
|
+
entry.el.classList.remove(config.stateClosed);
|
|
934
|
+
}
|
|
935
|
+
entry.state = "opened";
|
|
936
|
+
}
|
|
937
|
+
if (focus) {
|
|
938
|
+
updateFocusState.call(this);
|
|
939
|
+
}
|
|
940
|
+
entry.el.dispatchEvent(new CustomEvent(config.customEventPrefix + "opened", {
|
|
862
941
|
detail: this,
|
|
863
942
|
bubbles: true
|
|
864
|
-
}))
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
|
|
871
|
-
|
|
943
|
+
}));
|
|
944
|
+
return entry;
|
|
945
|
+
}
|
|
946
|
+
async function close$1(query, enableTransition, focus = true) {
|
|
947
|
+
const entry = query ? getModal.call(this, query) : this.active;
|
|
948
|
+
if (entry && entry.state === "opened") {
|
|
949
|
+
entry.state = "closing";
|
|
950
|
+
const config = { ...this.settings, ...entry.settings };
|
|
951
|
+
if (enableTransition !== void 0) config.transition = enableTransition;
|
|
952
|
+
document.activeElement.blur();
|
|
953
|
+
if (config.transition) {
|
|
954
|
+
await transition(entry.el, {
|
|
955
|
+
start: config.stateOpening,
|
|
956
|
+
finish: config.stateOpened
|
|
957
|
+
}, {
|
|
958
|
+
start: config.stateClosing,
|
|
959
|
+
finish: config.stateClosed
|
|
960
|
+
}, config.transitionDuration);
|
|
961
|
+
} else {
|
|
962
|
+
entry.el.classList.add(config.stateClosed);
|
|
963
|
+
entry.el.classList.remove(config.stateOpened);
|
|
964
|
+
}
|
|
965
|
+
this.stack.remove(entry);
|
|
966
|
+
entry.state = "closed";
|
|
967
|
+
if (focus) {
|
|
968
|
+
updateFocusState.call(this);
|
|
969
|
+
}
|
|
970
|
+
entry.el.dispatchEvent(new CustomEvent(config.customEventPrefix + "closed", {
|
|
872
971
|
detail: this,
|
|
873
972
|
bubbles: true
|
|
874
973
|
}));
|
|
875
974
|
}
|
|
876
|
-
return
|
|
877
|
-
}
|
|
878
|
-
async function $2(e, t) {
|
|
879
|
-
const s2 = [];
|
|
880
|
-
return await Promise.all(this.stack.value.map(async (i2) => {
|
|
881
|
-
e && e === i2.id ? Promise.resolve() : s2.push(await C.call(this, i2, t, false)), i2.trigger = null;
|
|
882
|
-
})), s2;
|
|
883
|
-
}
|
|
884
|
-
async function O(e, t, s2 = true) {
|
|
885
|
-
const i2 = L.call(this, e);
|
|
886
|
-
let n, l2;
|
|
887
|
-
return i2.state === "opened" ? (n = i2, l2 = await $2.call(this, i2.id, t)) : (n = x2.call(this, i2, t, false), l2 = $2.call(this, false, t), await Promise.all([n, l2])), s2 && m.call(this), { opened: n, closed: l2 };
|
|
975
|
+
return entry;
|
|
888
976
|
}
|
|
889
|
-
async function
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
|
|
977
|
+
async function closeAll$1(exclude, transition2) {
|
|
978
|
+
const result = [];
|
|
979
|
+
await Promise.all(this.stack.value.map(async (modal) => {
|
|
980
|
+
if (exclude && exclude === modal.id) {
|
|
981
|
+
Promise.resolve();
|
|
982
|
+
} else {
|
|
983
|
+
result.push(await close$1.call(this, modal, transition2, false));
|
|
984
|
+
}
|
|
985
|
+
modal.trigger = null;
|
|
986
|
+
}));
|
|
987
|
+
return result;
|
|
988
|
+
}
|
|
989
|
+
async function replace(query, transition2, focus = true) {
|
|
990
|
+
const entry = getModal.call(this, query);
|
|
991
|
+
let resultOpened, resultClosed;
|
|
992
|
+
if (entry.state === "opened") {
|
|
993
|
+
resultOpened = entry;
|
|
994
|
+
resultClosed = await closeAll$1.call(this, entry.id, transition2);
|
|
995
|
+
} else {
|
|
996
|
+
resultClosed = closeAll$1.call(this, false, transition2);
|
|
997
|
+
resultOpened = open$1.call(this, entry, transition2, false);
|
|
998
|
+
await Promise.all([resultOpened, resultClosed]);
|
|
999
|
+
}
|
|
1000
|
+
if (focus) {
|
|
1001
|
+
updateFocusState.call(this);
|
|
1002
|
+
}
|
|
1003
|
+
return { opened: resultOpened, closed: resultClosed };
|
|
1004
|
+
}
|
|
1005
|
+
async function register$1(el, config = {}) {
|
|
1006
|
+
await deregister$1.call(this, el, false);
|
|
1007
|
+
const root = this;
|
|
1008
|
+
const entry = {
|
|
1009
|
+
id: el.id,
|
|
1010
|
+
state: "closed",
|
|
1011
|
+
el,
|
|
1012
|
+
dialog: null,
|
|
1013
|
+
get required() {
|
|
1014
|
+
return this.dialog.matches(this.getSetting("selectorRequired"));
|
|
1015
|
+
},
|
|
1016
|
+
returnRef: null,
|
|
1017
|
+
settings: { ...getConfig$1(el, this.settings.dataConfig), ...config },
|
|
1018
|
+
open(transition2, focus) {
|
|
1019
|
+
return open$1.call(root, this, transition2, focus);
|
|
894
1020
|
},
|
|
895
|
-
close(
|
|
896
|
-
return
|
|
1021
|
+
close(transition2, focus) {
|
|
1022
|
+
return close$1.call(root, this, transition2, focus);
|
|
897
1023
|
},
|
|
898
|
-
replace(
|
|
899
|
-
return
|
|
1024
|
+
replace(transition2, focus) {
|
|
1025
|
+
return replace.call(root, this, transition2, focus);
|
|
900
1026
|
},
|
|
901
1027
|
deregister() {
|
|
902
|
-
return
|
|
1028
|
+
return deregister$1.call(root, this);
|
|
903
1029
|
},
|
|
904
|
-
teleport(
|
|
905
|
-
|
|
1030
|
+
teleport(ref = this.getSetting("teleport"), method = this.getSetting("teleportMethod")) {
|
|
1031
|
+
if (!this.returnRef) {
|
|
1032
|
+
this.returnRef = teleport(this.el, ref, method);
|
|
1033
|
+
return this.el;
|
|
1034
|
+
} else {
|
|
1035
|
+
console.error("Element has already been teleported:", this.el);
|
|
1036
|
+
return false;
|
|
1037
|
+
}
|
|
906
1038
|
},
|
|
907
1039
|
teleportReturn() {
|
|
908
|
-
|
|
1040
|
+
if (this.returnRef) {
|
|
1041
|
+
this.returnRef = teleport(this.el, this.returnRef);
|
|
1042
|
+
return this.el;
|
|
1043
|
+
} else {
|
|
1044
|
+
console.error("No return reference found:", this.el);
|
|
1045
|
+
return false;
|
|
1046
|
+
}
|
|
909
1047
|
},
|
|
910
|
-
getSetting(
|
|
911
|
-
return
|
|
1048
|
+
getSetting(key) {
|
|
1049
|
+
return key in this.settings ? this.settings[key] : root.settings[key];
|
|
912
1050
|
}
|
|
913
|
-
}, n = {
|
|
914
|
-
id: e.id,
|
|
915
|
-
state: "closed",
|
|
916
|
-
el: e,
|
|
917
|
-
dialog: t,
|
|
918
|
-
returnRef: null,
|
|
919
|
-
settings: P2(e, this.settings.dataConfig),
|
|
920
|
-
...i2
|
|
921
1051
|
};
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
1052
|
+
const dialog = el.querySelector(entry.getSetting("selectorDialog"));
|
|
1053
|
+
entry.dialog = dialog ? dialog : el;
|
|
1054
|
+
entry.dialog.setAttribute("aria-modal", "true");
|
|
1055
|
+
if (!entry.dialog.hasAttribute("role")) {
|
|
1056
|
+
entry.dialog.setAttribute("role", "dialog");
|
|
1057
|
+
}
|
|
1058
|
+
if (entry.getSetting("setTabindex")) {
|
|
1059
|
+
entry.dialog.setAttribute("tabindex", "-1");
|
|
1060
|
+
}
|
|
1061
|
+
if (entry.getSetting("teleport")) {
|
|
1062
|
+
entry.teleport();
|
|
1063
|
+
}
|
|
1064
|
+
this.collection.push(entry);
|
|
1065
|
+
if (entry.el.classList.contains(this.settings.stateOpened)) {
|
|
1066
|
+
await entry.open(false);
|
|
1067
|
+
} else {
|
|
1068
|
+
entry.el.classList.remove(this.settings.stateOpening);
|
|
1069
|
+
entry.el.classList.remove(this.settings.stateClosing);
|
|
1070
|
+
entry.el.classList.add(this.settings.stateClosed);
|
|
1071
|
+
}
|
|
1072
|
+
return entry;
|
|
1073
|
+
}
|
|
1074
|
+
function stack(settings) {
|
|
1075
|
+
const stackArray = [];
|
|
926
1076
|
return {
|
|
927
1077
|
get value() {
|
|
928
|
-
return [...
|
|
1078
|
+
return [...stackArray];
|
|
929
1079
|
},
|
|
930
1080
|
get top() {
|
|
931
|
-
return
|
|
1081
|
+
return stackArray[stackArray.length - 1];
|
|
932
1082
|
},
|
|
933
1083
|
updateIndex() {
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
const
|
|
937
|
-
|
|
1084
|
+
stackArray.forEach((entry, index2) => {
|
|
1085
|
+
entry.el.style.zIndex = null;
|
|
1086
|
+
const value = getComputedStyle(entry.el)["z-index"];
|
|
1087
|
+
entry.el.style.zIndex = parseInt(value) + index2 + 1;
|
|
938
1088
|
});
|
|
939
1089
|
},
|
|
940
1090
|
updateGlobalState() {
|
|
941
|
-
|
|
1091
|
+
updateGlobalState(this.top, settings);
|
|
1092
|
+
this.updateIndex();
|
|
942
1093
|
},
|
|
943
|
-
add(
|
|
944
|
-
|
|
945
|
-
const
|
|
946
|
-
|
|
1094
|
+
add(entry) {
|
|
1095
|
+
entry.el.style.zIndex = null;
|
|
1096
|
+
const value = getComputedStyle(entry.el)["z-index"];
|
|
1097
|
+
entry.el.style.zIndex = parseInt(value) + stackArray.length + 1;
|
|
1098
|
+
stackArray.push(entry);
|
|
1099
|
+
this.updateGlobalState();
|
|
947
1100
|
},
|
|
948
|
-
remove(
|
|
949
|
-
const
|
|
950
|
-
|
|
1101
|
+
remove(entry) {
|
|
1102
|
+
const index2 = stackArray.findIndex((item) => {
|
|
1103
|
+
return item.id === entry.id;
|
|
1104
|
+
});
|
|
1105
|
+
if (index2 >= 0) {
|
|
1106
|
+
entry.el.style.zIndex = null;
|
|
1107
|
+
stackArray.splice(index2, 1);
|
|
1108
|
+
this.updateGlobalState();
|
|
1109
|
+
}
|
|
951
1110
|
},
|
|
952
|
-
moveToTop(
|
|
953
|
-
const
|
|
954
|
-
|
|
1111
|
+
moveToTop(entry) {
|
|
1112
|
+
const index2 = stackArray.findIndex((item) => {
|
|
1113
|
+
return item.id === entry.id;
|
|
1114
|
+
});
|
|
1115
|
+
if (index2 >= 0) {
|
|
1116
|
+
stackArray.splice(index2, 1);
|
|
1117
|
+
this.add(entry);
|
|
1118
|
+
}
|
|
955
1119
|
}
|
|
956
1120
|
};
|
|
957
1121
|
}
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
constructor(s2) {
|
|
1122
|
+
class Modal extends Collection {
|
|
1123
|
+
constructor(options) {
|
|
961
1124
|
super();
|
|
962
|
-
|
|
963
|
-
|
|
964
|
-
this.defaults =
|
|
1125
|
+
__privateAdd(this, _handleClick2);
|
|
1126
|
+
__privateAdd(this, _handleKeydown2);
|
|
1127
|
+
this.defaults = defaults$1;
|
|
1128
|
+
this.settings = { ...this.defaults, ...options };
|
|
1129
|
+
this.trigger = null;
|
|
1130
|
+
this.focusTrap = new FocusTrap();
|
|
1131
|
+
this.stack = stack(this.settings);
|
|
1132
|
+
__privateSet(this, _handleClick2, handleClick$1.bind(this));
|
|
1133
|
+
__privateSet(this, _handleKeydown2, handleKeydown$1.bind(this));
|
|
1134
|
+
if (this.settings.autoMount) this.mount();
|
|
965
1135
|
}
|
|
966
1136
|
get active() {
|
|
967
1137
|
return this.stack.top;
|
|
968
1138
|
}
|
|
969
|
-
async
|
|
970
|
-
|
|
971
|
-
const
|
|
972
|
-
|
|
973
|
-
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
|
|
977
|
-
initEventListeners() {
|
|
978
|
-
document.addEventListener("click", f(this, u), false), document.addEventListener("keydown", f(this, h), false);
|
|
979
|
-
}
|
|
980
|
-
destroyEventListeners() {
|
|
981
|
-
document.removeEventListener("click", f(this, u), false), document.removeEventListener("keydown", f(this, h), false);
|
|
1139
|
+
async mount(options) {
|
|
1140
|
+
if (options) this.settings = { ...this.settings, ...options };
|
|
1141
|
+
const modals = document.querySelectorAll(this.settings.selectorModal);
|
|
1142
|
+
await this.registerCollection(modals);
|
|
1143
|
+
if (this.settings.eventListeners) {
|
|
1144
|
+
this.mountEventListeners();
|
|
1145
|
+
}
|
|
1146
|
+
return this;
|
|
982
1147
|
}
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
|
|
1148
|
+
async unmount() {
|
|
1149
|
+
this.trigger = null;
|
|
1150
|
+
await this.deregisterCollection();
|
|
1151
|
+
if (this.settings.eventListeners) {
|
|
1152
|
+
this.unmountEventListeners();
|
|
1153
|
+
}
|
|
1154
|
+
return this;
|
|
986
1155
|
}
|
|
987
|
-
|
|
988
|
-
|
|
989
|
-
|
|
1156
|
+
mountEventListeners() {
|
|
1157
|
+
document.addEventListener("click", __privateGet(this, _handleClick2), false);
|
|
1158
|
+
document.addEventListener("keydown", __privateGet(this, _handleKeydown2), false);
|
|
990
1159
|
}
|
|
991
|
-
|
|
992
|
-
|
|
1160
|
+
unmountEventListeners() {
|
|
1161
|
+
document.removeEventListener("click", __privateGet(this, _handleClick2), false);
|
|
1162
|
+
document.removeEventListener("keydown", __privateGet(this, _handleKeydown2), false);
|
|
993
1163
|
}
|
|
994
|
-
|
|
995
|
-
|
|
1164
|
+
register(query, config = {}) {
|
|
1165
|
+
let el = typeof query == "string" ? document.getElementById(query) : query;
|
|
1166
|
+
return el ? register$1.call(this, el, config) : Promise.reject(new Error(`Failed to register; modal not found with ID of: "${query.id || query}".`));
|
|
996
1167
|
}
|
|
997
|
-
|
|
998
|
-
|
|
1168
|
+
deregister(query) {
|
|
1169
|
+
let obj = this.get(query.id || query);
|
|
1170
|
+
return obj ? deregister$1.call(this, obj) : Promise.reject(new Error(`Failed to deregister; modal does not exist in collection with ID of: "${query.id || query}".`));
|
|
999
1171
|
}
|
|
1000
|
-
|
|
1001
|
-
|
|
1002
|
-
return n && m.call(this), l2;
|
|
1172
|
+
open(id, transition2, focus) {
|
|
1173
|
+
return open$1.call(this, id, transition2, focus);
|
|
1003
1174
|
}
|
|
1004
|
-
|
|
1005
|
-
|
|
1006
|
-
var Ue = (e, t, r3) => {
|
|
1007
|
-
if (!t.has(e))
|
|
1008
|
-
throw TypeError("Cannot " + r3);
|
|
1009
|
-
};
|
|
1010
|
-
var Ae = (e, t, r3) => (Ue(e, t, "read from private field"), r3 ? r3.call(e) : t.get(e)), _e = (e, t, r3) => {
|
|
1011
|
-
if (t.has(e))
|
|
1012
|
-
throw TypeError("Cannot add the same private member more than once");
|
|
1013
|
-
t instanceof WeakSet ? t.add(e) : t.set(e, r3);
|
|
1014
|
-
}, Ke = (e, t, r3, i2) => (Ue(e, t, "write to private field"), i2 ? i2.call(e, r3) : t.set(e, r3), r3);
|
|
1015
|
-
class Ct {
|
|
1016
|
-
constructor() {
|
|
1017
|
-
this.collection = [];
|
|
1175
|
+
close(id, transition2, focus) {
|
|
1176
|
+
return close$1.call(this, id, transition2, focus);
|
|
1018
1177
|
}
|
|
1019
|
-
|
|
1020
|
-
return
|
|
1178
|
+
replace(id, transition2, focus) {
|
|
1179
|
+
return replace.call(this, id, transition2, focus);
|
|
1021
1180
|
}
|
|
1022
|
-
async
|
|
1023
|
-
const
|
|
1024
|
-
if (
|
|
1025
|
-
|
|
1026
|
-
Object.getOwnPropertyNames(i2).forEach((n) => {
|
|
1027
|
-
delete i2[n];
|
|
1028
|
-
}), this.collection.splice(r3, 1);
|
|
1181
|
+
async closeAll(exclude = false, transition2, focus = true) {
|
|
1182
|
+
const result = await closeAll$1.call(this, exclude, transition2);
|
|
1183
|
+
if (focus) {
|
|
1184
|
+
updateFocusState.call(this);
|
|
1029
1185
|
}
|
|
1030
|
-
return
|
|
1031
|
-
}
|
|
1032
|
-
async registerCollection(t) {
|
|
1033
|
-
return await Promise.all(Array.from(t, (r3) => {
|
|
1034
|
-
this.register(r3);
|
|
1035
|
-
})), this.collection;
|
|
1186
|
+
return result;
|
|
1036
1187
|
}
|
|
1037
|
-
async deregisterCollection() {
|
|
1038
|
-
for (; this.collection.length > 0; )
|
|
1039
|
-
await this.deregister(this.collection[0]);
|
|
1040
|
-
return this.collection;
|
|
1041
|
-
}
|
|
1042
|
-
get(t, r3 = "id") {
|
|
1043
|
-
return this.collection.find((i2) => i2[r3] === t);
|
|
1044
|
-
}
|
|
1045
|
-
}
|
|
1046
|
-
function kt() {
|
|
1047
|
-
return getComputedStyle(document.body).getPropertyValue("--vrembem-variable-prefix").trim();
|
|
1048
1188
|
}
|
|
1049
|
-
|
|
1050
|
-
|
|
1189
|
+
_handleClick2 = new WeakMap();
|
|
1190
|
+
_handleKeydown2 = new WeakMap();
|
|
1191
|
+
const defaults = {
|
|
1192
|
+
autoMount: false,
|
|
1051
1193
|
// Selectors
|
|
1052
1194
|
selectorPopover: ".popover",
|
|
1053
1195
|
selectorArrow: ".popover__arrow",
|
|
@@ -1056,194 +1198,320 @@ const Dt = {
|
|
|
1056
1198
|
// Feature settings
|
|
1057
1199
|
eventListeners: true,
|
|
1058
1200
|
eventType: "click",
|
|
1059
|
-
placement: "bottom"
|
|
1201
|
+
placement: "bottom",
|
|
1202
|
+
hoverToggleDelay: 0
|
|
1060
1203
|
};
|
|
1061
|
-
function
|
|
1062
|
-
const
|
|
1063
|
-
|
|
1064
|
-
|
|
1065
|
-
|
|
1204
|
+
function getConfig(el, settings) {
|
|
1205
|
+
const styles = getComputedStyle(el);
|
|
1206
|
+
const config = {
|
|
1207
|
+
"placement": settings.placement,
|
|
1208
|
+
"event": settings.eventType,
|
|
1209
|
+
"offset": 0,
|
|
1066
1210
|
"overflow-padding": 0,
|
|
1067
1211
|
"flip-padding": 0,
|
|
1068
|
-
"arrow-element":
|
|
1069
|
-
"arrow-padding": 0
|
|
1212
|
+
"arrow-element": settings.selectorArrow,
|
|
1213
|
+
"arrow-padding": 0,
|
|
1214
|
+
"toggle-delay": settings.hoverToggleDelay
|
|
1070
1215
|
};
|
|
1071
|
-
for (const
|
|
1072
|
-
const
|
|
1073
|
-
|
|
1074
|
-
|
|
1075
|
-
|
|
1076
|
-
}
|
|
1077
|
-
|
|
1078
|
-
|
|
1079
|
-
|
|
1080
|
-
|
|
1081
|
-
|
|
1082
|
-
|
|
1216
|
+
for (const prop in config) {
|
|
1217
|
+
const prefix = getPrefix();
|
|
1218
|
+
const value = styles.getPropertyValue(`--${prefix}popover-${prop}`).trim();
|
|
1219
|
+
if (value) {
|
|
1220
|
+
config[prop] = value;
|
|
1221
|
+
}
|
|
1222
|
+
}
|
|
1223
|
+
return config;
|
|
1224
|
+
}
|
|
1225
|
+
function getPadding(value) {
|
|
1226
|
+
let padding;
|
|
1227
|
+
const array = typeof value === "string" ? value.trim().split(" ") : [value];
|
|
1228
|
+
array.forEach(function(item, index2) {
|
|
1229
|
+
array[index2] = parseInt(item, 10);
|
|
1230
|
+
});
|
|
1231
|
+
switch (array.length) {
|
|
1083
1232
|
case 1:
|
|
1084
|
-
|
|
1233
|
+
padding = array[0];
|
|
1085
1234
|
break;
|
|
1086
1235
|
case 2:
|
|
1087
|
-
|
|
1088
|
-
top:
|
|
1089
|
-
right:
|
|
1090
|
-
bottom:
|
|
1091
|
-
left:
|
|
1236
|
+
padding = {
|
|
1237
|
+
top: array[0],
|
|
1238
|
+
right: array[1],
|
|
1239
|
+
bottom: array[0],
|
|
1240
|
+
left: array[1]
|
|
1092
1241
|
};
|
|
1093
1242
|
break;
|
|
1094
1243
|
case 3:
|
|
1095
|
-
|
|
1096
|
-
top:
|
|
1097
|
-
right:
|
|
1098
|
-
bottom:
|
|
1099
|
-
left:
|
|
1244
|
+
padding = {
|
|
1245
|
+
top: array[0],
|
|
1246
|
+
right: array[1],
|
|
1247
|
+
bottom: array[2],
|
|
1248
|
+
left: array[1]
|
|
1100
1249
|
};
|
|
1101
1250
|
break;
|
|
1102
1251
|
case 4:
|
|
1103
|
-
|
|
1104
|
-
top:
|
|
1105
|
-
right:
|
|
1106
|
-
bottom:
|
|
1107
|
-
left:
|
|
1252
|
+
padding = {
|
|
1253
|
+
top: array[0],
|
|
1254
|
+
right: array[1],
|
|
1255
|
+
bottom: array[2],
|
|
1256
|
+
left: array[3]
|
|
1108
1257
|
};
|
|
1109
1258
|
break;
|
|
1110
1259
|
default:
|
|
1111
|
-
|
|
1260
|
+
padding = false;
|
|
1112
1261
|
break;
|
|
1113
1262
|
}
|
|
1114
|
-
return
|
|
1263
|
+
return padding;
|
|
1115
1264
|
}
|
|
1116
|
-
function
|
|
1265
|
+
function getModifiers(options) {
|
|
1117
1266
|
return [{
|
|
1118
1267
|
name: "offset",
|
|
1119
1268
|
options: {
|
|
1120
|
-
offset: [0, parseInt(
|
|
1269
|
+
offset: [0, parseInt(options["offset"], 10)]
|
|
1121
1270
|
}
|
|
1122
1271
|
}, {
|
|
1123
1272
|
name: "preventOverflow",
|
|
1124
1273
|
options: {
|
|
1125
|
-
padding:
|
|
1274
|
+
padding: getPadding(options["overflow-padding"])
|
|
1126
1275
|
}
|
|
1127
1276
|
}, {
|
|
1128
1277
|
name: "flip",
|
|
1129
1278
|
options: {
|
|
1130
|
-
padding:
|
|
1279
|
+
padding: getPadding(options["flip-padding"])
|
|
1131
1280
|
}
|
|
1132
1281
|
}, {
|
|
1133
1282
|
name: "arrow",
|
|
1134
1283
|
options: {
|
|
1135
|
-
element:
|
|
1136
|
-
padding:
|
|
1284
|
+
element: options["arrow-element"],
|
|
1285
|
+
padding: getPadding(options["arrow-padding"])
|
|
1137
1286
|
}
|
|
1138
1287
|
}];
|
|
1139
1288
|
}
|
|
1140
|
-
function
|
|
1141
|
-
const
|
|
1142
|
-
if (
|
|
1143
|
-
return
|
|
1144
|
-
|
|
1145
|
-
}
|
|
1146
|
-
|
|
1147
|
-
|
|
1148
|
-
|
|
1149
|
-
|
|
1150
|
-
|
|
1151
|
-
if (
|
|
1152
|
-
|
|
1153
|
-
|
|
1154
|
-
|
|
1289
|
+
function getPopover(query) {
|
|
1290
|
+
const entry = typeof query === "string" ? this.get(query) : this.get(query.id);
|
|
1291
|
+
if (entry) {
|
|
1292
|
+
return entry;
|
|
1293
|
+
} else {
|
|
1294
|
+
throw new Error(`Popover not found in collection with id of "${query}".`);
|
|
1295
|
+
}
|
|
1296
|
+
}
|
|
1297
|
+
function getPopoverID(obj) {
|
|
1298
|
+
if (typeof obj === "string") {
|
|
1299
|
+
return obj;
|
|
1300
|
+
} else if (typeof obj.hasAttribute === "function") {
|
|
1301
|
+
if (obj.closest(this.settings.selectorPopover)) {
|
|
1302
|
+
obj = obj.closest(this.settings.selectorPopover);
|
|
1303
|
+
return obj.id;
|
|
1304
|
+
} else if (obj.hasAttribute("aria-controls")) {
|
|
1305
|
+
return obj.getAttribute("aria-controls");
|
|
1306
|
+
} else if (obj.hasAttribute("aria-describedby")) {
|
|
1307
|
+
return obj.getAttribute("aria-describedby");
|
|
1308
|
+
} else return false;
|
|
1309
|
+
} else return false;
|
|
1310
|
+
}
|
|
1311
|
+
function getPopoverElements(query) {
|
|
1312
|
+
const id = getPopoverID.call(this, query);
|
|
1313
|
+
if (id) {
|
|
1314
|
+
const popover = document.querySelector(`#${id}`);
|
|
1315
|
+
const trigger = document.querySelector(`[aria-controls="${id}"]`) || document.querySelector(`[aria-describedby="${id}"]`);
|
|
1316
|
+
if (!trigger && !popover) {
|
|
1317
|
+
return { error: new Error(`No popover elements found using the ID: "${id}".`) };
|
|
1318
|
+
} else if (!trigger) {
|
|
1319
|
+
return { error: new Error("No popover trigger associated with the provided popover.") };
|
|
1320
|
+
} else if (!popover) {
|
|
1321
|
+
return { error: new Error("No popover associated with the provided popover trigger.") };
|
|
1322
|
+
} else {
|
|
1323
|
+
return { popover, trigger };
|
|
1324
|
+
}
|
|
1325
|
+
} else {
|
|
1155
1326
|
return { error: new Error("Could not resolve the popover ID.") };
|
|
1327
|
+
}
|
|
1328
|
+
}
|
|
1329
|
+
async function close(query) {
|
|
1330
|
+
const popover = query ? getPopover.call(this, query) : await closeAll.call(this);
|
|
1331
|
+
if (popover && popover.state === "opened") {
|
|
1332
|
+
popover.el.classList.remove(this.settings.stateActive);
|
|
1333
|
+
if (popover.trigger.hasAttribute("aria-controls")) {
|
|
1334
|
+
popover.trigger.setAttribute("aria-expanded", "false");
|
|
1335
|
+
}
|
|
1336
|
+
popover.popper.setOptions({
|
|
1337
|
+
placement: popover.config["placement"],
|
|
1338
|
+
modifiers: [
|
|
1339
|
+
{ name: "eventListeners", enabled: false },
|
|
1340
|
+
...getModifiers(popover.config)
|
|
1341
|
+
]
|
|
1342
|
+
});
|
|
1343
|
+
popover.state = "closed";
|
|
1344
|
+
if (popover.trigger === this.trigger) {
|
|
1345
|
+
this.trigger = null;
|
|
1346
|
+
}
|
|
1347
|
+
}
|
|
1348
|
+
return popover;
|
|
1156
1349
|
}
|
|
1157
|
-
async function
|
|
1158
|
-
const
|
|
1159
|
-
|
|
1160
|
-
|
|
1161
|
-
|
|
1162
|
-
}
|
|
1163
|
-
|
|
1164
|
-
|
|
1165
|
-
|
|
1166
|
-
|
|
1167
|
-
|
|
1168
|
-
|
|
1169
|
-
|
|
1170
|
-
|
|
1171
|
-
|
|
1172
|
-
`#${e.id}, [aria-controls="${e.id}"], [aria-describedby="${e.id}"]`
|
|
1350
|
+
async function closeAll() {
|
|
1351
|
+
const result = [];
|
|
1352
|
+
await Promise.all(this.collection.map(async (popover) => {
|
|
1353
|
+
if (popover.state === "opened") {
|
|
1354
|
+
result.push(await close.call(this, popover));
|
|
1355
|
+
}
|
|
1356
|
+
}));
|
|
1357
|
+
return result;
|
|
1358
|
+
}
|
|
1359
|
+
function closeCheck(popover) {
|
|
1360
|
+
if (popover.state != "opened") return;
|
|
1361
|
+
setTimeout(() => {
|
|
1362
|
+
const isHovered = popover.el.closest(":hover") === popover.el || popover.trigger.closest(":hover") === popover.trigger;
|
|
1363
|
+
const isFocused = document.activeElement.closest(
|
|
1364
|
+
`#${popover.id}, [aria-controls="${popover.id}"], [aria-describedby="${popover.id}"]`
|
|
1173
1365
|
);
|
|
1174
|
-
|
|
1366
|
+
if (!isHovered && !isFocused) {
|
|
1367
|
+
popover.close();
|
|
1368
|
+
}
|
|
1369
|
+
return popover;
|
|
1175
1370
|
}, 1);
|
|
1176
1371
|
}
|
|
1177
|
-
function
|
|
1178
|
-
|
|
1372
|
+
function handleClick(popover) {
|
|
1373
|
+
if (popover.state === "opened") {
|
|
1374
|
+
popover.close();
|
|
1375
|
+
} else {
|
|
1376
|
+
this.trigger = popover.trigger;
|
|
1377
|
+
popover.open();
|
|
1378
|
+
handleDocumentClick.call(this, popover);
|
|
1379
|
+
}
|
|
1380
|
+
}
|
|
1381
|
+
function handleMouseEnter(popover) {
|
|
1382
|
+
if (popover.toggleDelayId) {
|
|
1383
|
+
clearTimeout(popover.toggleDelayId);
|
|
1384
|
+
}
|
|
1385
|
+
const delay = this.activeTooltip ? 0 : popover.config["toggle-delay"];
|
|
1386
|
+
if (this.activeTooltip) this.activeTooltip.close();
|
|
1387
|
+
popover.toggleDelayId = setTimeout(() => {
|
|
1388
|
+
popover.open();
|
|
1389
|
+
}, delay);
|
|
1179
1390
|
}
|
|
1180
|
-
function
|
|
1181
|
-
|
|
1391
|
+
function handleMouseLeave(popover) {
|
|
1392
|
+
if (popover.toggleDelayId) {
|
|
1393
|
+
clearTimeout(popover.toggleDelayId);
|
|
1394
|
+
}
|
|
1395
|
+
popover.toggleDelayId = setTimeout(() => {
|
|
1396
|
+
closeCheck.call(this, popover);
|
|
1397
|
+
}, popover.config["toggle-delay"]);
|
|
1398
|
+
}
|
|
1399
|
+
function handleKeydown(event) {
|
|
1400
|
+
switch (event.key) {
|
|
1182
1401
|
case "Escape":
|
|
1183
|
-
|
|
1402
|
+
if (this.trigger) {
|
|
1403
|
+
this.trigger.focus();
|
|
1404
|
+
}
|
|
1405
|
+
closeAll.call(this);
|
|
1184
1406
|
return;
|
|
1185
1407
|
case "Tab":
|
|
1186
|
-
this.collection.forEach((
|
|
1187
|
-
|
|
1408
|
+
this.collection.forEach((popover) => {
|
|
1409
|
+
closeCheck.call(this, popover);
|
|
1188
1410
|
});
|
|
1189
1411
|
return;
|
|
1190
1412
|
default:
|
|
1191
1413
|
return;
|
|
1192
1414
|
}
|
|
1193
1415
|
}
|
|
1194
|
-
function
|
|
1195
|
-
const
|
|
1196
|
-
document.addEventListener("click", function
|
|
1197
|
-
|
|
1198
|
-
`#${
|
|
1199
|
-
)
|
|
1416
|
+
function handleDocumentClick(popover) {
|
|
1417
|
+
const root = this;
|
|
1418
|
+
document.addEventListener("click", function _f(event) {
|
|
1419
|
+
const wasClicked = event.target.closest(
|
|
1420
|
+
`#${popover.id}, [aria-controls="${popover.id}"], [aria-describedby="${popover.id}"]`
|
|
1421
|
+
);
|
|
1422
|
+
if (wasClicked) {
|
|
1423
|
+
if (popover.el && !popover.el.classList.contains(root.settings.stateActive)) {
|
|
1424
|
+
this.removeEventListener("click", _f);
|
|
1425
|
+
}
|
|
1426
|
+
} else {
|
|
1427
|
+
if (popover.el && popover.el.classList.contains(root.settings.stateActive)) {
|
|
1428
|
+
popover.close();
|
|
1429
|
+
}
|
|
1430
|
+
this.removeEventListener("click", _f);
|
|
1431
|
+
}
|
|
1200
1432
|
});
|
|
1201
1433
|
}
|
|
1202
|
-
var
|
|
1203
|
-
|
|
1204
|
-
|
|
1205
|
-
|
|
1206
|
-
|
|
1207
|
-
|
|
1208
|
-
|
|
1209
|
-
|
|
1210
|
-
|
|
1211
|
-
|
|
1434
|
+
var top = "top";
|
|
1435
|
+
var bottom = "bottom";
|
|
1436
|
+
var right = "right";
|
|
1437
|
+
var left = "left";
|
|
1438
|
+
var auto = "auto";
|
|
1439
|
+
var basePlacements = [top, bottom, right, left];
|
|
1440
|
+
var start = "start";
|
|
1441
|
+
var end = "end";
|
|
1442
|
+
var clippingParents = "clippingParents";
|
|
1443
|
+
var viewport = "viewport";
|
|
1444
|
+
var popper = "popper";
|
|
1445
|
+
var reference = "reference";
|
|
1446
|
+
var variationPlacements = /* @__PURE__ */ basePlacements.reduce(function(acc, placement) {
|
|
1447
|
+
return acc.concat([placement + "-" + start, placement + "-" + end]);
|
|
1448
|
+
}, []);
|
|
1449
|
+
var placements = /* @__PURE__ */ [].concat(basePlacements, [auto]).reduce(function(acc, placement) {
|
|
1450
|
+
return acc.concat([placement, placement + "-" + start, placement + "-" + end]);
|
|
1451
|
+
}, []);
|
|
1452
|
+
var beforeRead = "beforeRead";
|
|
1453
|
+
var read = "read";
|
|
1454
|
+
var afterRead = "afterRead";
|
|
1455
|
+
var beforeMain = "beforeMain";
|
|
1456
|
+
var main = "main";
|
|
1457
|
+
var afterMain = "afterMain";
|
|
1458
|
+
var beforeWrite = "beforeWrite";
|
|
1459
|
+
var write = "write";
|
|
1460
|
+
var afterWrite = "afterWrite";
|
|
1461
|
+
var modifierPhases = [beforeRead, read, afterRead, beforeMain, main, afterMain, beforeWrite, write, afterWrite];
|
|
1462
|
+
function getNodeName(element) {
|
|
1463
|
+
return element ? (element.nodeName || "").toLowerCase() : null;
|
|
1464
|
+
}
|
|
1465
|
+
function getWindow(node) {
|
|
1466
|
+
if (node == null) {
|
|
1212
1467
|
return window;
|
|
1213
|
-
if (e.toString() !== "[object Window]") {
|
|
1214
|
-
var t = e.ownerDocument;
|
|
1215
|
-
return t && t.defaultView || window;
|
|
1216
1468
|
}
|
|
1217
|
-
|
|
1469
|
+
if (node.toString() !== "[object Window]") {
|
|
1470
|
+
var ownerDocument = node.ownerDocument;
|
|
1471
|
+
return ownerDocument ? ownerDocument.defaultView || window : window;
|
|
1472
|
+
}
|
|
1473
|
+
return node;
|
|
1218
1474
|
}
|
|
1219
|
-
function
|
|
1220
|
-
var
|
|
1221
|
-
return
|
|
1475
|
+
function isElement(node) {
|
|
1476
|
+
var OwnElement = getWindow(node).Element;
|
|
1477
|
+
return node instanceof OwnElement || node instanceof Element;
|
|
1222
1478
|
}
|
|
1223
|
-
function
|
|
1224
|
-
var
|
|
1225
|
-
return
|
|
1479
|
+
function isHTMLElement(node) {
|
|
1480
|
+
var OwnElement = getWindow(node).HTMLElement;
|
|
1481
|
+
return node instanceof OwnElement || node instanceof HTMLElement;
|
|
1226
1482
|
}
|
|
1227
|
-
function
|
|
1228
|
-
if (typeof ShadowRoot
|
|
1483
|
+
function isShadowRoot(node) {
|
|
1484
|
+
if (typeof ShadowRoot === "undefined") {
|
|
1229
1485
|
return false;
|
|
1230
|
-
|
|
1231
|
-
|
|
1232
|
-
|
|
1233
|
-
|
|
1234
|
-
|
|
1235
|
-
|
|
1236
|
-
|
|
1237
|
-
|
|
1238
|
-
|
|
1239
|
-
|
|
1240
|
-
|
|
1486
|
+
}
|
|
1487
|
+
var OwnElement = getWindow(node).ShadowRoot;
|
|
1488
|
+
return node instanceof OwnElement || node instanceof ShadowRoot;
|
|
1489
|
+
}
|
|
1490
|
+
function applyStyles(_ref) {
|
|
1491
|
+
var state = _ref.state;
|
|
1492
|
+
Object.keys(state.elements).forEach(function(name) {
|
|
1493
|
+
var style = state.styles[name] || {};
|
|
1494
|
+
var attributes = state.attributes[name] || {};
|
|
1495
|
+
var element = state.elements[name];
|
|
1496
|
+
if (!isHTMLElement(element) || !getNodeName(element)) {
|
|
1497
|
+
return;
|
|
1498
|
+
}
|
|
1499
|
+
Object.assign(element.style, style);
|
|
1500
|
+
Object.keys(attributes).forEach(function(name2) {
|
|
1501
|
+
var value = attributes[name2];
|
|
1502
|
+
if (value === false) {
|
|
1503
|
+
element.removeAttribute(name2);
|
|
1504
|
+
} else {
|
|
1505
|
+
element.setAttribute(name2, value === true ? "" : value);
|
|
1506
|
+
}
|
|
1507
|
+
});
|
|
1241
1508
|
});
|
|
1242
1509
|
}
|
|
1243
|
-
function
|
|
1244
|
-
var
|
|
1510
|
+
function effect$2(_ref2) {
|
|
1511
|
+
var state = _ref2.state;
|
|
1512
|
+
var initialStyles = {
|
|
1245
1513
|
popper: {
|
|
1246
|
-
position:
|
|
1514
|
+
position: state.options.strategy,
|
|
1247
1515
|
left: "0",
|
|
1248
1516
|
top: "0",
|
|
1249
1517
|
margin: "0"
|
|
@@ -1253,137 +1521,198 @@ function _t(e) {
|
|
|
1253
1521
|
},
|
|
1254
1522
|
reference: {}
|
|
1255
1523
|
};
|
|
1256
|
-
|
|
1257
|
-
|
|
1258
|
-
|
|
1259
|
-
|
|
1524
|
+
Object.assign(state.elements.popper.style, initialStyles.popper);
|
|
1525
|
+
state.styles = initialStyles;
|
|
1526
|
+
if (state.elements.arrow) {
|
|
1527
|
+
Object.assign(state.elements.arrow.style, initialStyles.arrow);
|
|
1528
|
+
}
|
|
1529
|
+
return function() {
|
|
1530
|
+
Object.keys(state.elements).forEach(function(name) {
|
|
1531
|
+
var element = state.elements[name];
|
|
1532
|
+
var attributes = state.attributes[name] || {};
|
|
1533
|
+
var styleProperties = Object.keys(state.styles.hasOwnProperty(name) ? state.styles[name] : initialStyles[name]);
|
|
1534
|
+
var style = styleProperties.reduce(function(style2, property) {
|
|
1535
|
+
style2[property] = "";
|
|
1536
|
+
return style2;
|
|
1260
1537
|
}, {});
|
|
1261
|
-
!
|
|
1262
|
-
|
|
1263
|
-
}
|
|
1538
|
+
if (!isHTMLElement(element) || !getNodeName(element)) {
|
|
1539
|
+
return;
|
|
1540
|
+
}
|
|
1541
|
+
Object.assign(element.style, style);
|
|
1542
|
+
Object.keys(attributes).forEach(function(attribute) {
|
|
1543
|
+
element.removeAttribute(attribute);
|
|
1544
|
+
});
|
|
1264
1545
|
});
|
|
1265
1546
|
};
|
|
1266
1547
|
}
|
|
1267
|
-
const
|
|
1548
|
+
const applyStyles$1 = {
|
|
1268
1549
|
name: "applyStyles",
|
|
1269
1550
|
enabled: true,
|
|
1270
1551
|
phase: "write",
|
|
1271
|
-
fn:
|
|
1272
|
-
effect:
|
|
1552
|
+
fn: applyStyles,
|
|
1553
|
+
effect: effect$2,
|
|
1273
1554
|
requires: ["computeStyles"]
|
|
1274
1555
|
};
|
|
1275
|
-
function
|
|
1276
|
-
return
|
|
1277
|
-
}
|
|
1278
|
-
var
|
|
1279
|
-
|
|
1280
|
-
|
|
1281
|
-
|
|
1282
|
-
|
|
1283
|
-
|
|
1284
|
-
|
|
1285
|
-
|
|
1286
|
-
|
|
1287
|
-
}
|
|
1288
|
-
|
|
1289
|
-
|
|
1290
|
-
|
|
1291
|
-
|
|
1292
|
-
|
|
1556
|
+
function getBasePlacement(placement) {
|
|
1557
|
+
return placement.split("-")[0];
|
|
1558
|
+
}
|
|
1559
|
+
var max = Math.max;
|
|
1560
|
+
var min = Math.min;
|
|
1561
|
+
var round = Math.round;
|
|
1562
|
+
function getUAString() {
|
|
1563
|
+
var uaData = navigator.userAgentData;
|
|
1564
|
+
if (uaData != null && uaData.brands && Array.isArray(uaData.brands)) {
|
|
1565
|
+
return uaData.brands.map(function(item) {
|
|
1566
|
+
return item.brand + "/" + item.version;
|
|
1567
|
+
}).join(" ");
|
|
1568
|
+
}
|
|
1569
|
+
return navigator.userAgent;
|
|
1570
|
+
}
|
|
1571
|
+
function isLayoutViewport() {
|
|
1572
|
+
return !/^((?!chrome|android).)*safari/i.test(getUAString());
|
|
1573
|
+
}
|
|
1574
|
+
function getBoundingClientRect(element, includeScale, isFixedStrategy) {
|
|
1575
|
+
if (includeScale === void 0) {
|
|
1576
|
+
includeScale = false;
|
|
1577
|
+
}
|
|
1578
|
+
if (isFixedStrategy === void 0) {
|
|
1579
|
+
isFixedStrategy = false;
|
|
1580
|
+
}
|
|
1581
|
+
var clientRect = element.getBoundingClientRect();
|
|
1582
|
+
var scaleX = 1;
|
|
1583
|
+
var scaleY = 1;
|
|
1584
|
+
if (includeScale && isHTMLElement(element)) {
|
|
1585
|
+
scaleX = element.offsetWidth > 0 ? round(clientRect.width) / element.offsetWidth || 1 : 1;
|
|
1586
|
+
scaleY = element.offsetHeight > 0 ? round(clientRect.height) / element.offsetHeight || 1 : 1;
|
|
1587
|
+
}
|
|
1588
|
+
var _ref = isElement(element) ? getWindow(element) : window, visualViewport = _ref.visualViewport;
|
|
1589
|
+
var addVisualOffsets = !isLayoutViewport() && isFixedStrategy;
|
|
1590
|
+
var x = (clientRect.left + (addVisualOffsets && visualViewport ? visualViewport.offsetLeft : 0)) / scaleX;
|
|
1591
|
+
var y = (clientRect.top + (addVisualOffsets && visualViewport ? visualViewport.offsetTop : 0)) / scaleY;
|
|
1592
|
+
var width = clientRect.width / scaleX;
|
|
1593
|
+
var height = clientRect.height / scaleY;
|
|
1293
1594
|
return {
|
|
1294
|
-
width
|
|
1295
|
-
height
|
|
1296
|
-
top:
|
|
1297
|
-
right:
|
|
1298
|
-
bottom:
|
|
1299
|
-
left:
|
|
1300
|
-
x
|
|
1301
|
-
y
|
|
1595
|
+
width,
|
|
1596
|
+
height,
|
|
1597
|
+
top: y,
|
|
1598
|
+
right: x + width,
|
|
1599
|
+
bottom: y + height,
|
|
1600
|
+
left: x,
|
|
1601
|
+
x,
|
|
1602
|
+
y
|
|
1302
1603
|
};
|
|
1303
1604
|
}
|
|
1304
|
-
function
|
|
1305
|
-
var
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1309
|
-
width
|
|
1310
|
-
|
|
1605
|
+
function getLayoutRect(element) {
|
|
1606
|
+
var clientRect = getBoundingClientRect(element);
|
|
1607
|
+
var width = element.offsetWidth;
|
|
1608
|
+
var height = element.offsetHeight;
|
|
1609
|
+
if (Math.abs(clientRect.width - width) <= 1) {
|
|
1610
|
+
width = clientRect.width;
|
|
1611
|
+
}
|
|
1612
|
+
if (Math.abs(clientRect.height - height) <= 1) {
|
|
1613
|
+
height = clientRect.height;
|
|
1614
|
+
}
|
|
1615
|
+
return {
|
|
1616
|
+
x: element.offsetLeft,
|
|
1617
|
+
y: element.offsetTop,
|
|
1618
|
+
width,
|
|
1619
|
+
height
|
|
1311
1620
|
};
|
|
1312
1621
|
}
|
|
1313
|
-
function
|
|
1314
|
-
var
|
|
1315
|
-
if (
|
|
1622
|
+
function contains(parent, child) {
|
|
1623
|
+
var rootNode = child.getRootNode && child.getRootNode();
|
|
1624
|
+
if (parent.contains(child)) {
|
|
1316
1625
|
return true;
|
|
1317
|
-
if (
|
|
1318
|
-
var
|
|
1626
|
+
} else if (rootNode && isShadowRoot(rootNode)) {
|
|
1627
|
+
var next = child;
|
|
1319
1628
|
do {
|
|
1320
|
-
if (
|
|
1629
|
+
if (next && parent.isSameNode(next)) {
|
|
1321
1630
|
return true;
|
|
1322
|
-
|
|
1323
|
-
|
|
1631
|
+
}
|
|
1632
|
+
next = next.parentNode || next.host;
|
|
1633
|
+
} while (next);
|
|
1324
1634
|
}
|
|
1325
1635
|
return false;
|
|
1326
1636
|
}
|
|
1327
|
-
function
|
|
1328
|
-
return
|
|
1637
|
+
function getComputedStyle$1(element) {
|
|
1638
|
+
return getWindow(element).getComputedStyle(element);
|
|
1329
1639
|
}
|
|
1330
|
-
function
|
|
1331
|
-
return ["table", "td", "th"].indexOf(
|
|
1640
|
+
function isTableElement(element) {
|
|
1641
|
+
return ["table", "td", "th"].indexOf(getNodeName(element)) >= 0;
|
|
1332
1642
|
}
|
|
1333
|
-
function
|
|
1334
|
-
return ((
|
|
1643
|
+
function getDocumentElement(element) {
|
|
1644
|
+
return ((isElement(element) ? element.ownerDocument : (
|
|
1335
1645
|
// $FlowFixMe[prop-missing]
|
|
1336
|
-
|
|
1646
|
+
element.document
|
|
1337
1647
|
)) || window.document).documentElement;
|
|
1338
1648
|
}
|
|
1339
|
-
function
|
|
1340
|
-
|
|
1649
|
+
function getParentNode(element) {
|
|
1650
|
+
if (getNodeName(element) === "html") {
|
|
1651
|
+
return element;
|
|
1652
|
+
}
|
|
1653
|
+
return (
|
|
1341
1654
|
// this is a quicker (but less type safe) way to save quite some bytes from the bundle
|
|
1342
1655
|
// $FlowFixMe[incompatible-return]
|
|
1343
1656
|
// $FlowFixMe[prop-missing]
|
|
1344
|
-
|
|
1345
|
-
|
|
1346
|
-
(
|
|
1657
|
+
element.assignedSlot || // step into the shadow DOM of the parent of a slotted node
|
|
1658
|
+
element.parentNode || // DOM Element detected
|
|
1659
|
+
(isShadowRoot(element) ? element.host : null) || // ShadowRoot detected
|
|
1347
1660
|
// $FlowFixMe[incompatible-call]: HTMLElement is a Node
|
|
1348
|
-
|
|
1661
|
+
getDocumentElement(element)
|
|
1349
1662
|
);
|
|
1350
1663
|
}
|
|
1351
|
-
function
|
|
1352
|
-
|
|
1353
|
-
|
|
1664
|
+
function getTrueOffsetParent(element) {
|
|
1665
|
+
if (!isHTMLElement(element) || // https://github.com/popperjs/popper-core/issues/837
|
|
1666
|
+
getComputedStyle$1(element).position === "fixed") {
|
|
1667
|
+
return null;
|
|
1668
|
+
}
|
|
1669
|
+
return element.offsetParent;
|
|
1354
1670
|
}
|
|
1355
|
-
function
|
|
1356
|
-
var
|
|
1357
|
-
|
|
1358
|
-
|
|
1359
|
-
|
|
1671
|
+
function getContainingBlock(element) {
|
|
1672
|
+
var isFirefox = /firefox/i.test(getUAString());
|
|
1673
|
+
var isIE = /Trident/i.test(getUAString());
|
|
1674
|
+
if (isIE && isHTMLElement(element)) {
|
|
1675
|
+
var elementCss = getComputedStyle$1(element);
|
|
1676
|
+
if (elementCss.position === "fixed") {
|
|
1360
1677
|
return null;
|
|
1678
|
+
}
|
|
1361
1679
|
}
|
|
1362
|
-
var
|
|
1363
|
-
|
|
1364
|
-
|
|
1365
|
-
|
|
1366
|
-
|
|
1367
|
-
|
|
1680
|
+
var currentNode = getParentNode(element);
|
|
1681
|
+
if (isShadowRoot(currentNode)) {
|
|
1682
|
+
currentNode = currentNode.host;
|
|
1683
|
+
}
|
|
1684
|
+
while (isHTMLElement(currentNode) && ["html", "body"].indexOf(getNodeName(currentNode)) < 0) {
|
|
1685
|
+
var css = getComputedStyle$1(currentNode);
|
|
1686
|
+
if (css.transform !== "none" || css.perspective !== "none" || css.contain === "paint" || ["transform", "perspective"].indexOf(css.willChange) !== -1 || isFirefox && css.willChange === "filter" || isFirefox && css.filter && css.filter !== "none") {
|
|
1687
|
+
return currentNode;
|
|
1688
|
+
} else {
|
|
1689
|
+
currentNode = currentNode.parentNode;
|
|
1690
|
+
}
|
|
1368
1691
|
}
|
|
1369
1692
|
return null;
|
|
1370
1693
|
}
|
|
1371
|
-
function
|
|
1372
|
-
|
|
1373
|
-
|
|
1374
|
-
|
|
1694
|
+
function getOffsetParent(element) {
|
|
1695
|
+
var window2 = getWindow(element);
|
|
1696
|
+
var offsetParent = getTrueOffsetParent(element);
|
|
1697
|
+
while (offsetParent && isTableElement(offsetParent) && getComputedStyle$1(offsetParent).position === "static") {
|
|
1698
|
+
offsetParent = getTrueOffsetParent(offsetParent);
|
|
1699
|
+
}
|
|
1700
|
+
if (offsetParent && (getNodeName(offsetParent) === "html" || getNodeName(offsetParent) === "body" && getComputedStyle$1(offsetParent).position === "static")) {
|
|
1701
|
+
return window2;
|
|
1702
|
+
}
|
|
1703
|
+
return offsetParent || getContainingBlock(element) || window2;
|
|
1375
1704
|
}
|
|
1376
|
-
function
|
|
1377
|
-
return ["top", "bottom"].indexOf(
|
|
1705
|
+
function getMainAxisFromPlacement(placement) {
|
|
1706
|
+
return ["top", "bottom"].indexOf(placement) >= 0 ? "x" : "y";
|
|
1378
1707
|
}
|
|
1379
|
-
function
|
|
1380
|
-
return
|
|
1708
|
+
function within(min$1, value, max$1) {
|
|
1709
|
+
return max(min$1, min(value, max$1));
|
|
1381
1710
|
}
|
|
1382
|
-
function
|
|
1383
|
-
var
|
|
1384
|
-
return
|
|
1711
|
+
function withinMaxClamp(min2, value, max2) {
|
|
1712
|
+
var v = within(min2, value, max2);
|
|
1713
|
+
return v > max2 ? max2 : v;
|
|
1385
1714
|
}
|
|
1386
|
-
function
|
|
1715
|
+
function getFreshSideObject() {
|
|
1387
1716
|
return {
|
|
1388
1717
|
top: 0,
|
|
1389
1718
|
right: 0,
|
|
@@ -1391,845 +1720,1259 @@ function ht() {
|
|
|
1391
1720
|
left: 0
|
|
1392
1721
|
};
|
|
1393
1722
|
}
|
|
1394
|
-
function
|
|
1395
|
-
return Object.assign({},
|
|
1723
|
+
function mergePaddingObject(paddingObject) {
|
|
1724
|
+
return Object.assign({}, getFreshSideObject(), paddingObject);
|
|
1396
1725
|
}
|
|
1397
|
-
function
|
|
1398
|
-
return
|
|
1399
|
-
|
|
1726
|
+
function expandToHashMap(value, keys) {
|
|
1727
|
+
return keys.reduce(function(hashMap, key) {
|
|
1728
|
+
hashMap[key] = value;
|
|
1729
|
+
return hashMap;
|
|
1400
1730
|
}, {});
|
|
1401
1731
|
}
|
|
1402
|
-
var
|
|
1403
|
-
|
|
1404
|
-
placement:
|
|
1405
|
-
})) :
|
|
1732
|
+
var toPaddingObject = function toPaddingObject2(padding, state) {
|
|
1733
|
+
padding = typeof padding === "function" ? padding(Object.assign({}, state.rects, {
|
|
1734
|
+
placement: state.placement
|
|
1735
|
+
})) : padding;
|
|
1736
|
+
return mergePaddingObject(typeof padding !== "number" ? padding : expandToHashMap(padding, basePlacements));
|
|
1406
1737
|
};
|
|
1407
|
-
function
|
|
1408
|
-
var
|
|
1409
|
-
|
|
1410
|
-
|
|
1411
|
-
|
|
1738
|
+
function arrow(_ref) {
|
|
1739
|
+
var _state$modifiersData$;
|
|
1740
|
+
var state = _ref.state, name = _ref.name, options = _ref.options;
|
|
1741
|
+
var arrowElement = state.elements.arrow;
|
|
1742
|
+
var popperOffsets2 = state.modifiersData.popperOffsets;
|
|
1743
|
+
var basePlacement = getBasePlacement(state.placement);
|
|
1744
|
+
var axis = getMainAxisFromPlacement(basePlacement);
|
|
1745
|
+
var isVertical = [left, right].indexOf(basePlacement) >= 0;
|
|
1746
|
+
var len = isVertical ? "height" : "width";
|
|
1747
|
+
if (!arrowElement || !popperOffsets2) {
|
|
1748
|
+
return;
|
|
1412
1749
|
}
|
|
1750
|
+
var paddingObject = toPaddingObject(options.padding, state);
|
|
1751
|
+
var arrowRect = getLayoutRect(arrowElement);
|
|
1752
|
+
var minProp = axis === "y" ? top : left;
|
|
1753
|
+
var maxProp = axis === "y" ? bottom : right;
|
|
1754
|
+
var endDiff = state.rects.reference[len] + state.rects.reference[axis] - popperOffsets2[axis] - state.rects.popper[len];
|
|
1755
|
+
var startDiff = popperOffsets2[axis] - state.rects.reference[axis];
|
|
1756
|
+
var arrowOffsetParent = getOffsetParent(arrowElement);
|
|
1757
|
+
var clientSize = arrowOffsetParent ? axis === "y" ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0;
|
|
1758
|
+
var centerToReference = endDiff / 2 - startDiff / 2;
|
|
1759
|
+
var min2 = paddingObject[minProp];
|
|
1760
|
+
var max2 = clientSize - arrowRect[len] - paddingObject[maxProp];
|
|
1761
|
+
var center = clientSize / 2 - arrowRect[len] / 2 + centerToReference;
|
|
1762
|
+
var offset2 = within(min2, center, max2);
|
|
1763
|
+
var axisProp = axis;
|
|
1764
|
+
state.modifiersData[name] = (_state$modifiersData$ = {}, _state$modifiersData$[axisProp] = offset2, _state$modifiersData$.centerOffset = offset2 - center, _state$modifiersData$);
|
|
1765
|
+
}
|
|
1766
|
+
function effect$1(_ref2) {
|
|
1767
|
+
var state = _ref2.state, options = _ref2.options;
|
|
1768
|
+
var _options$element = options.element, arrowElement = _options$element === void 0 ? "[data-popper-arrow]" : _options$element;
|
|
1769
|
+
if (arrowElement == null) {
|
|
1770
|
+
return;
|
|
1771
|
+
}
|
|
1772
|
+
if (typeof arrowElement === "string") {
|
|
1773
|
+
arrowElement = state.elements.popper.querySelector(arrowElement);
|
|
1774
|
+
if (!arrowElement) {
|
|
1775
|
+
return;
|
|
1776
|
+
}
|
|
1777
|
+
}
|
|
1778
|
+
if (!contains(state.elements.popper, arrowElement)) {
|
|
1779
|
+
return;
|
|
1780
|
+
}
|
|
1781
|
+
state.elements.arrow = arrowElement;
|
|
1413
1782
|
}
|
|
1414
|
-
|
|
1415
|
-
var t = e.state, r3 = e.options, i2 = r3.element, n = i2 === void 0 ? "[data-popper-arrow]" : i2;
|
|
1416
|
-
n != null && (typeof n == "string" && (n = t.elements.popper.querySelector(n), !n) || vt(t.elements.popper, n) && (t.elements.arrow = n));
|
|
1417
|
-
}
|
|
1418
|
-
const rr = {
|
|
1783
|
+
const arrow$1 = {
|
|
1419
1784
|
name: "arrow",
|
|
1420
1785
|
enabled: true,
|
|
1421
1786
|
phase: "main",
|
|
1422
|
-
fn:
|
|
1423
|
-
effect:
|
|
1787
|
+
fn: arrow,
|
|
1788
|
+
effect: effect$1,
|
|
1424
1789
|
requires: ["popperOffsets"],
|
|
1425
1790
|
requiresIfExists: ["preventOverflow"]
|
|
1426
1791
|
};
|
|
1427
|
-
function
|
|
1428
|
-
return
|
|
1792
|
+
function getVariation(placement) {
|
|
1793
|
+
return placement.split("-")[1];
|
|
1429
1794
|
}
|
|
1430
|
-
var
|
|
1795
|
+
var unsetSides = {
|
|
1431
1796
|
top: "auto",
|
|
1432
1797
|
right: "auto",
|
|
1433
1798
|
bottom: "auto",
|
|
1434
1799
|
left: "auto"
|
|
1435
1800
|
};
|
|
1436
|
-
function
|
|
1437
|
-
var
|
|
1801
|
+
function roundOffsetsByDPR(_ref, win) {
|
|
1802
|
+
var x = _ref.x, y = _ref.y;
|
|
1803
|
+
var dpr = win.devicePixelRatio || 1;
|
|
1438
1804
|
return {
|
|
1439
|
-
x:
|
|
1440
|
-
y:
|
|
1805
|
+
x: round(x * dpr) / dpr || 0,
|
|
1806
|
+
y: round(y * dpr) / dpr || 0
|
|
1441
1807
|
};
|
|
1442
1808
|
}
|
|
1443
|
-
function
|
|
1444
|
-
var
|
|
1445
|
-
|
|
1446
|
-
|
|
1809
|
+
function mapToStyles(_ref2) {
|
|
1810
|
+
var _Object$assign2;
|
|
1811
|
+
var popper2 = _ref2.popper, popperRect = _ref2.popperRect, placement = _ref2.placement, variation = _ref2.variation, offsets = _ref2.offsets, position = _ref2.position, gpuAcceleration = _ref2.gpuAcceleration, adaptive = _ref2.adaptive, roundOffsets = _ref2.roundOffsets, isFixed = _ref2.isFixed;
|
|
1812
|
+
var _offsets$x = offsets.x, x = _offsets$x === void 0 ? 0 : _offsets$x, _offsets$y = offsets.y, y = _offsets$y === void 0 ? 0 : _offsets$y;
|
|
1813
|
+
var _ref3 = typeof roundOffsets === "function" ? roundOffsets({
|
|
1814
|
+
x,
|
|
1815
|
+
y
|
|
1447
1816
|
}) : {
|
|
1448
|
-
x
|
|
1449
|
-
y
|
|
1817
|
+
x,
|
|
1818
|
+
y
|
|
1450
1819
|
};
|
|
1451
|
-
|
|
1452
|
-
|
|
1453
|
-
|
|
1454
|
-
|
|
1455
|
-
|
|
1456
|
-
|
|
1457
|
-
|
|
1820
|
+
x = _ref3.x;
|
|
1821
|
+
y = _ref3.y;
|
|
1822
|
+
var hasX = offsets.hasOwnProperty("x");
|
|
1823
|
+
var hasY = offsets.hasOwnProperty("y");
|
|
1824
|
+
var sideX = left;
|
|
1825
|
+
var sideY = top;
|
|
1826
|
+
var win = window;
|
|
1827
|
+
if (adaptive) {
|
|
1828
|
+
var offsetParent = getOffsetParent(popper2);
|
|
1829
|
+
var heightProp = "clientHeight";
|
|
1830
|
+
var widthProp = "clientWidth";
|
|
1831
|
+
if (offsetParent === getWindow(popper2)) {
|
|
1832
|
+
offsetParent = getDocumentElement(popper2);
|
|
1833
|
+
if (getComputedStyle$1(offsetParent).position !== "static" && position === "absolute") {
|
|
1834
|
+
heightProp = "scrollHeight";
|
|
1835
|
+
widthProp = "scrollWidth";
|
|
1836
|
+
}
|
|
1837
|
+
}
|
|
1838
|
+
offsetParent = offsetParent;
|
|
1839
|
+
if (placement === top || (placement === left || placement === right) && variation === end) {
|
|
1840
|
+
sideY = bottom;
|
|
1841
|
+
var offsetY = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.height : (
|
|
1458
1842
|
// $FlowFixMe[prop-missing]
|
|
1459
|
-
|
|
1843
|
+
offsetParent[heightProp]
|
|
1460
1844
|
);
|
|
1461
|
-
|
|
1845
|
+
y -= offsetY - popperRect.height;
|
|
1846
|
+
y *= gpuAcceleration ? 1 : -1;
|
|
1462
1847
|
}
|
|
1463
|
-
if (
|
|
1464
|
-
|
|
1465
|
-
var
|
|
1848
|
+
if (placement === left || (placement === top || placement === bottom) && variation === end) {
|
|
1849
|
+
sideX = right;
|
|
1850
|
+
var offsetX = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.width : (
|
|
1466
1851
|
// $FlowFixMe[prop-missing]
|
|
1467
|
-
|
|
1852
|
+
offsetParent[widthProp]
|
|
1468
1853
|
);
|
|
1469
|
-
|
|
1854
|
+
x -= offsetX - popperRect.width;
|
|
1855
|
+
x *= gpuAcceleration ? 1 : -1;
|
|
1470
1856
|
}
|
|
1471
1857
|
}
|
|
1472
|
-
var
|
|
1473
|
-
position
|
|
1474
|
-
},
|
|
1475
|
-
|
|
1476
|
-
|
|
1477
|
-
|
|
1478
|
-
|
|
1479
|
-
|
|
1858
|
+
var commonStyles = Object.assign({
|
|
1859
|
+
position
|
|
1860
|
+
}, adaptive && unsetSides);
|
|
1861
|
+
var _ref4 = roundOffsets === true ? roundOffsetsByDPR({
|
|
1862
|
+
x,
|
|
1863
|
+
y
|
|
1864
|
+
}, getWindow(popper2)) : {
|
|
1865
|
+
x,
|
|
1866
|
+
y
|
|
1480
1867
|
};
|
|
1481
|
-
|
|
1482
|
-
|
|
1483
|
-
|
|
1484
|
-
|
|
1485
|
-
|
|
1486
|
-
}
|
|
1487
|
-
|
|
1488
|
-
|
|
1489
|
-
|
|
1490
|
-
|
|
1491
|
-
|
|
1492
|
-
|
|
1493
|
-
|
|
1494
|
-
|
|
1868
|
+
x = _ref4.x;
|
|
1869
|
+
y = _ref4.y;
|
|
1870
|
+
if (gpuAcceleration) {
|
|
1871
|
+
var _Object$assign;
|
|
1872
|
+
return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? "0" : "", _Object$assign[sideX] = hasX ? "0" : "", _Object$assign.transform = (win.devicePixelRatio || 1) <= 1 ? "translate(" + x + "px, " + y + "px)" : "translate3d(" + x + "px, " + y + "px, 0)", _Object$assign));
|
|
1873
|
+
}
|
|
1874
|
+
return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : "", _Object$assign2[sideX] = hasX ? x + "px" : "", _Object$assign2.transform = "", _Object$assign2));
|
|
1875
|
+
}
|
|
1876
|
+
function computeStyles(_ref5) {
|
|
1877
|
+
var state = _ref5.state, options = _ref5.options;
|
|
1878
|
+
var _options$gpuAccelerat = options.gpuAcceleration, gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat, _options$adaptive = options.adaptive, adaptive = _options$adaptive === void 0 ? true : _options$adaptive, _options$roundOffsets = options.roundOffsets, roundOffsets = _options$roundOffsets === void 0 ? true : _options$roundOffsets;
|
|
1879
|
+
var commonStyles = {
|
|
1880
|
+
placement: getBasePlacement(state.placement),
|
|
1881
|
+
variation: getVariation(state.placement),
|
|
1882
|
+
popper: state.elements.popper,
|
|
1883
|
+
popperRect: state.rects.popper,
|
|
1884
|
+
gpuAcceleration,
|
|
1885
|
+
isFixed: state.options.strategy === "fixed"
|
|
1495
1886
|
};
|
|
1496
|
-
|
|
1497
|
-
|
|
1498
|
-
|
|
1499
|
-
|
|
1500
|
-
|
|
1501
|
-
|
|
1502
|
-
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
|
|
1506
|
-
|
|
1507
|
-
|
|
1887
|
+
if (state.modifiersData.popperOffsets != null) {
|
|
1888
|
+
state.styles.popper = Object.assign({}, state.styles.popper, mapToStyles(Object.assign({}, commonStyles, {
|
|
1889
|
+
offsets: state.modifiersData.popperOffsets,
|
|
1890
|
+
position: state.options.strategy,
|
|
1891
|
+
adaptive,
|
|
1892
|
+
roundOffsets
|
|
1893
|
+
})));
|
|
1894
|
+
}
|
|
1895
|
+
if (state.modifiersData.arrow != null) {
|
|
1896
|
+
state.styles.arrow = Object.assign({}, state.styles.arrow, mapToStyles(Object.assign({}, commonStyles, {
|
|
1897
|
+
offsets: state.modifiersData.arrow,
|
|
1898
|
+
position: "absolute",
|
|
1899
|
+
adaptive: false,
|
|
1900
|
+
roundOffsets
|
|
1901
|
+
})));
|
|
1902
|
+
}
|
|
1903
|
+
state.attributes.popper = Object.assign({}, state.attributes.popper, {
|
|
1904
|
+
"data-popper-placement": state.placement
|
|
1508
1905
|
});
|
|
1509
1906
|
}
|
|
1510
|
-
const
|
|
1907
|
+
const computeStyles$1 = {
|
|
1511
1908
|
name: "computeStyles",
|
|
1512
1909
|
enabled: true,
|
|
1513
1910
|
phase: "beforeWrite",
|
|
1514
|
-
fn:
|
|
1911
|
+
fn: computeStyles,
|
|
1515
1912
|
data: {}
|
|
1516
1913
|
};
|
|
1517
|
-
var
|
|
1914
|
+
var passive = {
|
|
1518
1915
|
passive: true
|
|
1519
1916
|
};
|
|
1520
|
-
function
|
|
1521
|
-
var
|
|
1522
|
-
|
|
1523
|
-
|
|
1524
|
-
|
|
1525
|
-
|
|
1526
|
-
|
|
1527
|
-
|
|
1917
|
+
function effect(_ref) {
|
|
1918
|
+
var state = _ref.state, instance = _ref.instance, options = _ref.options;
|
|
1919
|
+
var _options$scroll = options.scroll, scroll = _options$scroll === void 0 ? true : _options$scroll, _options$resize = options.resize, resize = _options$resize === void 0 ? true : _options$resize;
|
|
1920
|
+
var window2 = getWindow(state.elements.popper);
|
|
1921
|
+
var scrollParents = [].concat(state.scrollParents.reference, state.scrollParents.popper);
|
|
1922
|
+
if (scroll) {
|
|
1923
|
+
scrollParents.forEach(function(scrollParent) {
|
|
1924
|
+
scrollParent.addEventListener("scroll", instance.update, passive);
|
|
1925
|
+
});
|
|
1926
|
+
}
|
|
1927
|
+
if (resize) {
|
|
1928
|
+
window2.addEventListener("resize", instance.update, passive);
|
|
1929
|
+
}
|
|
1930
|
+
return function() {
|
|
1931
|
+
if (scroll) {
|
|
1932
|
+
scrollParents.forEach(function(scrollParent) {
|
|
1933
|
+
scrollParent.removeEventListener("scroll", instance.update, passive);
|
|
1934
|
+
});
|
|
1935
|
+
}
|
|
1936
|
+
if (resize) {
|
|
1937
|
+
window2.removeEventListener("resize", instance.update, passive);
|
|
1938
|
+
}
|
|
1528
1939
|
};
|
|
1529
1940
|
}
|
|
1530
|
-
const
|
|
1941
|
+
const eventListeners = {
|
|
1531
1942
|
name: "eventListeners",
|
|
1532
1943
|
enabled: true,
|
|
1533
1944
|
phase: "write",
|
|
1534
|
-
fn: function() {
|
|
1945
|
+
fn: function fn() {
|
|
1535
1946
|
},
|
|
1536
|
-
effect
|
|
1947
|
+
effect,
|
|
1537
1948
|
data: {}
|
|
1538
1949
|
};
|
|
1539
|
-
var
|
|
1950
|
+
var hash$1 = {
|
|
1540
1951
|
left: "right",
|
|
1541
1952
|
right: "left",
|
|
1542
1953
|
bottom: "top",
|
|
1543
1954
|
top: "bottom"
|
|
1544
1955
|
};
|
|
1545
|
-
function
|
|
1546
|
-
return
|
|
1547
|
-
return
|
|
1956
|
+
function getOppositePlacement(placement) {
|
|
1957
|
+
return placement.replace(/left|right|bottom|top/g, function(matched) {
|
|
1958
|
+
return hash$1[matched];
|
|
1548
1959
|
});
|
|
1549
1960
|
}
|
|
1550
|
-
var
|
|
1961
|
+
var hash = {
|
|
1551
1962
|
start: "end",
|
|
1552
1963
|
end: "start"
|
|
1553
1964
|
};
|
|
1554
|
-
function
|
|
1555
|
-
return
|
|
1556
|
-
return
|
|
1965
|
+
function getOppositeVariationPlacement(placement) {
|
|
1966
|
+
return placement.replace(/start|end/g, function(matched) {
|
|
1967
|
+
return hash[matched];
|
|
1557
1968
|
});
|
|
1558
1969
|
}
|
|
1559
|
-
function
|
|
1560
|
-
var
|
|
1970
|
+
function getWindowScroll(node) {
|
|
1971
|
+
var win = getWindow(node);
|
|
1972
|
+
var scrollLeft = win.pageXOffset;
|
|
1973
|
+
var scrollTop = win.pageYOffset;
|
|
1561
1974
|
return {
|
|
1562
|
-
scrollLeft
|
|
1563
|
-
scrollTop
|
|
1975
|
+
scrollLeft,
|
|
1976
|
+
scrollTop
|
|
1564
1977
|
};
|
|
1565
1978
|
}
|
|
1566
|
-
function
|
|
1567
|
-
return
|
|
1568
|
-
}
|
|
1569
|
-
function
|
|
1570
|
-
var
|
|
1571
|
-
|
|
1572
|
-
|
|
1573
|
-
|
|
1574
|
-
|
|
1979
|
+
function getWindowScrollBarX(element) {
|
|
1980
|
+
return getBoundingClientRect(getDocumentElement(element)).left + getWindowScroll(element).scrollLeft;
|
|
1981
|
+
}
|
|
1982
|
+
function getViewportRect(element, strategy) {
|
|
1983
|
+
var win = getWindow(element);
|
|
1984
|
+
var html = getDocumentElement(element);
|
|
1985
|
+
var visualViewport = win.visualViewport;
|
|
1986
|
+
var width = html.clientWidth;
|
|
1987
|
+
var height = html.clientHeight;
|
|
1988
|
+
var x = 0;
|
|
1989
|
+
var y = 0;
|
|
1990
|
+
if (visualViewport) {
|
|
1991
|
+
width = visualViewport.width;
|
|
1992
|
+
height = visualViewport.height;
|
|
1993
|
+
var layoutViewport = isLayoutViewport();
|
|
1994
|
+
if (layoutViewport || !layoutViewport && strategy === "fixed") {
|
|
1995
|
+
x = visualViewport.offsetLeft;
|
|
1996
|
+
y = visualViewport.offsetTop;
|
|
1997
|
+
}
|
|
1575
1998
|
}
|
|
1576
1999
|
return {
|
|
1577
|
-
width
|
|
1578
|
-
height
|
|
1579
|
-
x:
|
|
1580
|
-
y
|
|
2000
|
+
width,
|
|
2001
|
+
height,
|
|
2002
|
+
x: x + getWindowScrollBarX(element),
|
|
2003
|
+
y
|
|
1581
2004
|
};
|
|
1582
2005
|
}
|
|
1583
|
-
function
|
|
1584
|
-
var
|
|
1585
|
-
|
|
1586
|
-
|
|
1587
|
-
|
|
1588
|
-
|
|
1589
|
-
|
|
2006
|
+
function getDocumentRect(element) {
|
|
2007
|
+
var _element$ownerDocumen;
|
|
2008
|
+
var html = getDocumentElement(element);
|
|
2009
|
+
var winScroll = getWindowScroll(element);
|
|
2010
|
+
var body = (_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body;
|
|
2011
|
+
var width = max(html.scrollWidth, html.clientWidth, body ? body.scrollWidth : 0, body ? body.clientWidth : 0);
|
|
2012
|
+
var height = max(html.scrollHeight, html.clientHeight, body ? body.scrollHeight : 0, body ? body.clientHeight : 0);
|
|
2013
|
+
var x = -winScroll.scrollLeft + getWindowScrollBarX(element);
|
|
2014
|
+
var y = -winScroll.scrollTop;
|
|
2015
|
+
if (getComputedStyle$1(body || html).direction === "rtl") {
|
|
2016
|
+
x += max(html.clientWidth, body ? body.clientWidth : 0) - width;
|
|
2017
|
+
}
|
|
2018
|
+
return {
|
|
2019
|
+
width,
|
|
2020
|
+
height,
|
|
2021
|
+
x,
|
|
2022
|
+
y
|
|
1590
2023
|
};
|
|
1591
2024
|
}
|
|
1592
|
-
function
|
|
1593
|
-
var
|
|
1594
|
-
return /auto|scroll|overlay|hidden/.test(
|
|
2025
|
+
function isScrollParent(element) {
|
|
2026
|
+
var _getComputedStyle = getComputedStyle$1(element), overflow = _getComputedStyle.overflow, overflowX = _getComputedStyle.overflowX, overflowY = _getComputedStyle.overflowY;
|
|
2027
|
+
return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
|
|
1595
2028
|
}
|
|
1596
|
-
function
|
|
1597
|
-
|
|
2029
|
+
function getScrollParent(node) {
|
|
2030
|
+
if (["html", "body", "#document"].indexOf(getNodeName(node)) >= 0) {
|
|
2031
|
+
return node.ownerDocument.body;
|
|
2032
|
+
}
|
|
2033
|
+
if (isHTMLElement(node) && isScrollParent(node)) {
|
|
2034
|
+
return node;
|
|
2035
|
+
}
|
|
2036
|
+
return getScrollParent(getParentNode(node));
|
|
1598
2037
|
}
|
|
1599
|
-
function
|
|
1600
|
-
var
|
|
1601
|
-
|
|
1602
|
-
|
|
1603
|
-
|
|
2038
|
+
function listScrollParents(element, list) {
|
|
2039
|
+
var _element$ownerDocumen;
|
|
2040
|
+
if (list === void 0) {
|
|
2041
|
+
list = [];
|
|
2042
|
+
}
|
|
2043
|
+
var scrollParent = getScrollParent(element);
|
|
2044
|
+
var isBody = scrollParent === ((_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body);
|
|
2045
|
+
var win = getWindow(scrollParent);
|
|
2046
|
+
var target = isBody ? [win].concat(win.visualViewport || [], isScrollParent(scrollParent) ? scrollParent : []) : scrollParent;
|
|
2047
|
+
var updatedList = list.concat(target);
|
|
2048
|
+
return isBody ? updatedList : (
|
|
1604
2049
|
// $FlowFixMe[incompatible-call]: isBody tells us target will be an HTMLElement here
|
|
1605
|
-
|
|
2050
|
+
updatedList.concat(listScrollParents(getParentNode(target)))
|
|
1606
2051
|
);
|
|
1607
2052
|
}
|
|
1608
|
-
function
|
|
1609
|
-
return Object.assign({},
|
|
1610
|
-
left:
|
|
1611
|
-
top:
|
|
1612
|
-
right:
|
|
1613
|
-
bottom:
|
|
2053
|
+
function rectToClientRect(rect) {
|
|
2054
|
+
return Object.assign({}, rect, {
|
|
2055
|
+
left: rect.x,
|
|
2056
|
+
top: rect.y,
|
|
2057
|
+
right: rect.x + rect.width,
|
|
2058
|
+
bottom: rect.y + rect.height
|
|
2059
|
+
});
|
|
2060
|
+
}
|
|
2061
|
+
function getInnerBoundingClientRect(element, strategy) {
|
|
2062
|
+
var rect = getBoundingClientRect(element, false, strategy === "fixed");
|
|
2063
|
+
rect.top = rect.top + element.clientTop;
|
|
2064
|
+
rect.left = rect.left + element.clientLeft;
|
|
2065
|
+
rect.bottom = rect.top + element.clientHeight;
|
|
2066
|
+
rect.right = rect.left + element.clientWidth;
|
|
2067
|
+
rect.width = element.clientWidth;
|
|
2068
|
+
rect.height = element.clientHeight;
|
|
2069
|
+
rect.x = rect.left;
|
|
2070
|
+
rect.y = rect.top;
|
|
2071
|
+
return rect;
|
|
2072
|
+
}
|
|
2073
|
+
function getClientRectFromMixedType(element, clippingParent, strategy) {
|
|
2074
|
+
return clippingParent === viewport ? rectToClientRect(getViewportRect(element, strategy)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent, strategy) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
|
|
2075
|
+
}
|
|
2076
|
+
function getClippingParents(element) {
|
|
2077
|
+
var clippingParents2 = listScrollParents(getParentNode(element));
|
|
2078
|
+
var canEscapeClipping = ["absolute", "fixed"].indexOf(getComputedStyle$1(element).position) >= 0;
|
|
2079
|
+
var clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;
|
|
2080
|
+
if (!isElement(clipperElement)) {
|
|
2081
|
+
return [];
|
|
2082
|
+
}
|
|
2083
|
+
return clippingParents2.filter(function(clippingParent) {
|
|
2084
|
+
return isElement(clippingParent) && contains(clippingParent, clipperElement) && getNodeName(clippingParent) !== "body";
|
|
1614
2085
|
});
|
|
1615
2086
|
}
|
|
1616
|
-
function
|
|
1617
|
-
var
|
|
1618
|
-
|
|
1619
|
-
|
|
1620
|
-
|
|
1621
|
-
|
|
1622
|
-
|
|
1623
|
-
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
return
|
|
1627
|
-
}
|
|
1628
|
-
|
|
1629
|
-
|
|
1630
|
-
|
|
1631
|
-
|
|
1632
|
-
|
|
1633
|
-
|
|
1634
|
-
|
|
1635
|
-
|
|
1636
|
-
|
|
1637
|
-
var
|
|
1638
|
-
|
|
1639
|
-
|
|
1640
|
-
|
|
1641
|
-
|
|
1642
|
-
|
|
2087
|
+
function getClippingRect(element, boundary, rootBoundary, strategy) {
|
|
2088
|
+
var mainClippingParents = boundary === "clippingParents" ? getClippingParents(element) : [].concat(boundary);
|
|
2089
|
+
var clippingParents2 = [].concat(mainClippingParents, [rootBoundary]);
|
|
2090
|
+
var firstClippingParent = clippingParents2[0];
|
|
2091
|
+
var clippingRect = clippingParents2.reduce(function(accRect, clippingParent) {
|
|
2092
|
+
var rect = getClientRectFromMixedType(element, clippingParent, strategy);
|
|
2093
|
+
accRect.top = max(rect.top, accRect.top);
|
|
2094
|
+
accRect.right = min(rect.right, accRect.right);
|
|
2095
|
+
accRect.bottom = min(rect.bottom, accRect.bottom);
|
|
2096
|
+
accRect.left = max(rect.left, accRect.left);
|
|
2097
|
+
return accRect;
|
|
2098
|
+
}, getClientRectFromMixedType(element, firstClippingParent, strategy));
|
|
2099
|
+
clippingRect.width = clippingRect.right - clippingRect.left;
|
|
2100
|
+
clippingRect.height = clippingRect.bottom - clippingRect.top;
|
|
2101
|
+
clippingRect.x = clippingRect.left;
|
|
2102
|
+
clippingRect.y = clippingRect.top;
|
|
2103
|
+
return clippingRect;
|
|
2104
|
+
}
|
|
2105
|
+
function computeOffsets(_ref) {
|
|
2106
|
+
var reference2 = _ref.reference, element = _ref.element, placement = _ref.placement;
|
|
2107
|
+
var basePlacement = placement ? getBasePlacement(placement) : null;
|
|
2108
|
+
var variation = placement ? getVariation(placement) : null;
|
|
2109
|
+
var commonX = reference2.x + reference2.width / 2 - element.width / 2;
|
|
2110
|
+
var commonY = reference2.y + reference2.height / 2 - element.height / 2;
|
|
2111
|
+
var offsets;
|
|
2112
|
+
switch (basePlacement) {
|
|
2113
|
+
case top:
|
|
2114
|
+
offsets = {
|
|
2115
|
+
x: commonX,
|
|
2116
|
+
y: reference2.y - element.height
|
|
1643
2117
|
};
|
|
1644
2118
|
break;
|
|
1645
|
-
case
|
|
1646
|
-
|
|
1647
|
-
x:
|
|
1648
|
-
y:
|
|
2119
|
+
case bottom:
|
|
2120
|
+
offsets = {
|
|
2121
|
+
x: commonX,
|
|
2122
|
+
y: reference2.y + reference2.height
|
|
1649
2123
|
};
|
|
1650
2124
|
break;
|
|
1651
|
-
case
|
|
1652
|
-
|
|
1653
|
-
x:
|
|
1654
|
-
y:
|
|
2125
|
+
case right:
|
|
2126
|
+
offsets = {
|
|
2127
|
+
x: reference2.x + reference2.width,
|
|
2128
|
+
y: commonY
|
|
1655
2129
|
};
|
|
1656
2130
|
break;
|
|
1657
|
-
case
|
|
1658
|
-
|
|
1659
|
-
x:
|
|
1660
|
-
y:
|
|
2131
|
+
case left:
|
|
2132
|
+
offsets = {
|
|
2133
|
+
x: reference2.x - element.width,
|
|
2134
|
+
y: commonY
|
|
1661
2135
|
};
|
|
1662
2136
|
break;
|
|
1663
2137
|
default:
|
|
1664
|
-
|
|
1665
|
-
x:
|
|
1666
|
-
y:
|
|
2138
|
+
offsets = {
|
|
2139
|
+
x: reference2.x,
|
|
2140
|
+
y: reference2.y
|
|
1667
2141
|
};
|
|
1668
2142
|
}
|
|
1669
|
-
var
|
|
1670
|
-
if (
|
|
1671
|
-
var
|
|
1672
|
-
switch (
|
|
1673
|
-
case
|
|
1674
|
-
|
|
2143
|
+
var mainAxis = basePlacement ? getMainAxisFromPlacement(basePlacement) : null;
|
|
2144
|
+
if (mainAxis != null) {
|
|
2145
|
+
var len = mainAxis === "y" ? "height" : "width";
|
|
2146
|
+
switch (variation) {
|
|
2147
|
+
case start:
|
|
2148
|
+
offsets[mainAxis] = offsets[mainAxis] - (reference2[len] / 2 - element[len] / 2);
|
|
1675
2149
|
break;
|
|
1676
|
-
case
|
|
1677
|
-
|
|
2150
|
+
case end:
|
|
2151
|
+
offsets[mainAxis] = offsets[mainAxis] + (reference2[len] / 2 - element[len] / 2);
|
|
1678
2152
|
break;
|
|
1679
2153
|
}
|
|
1680
2154
|
}
|
|
1681
|
-
return
|
|
1682
|
-
}
|
|
1683
|
-
function
|
|
1684
|
-
|
|
1685
|
-
|
|
1686
|
-
|
|
1687
|
-
|
|
2155
|
+
return offsets;
|
|
2156
|
+
}
|
|
2157
|
+
function detectOverflow(state, options) {
|
|
2158
|
+
if (options === void 0) {
|
|
2159
|
+
options = {};
|
|
2160
|
+
}
|
|
2161
|
+
var _options = options, _options$placement = _options.placement, placement = _options$placement === void 0 ? state.placement : _options$placement, _options$strategy = _options.strategy, strategy = _options$strategy === void 0 ? state.strategy : _options$strategy, _options$boundary = _options.boundary, boundary = _options$boundary === void 0 ? clippingParents : _options$boundary, _options$rootBoundary = _options.rootBoundary, rootBoundary = _options$rootBoundary === void 0 ? viewport : _options$rootBoundary, _options$elementConte = _options.elementContext, elementContext = _options$elementConte === void 0 ? popper : _options$elementConte, _options$altBoundary = _options.altBoundary, altBoundary = _options$altBoundary === void 0 ? false : _options$altBoundary, _options$padding = _options.padding, padding = _options$padding === void 0 ? 0 : _options$padding;
|
|
2162
|
+
var paddingObject = mergePaddingObject(typeof padding !== "number" ? padding : expandToHashMap(padding, basePlacements));
|
|
2163
|
+
var altContext = elementContext === popper ? reference : popper;
|
|
2164
|
+
var popperRect = state.rects.popper;
|
|
2165
|
+
var element = state.elements[altBoundary ? altContext : elementContext];
|
|
2166
|
+
var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary, strategy);
|
|
2167
|
+
var referenceClientRect = getBoundingClientRect(state.elements.reference);
|
|
2168
|
+
var popperOffsets2 = computeOffsets({
|
|
2169
|
+
reference: referenceClientRect,
|
|
2170
|
+
element: popperRect,
|
|
1688
2171
|
strategy: "absolute",
|
|
1689
|
-
placement
|
|
1690
|
-
})
|
|
1691
|
-
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
|
|
1695
|
-
|
|
1696
|
-
|
|
1697
|
-
|
|
1698
|
-
|
|
1699
|
-
|
|
1700
|
-
|
|
2172
|
+
placement
|
|
2173
|
+
});
|
|
2174
|
+
var popperClientRect = rectToClientRect(Object.assign({}, popperRect, popperOffsets2));
|
|
2175
|
+
var elementClientRect = elementContext === popper ? popperClientRect : referenceClientRect;
|
|
2176
|
+
var overflowOffsets = {
|
|
2177
|
+
top: clippingClientRect.top - elementClientRect.top + paddingObject.top,
|
|
2178
|
+
bottom: elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,
|
|
2179
|
+
left: clippingClientRect.left - elementClientRect.left + paddingObject.left,
|
|
2180
|
+
right: elementClientRect.right - clippingClientRect.right + paddingObject.right
|
|
2181
|
+
};
|
|
2182
|
+
var offsetData = state.modifiersData.offset;
|
|
2183
|
+
if (elementContext === popper && offsetData) {
|
|
2184
|
+
var offset2 = offsetData[placement];
|
|
2185
|
+
Object.keys(overflowOffsets).forEach(function(key) {
|
|
2186
|
+
var multiply = [right, bottom].indexOf(key) >= 0 ? 1 : -1;
|
|
2187
|
+
var axis = [top, bottom].indexOf(key) >= 0 ? "y" : "x";
|
|
2188
|
+
overflowOffsets[key] += offset2[axis] * multiply;
|
|
1701
2189
|
});
|
|
1702
2190
|
}
|
|
1703
|
-
return
|
|
2191
|
+
return overflowOffsets;
|
|
1704
2192
|
}
|
|
1705
|
-
function
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
|
|
1709
|
-
|
|
1710
|
-
|
|
2193
|
+
function computeAutoPlacement(state, options) {
|
|
2194
|
+
if (options === void 0) {
|
|
2195
|
+
options = {};
|
|
2196
|
+
}
|
|
2197
|
+
var _options = options, placement = _options.placement, boundary = _options.boundary, rootBoundary = _options.rootBoundary, padding = _options.padding, flipVariations = _options.flipVariations, _options$allowedAutoP = _options.allowedAutoPlacements, allowedAutoPlacements = _options$allowedAutoP === void 0 ? placements : _options$allowedAutoP;
|
|
2198
|
+
var variation = getVariation(placement);
|
|
2199
|
+
var placements$1 = variation ? flipVariations ? variationPlacements : variationPlacements.filter(function(placement2) {
|
|
2200
|
+
return getVariation(placement2) === variation;
|
|
2201
|
+
}) : basePlacements;
|
|
2202
|
+
var allowedPlacements = placements$1.filter(function(placement2) {
|
|
2203
|
+
return allowedAutoPlacements.indexOf(placement2) >= 0;
|
|
1711
2204
|
});
|
|
1712
|
-
|
|
1713
|
-
|
|
1714
|
-
|
|
1715
|
-
|
|
1716
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
2205
|
+
if (allowedPlacements.length === 0) {
|
|
2206
|
+
allowedPlacements = placements$1;
|
|
2207
|
+
}
|
|
2208
|
+
var overflows = allowedPlacements.reduce(function(acc, placement2) {
|
|
2209
|
+
acc[placement2] = detectOverflow(state, {
|
|
2210
|
+
placement: placement2,
|
|
2211
|
+
boundary,
|
|
2212
|
+
rootBoundary,
|
|
2213
|
+
padding
|
|
2214
|
+
})[getBasePlacement(placement2)];
|
|
2215
|
+
return acc;
|
|
1720
2216
|
}, {});
|
|
1721
|
-
return Object.keys(
|
|
1722
|
-
return
|
|
2217
|
+
return Object.keys(overflows).sort(function(a, b) {
|
|
2218
|
+
return overflows[a] - overflows[b];
|
|
1723
2219
|
});
|
|
1724
2220
|
}
|
|
1725
|
-
function
|
|
1726
|
-
if (
|
|
2221
|
+
function getExpandedFallbackPlacements(placement) {
|
|
2222
|
+
if (getBasePlacement(placement) === auto) {
|
|
1727
2223
|
return [];
|
|
1728
|
-
|
|
1729
|
-
|
|
1730
|
-
|
|
1731
|
-
|
|
1732
|
-
|
|
1733
|
-
|
|
1734
|
-
|
|
1735
|
-
|
|
1736
|
-
|
|
1737
|
-
|
|
1738
|
-
|
|
1739
|
-
|
|
1740
|
-
|
|
1741
|
-
|
|
1742
|
-
|
|
1743
|
-
|
|
1744
|
-
|
|
1745
|
-
|
|
1746
|
-
|
|
1747
|
-
|
|
1748
|
-
|
|
1749
|
-
|
|
1750
|
-
|
|
1751
|
-
|
|
1752
|
-
|
|
1753
|
-
|
|
1754
|
-
|
|
1755
|
-
|
|
1756
|
-
|
|
1757
|
-
|
|
1758
|
-
|
|
1759
|
-
|
|
1760
|
-
|
|
1761
|
-
|
|
1762
|
-
|
|
1763
|
-
|
|
1764
|
-
|
|
1765
|
-
|
|
1766
|
-
|
|
1767
|
-
|
|
1768
|
-
|
|
1769
|
-
|
|
1770
|
-
|
|
1771
|
-
|
|
1772
|
-
|
|
1773
|
-
|
|
1774
|
-
|
|
1775
|
-
|
|
2224
|
+
}
|
|
2225
|
+
var oppositePlacement = getOppositePlacement(placement);
|
|
2226
|
+
return [getOppositeVariationPlacement(placement), oppositePlacement, getOppositeVariationPlacement(oppositePlacement)];
|
|
2227
|
+
}
|
|
2228
|
+
function flip(_ref) {
|
|
2229
|
+
var state = _ref.state, options = _ref.options, name = _ref.name;
|
|
2230
|
+
if (state.modifiersData[name]._skip) {
|
|
2231
|
+
return;
|
|
2232
|
+
}
|
|
2233
|
+
var _options$mainAxis = options.mainAxis, checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis, _options$altAxis = options.altAxis, checkAltAxis = _options$altAxis === void 0 ? true : _options$altAxis, specifiedFallbackPlacements = options.fallbackPlacements, padding = options.padding, boundary = options.boundary, rootBoundary = options.rootBoundary, altBoundary = options.altBoundary, _options$flipVariatio = options.flipVariations, flipVariations = _options$flipVariatio === void 0 ? true : _options$flipVariatio, allowedAutoPlacements = options.allowedAutoPlacements;
|
|
2234
|
+
var preferredPlacement = state.options.placement;
|
|
2235
|
+
var basePlacement = getBasePlacement(preferredPlacement);
|
|
2236
|
+
var isBasePlacement = basePlacement === preferredPlacement;
|
|
2237
|
+
var fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipVariations ? [getOppositePlacement(preferredPlacement)] : getExpandedFallbackPlacements(preferredPlacement));
|
|
2238
|
+
var placements2 = [preferredPlacement].concat(fallbackPlacements).reduce(function(acc, placement2) {
|
|
2239
|
+
return acc.concat(getBasePlacement(placement2) === auto ? computeAutoPlacement(state, {
|
|
2240
|
+
placement: placement2,
|
|
2241
|
+
boundary,
|
|
2242
|
+
rootBoundary,
|
|
2243
|
+
padding,
|
|
2244
|
+
flipVariations,
|
|
2245
|
+
allowedAutoPlacements
|
|
2246
|
+
}) : placement2);
|
|
2247
|
+
}, []);
|
|
2248
|
+
var referenceRect = state.rects.reference;
|
|
2249
|
+
var popperRect = state.rects.popper;
|
|
2250
|
+
var checksMap = /* @__PURE__ */ new Map();
|
|
2251
|
+
var makeFallbackChecks = true;
|
|
2252
|
+
var firstFittingPlacement = placements2[0];
|
|
2253
|
+
for (var i = 0; i < placements2.length; i++) {
|
|
2254
|
+
var placement = placements2[i];
|
|
2255
|
+
var _basePlacement = getBasePlacement(placement);
|
|
2256
|
+
var isStartVariation = getVariation(placement) === start;
|
|
2257
|
+
var isVertical = [top, bottom].indexOf(_basePlacement) >= 0;
|
|
2258
|
+
var len = isVertical ? "width" : "height";
|
|
2259
|
+
var overflow = detectOverflow(state, {
|
|
2260
|
+
placement,
|
|
2261
|
+
boundary,
|
|
2262
|
+
rootBoundary,
|
|
2263
|
+
altBoundary,
|
|
2264
|
+
padding
|
|
2265
|
+
});
|
|
2266
|
+
var mainVariationSide = isVertical ? isStartVariation ? right : left : isStartVariation ? bottom : top;
|
|
2267
|
+
if (referenceRect[len] > popperRect[len]) {
|
|
2268
|
+
mainVariationSide = getOppositePlacement(mainVariationSide);
|
|
2269
|
+
}
|
|
2270
|
+
var altVariationSide = getOppositePlacement(mainVariationSide);
|
|
2271
|
+
var checks = [];
|
|
2272
|
+
if (checkMainAxis) {
|
|
2273
|
+
checks.push(overflow[_basePlacement] <= 0);
|
|
2274
|
+
}
|
|
2275
|
+
if (checkAltAxis) {
|
|
2276
|
+
checks.push(overflow[mainVariationSide] <= 0, overflow[altVariationSide] <= 0);
|
|
2277
|
+
}
|
|
2278
|
+
if (checks.every(function(check) {
|
|
2279
|
+
return check;
|
|
2280
|
+
})) {
|
|
2281
|
+
firstFittingPlacement = placement;
|
|
2282
|
+
makeFallbackChecks = false;
|
|
2283
|
+
break;
|
|
2284
|
+
}
|
|
2285
|
+
checksMap.set(placement, checks);
|
|
2286
|
+
}
|
|
2287
|
+
if (makeFallbackChecks) {
|
|
2288
|
+
var numberOfChecks = flipVariations ? 3 : 1;
|
|
2289
|
+
var _loop = function _loop2(_i2) {
|
|
2290
|
+
var fittingPlacement = placements2.find(function(placement2) {
|
|
2291
|
+
var checks2 = checksMap.get(placement2);
|
|
2292
|
+
if (checks2) {
|
|
2293
|
+
return checks2.slice(0, _i2).every(function(check) {
|
|
2294
|
+
return check;
|
|
2295
|
+
});
|
|
2296
|
+
}
|
|
2297
|
+
});
|
|
2298
|
+
if (fittingPlacement) {
|
|
2299
|
+
firstFittingPlacement = fittingPlacement;
|
|
2300
|
+
return "break";
|
|
1776
2301
|
}
|
|
1777
|
-
|
|
2302
|
+
};
|
|
2303
|
+
for (var _i = numberOfChecks; _i > 0; _i--) {
|
|
2304
|
+
var _ret = _loop(_i);
|
|
2305
|
+
if (_ret === "break") break;
|
|
2306
|
+
}
|
|
2307
|
+
}
|
|
2308
|
+
if (state.placement !== firstFittingPlacement) {
|
|
2309
|
+
state.modifiersData[name]._skip = true;
|
|
2310
|
+
state.placement = firstFittingPlacement;
|
|
2311
|
+
state.reset = true;
|
|
1778
2312
|
}
|
|
1779
2313
|
}
|
|
1780
|
-
const
|
|
2314
|
+
const flip$1 = {
|
|
1781
2315
|
name: "flip",
|
|
1782
2316
|
enabled: true,
|
|
1783
2317
|
phase: "main",
|
|
1784
|
-
fn:
|
|
2318
|
+
fn: flip,
|
|
1785
2319
|
requiresIfExists: ["offset"],
|
|
1786
2320
|
data: {
|
|
1787
2321
|
_skip: false
|
|
1788
2322
|
}
|
|
1789
2323
|
};
|
|
1790
|
-
function
|
|
1791
|
-
|
|
1792
|
-
|
|
1793
|
-
|
|
1794
|
-
|
|
1795
|
-
|
|
1796
|
-
|
|
1797
|
-
|
|
1798
|
-
|
|
2324
|
+
function getSideOffsets(overflow, rect, preventedOffsets) {
|
|
2325
|
+
if (preventedOffsets === void 0) {
|
|
2326
|
+
preventedOffsets = {
|
|
2327
|
+
x: 0,
|
|
2328
|
+
y: 0
|
|
2329
|
+
};
|
|
2330
|
+
}
|
|
2331
|
+
return {
|
|
2332
|
+
top: overflow.top - rect.height - preventedOffsets.y,
|
|
2333
|
+
right: overflow.right - rect.width + preventedOffsets.x,
|
|
2334
|
+
bottom: overflow.bottom - rect.height + preventedOffsets.y,
|
|
2335
|
+
left: overflow.left - rect.width - preventedOffsets.x
|
|
1799
2336
|
};
|
|
1800
2337
|
}
|
|
1801
|
-
function
|
|
1802
|
-
return [
|
|
1803
|
-
return
|
|
2338
|
+
function isAnySideFullyClipped(overflow) {
|
|
2339
|
+
return [top, right, bottom, left].some(function(side) {
|
|
2340
|
+
return overflow[side] >= 0;
|
|
1804
2341
|
});
|
|
1805
2342
|
}
|
|
1806
|
-
function
|
|
1807
|
-
var
|
|
2343
|
+
function hide(_ref) {
|
|
2344
|
+
var state = _ref.state, name = _ref.name;
|
|
2345
|
+
var referenceRect = state.rects.reference;
|
|
2346
|
+
var popperRect = state.rects.popper;
|
|
2347
|
+
var preventedOffsets = state.modifiersData.preventOverflow;
|
|
2348
|
+
var referenceOverflow = detectOverflow(state, {
|
|
1808
2349
|
elementContext: "reference"
|
|
1809
|
-
})
|
|
2350
|
+
});
|
|
2351
|
+
var popperAltOverflow = detectOverflow(state, {
|
|
1810
2352
|
altBoundary: true
|
|
1811
|
-
})
|
|
1812
|
-
|
|
1813
|
-
|
|
1814
|
-
|
|
1815
|
-
|
|
1816
|
-
|
|
1817
|
-
|
|
1818
|
-
|
|
1819
|
-
|
|
2353
|
+
});
|
|
2354
|
+
var referenceClippingOffsets = getSideOffsets(referenceOverflow, referenceRect);
|
|
2355
|
+
var popperEscapeOffsets = getSideOffsets(popperAltOverflow, popperRect, preventedOffsets);
|
|
2356
|
+
var isReferenceHidden = isAnySideFullyClipped(referenceClippingOffsets);
|
|
2357
|
+
var hasPopperEscaped = isAnySideFullyClipped(popperEscapeOffsets);
|
|
2358
|
+
state.modifiersData[name] = {
|
|
2359
|
+
referenceClippingOffsets,
|
|
2360
|
+
popperEscapeOffsets,
|
|
2361
|
+
isReferenceHidden,
|
|
2362
|
+
hasPopperEscaped
|
|
2363
|
+
};
|
|
2364
|
+
state.attributes.popper = Object.assign({}, state.attributes.popper, {
|
|
2365
|
+
"data-popper-reference-hidden": isReferenceHidden,
|
|
2366
|
+
"data-popper-escaped": hasPopperEscaped
|
|
1820
2367
|
});
|
|
1821
2368
|
}
|
|
1822
|
-
const
|
|
2369
|
+
const hide$1 = {
|
|
1823
2370
|
name: "hide",
|
|
1824
2371
|
enabled: true,
|
|
1825
2372
|
phase: "main",
|
|
1826
2373
|
requiresIfExists: ["preventOverflow"],
|
|
1827
|
-
fn:
|
|
2374
|
+
fn: hide
|
|
1828
2375
|
};
|
|
1829
|
-
function
|
|
1830
|
-
var
|
|
1831
|
-
|
|
1832
|
-
|
|
1833
|
-
|
|
1834
|
-
|
|
1835
|
-
|
|
2376
|
+
function distanceAndSkiddingToXY(placement, rects, offset2) {
|
|
2377
|
+
var basePlacement = getBasePlacement(placement);
|
|
2378
|
+
var invertDistance = [left, top].indexOf(basePlacement) >= 0 ? -1 : 1;
|
|
2379
|
+
var _ref = typeof offset2 === "function" ? offset2(Object.assign({}, rects, {
|
|
2380
|
+
placement
|
|
2381
|
+
})) : offset2, skidding = _ref[0], distance = _ref[1];
|
|
2382
|
+
skidding = skidding || 0;
|
|
2383
|
+
distance = (distance || 0) * invertDistance;
|
|
2384
|
+
return [left, right].indexOf(basePlacement) >= 0 ? {
|
|
2385
|
+
x: distance,
|
|
2386
|
+
y: skidding
|
|
1836
2387
|
} : {
|
|
1837
|
-
x:
|
|
1838
|
-
y:
|
|
2388
|
+
x: skidding,
|
|
2389
|
+
y: distance
|
|
1839
2390
|
};
|
|
1840
2391
|
}
|
|
1841
|
-
function
|
|
1842
|
-
var
|
|
1843
|
-
|
|
1844
|
-
|
|
1845
|
-
|
|
2392
|
+
function offset(_ref2) {
|
|
2393
|
+
var state = _ref2.state, options = _ref2.options, name = _ref2.name;
|
|
2394
|
+
var _options$offset = options.offset, offset2 = _options$offset === void 0 ? [0, 0] : _options$offset;
|
|
2395
|
+
var data = placements.reduce(function(acc, placement) {
|
|
2396
|
+
acc[placement] = distanceAndSkiddingToXY(placement, state.rects, offset2);
|
|
2397
|
+
return acc;
|
|
2398
|
+
}, {});
|
|
2399
|
+
var _data$state$placement = data[state.placement], x = _data$state$placement.x, y = _data$state$placement.y;
|
|
2400
|
+
if (state.modifiersData.popperOffsets != null) {
|
|
2401
|
+
state.modifiersData.popperOffsets.x += x;
|
|
2402
|
+
state.modifiersData.popperOffsets.y += y;
|
|
2403
|
+
}
|
|
2404
|
+
state.modifiersData[name] = data;
|
|
1846
2405
|
}
|
|
1847
|
-
const
|
|
2406
|
+
const offset$1 = {
|
|
1848
2407
|
name: "offset",
|
|
1849
2408
|
enabled: true,
|
|
1850
2409
|
phase: "main",
|
|
1851
2410
|
requires: ["popperOffsets"],
|
|
1852
|
-
fn:
|
|
2411
|
+
fn: offset
|
|
1853
2412
|
};
|
|
1854
|
-
function
|
|
1855
|
-
var
|
|
1856
|
-
|
|
1857
|
-
reference:
|
|
1858
|
-
element:
|
|
2413
|
+
function popperOffsets(_ref) {
|
|
2414
|
+
var state = _ref.state, name = _ref.name;
|
|
2415
|
+
state.modifiersData[name] = computeOffsets({
|
|
2416
|
+
reference: state.rects.reference,
|
|
2417
|
+
element: state.rects.popper,
|
|
1859
2418
|
strategy: "absolute",
|
|
1860
|
-
placement:
|
|
2419
|
+
placement: state.placement
|
|
1861
2420
|
});
|
|
1862
2421
|
}
|
|
1863
|
-
const
|
|
2422
|
+
const popperOffsets$1 = {
|
|
1864
2423
|
name: "popperOffsets",
|
|
1865
2424
|
enabled: true,
|
|
1866
2425
|
phase: "read",
|
|
1867
|
-
fn:
|
|
2426
|
+
fn: popperOffsets,
|
|
1868
2427
|
data: {}
|
|
1869
2428
|
};
|
|
1870
|
-
function
|
|
1871
|
-
return
|
|
1872
|
-
}
|
|
1873
|
-
function
|
|
1874
|
-
var
|
|
1875
|
-
|
|
1876
|
-
|
|
1877
|
-
|
|
1878
|
-
|
|
1879
|
-
|
|
1880
|
-
|
|
1881
|
-
})
|
|
1882
|
-
|
|
1883
|
-
|
|
2429
|
+
function getAltAxis(axis) {
|
|
2430
|
+
return axis === "x" ? "y" : "x";
|
|
2431
|
+
}
|
|
2432
|
+
function preventOverflow(_ref) {
|
|
2433
|
+
var state = _ref.state, options = _ref.options, name = _ref.name;
|
|
2434
|
+
var _options$mainAxis = options.mainAxis, checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis, _options$altAxis = options.altAxis, checkAltAxis = _options$altAxis === void 0 ? false : _options$altAxis, boundary = options.boundary, rootBoundary = options.rootBoundary, altBoundary = options.altBoundary, padding = options.padding, _options$tether = options.tether, tether = _options$tether === void 0 ? true : _options$tether, _options$tetherOffset = options.tetherOffset, tetherOffset = _options$tetherOffset === void 0 ? 0 : _options$tetherOffset;
|
|
2435
|
+
var overflow = detectOverflow(state, {
|
|
2436
|
+
boundary,
|
|
2437
|
+
rootBoundary,
|
|
2438
|
+
padding,
|
|
2439
|
+
altBoundary
|
|
2440
|
+
});
|
|
2441
|
+
var basePlacement = getBasePlacement(state.placement);
|
|
2442
|
+
var variation = getVariation(state.placement);
|
|
2443
|
+
var isBasePlacement = !variation;
|
|
2444
|
+
var mainAxis = getMainAxisFromPlacement(basePlacement);
|
|
2445
|
+
var altAxis = getAltAxis(mainAxis);
|
|
2446
|
+
var popperOffsets2 = state.modifiersData.popperOffsets;
|
|
2447
|
+
var referenceRect = state.rects.reference;
|
|
2448
|
+
var popperRect = state.rects.popper;
|
|
2449
|
+
var tetherOffsetValue = typeof tetherOffset === "function" ? tetherOffset(Object.assign({}, state.rects, {
|
|
2450
|
+
placement: state.placement
|
|
2451
|
+
})) : tetherOffset;
|
|
2452
|
+
var normalizedTetherOffsetValue = typeof tetherOffsetValue === "number" ? {
|
|
2453
|
+
mainAxis: tetherOffsetValue,
|
|
2454
|
+
altAxis: tetherOffsetValue
|
|
1884
2455
|
} : Object.assign({
|
|
1885
2456
|
mainAxis: 0,
|
|
1886
2457
|
altAxis: 0
|
|
1887
|
-
},
|
|
2458
|
+
}, tetherOffsetValue);
|
|
2459
|
+
var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;
|
|
2460
|
+
var data = {
|
|
1888
2461
|
x: 0,
|
|
1889
2462
|
y: 0
|
|
1890
2463
|
};
|
|
1891
|
-
if (
|
|
1892
|
-
|
|
1893
|
-
var C2, q2 = p2 === "y" ? k : D, X2 = p2 === "y" ? S : M3, R2 = p2 === "y" ? "height" : "width", j2 = m2[p2], ue = j2 + d2[q2], Y2 = j2 - d2[X2], pe = u2 ? -L2[R2] / 2 : 0, be = O2 === Q ? x3[R2] : L2[R2], re = O2 === Q ? -L2[R2] : -x3[R2], de = t.elements.arrow, G2 = u2 && de ? Be(de) : {
|
|
1894
|
-
width: 0,
|
|
1895
|
-
height: 0
|
|
1896
|
-
}, V2 = t.modifiersData["arrow#persistent"] ? t.modifiersData["arrow#persistent"].padding : ht(), ie = V2[q2], ve = V2[X2], z2 = oe(0, x3[R2], G2[R2]), xe = E2 ? x3[R2] / 2 - pe - z2 - ie - A2.mainAxis : be - z2 - ie - A2.mainAxis, Ot = E2 ? -x3[R2] / 2 + pe + z2 + ve + A2.mainAxis : re + z2 + ve + A2.mainAxis, Oe = t.elements.arrow && fe(t.elements.arrow), Et = Oe ? p2 === "y" ? Oe.clientTop || 0 : Oe.clientLeft || 0 : 0, He = (C2 = $3 == null ? void 0 : $3[p2]) != null ? C2 : 0, At = j2 + xe - He - Et, Pt = j2 + Ot - He, Ne = oe(u2 ? ye(ue, At) : ue, j2, u2 ? _(Y2, Pt) : Y2);
|
|
1897
|
-
m2[p2] = Ne, W2[p2] = Ne - j2;
|
|
1898
|
-
}
|
|
1899
|
-
if (s2) {
|
|
1900
|
-
var Ie, Lt = p2 === "x" ? k : D, $t = p2 === "x" ? S : M3, U2 = m2[g2], he = g2 === "y" ? "height" : "width", Ve = U2 + d2[Lt], Fe = U2 - d2[$t], Ee = [k, D].indexOf(w2) !== -1, qe = (Ie = $3 == null ? void 0 : $3[g2]) != null ? Ie : 0, Xe = Ee ? Ve : U2 - x3[he] - L2[he] - qe + A2.altAxis, Ye = Ee ? U2 + x3[he] + L2[he] - qe - A2.altAxis : Fe, ze = u2 && Ee ? Qt(Xe, U2, Ye) : oe(u2 ? Xe : Ve, U2, u2 ? Ye : Fe);
|
|
1901
|
-
m2[g2] = ze, W2[g2] = ze - U2;
|
|
1902
|
-
}
|
|
1903
|
-
t.modifiersData[i2] = W2;
|
|
2464
|
+
if (!popperOffsets2) {
|
|
2465
|
+
return;
|
|
1904
2466
|
}
|
|
1905
|
-
|
|
1906
|
-
|
|
2467
|
+
if (checkMainAxis) {
|
|
2468
|
+
var _offsetModifierState$;
|
|
2469
|
+
var mainSide = mainAxis === "y" ? top : left;
|
|
2470
|
+
var altSide = mainAxis === "y" ? bottom : right;
|
|
2471
|
+
var len = mainAxis === "y" ? "height" : "width";
|
|
2472
|
+
var offset2 = popperOffsets2[mainAxis];
|
|
2473
|
+
var min$1 = offset2 + overflow[mainSide];
|
|
2474
|
+
var max$1 = offset2 - overflow[altSide];
|
|
2475
|
+
var additive = tether ? -popperRect[len] / 2 : 0;
|
|
2476
|
+
var minLen = variation === start ? referenceRect[len] : popperRect[len];
|
|
2477
|
+
var maxLen = variation === start ? -popperRect[len] : -referenceRect[len];
|
|
2478
|
+
var arrowElement = state.elements.arrow;
|
|
2479
|
+
var arrowRect = tether && arrowElement ? getLayoutRect(arrowElement) : {
|
|
2480
|
+
width: 0,
|
|
2481
|
+
height: 0
|
|
2482
|
+
};
|
|
2483
|
+
var arrowPaddingObject = state.modifiersData["arrow#persistent"] ? state.modifiersData["arrow#persistent"].padding : getFreshSideObject();
|
|
2484
|
+
var arrowPaddingMin = arrowPaddingObject[mainSide];
|
|
2485
|
+
var arrowPaddingMax = arrowPaddingObject[altSide];
|
|
2486
|
+
var arrowLen = within(0, referenceRect[len], arrowRect[len]);
|
|
2487
|
+
var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;
|
|
2488
|
+
var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;
|
|
2489
|
+
var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);
|
|
2490
|
+
var clientOffset = arrowOffsetParent ? mainAxis === "y" ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;
|
|
2491
|
+
var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;
|
|
2492
|
+
var tetherMin = offset2 + minOffset - offsetModifierValue - clientOffset;
|
|
2493
|
+
var tetherMax = offset2 + maxOffset - offsetModifierValue;
|
|
2494
|
+
var preventedOffset = within(tether ? min(min$1, tetherMin) : min$1, offset2, tether ? max(max$1, tetherMax) : max$1);
|
|
2495
|
+
popperOffsets2[mainAxis] = preventedOffset;
|
|
2496
|
+
data[mainAxis] = preventedOffset - offset2;
|
|
2497
|
+
}
|
|
2498
|
+
if (checkAltAxis) {
|
|
2499
|
+
var _offsetModifierState$2;
|
|
2500
|
+
var _mainSide = mainAxis === "x" ? top : left;
|
|
2501
|
+
var _altSide = mainAxis === "x" ? bottom : right;
|
|
2502
|
+
var _offset = popperOffsets2[altAxis];
|
|
2503
|
+
var _len = altAxis === "y" ? "height" : "width";
|
|
2504
|
+
var _min = _offset + overflow[_mainSide];
|
|
2505
|
+
var _max = _offset - overflow[_altSide];
|
|
2506
|
+
var isOriginSide = [top, left].indexOf(basePlacement) !== -1;
|
|
2507
|
+
var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;
|
|
2508
|
+
var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;
|
|
2509
|
+
var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;
|
|
2510
|
+
var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);
|
|
2511
|
+
popperOffsets2[altAxis] = _preventedOffset;
|
|
2512
|
+
data[altAxis] = _preventedOffset - _offset;
|
|
2513
|
+
}
|
|
2514
|
+
state.modifiersData[name] = data;
|
|
2515
|
+
}
|
|
2516
|
+
const preventOverflow$1 = {
|
|
1907
2517
|
name: "preventOverflow",
|
|
1908
2518
|
enabled: true,
|
|
1909
2519
|
phase: "main",
|
|
1910
|
-
fn:
|
|
2520
|
+
fn: preventOverflow,
|
|
1911
2521
|
requiresIfExists: ["offset"]
|
|
1912
2522
|
};
|
|
1913
|
-
function
|
|
2523
|
+
function getHTMLElementScroll(element) {
|
|
1914
2524
|
return {
|
|
1915
|
-
scrollLeft:
|
|
1916
|
-
scrollTop:
|
|
2525
|
+
scrollLeft: element.scrollLeft,
|
|
2526
|
+
scrollTop: element.scrollTop
|
|
1917
2527
|
};
|
|
1918
2528
|
}
|
|
1919
|
-
function
|
|
1920
|
-
|
|
2529
|
+
function getNodeScroll(node) {
|
|
2530
|
+
if (node === getWindow(node) || !isHTMLElement(node)) {
|
|
2531
|
+
return getWindowScroll(node);
|
|
2532
|
+
} else {
|
|
2533
|
+
return getHTMLElementScroll(node);
|
|
2534
|
+
}
|
|
1921
2535
|
}
|
|
1922
|
-
function
|
|
1923
|
-
var
|
|
1924
|
-
|
|
2536
|
+
function isElementScaled(element) {
|
|
2537
|
+
var rect = element.getBoundingClientRect();
|
|
2538
|
+
var scaleX = round(rect.width) / element.offsetWidth || 1;
|
|
2539
|
+
var scaleY = round(rect.height) / element.offsetHeight || 1;
|
|
2540
|
+
return scaleX !== 1 || scaleY !== 1;
|
|
1925
2541
|
}
|
|
1926
|
-
function
|
|
1927
|
-
|
|
1928
|
-
|
|
2542
|
+
function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
|
|
2543
|
+
if (isFixed === void 0) {
|
|
2544
|
+
isFixed = false;
|
|
2545
|
+
}
|
|
2546
|
+
var isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
2547
|
+
var offsetParentIsScaled = isHTMLElement(offsetParent) && isElementScaled(offsetParent);
|
|
2548
|
+
var documentElement = getDocumentElement(offsetParent);
|
|
2549
|
+
var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled, isFixed);
|
|
2550
|
+
var scroll = {
|
|
1929
2551
|
scrollLeft: 0,
|
|
1930
2552
|
scrollTop: 0
|
|
1931
|
-
}
|
|
2553
|
+
};
|
|
2554
|
+
var offsets = {
|
|
1932
2555
|
x: 0,
|
|
1933
2556
|
y: 0
|
|
1934
2557
|
};
|
|
1935
|
-
|
|
1936
|
-
|
|
1937
|
-
|
|
1938
|
-
|
|
1939
|
-
|
|
1940
|
-
|
|
2558
|
+
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
2559
|
+
if (getNodeName(offsetParent) !== "body" || // https://github.com/popperjs/popper-core/issues/1078
|
|
2560
|
+
isScrollParent(documentElement)) {
|
|
2561
|
+
scroll = getNodeScroll(offsetParent);
|
|
2562
|
+
}
|
|
2563
|
+
if (isHTMLElement(offsetParent)) {
|
|
2564
|
+
offsets = getBoundingClientRect(offsetParent, true);
|
|
2565
|
+
offsets.x += offsetParent.clientLeft;
|
|
2566
|
+
offsets.y += offsetParent.clientTop;
|
|
2567
|
+
} else if (documentElement) {
|
|
2568
|
+
offsets.x = getWindowScrollBarX(documentElement);
|
|
2569
|
+
}
|
|
2570
|
+
}
|
|
2571
|
+
return {
|
|
2572
|
+
x: rect.left + scroll.scrollLeft - offsets.x,
|
|
2573
|
+
y: rect.top + scroll.scrollTop - offsets.y,
|
|
2574
|
+
width: rect.width,
|
|
2575
|
+
height: rect.height
|
|
1941
2576
|
};
|
|
1942
2577
|
}
|
|
1943
|
-
function
|
|
1944
|
-
var
|
|
1945
|
-
|
|
1946
|
-
|
|
2578
|
+
function order(modifiers) {
|
|
2579
|
+
var map = /* @__PURE__ */ new Map();
|
|
2580
|
+
var visited = /* @__PURE__ */ new Set();
|
|
2581
|
+
var result = [];
|
|
2582
|
+
modifiers.forEach(function(modifier) {
|
|
2583
|
+
map.set(modifier.name, modifier);
|
|
1947
2584
|
});
|
|
1948
|
-
function
|
|
1949
|
-
|
|
1950
|
-
var
|
|
1951
|
-
|
|
1952
|
-
if (!
|
|
1953
|
-
var
|
|
1954
|
-
|
|
2585
|
+
function sort(modifier) {
|
|
2586
|
+
visited.add(modifier.name);
|
|
2587
|
+
var requires = [].concat(modifier.requires || [], modifier.requiresIfExists || []);
|
|
2588
|
+
requires.forEach(function(dep) {
|
|
2589
|
+
if (!visited.has(dep)) {
|
|
2590
|
+
var depModifier = map.get(dep);
|
|
2591
|
+
if (depModifier) {
|
|
2592
|
+
sort(depModifier);
|
|
2593
|
+
}
|
|
1955
2594
|
}
|
|
1956
|
-
})
|
|
2595
|
+
});
|
|
2596
|
+
result.push(modifier);
|
|
1957
2597
|
}
|
|
1958
|
-
|
|
1959
|
-
|
|
1960
|
-
|
|
2598
|
+
modifiers.forEach(function(modifier) {
|
|
2599
|
+
if (!visited.has(modifier.name)) {
|
|
2600
|
+
sort(modifier);
|
|
2601
|
+
}
|
|
2602
|
+
});
|
|
2603
|
+
return result;
|
|
1961
2604
|
}
|
|
1962
|
-
function
|
|
1963
|
-
var
|
|
1964
|
-
return
|
|
1965
|
-
return
|
|
1966
|
-
return
|
|
2605
|
+
function orderModifiers(modifiers) {
|
|
2606
|
+
var orderedModifiers = order(modifiers);
|
|
2607
|
+
return modifierPhases.reduce(function(acc, phase) {
|
|
2608
|
+
return acc.concat(orderedModifiers.filter(function(modifier) {
|
|
2609
|
+
return modifier.phase === phase;
|
|
1967
2610
|
}));
|
|
1968
2611
|
}, []);
|
|
1969
2612
|
}
|
|
1970
|
-
function
|
|
1971
|
-
var
|
|
2613
|
+
function debounce(fn2) {
|
|
2614
|
+
var pending;
|
|
1972
2615
|
return function() {
|
|
1973
|
-
|
|
1974
|
-
Promise
|
|
1975
|
-
|
|
2616
|
+
if (!pending) {
|
|
2617
|
+
pending = new Promise(function(resolve) {
|
|
2618
|
+
Promise.resolve().then(function() {
|
|
2619
|
+
pending = void 0;
|
|
2620
|
+
resolve(fn2());
|
|
2621
|
+
});
|
|
1976
2622
|
});
|
|
1977
|
-
}
|
|
2623
|
+
}
|
|
2624
|
+
return pending;
|
|
1978
2625
|
};
|
|
1979
2626
|
}
|
|
1980
|
-
function
|
|
1981
|
-
var
|
|
1982
|
-
var
|
|
1983
|
-
|
|
1984
|
-
options: Object.assign({},
|
|
1985
|
-
data: Object.assign({},
|
|
1986
|
-
}) :
|
|
2627
|
+
function mergeByName(modifiers) {
|
|
2628
|
+
var merged = modifiers.reduce(function(merged2, current) {
|
|
2629
|
+
var existing = merged2[current.name];
|
|
2630
|
+
merged2[current.name] = existing ? Object.assign({}, existing, current, {
|
|
2631
|
+
options: Object.assign({}, existing.options, current.options),
|
|
2632
|
+
data: Object.assign({}, existing.data, current.data)
|
|
2633
|
+
}) : current;
|
|
2634
|
+
return merged2;
|
|
1987
2635
|
}, {});
|
|
1988
|
-
return Object.keys(
|
|
1989
|
-
return
|
|
2636
|
+
return Object.keys(merged).map(function(key) {
|
|
2637
|
+
return merged[key];
|
|
1990
2638
|
});
|
|
1991
2639
|
}
|
|
1992
|
-
var
|
|
2640
|
+
var DEFAULT_OPTIONS = {
|
|
1993
2641
|
placement: "bottom",
|
|
1994
2642
|
modifiers: [],
|
|
1995
2643
|
strategy: "absolute"
|
|
1996
2644
|
};
|
|
1997
|
-
function
|
|
1998
|
-
for (var
|
|
1999
|
-
|
|
2000
|
-
|
|
2001
|
-
|
|
2645
|
+
function areValidElements() {
|
|
2646
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
2647
|
+
args[_key] = arguments[_key];
|
|
2648
|
+
}
|
|
2649
|
+
return !args.some(function(element) {
|
|
2650
|
+
return !(element && typeof element.getBoundingClientRect === "function");
|
|
2002
2651
|
});
|
|
2003
2652
|
}
|
|
2004
|
-
function
|
|
2005
|
-
|
|
2006
|
-
|
|
2007
|
-
|
|
2008
|
-
|
|
2009
|
-
|
|
2653
|
+
function popperGenerator(generatorOptions) {
|
|
2654
|
+
if (generatorOptions === void 0) {
|
|
2655
|
+
generatorOptions = {};
|
|
2656
|
+
}
|
|
2657
|
+
var _generatorOptions = generatorOptions, _generatorOptions$def = _generatorOptions.defaultModifiers, defaultModifiers2 = _generatorOptions$def === void 0 ? [] : _generatorOptions$def, _generatorOptions$def2 = _generatorOptions.defaultOptions, defaultOptions = _generatorOptions$def2 === void 0 ? DEFAULT_OPTIONS : _generatorOptions$def2;
|
|
2658
|
+
return function createPopper2(reference2, popper2, options) {
|
|
2659
|
+
if (options === void 0) {
|
|
2660
|
+
options = defaultOptions;
|
|
2661
|
+
}
|
|
2662
|
+
var state = {
|
|
2010
2663
|
placement: "bottom",
|
|
2011
2664
|
orderedModifiers: [],
|
|
2012
|
-
options: Object.assign({},
|
|
2665
|
+
options: Object.assign({}, DEFAULT_OPTIONS, defaultOptions),
|
|
2013
2666
|
modifiersData: {},
|
|
2014
2667
|
elements: {
|
|
2015
|
-
reference:
|
|
2016
|
-
popper:
|
|
2668
|
+
reference: reference2,
|
|
2669
|
+
popper: popper2
|
|
2017
2670
|
},
|
|
2018
2671
|
attributes: {},
|
|
2019
2672
|
styles: {}
|
|
2020
|
-
}
|
|
2021
|
-
|
|
2022
|
-
|
|
2023
|
-
|
|
2024
|
-
|
|
2025
|
-
|
|
2026
|
-
|
|
2673
|
+
};
|
|
2674
|
+
var effectCleanupFns = [];
|
|
2675
|
+
var isDestroyed = false;
|
|
2676
|
+
var instance = {
|
|
2677
|
+
state,
|
|
2678
|
+
setOptions: function setOptions(setOptionsAction) {
|
|
2679
|
+
var options2 = typeof setOptionsAction === "function" ? setOptionsAction(state.options) : setOptionsAction;
|
|
2680
|
+
cleanupModifierEffects();
|
|
2681
|
+
state.options = Object.assign({}, defaultOptions, state.options, options2);
|
|
2682
|
+
state.scrollParents = {
|
|
2683
|
+
reference: isElement(reference2) ? listScrollParents(reference2) : reference2.contextElement ? listScrollParents(reference2.contextElement) : [],
|
|
2684
|
+
popper: listScrollParents(popper2)
|
|
2027
2685
|
};
|
|
2028
|
-
var
|
|
2029
|
-
|
|
2030
|
-
return
|
|
2031
|
-
})
|
|
2686
|
+
var orderedModifiers = orderModifiers(mergeByName([].concat(defaultModifiers2, state.options.modifiers)));
|
|
2687
|
+
state.orderedModifiers = orderedModifiers.filter(function(m) {
|
|
2688
|
+
return m.enabled;
|
|
2689
|
+
});
|
|
2690
|
+
runModifierEffects();
|
|
2691
|
+
return instance.update();
|
|
2032
2692
|
},
|
|
2033
2693
|
// Sync update – it will always be executed, even if not necessary. This
|
|
2034
2694
|
// is useful for low frequency updates where sync behavior simplifies the
|
|
2035
2695
|
// logic.
|
|
2036
2696
|
// For high frequency updates (e.g. `resize` and `scroll` events), always
|
|
2037
2697
|
// prefer the async Popper#update method
|
|
2038
|
-
forceUpdate: function() {
|
|
2039
|
-
if (
|
|
2040
|
-
|
|
2041
|
-
|
|
2042
|
-
|
|
2043
|
-
|
|
2044
|
-
|
|
2045
|
-
|
|
2046
|
-
|
|
2047
|
-
|
|
2048
|
-
|
|
2049
|
-
|
|
2050
|
-
|
|
2051
|
-
|
|
2052
|
-
|
|
2053
|
-
|
|
2054
|
-
|
|
2055
|
-
|
|
2056
|
-
|
|
2057
|
-
|
|
2058
|
-
|
|
2059
|
-
|
|
2060
|
-
|
|
2698
|
+
forceUpdate: function forceUpdate() {
|
|
2699
|
+
if (isDestroyed) {
|
|
2700
|
+
return;
|
|
2701
|
+
}
|
|
2702
|
+
var _state$elements = state.elements, reference3 = _state$elements.reference, popper3 = _state$elements.popper;
|
|
2703
|
+
if (!areValidElements(reference3, popper3)) {
|
|
2704
|
+
return;
|
|
2705
|
+
}
|
|
2706
|
+
state.rects = {
|
|
2707
|
+
reference: getCompositeRect(reference3, getOffsetParent(popper3), state.options.strategy === "fixed"),
|
|
2708
|
+
popper: getLayoutRect(popper3)
|
|
2709
|
+
};
|
|
2710
|
+
state.reset = false;
|
|
2711
|
+
state.placement = state.options.placement;
|
|
2712
|
+
state.orderedModifiers.forEach(function(modifier) {
|
|
2713
|
+
return state.modifiersData[modifier.name] = Object.assign({}, modifier.data);
|
|
2714
|
+
});
|
|
2715
|
+
for (var index2 = 0; index2 < state.orderedModifiers.length; index2++) {
|
|
2716
|
+
if (state.reset === true) {
|
|
2717
|
+
state.reset = false;
|
|
2718
|
+
index2 = -1;
|
|
2719
|
+
continue;
|
|
2720
|
+
}
|
|
2721
|
+
var _state$orderedModifie = state.orderedModifiers[index2], fn2 = _state$orderedModifie.fn, _state$orderedModifie2 = _state$orderedModifie.options, _options = _state$orderedModifie2 === void 0 ? {} : _state$orderedModifie2, name = _state$orderedModifie.name;
|
|
2722
|
+
if (typeof fn2 === "function") {
|
|
2723
|
+
state = fn2({
|
|
2724
|
+
state,
|
|
2725
|
+
options: _options,
|
|
2726
|
+
name,
|
|
2727
|
+
instance
|
|
2728
|
+
}) || state;
|
|
2061
2729
|
}
|
|
2062
2730
|
}
|
|
2063
2731
|
},
|
|
2064
2732
|
// Async and optimistically optimized update – it will not be executed if
|
|
2065
2733
|
// not necessary (debounced to run at most once-per-tick)
|
|
2066
|
-
update:
|
|
2067
|
-
return new Promise(function(
|
|
2068
|
-
|
|
2734
|
+
update: debounce(function() {
|
|
2735
|
+
return new Promise(function(resolve) {
|
|
2736
|
+
instance.forceUpdate();
|
|
2737
|
+
resolve(state);
|
|
2069
2738
|
});
|
|
2070
2739
|
}),
|
|
2071
|
-
destroy: function() {
|
|
2072
|
-
|
|
2740
|
+
destroy: function destroy() {
|
|
2741
|
+
cleanupModifierEffects();
|
|
2742
|
+
isDestroyed = true;
|
|
2073
2743
|
}
|
|
2074
2744
|
};
|
|
2075
|
-
if (!
|
|
2076
|
-
return
|
|
2077
|
-
|
|
2078
|
-
|
|
2745
|
+
if (!areValidElements(reference2, popper2)) {
|
|
2746
|
+
return instance;
|
|
2747
|
+
}
|
|
2748
|
+
instance.setOptions(options).then(function(state2) {
|
|
2749
|
+
if (!isDestroyed && options.onFirstUpdate) {
|
|
2750
|
+
options.onFirstUpdate(state2);
|
|
2751
|
+
}
|
|
2079
2752
|
});
|
|
2080
|
-
function
|
|
2081
|
-
|
|
2082
|
-
var
|
|
2083
|
-
if (typeof
|
|
2084
|
-
var
|
|
2085
|
-
state
|
|
2086
|
-
name
|
|
2087
|
-
instance
|
|
2088
|
-
options:
|
|
2089
|
-
})
|
|
2753
|
+
function runModifierEffects() {
|
|
2754
|
+
state.orderedModifiers.forEach(function(_ref) {
|
|
2755
|
+
var name = _ref.name, _ref$options = _ref.options, options2 = _ref$options === void 0 ? {} : _ref$options, effect2 = _ref.effect;
|
|
2756
|
+
if (typeof effect2 === "function") {
|
|
2757
|
+
var cleanupFn = effect2({
|
|
2758
|
+
state,
|
|
2759
|
+
name,
|
|
2760
|
+
instance,
|
|
2761
|
+
options: options2
|
|
2762
|
+
});
|
|
2763
|
+
var noopFn = function noopFn2() {
|
|
2090
2764
|
};
|
|
2091
|
-
|
|
2765
|
+
effectCleanupFns.push(cleanupFn || noopFn);
|
|
2092
2766
|
}
|
|
2093
2767
|
});
|
|
2094
2768
|
}
|
|
2095
|
-
function
|
|
2096
|
-
|
|
2097
|
-
return
|
|
2098
|
-
})
|
|
2769
|
+
function cleanupModifierEffects() {
|
|
2770
|
+
effectCleanupFns.forEach(function(fn2) {
|
|
2771
|
+
return fn2();
|
|
2772
|
+
});
|
|
2773
|
+
effectCleanupFns = [];
|
|
2099
2774
|
}
|
|
2100
|
-
return
|
|
2775
|
+
return instance;
|
|
2101
2776
|
};
|
|
2102
2777
|
}
|
|
2103
|
-
var
|
|
2104
|
-
|
|
2778
|
+
var defaultModifiers = [eventListeners, popperOffsets$1, computeStyles$1, applyStyles$1, offset$1, flip$1, preventOverflow$1, arrow$1, hide$1];
|
|
2779
|
+
var createPopper = /* @__PURE__ */ popperGenerator({
|
|
2780
|
+
defaultModifiers
|
|
2105
2781
|
});
|
|
2106
|
-
async function
|
|
2107
|
-
|
|
2108
|
-
return
|
|
2109
|
-
|
|
2110
|
-
if (
|
|
2111
|
-
const
|
|
2112
|
-
|
|
2113
|
-
|
|
2114
|
-
}
|
|
2782
|
+
async function deregister(obj) {
|
|
2783
|
+
const index2 = this.collection.findIndex((entry) => {
|
|
2784
|
+
return entry.id === obj.id;
|
|
2785
|
+
});
|
|
2786
|
+
if (index2 >= 0) {
|
|
2787
|
+
const entry = this.collection[index2];
|
|
2788
|
+
if (entry.state === "opened") {
|
|
2789
|
+
entry.close();
|
|
2790
|
+
}
|
|
2791
|
+
entry.popper.destroy();
|
|
2792
|
+
deregisterEventListeners(entry);
|
|
2793
|
+
Object.getOwnPropertyNames(entry).forEach((prop) => {
|
|
2794
|
+
delete entry[prop];
|
|
2795
|
+
});
|
|
2796
|
+
this.collection.splice(index2, 1);
|
|
2115
2797
|
}
|
|
2116
2798
|
return this.collection;
|
|
2117
2799
|
}
|
|
2118
|
-
function
|
|
2119
|
-
|
|
2120
|
-
|
|
2121
|
-
|
|
2122
|
-
|
|
2800
|
+
function deregisterEventListeners(entry) {
|
|
2801
|
+
if (entry.__eventListeners) {
|
|
2802
|
+
entry.__eventListeners.forEach((evObj) => {
|
|
2803
|
+
evObj.el.forEach((el) => {
|
|
2804
|
+
evObj.type.forEach((type) => {
|
|
2805
|
+
entry[el].removeEventListener(type, evObj.listener, false);
|
|
2806
|
+
});
|
|
2123
2807
|
});
|
|
2124
2808
|
});
|
|
2125
|
-
|
|
2809
|
+
delete entry.__eventListeners;
|
|
2810
|
+
}
|
|
2811
|
+
return entry;
|
|
2126
2812
|
}
|
|
2127
|
-
async function
|
|
2128
|
-
const
|
|
2129
|
-
|
|
2130
|
-
|
|
2813
|
+
async function open(query) {
|
|
2814
|
+
const popover = getPopover.call(this, query);
|
|
2815
|
+
popover.el.classList.add(this.settings.stateActive);
|
|
2816
|
+
if (popover.trigger.hasAttribute("aria-controls")) {
|
|
2817
|
+
popover.trigger.setAttribute("aria-expanded", "true");
|
|
2818
|
+
}
|
|
2819
|
+
popover.config = getConfig(popover.el, this.settings);
|
|
2820
|
+
popover.popper.setOptions({
|
|
2821
|
+
placement: popover.config["placement"],
|
|
2131
2822
|
modifiers: [
|
|
2132
2823
|
{ name: "eventListeners", enabled: true },
|
|
2133
|
-
...
|
|
2824
|
+
...getModifiers(popover.config)
|
|
2134
2825
|
]
|
|
2135
|
-
})
|
|
2136
|
-
|
|
2137
|
-
|
|
2138
|
-
|
|
2139
|
-
|
|
2826
|
+
});
|
|
2827
|
+
popover.popper.update();
|
|
2828
|
+
popover.state = "opened";
|
|
2829
|
+
return popover;
|
|
2830
|
+
}
|
|
2831
|
+
async function register(el, trigger) {
|
|
2832
|
+
deregister.call(this, el);
|
|
2833
|
+
const root = this;
|
|
2834
|
+
const entry = {
|
|
2835
|
+
id: el.id,
|
|
2836
|
+
state: "closed",
|
|
2837
|
+
el,
|
|
2838
|
+
trigger,
|
|
2839
|
+
toggleDelayId: null,
|
|
2840
|
+
popper: createPopper(trigger, el),
|
|
2841
|
+
config: getConfig(el, this.settings),
|
|
2842
|
+
get isTooltip() {
|
|
2843
|
+
return trigger.hasAttribute("aria-describedby");
|
|
2844
|
+
},
|
|
2140
2845
|
open() {
|
|
2141
|
-
return
|
|
2846
|
+
return open.call(root, this);
|
|
2142
2847
|
},
|
|
2143
2848
|
close() {
|
|
2144
|
-
return
|
|
2849
|
+
return close.call(root, this);
|
|
2145
2850
|
},
|
|
2146
2851
|
deregister() {
|
|
2147
|
-
return
|
|
2852
|
+
return deregister.call(root, this);
|
|
2148
2853
|
}
|
|
2149
|
-
}, n = {
|
|
2150
|
-
id: e.id,
|
|
2151
|
-
state: "closed",
|
|
2152
|
-
el: e,
|
|
2153
|
-
trigger: t,
|
|
2154
|
-
popper: Ir(t, e),
|
|
2155
|
-
config: ot(e, this.settings),
|
|
2156
|
-
...i2
|
|
2157
2854
|
};
|
|
2158
|
-
|
|
2159
|
-
|
|
2160
|
-
|
|
2161
|
-
|
|
2162
|
-
|
|
2163
|
-
|
|
2164
|
-
|
|
2165
|
-
|
|
2166
|
-
|
|
2167
|
-
|
|
2168
|
-
|
|
2169
|
-
}
|
|
2170
|
-
|
|
2171
|
-
|
|
2172
|
-
|
|
2855
|
+
if (entry.trigger.hasAttribute("aria-controls")) {
|
|
2856
|
+
entry.trigger.setAttribute("aria-expanded", "false");
|
|
2857
|
+
}
|
|
2858
|
+
registerEventListeners.call(this, entry);
|
|
2859
|
+
this.collection.push(entry);
|
|
2860
|
+
if (entry.el.classList.contains(this.settings.stateActive)) {
|
|
2861
|
+
await entry.open();
|
|
2862
|
+
handleDocumentClick.call(this, entry);
|
|
2863
|
+
}
|
|
2864
|
+
entry.popper.setOptions({
|
|
2865
|
+
placement: entry.config["placement"]
|
|
2866
|
+
});
|
|
2867
|
+
return entry;
|
|
2868
|
+
}
|
|
2869
|
+
function registerEventListeners(entry) {
|
|
2870
|
+
if (!entry.__eventListeners) {
|
|
2871
|
+
const eventType = entry.config["event"];
|
|
2872
|
+
if (eventType === "hover") {
|
|
2873
|
+
entry.__eventListeners = [{
|
|
2874
|
+
el: ["trigger"],
|
|
2875
|
+
type: ["mouseenter", "focus"],
|
|
2876
|
+
listener: handleMouseEnter.bind(this, entry)
|
|
2877
|
+
}, {
|
|
2878
|
+
el: ["el", "trigger"],
|
|
2879
|
+
type: ["mouseleave", "focusout"],
|
|
2880
|
+
listener: handleMouseLeave.bind(this, entry)
|
|
2881
|
+
}];
|
|
2882
|
+
entry.__eventListeners.forEach((evObj) => {
|
|
2883
|
+
evObj.el.forEach((el) => {
|
|
2884
|
+
evObj.type.forEach((type) => {
|
|
2885
|
+
entry[el].addEventListener(type, evObj.listener, false);
|
|
2886
|
+
});
|
|
2887
|
+
});
|
|
2173
2888
|
});
|
|
2174
|
-
}
|
|
2175
|
-
|
|
2176
|
-
|
|
2177
|
-
|
|
2178
|
-
|
|
2179
|
-
|
|
2180
|
-
|
|
2181
|
-
|
|
2182
|
-
|
|
2889
|
+
} else {
|
|
2890
|
+
entry.__eventListeners = [{
|
|
2891
|
+
el: ["trigger"],
|
|
2892
|
+
type: ["click"],
|
|
2893
|
+
listener: handleClick.bind(this, entry)
|
|
2894
|
+
}];
|
|
2895
|
+
entry.__eventListeners.forEach((evObj) => {
|
|
2896
|
+
evObj.el.forEach((el) => {
|
|
2897
|
+
evObj.type.forEach((type) => {
|
|
2898
|
+
entry[el].addEventListener(type, evObj.listener, false);
|
|
2899
|
+
});
|
|
2900
|
+
});
|
|
2183
2901
|
});
|
|
2184
|
-
}
|
|
2185
|
-
}
|
|
2902
|
+
}
|
|
2903
|
+
}
|
|
2904
|
+
return entry;
|
|
2186
2905
|
}
|
|
2187
|
-
|
|
2188
|
-
|
|
2189
|
-
constructor(r3) {
|
|
2906
|
+
class Popover extends Collection {
|
|
2907
|
+
constructor(options) {
|
|
2190
2908
|
super();
|
|
2191
|
-
|
|
2192
|
-
this.defaults =
|
|
2909
|
+
__privateAdd(this, _handleKeydown3);
|
|
2910
|
+
this.defaults = defaults;
|
|
2911
|
+
this.settings = { ...this.defaults, ...options };
|
|
2912
|
+
this.trigger = null;
|
|
2913
|
+
__privateSet(this, _handleKeydown3, handleKeydown.bind(this));
|
|
2914
|
+
if (this.settings.autoMount) this.mount();
|
|
2193
2915
|
}
|
|
2194
|
-
|
|
2195
|
-
|
|
2196
|
-
const i2 = document.querySelectorAll(this.settings.selectorPopover);
|
|
2197
|
-
return await this.registerCollection(i2), this.settings.eventListeners && this.initEventListeners(false), this;
|
|
2916
|
+
get active() {
|
|
2917
|
+
return this.collection.find((popover) => popover.state == "opened");
|
|
2198
2918
|
}
|
|
2199
|
-
|
|
2200
|
-
return this.
|
|
2919
|
+
get activeTooltip() {
|
|
2920
|
+
return this.collection.find((popover) => popover.state == "opened" && popover.isTooltip);
|
|
2201
2921
|
}
|
|
2202
|
-
|
|
2203
|
-
|
|
2204
|
-
|
|
2205
|
-
|
|
2922
|
+
async mount(options) {
|
|
2923
|
+
if (options) this.settings = { ...this.settings, ...options };
|
|
2924
|
+
const popovers = document.querySelectorAll(this.settings.selectorPopover);
|
|
2925
|
+
await this.registerCollection(popovers);
|
|
2926
|
+
if (this.settings.eventListeners) {
|
|
2927
|
+
this.mountEventListeners(false);
|
|
2928
|
+
}
|
|
2929
|
+
return this;
|
|
2206
2930
|
}
|
|
2207
|
-
|
|
2208
|
-
|
|
2209
|
-
|
|
2210
|
-
|
|
2931
|
+
async unmount() {
|
|
2932
|
+
this.trigger = null;
|
|
2933
|
+
await this.deregisterCollection();
|
|
2934
|
+
if (this.settings.eventListeners) {
|
|
2935
|
+
this.unmountEventListeners(false);
|
|
2936
|
+
}
|
|
2937
|
+
return this;
|
|
2938
|
+
}
|
|
2939
|
+
mountEventListeners(processCollection = true) {
|
|
2940
|
+
if (processCollection) {
|
|
2941
|
+
this.collection.forEach((popover) => {
|
|
2942
|
+
registerEventListeners.call(this, popover);
|
|
2943
|
+
});
|
|
2944
|
+
}
|
|
2945
|
+
document.addEventListener("keydown", __privateGet(this, _handleKeydown3), false);
|
|
2946
|
+
}
|
|
2947
|
+
unmountEventListeners(processCollection = true) {
|
|
2948
|
+
if (processCollection) {
|
|
2949
|
+
this.collection.forEach((popover) => {
|
|
2950
|
+
deregisterEventListeners(popover);
|
|
2951
|
+
});
|
|
2952
|
+
}
|
|
2953
|
+
document.removeEventListener("keydown", __privateGet(this, _handleKeydown3), false);
|
|
2211
2954
|
}
|
|
2212
|
-
register(
|
|
2213
|
-
const
|
|
2214
|
-
|
|
2955
|
+
register(query) {
|
|
2956
|
+
const els = getPopoverElements.call(this, query);
|
|
2957
|
+
if (els.error) return Promise.reject(els.error);
|
|
2958
|
+
return register.call(this, els.popover, els.trigger);
|
|
2215
2959
|
}
|
|
2216
|
-
deregister(
|
|
2217
|
-
|
|
2218
|
-
return
|
|
2960
|
+
deregister(query) {
|
|
2961
|
+
let obj = this.get(query.id || query);
|
|
2962
|
+
return obj ? deregister.call(this, obj) : Promise.reject(new Error(`Failed to deregister; popover does not exist in collection with ID of: "${query.id || query}".`));
|
|
2219
2963
|
}
|
|
2220
|
-
open(
|
|
2221
|
-
return
|
|
2964
|
+
open(id) {
|
|
2965
|
+
return open.call(this, id);
|
|
2222
2966
|
}
|
|
2223
|
-
close(
|
|
2224
|
-
return
|
|
2967
|
+
close(id) {
|
|
2968
|
+
return close.call(this, id);
|
|
2225
2969
|
}
|
|
2226
2970
|
}
|
|
2227
|
-
|
|
2971
|
+
_handleKeydown3 = new WeakMap();
|
|
2228
2972
|
export {
|
|
2229
|
-
|
|
2230
|
-
|
|
2231
|
-
|
|
2232
|
-
qr as Popover,
|
|
2973
|
+
Drawer,
|
|
2974
|
+
Modal,
|
|
2975
|
+
Popover,
|
|
2233
2976
|
index as core
|
|
2234
2977
|
};
|
|
2235
2978
|
//# sourceMappingURL=index.js.map
|