rx-compo 1.0.52 → 1.0.54
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/entry/types/index.d.ts +0 -1
- package/es/components/RxButton/index.js +16 -25
- package/es/components/RxCheckbox/index.js +3712 -0
- package/es/components/RxCheckboxGroup/index.js +6430 -0
- package/es/components/RxDatePicker/index.js +13042 -0
- package/es/components/RxInput/index.js +1560 -0
- package/es/components/RxOption/index.js +8859 -0
- package/es/components/RxRadio/index.js +646 -0
- package/es/components/RxRadioButton/index.js +646 -0
- package/es/components/RxRadioGroup/index.js +1117 -0
- package/es/components/RxScrollbar/index.js +867 -0
- package/es/components/RxSelect/index.js +9022 -0
- package/es/components/RxSelectPlus/index.js +17471 -0
- package/es/components/RxSuperCondition/index.js +8690 -0
- package/es/components/RxTooltip/index.js +2470 -0
- package/es/components/index.js +13 -0
- package/es/index.d.ts +0 -1
- package/es/index.js +0 -1
- package/es/utils/useContext.d.ts +10 -0
- package/es/utils/useContext.js +13 -0
- package/es/utils/useTextOverflow.d.ts +4 -0
- package/es/utils/useTextOverflow.js +13 -0
- package/es/utils/with-install.d.ts +3 -0
- package/es/utils/with-install.js +7 -0
- package/index.esm.js +43171 -1577
- package/index.js +43192 -1585
- package/lib/components/RxButton/index.js +15 -24
- package/lib/components/RxCheckbox/index.js +3717 -0
- package/lib/components/RxCheckboxGroup/index.js +6435 -0
- package/lib/components/RxDatePicker/index.js +13047 -0
- package/lib/components/RxInput/index.js +1565 -0
- package/lib/components/RxOption/index.js +8864 -0
- package/lib/components/RxRadio/index.js +651 -0
- package/lib/components/RxRadioButton/index.js +651 -0
- package/lib/components/RxRadioGroup/index.js +1122 -0
- package/lib/components/RxScrollbar/index.js +872 -0
- package/lib/components/RxSelect/index.js +9027 -0
- package/lib/components/RxSelectPlus/index.js +17476 -0
- package/lib/components/RxSuperCondition/index.js +8695 -0
- package/lib/components/RxTooltip/index.js +2475 -0
- package/lib/components/index.js +91 -0
- package/lib/index.d.ts +0 -1
- package/lib/index.js +0 -1
- package/lib/utils/useContext.d.ts +10 -0
- package/lib/utils/useContext.js +18 -0
- package/lib/utils/useTextOverflow.d.ts +4 -0
- package/lib/utils/useTextOverflow.js +17 -0
- package/lib/utils/with-install.d.ts +3 -0
- package/lib/utils/with-install.js +11 -0
- package/package.json +4 -2
- package/theme-chalk/css/index.css +1 -1
- package/theme-chalk/css/rx-button.css +1 -0
- package/theme-chalk/css/rx-checkbox-group.css +1 -0
- package/theme-chalk/css/rx-checkbox.css +1 -0
- package/theme-chalk/css/rx-date-picker.css +0 -0
- package/theme-chalk/css/rx-input.css +1 -0
- package/theme-chalk/css/rx-option.css +1 -0
- package/theme-chalk/css/rx-radio-button.css +0 -0
- package/theme-chalk/css/rx-radio-group.css +1 -0
- package/theme-chalk/css/rx-radio.css +1 -0
- package/theme-chalk/css/rx-scrollbar.css +0 -0
- package/theme-chalk/css/rx-select.css +1 -0
- package/theme-chalk/css/rx-super-condition.css +0 -0
- package/theme-chalk/css/rx-tooltip.css +0 -0
- package/es/components/RxButton/index.d.ts +0 -3
- package/es/components/RxButton/src/index.d.ts +0 -3
- package/es/components/RxButton/src/index.vue.d.ts +0 -10
- package/es/components/index.d.ts +0 -2
- package/lib/components/RxButton/index.d.ts +0 -3
- package/lib/components/RxButton/src/index.d.ts +0 -3
- package/lib/components/RxButton/src/index.vue.d.ts +0 -10
- package/lib/components/index.d.ts +0 -2
- package/types/components/RxButton/index.d.ts +0 -3
- package/types/components/RxButton/src/index.d.ts +0 -3
- package/types/components/RxButton/src/index.vue.d.ts +0 -10
- package/types/components/index.d.ts +0 -2
- package/types/utils/with-install.d.ts +0 -3
|
@@ -0,0 +1,2470 @@
|
|
|
1
|
+
import { withInstall as withInstall$1 } from 'rx-compo/es/utils/with-install';
|
|
2
|
+
import { warn, inject, ref, computed, unref as unref$1, getCurrentInstance, watch as watch$1, onMounted, shallowRef, onBeforeUnmount, onBeforeMount, provide, defineComponent, renderSlot, openBlock, createElementBlock, normalizeClass, normalizeStyle, withDirectives, cloneVNode, Fragment, Text, Comment, createVNode, createBlock, mergeProps, withCtx, createCommentVNode, nextTick, toRef, Teleport, Transition, vShow, readonly, onDeactivated, toDisplayString, resolveComponent, normalizeProps, guardReactiveProps } from 'vue';
|
|
3
|
+
import { getCurrentScope, onScopeDispose, unref, watch } from 'vue-demi';
|
|
4
|
+
|
|
5
|
+
const RxTooltipProps = {};
|
|
6
|
+
|
|
7
|
+
const composeEventHandlers = (theirsHandler, oursHandler, { checkForDefaultPrevented = true } = {}) => {
|
|
8
|
+
const handleEvent = (event) => {
|
|
9
|
+
const shouldPrevent = theirsHandler == null ? void 0 : theirsHandler(event);
|
|
10
|
+
if (checkForDefaultPrevented === false || !shouldPrevent) {
|
|
11
|
+
return oursHandler == null ? void 0 : oursHandler(event);
|
|
12
|
+
}
|
|
13
|
+
};
|
|
14
|
+
return handleEvent;
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
var _a;
|
|
18
|
+
const isClient = typeof window !== "undefined";
|
|
19
|
+
const isString$1 = (val) => typeof val === "string";
|
|
20
|
+
const noop = () => {
|
|
21
|
+
};
|
|
22
|
+
const isIOS = isClient && ((_a = window == null ? void 0 : window.navigator) == null ? void 0 : _a.userAgent) && /iP(ad|hone|od)/.test(window.navigator.userAgent);
|
|
23
|
+
|
|
24
|
+
function resolveUnref(r) {
|
|
25
|
+
return typeof r === "function" ? r() : unref(r);
|
|
26
|
+
}
|
|
27
|
+
function identity(arg) {
|
|
28
|
+
return arg;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
function tryOnScopeDispose(fn) {
|
|
32
|
+
if (getCurrentScope()) {
|
|
33
|
+
onScopeDispose(fn);
|
|
34
|
+
return true;
|
|
35
|
+
}
|
|
36
|
+
return false;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
function unrefElement(elRef) {
|
|
40
|
+
var _a;
|
|
41
|
+
const plain = resolveUnref(elRef);
|
|
42
|
+
return (_a = plain == null ? void 0 : plain.$el) != null ? _a : plain;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
const defaultWindow = isClient ? window : void 0;
|
|
46
|
+
|
|
47
|
+
function useEventListener(...args) {
|
|
48
|
+
let target;
|
|
49
|
+
let events;
|
|
50
|
+
let listeners;
|
|
51
|
+
let options;
|
|
52
|
+
if (isString$1(args[0]) || Array.isArray(args[0])) {
|
|
53
|
+
[events, listeners, options] = args;
|
|
54
|
+
target = defaultWindow;
|
|
55
|
+
} else {
|
|
56
|
+
[target, events, listeners, options] = args;
|
|
57
|
+
}
|
|
58
|
+
if (!target)
|
|
59
|
+
return noop;
|
|
60
|
+
if (!Array.isArray(events))
|
|
61
|
+
events = [events];
|
|
62
|
+
if (!Array.isArray(listeners))
|
|
63
|
+
listeners = [listeners];
|
|
64
|
+
const cleanups = [];
|
|
65
|
+
const cleanup = () => {
|
|
66
|
+
cleanups.forEach((fn) => fn());
|
|
67
|
+
cleanups.length = 0;
|
|
68
|
+
};
|
|
69
|
+
const register = (el, event, listener, options2) => {
|
|
70
|
+
el.addEventListener(event, listener, options2);
|
|
71
|
+
return () => el.removeEventListener(event, listener, options2);
|
|
72
|
+
};
|
|
73
|
+
const stopWatch = watch(() => [unrefElement(target), resolveUnref(options)], ([el, options2]) => {
|
|
74
|
+
cleanup();
|
|
75
|
+
if (!el)
|
|
76
|
+
return;
|
|
77
|
+
cleanups.push(...events.flatMap((event) => {
|
|
78
|
+
return listeners.map((listener) => register(el, event, listener, options2));
|
|
79
|
+
}));
|
|
80
|
+
}, { immediate: true, flush: "post" });
|
|
81
|
+
const stop = () => {
|
|
82
|
+
stopWatch();
|
|
83
|
+
cleanup();
|
|
84
|
+
};
|
|
85
|
+
tryOnScopeDispose(stop);
|
|
86
|
+
return stop;
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
let _iOSWorkaround = false;
|
|
90
|
+
function onClickOutside(target, handler, options = {}) {
|
|
91
|
+
const { window = defaultWindow, ignore = [], capture = true, detectIframe = false } = options;
|
|
92
|
+
if (!window)
|
|
93
|
+
return;
|
|
94
|
+
if (isIOS && !_iOSWorkaround) {
|
|
95
|
+
_iOSWorkaround = true;
|
|
96
|
+
Array.from(window.document.body.children).forEach((el) => el.addEventListener("click", noop));
|
|
97
|
+
}
|
|
98
|
+
let shouldListen = true;
|
|
99
|
+
const shouldIgnore = (event) => {
|
|
100
|
+
return ignore.some((target2) => {
|
|
101
|
+
if (typeof target2 === "string") {
|
|
102
|
+
return Array.from(window.document.querySelectorAll(target2)).some((el) => el === event.target || event.composedPath().includes(el));
|
|
103
|
+
} else {
|
|
104
|
+
const el = unrefElement(target2);
|
|
105
|
+
return el && (event.target === el || event.composedPath().includes(el));
|
|
106
|
+
}
|
|
107
|
+
});
|
|
108
|
+
};
|
|
109
|
+
const listener = (event) => {
|
|
110
|
+
const el = unrefElement(target);
|
|
111
|
+
if (!el || el === event.target || event.composedPath().includes(el))
|
|
112
|
+
return;
|
|
113
|
+
if (event.detail === 0)
|
|
114
|
+
shouldListen = !shouldIgnore(event);
|
|
115
|
+
if (!shouldListen) {
|
|
116
|
+
shouldListen = true;
|
|
117
|
+
return;
|
|
118
|
+
}
|
|
119
|
+
handler(event);
|
|
120
|
+
};
|
|
121
|
+
const cleanup = [
|
|
122
|
+
useEventListener(window, "click", listener, { passive: true, capture }),
|
|
123
|
+
useEventListener(window, "pointerdown", (e) => {
|
|
124
|
+
const el = unrefElement(target);
|
|
125
|
+
if (el)
|
|
126
|
+
shouldListen = !e.composedPath().includes(el) && !shouldIgnore(e);
|
|
127
|
+
}, { passive: true }),
|
|
128
|
+
detectIframe && useEventListener(window, "blur", (event) => {
|
|
129
|
+
var _a;
|
|
130
|
+
const el = unrefElement(target);
|
|
131
|
+
if (((_a = window.document.activeElement) == null ? void 0 : _a.tagName) === "IFRAME" && !(el == null ? void 0 : el.contains(window.document.activeElement)))
|
|
132
|
+
handler(event);
|
|
133
|
+
})
|
|
134
|
+
].filter(Boolean);
|
|
135
|
+
const stop = () => cleanup.forEach((fn) => fn());
|
|
136
|
+
return stop;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
const _global = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
|
|
140
|
+
const globalKey = "__vueuse_ssr_handlers__";
|
|
141
|
+
_global[globalKey] = _global[globalKey] || {};
|
|
142
|
+
_global[globalKey];
|
|
143
|
+
|
|
144
|
+
var SwipeDirection;
|
|
145
|
+
(function(SwipeDirection2) {
|
|
146
|
+
SwipeDirection2["UP"] = "UP";
|
|
147
|
+
SwipeDirection2["RIGHT"] = "RIGHT";
|
|
148
|
+
SwipeDirection2["DOWN"] = "DOWN";
|
|
149
|
+
SwipeDirection2["LEFT"] = "LEFT";
|
|
150
|
+
SwipeDirection2["NONE"] = "NONE";
|
|
151
|
+
})(SwipeDirection || (SwipeDirection = {}));
|
|
152
|
+
|
|
153
|
+
var __defProp = Object.defineProperty;
|
|
154
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
155
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
156
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
157
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
158
|
+
var __spreadValues = (a, b) => {
|
|
159
|
+
for (var prop in b || (b = {}))
|
|
160
|
+
if (__hasOwnProp.call(b, prop))
|
|
161
|
+
__defNormalProp(a, prop, b[prop]);
|
|
162
|
+
if (__getOwnPropSymbols)
|
|
163
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
164
|
+
if (__propIsEnum.call(b, prop))
|
|
165
|
+
__defNormalProp(a, prop, b[prop]);
|
|
166
|
+
}
|
|
167
|
+
return a;
|
|
168
|
+
};
|
|
169
|
+
const _TransitionPresets = {
|
|
170
|
+
easeInSine: [0.12, 0, 0.39, 0],
|
|
171
|
+
easeOutSine: [0.61, 1, 0.88, 1],
|
|
172
|
+
easeInOutSine: [0.37, 0, 0.63, 1],
|
|
173
|
+
easeInQuad: [0.11, 0, 0.5, 0],
|
|
174
|
+
easeOutQuad: [0.5, 1, 0.89, 1],
|
|
175
|
+
easeInOutQuad: [0.45, 0, 0.55, 1],
|
|
176
|
+
easeInCubic: [0.32, 0, 0.67, 0],
|
|
177
|
+
easeOutCubic: [0.33, 1, 0.68, 1],
|
|
178
|
+
easeInOutCubic: [0.65, 0, 0.35, 1],
|
|
179
|
+
easeInQuart: [0.5, 0, 0.75, 0],
|
|
180
|
+
easeOutQuart: [0.25, 1, 0.5, 1],
|
|
181
|
+
easeInOutQuart: [0.76, 0, 0.24, 1],
|
|
182
|
+
easeInQuint: [0.64, 0, 0.78, 0],
|
|
183
|
+
easeOutQuint: [0.22, 1, 0.36, 1],
|
|
184
|
+
easeInOutQuint: [0.83, 0, 0.17, 1],
|
|
185
|
+
easeInExpo: [0.7, 0, 0.84, 0],
|
|
186
|
+
easeOutExpo: [0.16, 1, 0.3, 1],
|
|
187
|
+
easeInOutExpo: [0.87, 0, 0.13, 1],
|
|
188
|
+
easeInCirc: [0.55, 0, 1, 0.45],
|
|
189
|
+
easeOutCirc: [0, 0.55, 0.45, 1],
|
|
190
|
+
easeInOutCirc: [0.85, 0, 0.15, 1],
|
|
191
|
+
easeInBack: [0.36, 0, 0.66, -0.56],
|
|
192
|
+
easeOutBack: [0.34, 1.56, 0.64, 1],
|
|
193
|
+
easeInOutBack: [0.68, -0.6, 0.32, 1.6]
|
|
194
|
+
};
|
|
195
|
+
__spreadValues({
|
|
196
|
+
linear: identity
|
|
197
|
+
}, _TransitionPresets);
|
|
198
|
+
|
|
199
|
+
!!(process.env.NODE_ENV !== "production") ? Object.freeze({}) : {};
|
|
200
|
+
!!(process.env.NODE_ENV !== "production") ? Object.freeze([]) : [];
|
|
201
|
+
const NOOP = () => {
|
|
202
|
+
};
|
|
203
|
+
const hasOwnProperty = Object.prototype.hasOwnProperty;
|
|
204
|
+
const hasOwn = (val, key) => hasOwnProperty.call(val, key);
|
|
205
|
+
const isArray = Array.isArray;
|
|
206
|
+
const isFunction = (val) => typeof val === "function";
|
|
207
|
+
const isString = (val) => typeof val === "string";
|
|
208
|
+
const isObject = (val) => val !== null && typeof val === "object";
|
|
209
|
+
|
|
210
|
+
/**
|
|
211
|
+
* The inverse of `_.toPairs`; this method returns an object composed
|
|
212
|
+
* from key-value `pairs`.
|
|
213
|
+
*
|
|
214
|
+
* @static
|
|
215
|
+
* @memberOf _
|
|
216
|
+
* @since 4.0.0
|
|
217
|
+
* @category Array
|
|
218
|
+
* @param {Array} pairs The key-value pairs.
|
|
219
|
+
* @returns {Object} Returns the new object.
|
|
220
|
+
* @example
|
|
221
|
+
*
|
|
222
|
+
* _.fromPairs([['a', 1], ['b', 2]]);
|
|
223
|
+
* // => { 'a': 1, 'b': 2 }
|
|
224
|
+
*/
|
|
225
|
+
function fromPairs(pairs) {
|
|
226
|
+
var index = -1,
|
|
227
|
+
length = pairs == null ? 0 : pairs.length,
|
|
228
|
+
result = {};
|
|
229
|
+
|
|
230
|
+
while (++index < length) {
|
|
231
|
+
var pair = pairs[index];
|
|
232
|
+
result[pair[0]] = pair[1];
|
|
233
|
+
}
|
|
234
|
+
return result;
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
/**
|
|
238
|
+
* Checks if `value` is `null` or `undefined`.
|
|
239
|
+
*
|
|
240
|
+
* @static
|
|
241
|
+
* @memberOf _
|
|
242
|
+
* @since 4.0.0
|
|
243
|
+
* @category Lang
|
|
244
|
+
* @param {*} value The value to check.
|
|
245
|
+
* @returns {boolean} Returns `true` if `value` is nullish, else `false`.
|
|
246
|
+
* @example
|
|
247
|
+
*
|
|
248
|
+
* _.isNil(null);
|
|
249
|
+
* // => true
|
|
250
|
+
*
|
|
251
|
+
* _.isNil(void 0);
|
|
252
|
+
* // => true
|
|
253
|
+
*
|
|
254
|
+
* _.isNil(NaN);
|
|
255
|
+
* // => false
|
|
256
|
+
*/
|
|
257
|
+
function isNil(value) {
|
|
258
|
+
return value == null;
|
|
259
|
+
}
|
|
260
|
+
|
|
261
|
+
/**
|
|
262
|
+
* Checks if `value` is `undefined`.
|
|
263
|
+
*
|
|
264
|
+
* @static
|
|
265
|
+
* @since 0.1.0
|
|
266
|
+
* @memberOf _
|
|
267
|
+
* @category Lang
|
|
268
|
+
* @param {*} value The value to check.
|
|
269
|
+
* @returns {boolean} Returns `true` if `value` is `undefined`, else `false`.
|
|
270
|
+
* @example
|
|
271
|
+
*
|
|
272
|
+
* _.isUndefined(void 0);
|
|
273
|
+
* // => true
|
|
274
|
+
*
|
|
275
|
+
* _.isUndefined(null);
|
|
276
|
+
* // => false
|
|
277
|
+
*/
|
|
278
|
+
function isUndefined(value) {
|
|
279
|
+
return value === undefined;
|
|
280
|
+
}
|
|
281
|
+
|
|
282
|
+
const isBoolean = (val) => typeof val === "boolean";
|
|
283
|
+
const isNumber = (val) => typeof val === "number";
|
|
284
|
+
const isElement = (e) => {
|
|
285
|
+
if (typeof Element === "undefined")
|
|
286
|
+
return false;
|
|
287
|
+
return e instanceof Element;
|
|
288
|
+
};
|
|
289
|
+
|
|
290
|
+
class ElementPlusError extends Error {
|
|
291
|
+
constructor(m) {
|
|
292
|
+
super(m);
|
|
293
|
+
this.name = "ElementPlusError";
|
|
294
|
+
}
|
|
295
|
+
}
|
|
296
|
+
function debugWarn(scope, message) {
|
|
297
|
+
if (process.env.NODE_ENV !== "production") {
|
|
298
|
+
const error = isString(scope) ? new ElementPlusError(`[${scope}] ${message}`) : scope;
|
|
299
|
+
console.warn(error);
|
|
300
|
+
}
|
|
301
|
+
}
|
|
302
|
+
|
|
303
|
+
const epPropKey = "__epPropKey";
|
|
304
|
+
const definePropType = (val) => val;
|
|
305
|
+
const isEpProp = (val) => isObject(val) && !!val[epPropKey];
|
|
306
|
+
const buildProp = (prop, key) => {
|
|
307
|
+
if (!isObject(prop) || isEpProp(prop))
|
|
308
|
+
return prop;
|
|
309
|
+
const { values, required, default: defaultValue, type, validator } = prop;
|
|
310
|
+
const _validator = values || validator ? (val) => {
|
|
311
|
+
let valid = false;
|
|
312
|
+
let allowedValues = [];
|
|
313
|
+
if (values) {
|
|
314
|
+
allowedValues = Array.from(values);
|
|
315
|
+
if (hasOwn(prop, "default")) {
|
|
316
|
+
allowedValues.push(defaultValue);
|
|
317
|
+
}
|
|
318
|
+
valid || (valid = allowedValues.includes(val));
|
|
319
|
+
}
|
|
320
|
+
if (validator)
|
|
321
|
+
valid || (valid = validator(val));
|
|
322
|
+
if (!valid && allowedValues.length > 0) {
|
|
323
|
+
const allowValuesText = [...new Set(allowedValues)].map((value) => JSON.stringify(value)).join(", ");
|
|
324
|
+
warn(`Invalid prop: validation failed${key ? ` for prop "${key}"` : ""}. Expected one of [${allowValuesText}], got value ${JSON.stringify(val)}.`);
|
|
325
|
+
}
|
|
326
|
+
return valid;
|
|
327
|
+
} : void 0;
|
|
328
|
+
const epProp = {
|
|
329
|
+
type,
|
|
330
|
+
required: !!required,
|
|
331
|
+
validator: _validator,
|
|
332
|
+
[epPropKey]: true
|
|
333
|
+
};
|
|
334
|
+
if (hasOwn(prop, "default"))
|
|
335
|
+
epProp.default = defaultValue;
|
|
336
|
+
return epProp;
|
|
337
|
+
};
|
|
338
|
+
const buildProps = (props) => fromPairs(Object.entries(props).map(([key, option]) => [
|
|
339
|
+
key,
|
|
340
|
+
buildProp(option, key)
|
|
341
|
+
]));
|
|
342
|
+
|
|
343
|
+
const withInstall = (main, extra) => {
|
|
344
|
+
main.install = (app) => {
|
|
345
|
+
for (const comp of [main, ...Object.values(extra != null ? extra : {})]) {
|
|
346
|
+
app.component(comp.name, comp);
|
|
347
|
+
}
|
|
348
|
+
};
|
|
349
|
+
if (extra) {
|
|
350
|
+
for (const [key, comp] of Object.entries(extra)) {
|
|
351
|
+
main[key] = comp;
|
|
352
|
+
}
|
|
353
|
+
}
|
|
354
|
+
return main;
|
|
355
|
+
};
|
|
356
|
+
|
|
357
|
+
const EVENT_CODE = {
|
|
358
|
+
tab: "Tab",
|
|
359
|
+
enter: "Enter",
|
|
360
|
+
space: "Space",
|
|
361
|
+
left: "ArrowLeft",
|
|
362
|
+
up: "ArrowUp",
|
|
363
|
+
right: "ArrowRight",
|
|
364
|
+
down: "ArrowDown",
|
|
365
|
+
esc: "Escape",
|
|
366
|
+
delete: "Delete",
|
|
367
|
+
backspace: "Backspace",
|
|
368
|
+
numpadEnter: "NumpadEnter",
|
|
369
|
+
pageUp: "PageUp",
|
|
370
|
+
pageDown: "PageDown",
|
|
371
|
+
home: "Home",
|
|
372
|
+
end: "End"
|
|
373
|
+
};
|
|
374
|
+
|
|
375
|
+
const defaultNamespace = "el";
|
|
376
|
+
const statePrefix = "is-";
|
|
377
|
+
const _bem = (namespace, block, blockSuffix, element, modifier) => {
|
|
378
|
+
let cls = `${namespace}-${block}`;
|
|
379
|
+
if (blockSuffix) {
|
|
380
|
+
cls += `-${blockSuffix}`;
|
|
381
|
+
}
|
|
382
|
+
if (element) {
|
|
383
|
+
cls += `__${element}`;
|
|
384
|
+
}
|
|
385
|
+
if (modifier) {
|
|
386
|
+
cls += `--${modifier}`;
|
|
387
|
+
}
|
|
388
|
+
return cls;
|
|
389
|
+
};
|
|
390
|
+
const namespaceContextKey = Symbol("namespaceContextKey");
|
|
391
|
+
const useGetDerivedNamespace = (namespaceOverrides) => {
|
|
392
|
+
const derivedNamespace = namespaceOverrides || inject(namespaceContextKey, ref(defaultNamespace));
|
|
393
|
+
const namespace = computed(() => {
|
|
394
|
+
return unref$1(derivedNamespace) || defaultNamespace;
|
|
395
|
+
});
|
|
396
|
+
return namespace;
|
|
397
|
+
};
|
|
398
|
+
const useNamespace = (block, namespaceOverrides) => {
|
|
399
|
+
const namespace = useGetDerivedNamespace(namespaceOverrides);
|
|
400
|
+
const b = (blockSuffix = "") => _bem(namespace.value, block, blockSuffix, "", "");
|
|
401
|
+
const e = (element) => element ? _bem(namespace.value, block, "", element, "") : "";
|
|
402
|
+
const m = (modifier) => modifier ? _bem(namespace.value, block, "", "", modifier) : "";
|
|
403
|
+
const be = (blockSuffix, element) => blockSuffix && element ? _bem(namespace.value, block, blockSuffix, element, "") : "";
|
|
404
|
+
const em = (element, modifier) => element && modifier ? _bem(namespace.value, block, "", element, modifier) : "";
|
|
405
|
+
const bm = (blockSuffix, modifier) => blockSuffix && modifier ? _bem(namespace.value, block, blockSuffix, "", modifier) : "";
|
|
406
|
+
const bem = (blockSuffix, element, modifier) => blockSuffix && element && modifier ? _bem(namespace.value, block, blockSuffix, element, modifier) : "";
|
|
407
|
+
const is = (name, ...args) => {
|
|
408
|
+
const state = args.length >= 1 ? args[0] : true;
|
|
409
|
+
return name && state ? `${statePrefix}${name}` : "";
|
|
410
|
+
};
|
|
411
|
+
const cssVar = (object) => {
|
|
412
|
+
const styles = {};
|
|
413
|
+
for (const key in object) {
|
|
414
|
+
if (object[key]) {
|
|
415
|
+
styles[`--${namespace.value}-${key}`] = object[key];
|
|
416
|
+
}
|
|
417
|
+
}
|
|
418
|
+
return styles;
|
|
419
|
+
};
|
|
420
|
+
const cssVarBlock = (object) => {
|
|
421
|
+
const styles = {};
|
|
422
|
+
for (const key in object) {
|
|
423
|
+
if (object[key]) {
|
|
424
|
+
styles[`--${namespace.value}-${block}-${key}`] = object[key];
|
|
425
|
+
}
|
|
426
|
+
}
|
|
427
|
+
return styles;
|
|
428
|
+
};
|
|
429
|
+
const cssVarName = (name) => `--${namespace.value}-${name}`;
|
|
430
|
+
const cssVarBlockName = (name) => `--${namespace.value}-${block}-${name}`;
|
|
431
|
+
return {
|
|
432
|
+
namespace,
|
|
433
|
+
b,
|
|
434
|
+
e,
|
|
435
|
+
m,
|
|
436
|
+
be,
|
|
437
|
+
em,
|
|
438
|
+
bm,
|
|
439
|
+
bem,
|
|
440
|
+
is,
|
|
441
|
+
cssVar,
|
|
442
|
+
cssVarName,
|
|
443
|
+
cssVarBlock,
|
|
444
|
+
cssVarBlockName
|
|
445
|
+
};
|
|
446
|
+
};
|
|
447
|
+
|
|
448
|
+
const _prop = buildProp({
|
|
449
|
+
type: definePropType(Boolean),
|
|
450
|
+
default: null
|
|
451
|
+
});
|
|
452
|
+
const _event = buildProp({
|
|
453
|
+
type: definePropType(Function)
|
|
454
|
+
});
|
|
455
|
+
const createModelToggleComposable = (name) => {
|
|
456
|
+
const updateEventKey = `update:${name}`;
|
|
457
|
+
const updateEventKeyRaw = `onUpdate:${name}`;
|
|
458
|
+
const useModelToggleEmits2 = [updateEventKey];
|
|
459
|
+
const useModelToggleProps2 = {
|
|
460
|
+
[name]: _prop,
|
|
461
|
+
[updateEventKeyRaw]: _event
|
|
462
|
+
};
|
|
463
|
+
const useModelToggle2 = ({
|
|
464
|
+
indicator,
|
|
465
|
+
toggleReason,
|
|
466
|
+
shouldHideWhenRouteChanges,
|
|
467
|
+
shouldProceed,
|
|
468
|
+
onShow,
|
|
469
|
+
onHide
|
|
470
|
+
}) => {
|
|
471
|
+
const instance = getCurrentInstance();
|
|
472
|
+
const { emit } = instance;
|
|
473
|
+
const props = instance.props;
|
|
474
|
+
const hasUpdateHandler = computed(() => isFunction(props[updateEventKeyRaw]));
|
|
475
|
+
const isModelBindingAbsent = computed(() => props[name] === null);
|
|
476
|
+
const doShow = (event) => {
|
|
477
|
+
if (indicator.value === true) {
|
|
478
|
+
return;
|
|
479
|
+
}
|
|
480
|
+
indicator.value = true;
|
|
481
|
+
if (toggleReason) {
|
|
482
|
+
toggleReason.value = event;
|
|
483
|
+
}
|
|
484
|
+
if (isFunction(onShow)) {
|
|
485
|
+
onShow(event);
|
|
486
|
+
}
|
|
487
|
+
};
|
|
488
|
+
const doHide = (event) => {
|
|
489
|
+
if (indicator.value === false) {
|
|
490
|
+
return;
|
|
491
|
+
}
|
|
492
|
+
indicator.value = false;
|
|
493
|
+
if (toggleReason) {
|
|
494
|
+
toggleReason.value = event;
|
|
495
|
+
}
|
|
496
|
+
if (isFunction(onHide)) {
|
|
497
|
+
onHide(event);
|
|
498
|
+
}
|
|
499
|
+
};
|
|
500
|
+
const show = (event) => {
|
|
501
|
+
if (props.disabled === true || isFunction(shouldProceed) && !shouldProceed())
|
|
502
|
+
return;
|
|
503
|
+
const shouldEmit = hasUpdateHandler.value && isClient;
|
|
504
|
+
if (shouldEmit) {
|
|
505
|
+
emit(updateEventKey, true);
|
|
506
|
+
}
|
|
507
|
+
if (isModelBindingAbsent.value || !shouldEmit) {
|
|
508
|
+
doShow(event);
|
|
509
|
+
}
|
|
510
|
+
};
|
|
511
|
+
const hide = (event) => {
|
|
512
|
+
if (props.disabled === true || !isClient)
|
|
513
|
+
return;
|
|
514
|
+
const shouldEmit = hasUpdateHandler.value && isClient;
|
|
515
|
+
if (shouldEmit) {
|
|
516
|
+
emit(updateEventKey, false);
|
|
517
|
+
}
|
|
518
|
+
if (isModelBindingAbsent.value || !shouldEmit) {
|
|
519
|
+
doHide(event);
|
|
520
|
+
}
|
|
521
|
+
};
|
|
522
|
+
const onChange = (val) => {
|
|
523
|
+
if (!isBoolean(val))
|
|
524
|
+
return;
|
|
525
|
+
if (props.disabled && val) {
|
|
526
|
+
if (hasUpdateHandler.value) {
|
|
527
|
+
emit(updateEventKey, false);
|
|
528
|
+
}
|
|
529
|
+
} else if (indicator.value !== val) {
|
|
530
|
+
if (val) {
|
|
531
|
+
doShow();
|
|
532
|
+
} else {
|
|
533
|
+
doHide();
|
|
534
|
+
}
|
|
535
|
+
}
|
|
536
|
+
};
|
|
537
|
+
const toggle = () => {
|
|
538
|
+
if (indicator.value) {
|
|
539
|
+
hide();
|
|
540
|
+
} else {
|
|
541
|
+
show();
|
|
542
|
+
}
|
|
543
|
+
};
|
|
544
|
+
watch$1(() => props[name], onChange);
|
|
545
|
+
if (shouldHideWhenRouteChanges && instance.appContext.config.globalProperties.$route !== void 0) {
|
|
546
|
+
watch$1(() => ({
|
|
547
|
+
...instance.proxy.$route
|
|
548
|
+
}), () => {
|
|
549
|
+
if (shouldHideWhenRouteChanges.value && indicator.value) {
|
|
550
|
+
hide();
|
|
551
|
+
}
|
|
552
|
+
});
|
|
553
|
+
}
|
|
554
|
+
onMounted(() => {
|
|
555
|
+
onChange(props[name]);
|
|
556
|
+
});
|
|
557
|
+
return {
|
|
558
|
+
hide,
|
|
559
|
+
show,
|
|
560
|
+
toggle,
|
|
561
|
+
hasUpdateHandler
|
|
562
|
+
};
|
|
563
|
+
};
|
|
564
|
+
return {
|
|
565
|
+
useModelToggle: useModelToggle2,
|
|
566
|
+
useModelToggleProps: useModelToggleProps2,
|
|
567
|
+
useModelToggleEmits: useModelToggleEmits2
|
|
568
|
+
};
|
|
569
|
+
};
|
|
570
|
+
|
|
571
|
+
var E="top",R="bottom",W="right",P="left",me="auto",G=[E,R,W,P],U="start",J="end",Xe="clippingParents",je="viewport",K="popper",Ye="reference",De=G.reduce(function(t,e){return t.concat([e+"-"+U,e+"-"+J])},[]),Ee=[].concat(G,[me]).reduce(function(t,e){return t.concat([e,e+"-"+U,e+"-"+J])},[]),Ge="beforeRead",Je="read",Ke="afterRead",Qe="beforeMain",Ze="main",et="afterMain",tt="beforeWrite",nt="write",rt="afterWrite",ot=[Ge,Je,Ke,Qe,Ze,et,tt,nt,rt];function C(t){return t?(t.nodeName||"").toLowerCase():null}function H(t){if(t==null)return window;if(t.toString()!=="[object Window]"){var e=t.ownerDocument;return e&&e.defaultView||window}return t}function Q(t){var e=H(t).Element;return t instanceof e||t instanceof Element}function B(t){var e=H(t).HTMLElement;return t instanceof e||t instanceof HTMLElement}function Pe(t){if(typeof ShadowRoot=="undefined")return !1;var e=H(t).ShadowRoot;return t instanceof e||t instanceof ShadowRoot}function Mt(t){var e=t.state;Object.keys(e.elements).forEach(function(n){var r=e.styles[n]||{},o=e.attributes[n]||{},i=e.elements[n];!B(i)||!C(i)||(Object.assign(i.style,r),Object.keys(o).forEach(function(a){var s=o[a];s===!1?i.removeAttribute(a):i.setAttribute(a,s===!0?"":s);}));});}function Rt(t){var e=t.state,n={popper:{position:e.options.strategy,left:"0",top:"0",margin:"0"},arrow:{position:"absolute"},reference:{}};return Object.assign(e.elements.popper.style,n.popper),e.styles=n,e.elements.arrow&&Object.assign(e.elements.arrow.style,n.arrow),function(){Object.keys(e.elements).forEach(function(r){var o=e.elements[r],i=e.attributes[r]||{},a=Object.keys(e.styles.hasOwnProperty(r)?e.styles[r]:n[r]),s=a.reduce(function(f,c){return f[c]="",f},{});!B(o)||!C(o)||(Object.assign(o.style,s),Object.keys(i).forEach(function(f){o.removeAttribute(f);}));});}}var Ae={name:"applyStyles",enabled:!0,phase:"write",fn:Mt,effect:Rt,requires:["computeStyles"]};function q(t){return t.split("-")[0]}var X=Math.max,ve=Math.min,Z=Math.round;function ee(t,e){e===void 0&&(e=!1);var n=t.getBoundingClientRect(),r=1,o=1;if(B(t)&&e){var i=t.offsetHeight,a=t.offsetWidth;a>0&&(r=Z(n.width)/a||1),i>0&&(o=Z(n.height)/i||1);}return {width:n.width/r,height:n.height/o,top:n.top/o,right:n.right/r,bottom:n.bottom/o,left:n.left/r,x:n.left/r,y:n.top/o}}function ke(t){var e=ee(t),n=t.offsetWidth,r=t.offsetHeight;return Math.abs(e.width-n)<=1&&(n=e.width),Math.abs(e.height-r)<=1&&(r=e.height),{x:t.offsetLeft,y:t.offsetTop,width:n,height:r}}function it(t,e){var n=e.getRootNode&&e.getRootNode();if(t.contains(e))return !0;if(n&&Pe(n)){var r=e;do{if(r&&t.isSameNode(r))return !0;r=r.parentNode||r.host;}while(r)}return !1}function N(t){return H(t).getComputedStyle(t)}function Wt(t){return ["table","td","th"].indexOf(C(t))>=0}function I(t){return ((Q(t)?t.ownerDocument:t.document)||window.document).documentElement}function ge(t){return C(t)==="html"?t:t.assignedSlot||t.parentNode||(Pe(t)?t.host:null)||I(t)}function at(t){return !B(t)||N(t).position==="fixed"?null:t.offsetParent}function Bt(t){var e=navigator.userAgent.toLowerCase().indexOf("firefox")!==-1,n=navigator.userAgent.indexOf("Trident")!==-1;if(n&&B(t)){var r=N(t);if(r.position==="fixed")return null}var o=ge(t);for(Pe(o)&&(o=o.host);B(o)&&["html","body"].indexOf(C(o))<0;){var i=N(o);if(i.transform!=="none"||i.perspective!=="none"||i.contain==="paint"||["transform","perspective"].indexOf(i.willChange)!==-1||e&&i.willChange==="filter"||e&&i.filter&&i.filter!=="none")return o;o=o.parentNode;}return null}function se(t){for(var e=H(t),n=at(t);n&&Wt(n)&&N(n).position==="static";)n=at(n);return n&&(C(n)==="html"||C(n)==="body"&&N(n).position==="static")?e:n||Bt(t)||e}function Le(t){return ["top","bottom"].indexOf(t)>=0?"x":"y"}function fe(t,e,n){return X(t,ve(e,n))}function St(t,e,n){var r=fe(t,e,n);return r>n?n:r}function st(){return {top:0,right:0,bottom:0,left:0}}function ft(t){return Object.assign({},st(),t)}function ct(t,e){return e.reduce(function(n,r){return n[r]=t,n},{})}var Tt=function(t,e){return t=typeof t=="function"?t(Object.assign({},e.rects,{placement:e.placement})):t,ft(typeof t!="number"?t:ct(t,G))};function Ht(t){var e,n=t.state,r=t.name,o=t.options,i=n.elements.arrow,a=n.modifiersData.popperOffsets,s=q(n.placement),f=Le(s),c=[P,W].indexOf(s)>=0,u=c?"height":"width";if(!(!i||!a)){var m=Tt(o.padding,n),v=ke(i),l=f==="y"?E:P,h=f==="y"?R:W,p=n.rects.reference[u]+n.rects.reference[f]-a[f]-n.rects.popper[u],g=a[f]-n.rects.reference[f],x=se(i),y=x?f==="y"?x.clientHeight||0:x.clientWidth||0:0,$=p/2-g/2,d=m[l],b=y-v[u]-m[h],w=y/2-v[u]/2+$,O=fe(d,w,b),j=f;n.modifiersData[r]=(e={},e[j]=O,e.centerOffset=O-w,e);}}function Ct(t){var e=t.state,n=t.options,r=n.element,o=r===void 0?"[data-popper-arrow]":r;o!=null&&(typeof o=="string"&&(o=e.elements.popper.querySelector(o),!o)||!it(e.elements.popper,o)||(e.elements.arrow=o));}var pt={name:"arrow",enabled:!0,phase:"main",fn:Ht,effect:Ct,requires:["popperOffsets"],requiresIfExists:["preventOverflow"]};function te(t){return t.split("-")[1]}var qt={top:"auto",right:"auto",bottom:"auto",left:"auto"};function Vt(t){var e=t.x,n=t.y,r=window,o=r.devicePixelRatio||1;return {x:Z(e*o)/o||0,y:Z(n*o)/o||0}}function ut(t){var e,n=t.popper,r=t.popperRect,o=t.placement,i=t.variation,a=t.offsets,s=t.position,f=t.gpuAcceleration,c=t.adaptive,u=t.roundOffsets,m=t.isFixed,v=a.x,l=v===void 0?0:v,h=a.y,p=h===void 0?0:h,g=typeof u=="function"?u({x:l,y:p}):{x:l,y:p};l=g.x,p=g.y;var x=a.hasOwnProperty("x"),y=a.hasOwnProperty("y"),$=P,d=E,b=window;if(c){var w=se(n),O="clientHeight",j="clientWidth";if(w===H(n)&&(w=I(n),N(w).position!=="static"&&s==="absolute"&&(O="scrollHeight",j="scrollWidth")),w=w,o===E||(o===P||o===W)&&i===J){d=R;var A=m&&w===b&&b.visualViewport?b.visualViewport.height:w[O];p-=A-r.height,p*=f?1:-1;}if(o===P||(o===E||o===R)&&i===J){$=W;var k=m&&w===b&&b.visualViewport?b.visualViewport.width:w[j];l-=k-r.width,l*=f?1:-1;}}var D=Object.assign({position:s},c&&qt),S=u===!0?Vt({x:l,y:p}):{x:l,y:p};if(l=S.x,p=S.y,f){var L;return Object.assign({},D,(L={},L[d]=y?"0":"",L[$]=x?"0":"",L.transform=(b.devicePixelRatio||1)<=1?"translate("+l+"px, "+p+"px)":"translate3d("+l+"px, "+p+"px, 0)",L))}return Object.assign({},D,(e={},e[d]=y?p+"px":"",e[$]=x?l+"px":"",e.transform="",e))}function Nt(t){var e=t.state,n=t.options,r=n.gpuAcceleration,o=r===void 0?!0:r,i=n.adaptive,a=i===void 0?!0:i,s=n.roundOffsets,f=s===void 0?!0:s,c={placement:q(e.placement),variation:te(e.placement),popper:e.elements.popper,popperRect:e.rects.popper,gpuAcceleration:o,isFixed:e.options.strategy==="fixed"};e.modifiersData.popperOffsets!=null&&(e.styles.popper=Object.assign({},e.styles.popper,ut(Object.assign({},c,{offsets:e.modifiersData.popperOffsets,position:e.options.strategy,adaptive:a,roundOffsets:f})))),e.modifiersData.arrow!=null&&(e.styles.arrow=Object.assign({},e.styles.arrow,ut(Object.assign({},c,{offsets:e.modifiersData.arrow,position:"absolute",adaptive:!1,roundOffsets:f})))),e.attributes.popper=Object.assign({},e.attributes.popper,{"data-popper-placement":e.placement});}var Me={name:"computeStyles",enabled:!0,phase:"beforeWrite",fn:Nt,data:{}},ye={passive:!0};function It(t){var e=t.state,n=t.instance,r=t.options,o=r.scroll,i=o===void 0?!0:o,a=r.resize,s=a===void 0?!0:a,f=H(e.elements.popper),c=[].concat(e.scrollParents.reference,e.scrollParents.popper);return i&&c.forEach(function(u){u.addEventListener("scroll",n.update,ye);}),s&&f.addEventListener("resize",n.update,ye),function(){i&&c.forEach(function(u){u.removeEventListener("scroll",n.update,ye);}),s&&f.removeEventListener("resize",n.update,ye);}}var Re={name:"eventListeners",enabled:!0,phase:"write",fn:function(){},effect:It,data:{}},_t={left:"right",right:"left",bottom:"top",top:"bottom"};function be(t){return t.replace(/left|right|bottom|top/g,function(e){return _t[e]})}var zt={start:"end",end:"start"};function lt(t){return t.replace(/start|end/g,function(e){return zt[e]})}function We(t){var e=H(t),n=e.pageXOffset,r=e.pageYOffset;return {scrollLeft:n,scrollTop:r}}function Be(t){return ee(I(t)).left+We(t).scrollLeft}function Ft(t){var e=H(t),n=I(t),r=e.visualViewport,o=n.clientWidth,i=n.clientHeight,a=0,s=0;return r&&(o=r.width,i=r.height,/^((?!chrome|android).)*safari/i.test(navigator.userAgent)||(a=r.offsetLeft,s=r.offsetTop)),{width:o,height:i,x:a+Be(t),y:s}}function Ut(t){var e,n=I(t),r=We(t),o=(e=t.ownerDocument)==null?void 0:e.body,i=X(n.scrollWidth,n.clientWidth,o?o.scrollWidth:0,o?o.clientWidth:0),a=X(n.scrollHeight,n.clientHeight,o?o.scrollHeight:0,o?o.clientHeight:0),s=-r.scrollLeft+Be(t),f=-r.scrollTop;return N(o||n).direction==="rtl"&&(s+=X(n.clientWidth,o?o.clientWidth:0)-i),{width:i,height:a,x:s,y:f}}function Se(t){var e=N(t),n=e.overflow,r=e.overflowX,o=e.overflowY;return /auto|scroll|overlay|hidden/.test(n+o+r)}function dt(t){return ["html","body","#document"].indexOf(C(t))>=0?t.ownerDocument.body:B(t)&&Se(t)?t:dt(ge(t))}function ce(t,e){var n;e===void 0&&(e=[]);var r=dt(t),o=r===((n=t.ownerDocument)==null?void 0:n.body),i=H(r),a=o?[i].concat(i.visualViewport||[],Se(r)?r:[]):r,s=e.concat(a);return o?s:s.concat(ce(ge(a)))}function Te(t){return Object.assign({},t,{left:t.x,top:t.y,right:t.x+t.width,bottom:t.y+t.height})}function Xt(t){var e=ee(t);return e.top=e.top+t.clientTop,e.left=e.left+t.clientLeft,e.bottom=e.top+t.clientHeight,e.right=e.left+t.clientWidth,e.width=t.clientWidth,e.height=t.clientHeight,e.x=e.left,e.y=e.top,e}function ht(t,e){return e===je?Te(Ft(t)):Q(e)?Xt(e):Te(Ut(I(t)))}function Yt(t){var e=ce(ge(t)),n=["absolute","fixed"].indexOf(N(t).position)>=0,r=n&&B(t)?se(t):t;return Q(r)?e.filter(function(o){return Q(o)&&it(o,r)&&C(o)!=="body"}):[]}function Gt(t,e,n){var r=e==="clippingParents"?Yt(t):[].concat(e),o=[].concat(r,[n]),i=o[0],a=o.reduce(function(s,f){var c=ht(t,f);return s.top=X(c.top,s.top),s.right=ve(c.right,s.right),s.bottom=ve(c.bottom,s.bottom),s.left=X(c.left,s.left),s},ht(t,i));return a.width=a.right-a.left,a.height=a.bottom-a.top,a.x=a.left,a.y=a.top,a}function mt(t){var e=t.reference,n=t.element,r=t.placement,o=r?q(r):null,i=r?te(r):null,a=e.x+e.width/2-n.width/2,s=e.y+e.height/2-n.height/2,f;switch(o){case E:f={x:a,y:e.y-n.height};break;case R:f={x:a,y:e.y+e.height};break;case W:f={x:e.x+e.width,y:s};break;case P:f={x:e.x-n.width,y:s};break;default:f={x:e.x,y:e.y};}var c=o?Le(o):null;if(c!=null){var u=c==="y"?"height":"width";switch(i){case U:f[c]=f[c]-(e[u]/2-n[u]/2);break;case J:f[c]=f[c]+(e[u]/2-n[u]/2);break}}return f}function ne(t,e){e===void 0&&(e={});var n=e,r=n.placement,o=r===void 0?t.placement:r,i=n.boundary,a=i===void 0?Xe:i,s=n.rootBoundary,f=s===void 0?je:s,c=n.elementContext,u=c===void 0?K:c,m=n.altBoundary,v=m===void 0?!1:m,l=n.padding,h=l===void 0?0:l,p=ft(typeof h!="number"?h:ct(h,G)),g=u===K?Ye:K,x=t.rects.popper,y=t.elements[v?g:u],$=Gt(Q(y)?y:y.contextElement||I(t.elements.popper),a,f),d=ee(t.elements.reference),b=mt({reference:d,element:x,strategy:"absolute",placement:o}),w=Te(Object.assign({},x,b)),O=u===K?w:d,j={top:$.top-O.top+p.top,bottom:O.bottom-$.bottom+p.bottom,left:$.left-O.left+p.left,right:O.right-$.right+p.right},A=t.modifiersData.offset;if(u===K&&A){var k=A[o];Object.keys(j).forEach(function(D){var S=[W,R].indexOf(D)>=0?1:-1,L=[E,R].indexOf(D)>=0?"y":"x";j[D]+=k[L]*S;});}return j}function Jt(t,e){e===void 0&&(e={});var n=e,r=n.placement,o=n.boundary,i=n.rootBoundary,a=n.padding,s=n.flipVariations,f=n.allowedAutoPlacements,c=f===void 0?Ee:f,u=te(r),m=u?s?De:De.filter(function(h){return te(h)===u}):G,v=m.filter(function(h){return c.indexOf(h)>=0});v.length===0&&(v=m);var l=v.reduce(function(h,p){return h[p]=ne(t,{placement:p,boundary:o,rootBoundary:i,padding:a})[q(p)],h},{});return Object.keys(l).sort(function(h,p){return l[h]-l[p]})}function Kt(t){if(q(t)===me)return [];var e=be(t);return [lt(t),e,lt(e)]}function Qt(t){var e=t.state,n=t.options,r=t.name;if(!e.modifiersData[r]._skip){for(var o=n.mainAxis,i=o===void 0?!0:o,a=n.altAxis,s=a===void 0?!0:a,f=n.fallbackPlacements,c=n.padding,u=n.boundary,m=n.rootBoundary,v=n.altBoundary,l=n.flipVariations,h=l===void 0?!0:l,p=n.allowedAutoPlacements,g=e.options.placement,x=q(g),y=x===g,$=f||(y||!h?[be(g)]:Kt(g)),d=[g].concat($).reduce(function(z,V){return z.concat(q(V)===me?Jt(e,{placement:V,boundary:u,rootBoundary:m,padding:c,flipVariations:h,allowedAutoPlacements:p}):V)},[]),b=e.rects.reference,w=e.rects.popper,O=new Map,j=!0,A=d[0],k=0;k<d.length;k++){var D=d[k],S=q(D),L=te(D)===U,re=[E,R].indexOf(S)>=0,oe=re?"width":"height",M=ne(e,{placement:D,boundary:u,rootBoundary:m,altBoundary:v,padding:c}),T=re?L?W:P:L?R:E;b[oe]>w[oe]&&(T=be(T));var pe=be(T),_=[];if(i&&_.push(M[S]<=0),s&&_.push(M[T]<=0,M[pe]<=0),_.every(function(z){return z})){A=D,j=!1;break}O.set(D,_);}if(j)for(var ue=h?3:1,xe=function(z){var V=d.find(function(de){var ae=O.get(de);if(ae)return ae.slice(0,z).every(function(Y){return Y})});if(V)return A=V,"break"},ie=ue;ie>0;ie--){var le=xe(ie);if(le==="break")break}e.placement!==A&&(e.modifiersData[r]._skip=!0,e.placement=A,e.reset=!0);}}var vt={name:"flip",enabled:!0,phase:"main",fn:Qt,requiresIfExists:["offset"],data:{_skip:!1}};function gt(t,e,n){return n===void 0&&(n={x:0,y:0}),{top:t.top-e.height-n.y,right:t.right-e.width+n.x,bottom:t.bottom-e.height+n.y,left:t.left-e.width-n.x}}function yt(t){return [E,W,R,P].some(function(e){return t[e]>=0})}function Zt(t){var e=t.state,n=t.name,r=e.rects.reference,o=e.rects.popper,i=e.modifiersData.preventOverflow,a=ne(e,{elementContext:"reference"}),s=ne(e,{altBoundary:!0}),f=gt(a,r),c=gt(s,o,i),u=yt(f),m=yt(c);e.modifiersData[n]={referenceClippingOffsets:f,popperEscapeOffsets:c,isReferenceHidden:u,hasPopperEscaped:m},e.attributes.popper=Object.assign({},e.attributes.popper,{"data-popper-reference-hidden":u,"data-popper-escaped":m});}var bt={name:"hide",enabled:!0,phase:"main",requiresIfExists:["preventOverflow"],fn:Zt};function en(t,e,n){var r=q(t),o=[P,E].indexOf(r)>=0?-1:1,i=typeof n=="function"?n(Object.assign({},e,{placement:t})):n,a=i[0],s=i[1];return a=a||0,s=(s||0)*o,[P,W].indexOf(r)>=0?{x:s,y:a}:{x:a,y:s}}function tn(t){var e=t.state,n=t.options,r=t.name,o=n.offset,i=o===void 0?[0,0]:o,a=Ee.reduce(function(u,m){return u[m]=en(m,e.rects,i),u},{}),s=a[e.placement],f=s.x,c=s.y;e.modifiersData.popperOffsets!=null&&(e.modifiersData.popperOffsets.x+=f,e.modifiersData.popperOffsets.y+=c),e.modifiersData[r]=a;}var wt={name:"offset",enabled:!0,phase:"main",requires:["popperOffsets"],fn:tn};function nn(t){var e=t.state,n=t.name;e.modifiersData[n]=mt({reference:e.rects.reference,element:e.rects.popper,strategy:"absolute",placement:e.placement});}var He={name:"popperOffsets",enabled:!0,phase:"read",fn:nn,data:{}};function rn(t){return t==="x"?"y":"x"}function on(t){var e=t.state,n=t.options,r=t.name,o=n.mainAxis,i=o===void 0?!0:o,a=n.altAxis,s=a===void 0?!1:a,f=n.boundary,c=n.rootBoundary,u=n.altBoundary,m=n.padding,v=n.tether,l=v===void 0?!0:v,h=n.tetherOffset,p=h===void 0?0:h,g=ne(e,{boundary:f,rootBoundary:c,padding:m,altBoundary:u}),x=q(e.placement),y=te(e.placement),$=!y,d=Le(x),b=rn(d),w=e.modifiersData.popperOffsets,O=e.rects.reference,j=e.rects.popper,A=typeof p=="function"?p(Object.assign({},e.rects,{placement:e.placement})):p,k=typeof A=="number"?{mainAxis:A,altAxis:A}:Object.assign({mainAxis:0,altAxis:0},A),D=e.modifiersData.offset?e.modifiersData.offset[e.placement]:null,S={x:0,y:0};if(w){if(i){var L,re=d==="y"?E:P,oe=d==="y"?R:W,M=d==="y"?"height":"width",T=w[d],pe=T+g[re],_=T-g[oe],ue=l?-j[M]/2:0,xe=y===U?O[M]:j[M],ie=y===U?-j[M]:-O[M],le=e.elements.arrow,z=l&&le?ke(le):{width:0,height:0},V=e.modifiersData["arrow#persistent"]?e.modifiersData["arrow#persistent"].padding:st(),de=V[re],ae=V[oe],Y=fe(0,O[M],z[M]),jt=$?O[M]/2-ue-Y-de-k.mainAxis:xe-Y-de-k.mainAxis,Dt=$?-O[M]/2+ue+Y+ae+k.mainAxis:ie+Y+ae+k.mainAxis,Oe=e.elements.arrow&&se(e.elements.arrow),Et=Oe?d==="y"?Oe.clientTop||0:Oe.clientLeft||0:0,Ce=(L=D==null?void 0:D[d])!=null?L:0,Pt=T+jt-Ce-Et,At=T+Dt-Ce,qe=fe(l?ve(pe,Pt):pe,T,l?X(_,At):_);w[d]=qe,S[d]=qe-T;}if(s){var Ve,kt=d==="x"?E:P,Lt=d==="x"?R:W,F=w[b],he=b==="y"?"height":"width",Ne=F+g[kt],Ie=F-g[Lt],$e=[E,P].indexOf(x)!==-1,_e=(Ve=D==null?void 0:D[b])!=null?Ve:0,ze=$e?Ne:F-O[he]-j[he]-_e+k.altAxis,Fe=$e?F+O[he]+j[he]-_e-k.altAxis:Ie,Ue=l&&$e?St(ze,F,Fe):fe(l?ze:Ne,F,l?Fe:Ie);w[b]=Ue,S[b]=Ue-F;}e.modifiersData[r]=S;}}var xt={name:"preventOverflow",enabled:!0,phase:"main",fn:on,requiresIfExists:["offset"]};function an(t){return {scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}}function sn(t){return t===H(t)||!B(t)?We(t):an(t)}function fn(t){var e=t.getBoundingClientRect(),n=Z(e.width)/t.offsetWidth||1,r=Z(e.height)/t.offsetHeight||1;return n!==1||r!==1}function cn(t,e,n){n===void 0&&(n=!1);var r=B(e),o=B(e)&&fn(e),i=I(e),a=ee(t,o),s={scrollLeft:0,scrollTop:0},f={x:0,y:0};return (r||!r&&!n)&&((C(e)!=="body"||Se(i))&&(s=sn(e)),B(e)?(f=ee(e,!0),f.x+=e.clientLeft,f.y+=e.clientTop):i&&(f.x=Be(i))),{x:a.left+s.scrollLeft-f.x,y:a.top+s.scrollTop-f.y,width:a.width,height:a.height}}function pn(t){var e=new Map,n=new Set,r=[];t.forEach(function(i){e.set(i.name,i);});function o(i){n.add(i.name);var a=[].concat(i.requires||[],i.requiresIfExists||[]);a.forEach(function(s){if(!n.has(s)){var f=e.get(s);f&&o(f);}}),r.push(i);}return t.forEach(function(i){n.has(i.name)||o(i);}),r}function un(t){var e=pn(t);return ot.reduce(function(n,r){return n.concat(e.filter(function(o){return o.phase===r}))},[])}function ln(t){var e;return function(){return e||(e=new Promise(function(n){Promise.resolve().then(function(){e=void 0,n(t());});})),e}}function dn(t){var e=t.reduce(function(n,r){var o=n[r.name];return n[r.name]=o?Object.assign({},o,r,{options:Object.assign({},o.options,r.options),data:Object.assign({},o.data,r.data)}):r,n},{});return Object.keys(e).map(function(n){return e[n]})}var Ot={placement:"bottom",modifiers:[],strategy:"absolute"};function $t(){for(var t=arguments.length,e=new Array(t),n=0;n<t;n++)e[n]=arguments[n];return !e.some(function(r){return !(r&&typeof r.getBoundingClientRect=="function")})}function we(t){t===void 0&&(t={});var e=t,n=e.defaultModifiers,r=n===void 0?[]:n,o=e.defaultOptions,i=o===void 0?Ot:o;return function(a,s,f){f===void 0&&(f=i);var c={placement:"bottom",orderedModifiers:[],options:Object.assign({},Ot,i),modifiersData:{},elements:{reference:a,popper:s},attributes:{},styles:{}},u=[],m=!1,v={state:c,setOptions:function(p){var g=typeof p=="function"?p(c.options):p;h(),c.options=Object.assign({},i,c.options,g),c.scrollParents={reference:Q(a)?ce(a):a.contextElement?ce(a.contextElement):[],popper:ce(s)};var x=un(dn([].concat(r,c.options.modifiers)));return c.orderedModifiers=x.filter(function(y){return y.enabled}),l(),v.update()},forceUpdate:function(){if(!m){var p=c.elements,g=p.reference,x=p.popper;if($t(g,x)){c.rects={reference:cn(g,se(x),c.options.strategy==="fixed"),popper:ke(x)},c.reset=!1,c.placement=c.options.placement,c.orderedModifiers.forEach(function(j){return c.modifiersData[j.name]=Object.assign({},j.data)});for(var y=0;y<c.orderedModifiers.length;y++){if(c.reset===!0){c.reset=!1,y=-1;continue}var $=c.orderedModifiers[y],d=$.fn,b=$.options,w=b===void 0?{}:b,O=$.name;typeof d=="function"&&(c=d({state:c,options:w,name:O,instance:v})||c);}}}},update:ln(function(){return new Promise(function(p){v.forceUpdate(),p(c);})}),destroy:function(){h(),m=!0;}};if(!$t(a,s))return v;v.setOptions(f).then(function(p){!m&&f.onFirstUpdate&&f.onFirstUpdate(p);});function l(){c.orderedModifiers.forEach(function(p){var g=p.name,x=p.options,y=x===void 0?{}:x,$=p.effect;if(typeof $=="function"){var d=$({state:c,name:g,instance:v,options:y}),b=function(){};u.push(d||b);}});}function h(){u.forEach(function(p){return p()}),u=[];}return v}}we();var mn=[Re,He,Me,Ae];we({defaultModifiers:mn});var gn=[Re,He,Me,Ae,wt,vt,xt,pt,bt],yn=we({defaultModifiers:gn});
|
|
572
|
+
|
|
573
|
+
const usePopper = (referenceElementRef, popperElementRef, opts = {}) => {
|
|
574
|
+
const stateUpdater = {
|
|
575
|
+
name: "updateState",
|
|
576
|
+
enabled: true,
|
|
577
|
+
phase: "write",
|
|
578
|
+
fn: ({ state }) => {
|
|
579
|
+
const derivedState = deriveState(state);
|
|
580
|
+
Object.assign(states.value, derivedState);
|
|
581
|
+
},
|
|
582
|
+
requires: ["computeStyles"]
|
|
583
|
+
};
|
|
584
|
+
const options = computed(() => {
|
|
585
|
+
const { onFirstUpdate, placement, strategy, modifiers } = unref$1(opts);
|
|
586
|
+
return {
|
|
587
|
+
onFirstUpdate,
|
|
588
|
+
placement: placement || "bottom",
|
|
589
|
+
strategy: strategy || "absolute",
|
|
590
|
+
modifiers: [
|
|
591
|
+
...modifiers || [],
|
|
592
|
+
stateUpdater,
|
|
593
|
+
{ name: "applyStyles", enabled: false }
|
|
594
|
+
]
|
|
595
|
+
};
|
|
596
|
+
});
|
|
597
|
+
const instanceRef = shallowRef();
|
|
598
|
+
const states = ref({
|
|
599
|
+
styles: {
|
|
600
|
+
popper: {
|
|
601
|
+
position: unref$1(options).strategy,
|
|
602
|
+
left: "0",
|
|
603
|
+
top: "0"
|
|
604
|
+
},
|
|
605
|
+
arrow: {
|
|
606
|
+
position: "absolute"
|
|
607
|
+
}
|
|
608
|
+
},
|
|
609
|
+
attributes: {}
|
|
610
|
+
});
|
|
611
|
+
const destroy = () => {
|
|
612
|
+
if (!instanceRef.value)
|
|
613
|
+
return;
|
|
614
|
+
instanceRef.value.destroy();
|
|
615
|
+
instanceRef.value = void 0;
|
|
616
|
+
};
|
|
617
|
+
watch$1(options, (newOptions) => {
|
|
618
|
+
const instance = unref$1(instanceRef);
|
|
619
|
+
if (instance) {
|
|
620
|
+
instance.setOptions(newOptions);
|
|
621
|
+
}
|
|
622
|
+
}, {
|
|
623
|
+
deep: true
|
|
624
|
+
});
|
|
625
|
+
watch$1([referenceElementRef, popperElementRef], ([referenceElement, popperElement]) => {
|
|
626
|
+
destroy();
|
|
627
|
+
if (!referenceElement || !popperElement)
|
|
628
|
+
return;
|
|
629
|
+
instanceRef.value = yn(referenceElement, popperElement, unref$1(options));
|
|
630
|
+
});
|
|
631
|
+
onBeforeUnmount(() => {
|
|
632
|
+
destroy();
|
|
633
|
+
});
|
|
634
|
+
return {
|
|
635
|
+
state: computed(() => {
|
|
636
|
+
var _a;
|
|
637
|
+
return { ...((_a = unref$1(instanceRef)) == null ? void 0 : _a.state) || {} };
|
|
638
|
+
}),
|
|
639
|
+
styles: computed(() => unref$1(states).styles),
|
|
640
|
+
attributes: computed(() => unref$1(states).attributes),
|
|
641
|
+
update: () => {
|
|
642
|
+
var _a;
|
|
643
|
+
return (_a = unref$1(instanceRef)) == null ? void 0 : _a.update();
|
|
644
|
+
},
|
|
645
|
+
forceUpdate: () => {
|
|
646
|
+
var _a;
|
|
647
|
+
return (_a = unref$1(instanceRef)) == null ? void 0 : _a.forceUpdate();
|
|
648
|
+
},
|
|
649
|
+
instanceRef: computed(() => unref$1(instanceRef))
|
|
650
|
+
};
|
|
651
|
+
};
|
|
652
|
+
function deriveState(state) {
|
|
653
|
+
const elements = Object.keys(state.elements);
|
|
654
|
+
const styles = fromPairs(elements.map((element) => [element, state.styles[element] || {}]));
|
|
655
|
+
const attributes = fromPairs(elements.map((element) => [element, state.attributes[element]]));
|
|
656
|
+
return {
|
|
657
|
+
styles,
|
|
658
|
+
attributes
|
|
659
|
+
};
|
|
660
|
+
}
|
|
661
|
+
|
|
662
|
+
function useTimeout() {
|
|
663
|
+
let timeoutHandle;
|
|
664
|
+
const registerTimeout = (fn, delay) => {
|
|
665
|
+
cancelTimeout();
|
|
666
|
+
timeoutHandle = window.setTimeout(fn, delay);
|
|
667
|
+
};
|
|
668
|
+
const cancelTimeout = () => window.clearTimeout(timeoutHandle);
|
|
669
|
+
tryOnScopeDispose(() => cancelTimeout());
|
|
670
|
+
return {
|
|
671
|
+
registerTimeout,
|
|
672
|
+
cancelTimeout
|
|
673
|
+
};
|
|
674
|
+
}
|
|
675
|
+
|
|
676
|
+
const defaultIdInjection = {
|
|
677
|
+
prefix: Math.floor(Math.random() * 1e4),
|
|
678
|
+
current: 0
|
|
679
|
+
};
|
|
680
|
+
const ID_INJECTION_KEY = Symbol("elIdInjection");
|
|
681
|
+
const useIdInjection = () => {
|
|
682
|
+
return getCurrentInstance() ? inject(ID_INJECTION_KEY, defaultIdInjection) : defaultIdInjection;
|
|
683
|
+
};
|
|
684
|
+
const useId = (deterministicId) => {
|
|
685
|
+
const idInjection = useIdInjection();
|
|
686
|
+
if (!isClient && idInjection === defaultIdInjection) {
|
|
687
|
+
debugWarn("IdInjection", `Looks like you are using server rendering, you must provide a id provider to ensure the hydration process to be succeed
|
|
688
|
+
usage: app.provide(ID_INJECTION_KEY, {
|
|
689
|
+
prefix: number,
|
|
690
|
+
current: number,
|
|
691
|
+
})`);
|
|
692
|
+
}
|
|
693
|
+
const namespace = useGetDerivedNamespace();
|
|
694
|
+
const idRef = computed(() => unref$1(deterministicId) || `${namespace.value}-id-${idInjection.prefix}-${idInjection.current++}`);
|
|
695
|
+
return idRef;
|
|
696
|
+
};
|
|
697
|
+
|
|
698
|
+
let registeredEscapeHandlers = [];
|
|
699
|
+
const cachedHandler = (e) => {
|
|
700
|
+
const event = e;
|
|
701
|
+
if (event.key === EVENT_CODE.esc) {
|
|
702
|
+
registeredEscapeHandlers.forEach((registeredHandler) => registeredHandler(event));
|
|
703
|
+
}
|
|
704
|
+
};
|
|
705
|
+
const useEscapeKeydown = (handler) => {
|
|
706
|
+
onMounted(() => {
|
|
707
|
+
if (registeredEscapeHandlers.length === 0) {
|
|
708
|
+
document.addEventListener("keydown", cachedHandler);
|
|
709
|
+
}
|
|
710
|
+
if (isClient)
|
|
711
|
+
registeredEscapeHandlers.push(handler);
|
|
712
|
+
});
|
|
713
|
+
onBeforeUnmount(() => {
|
|
714
|
+
registeredEscapeHandlers = registeredEscapeHandlers.filter((registeredHandler) => registeredHandler !== handler);
|
|
715
|
+
if (registeredEscapeHandlers.length === 0) {
|
|
716
|
+
if (isClient)
|
|
717
|
+
document.removeEventListener("keydown", cachedHandler);
|
|
718
|
+
}
|
|
719
|
+
});
|
|
720
|
+
};
|
|
721
|
+
|
|
722
|
+
let cachedContainer;
|
|
723
|
+
const usePopperContainerId = () => {
|
|
724
|
+
const namespace = useGetDerivedNamespace();
|
|
725
|
+
const idInjection = useIdInjection();
|
|
726
|
+
const id = computed(() => {
|
|
727
|
+
return `${namespace.value}-popper-container-${idInjection.prefix}`;
|
|
728
|
+
});
|
|
729
|
+
const selector = computed(() => `#${id.value}`);
|
|
730
|
+
return {
|
|
731
|
+
id,
|
|
732
|
+
selector
|
|
733
|
+
};
|
|
734
|
+
};
|
|
735
|
+
const createContainer = (id) => {
|
|
736
|
+
const container = document.createElement("div");
|
|
737
|
+
container.id = id;
|
|
738
|
+
document.body.appendChild(container);
|
|
739
|
+
return container;
|
|
740
|
+
};
|
|
741
|
+
const usePopperContainer = () => {
|
|
742
|
+
const { id, selector } = usePopperContainerId();
|
|
743
|
+
onBeforeMount(() => {
|
|
744
|
+
if (!isClient)
|
|
745
|
+
return;
|
|
746
|
+
if (process.env.NODE_ENV === "test" || !cachedContainer && !document.body.querySelector(selector.value)) {
|
|
747
|
+
cachedContainer = createContainer(id.value);
|
|
748
|
+
}
|
|
749
|
+
});
|
|
750
|
+
return {
|
|
751
|
+
id,
|
|
752
|
+
selector
|
|
753
|
+
};
|
|
754
|
+
};
|
|
755
|
+
|
|
756
|
+
const useDelayedToggleProps = buildProps({
|
|
757
|
+
showAfter: {
|
|
758
|
+
type: Number,
|
|
759
|
+
default: 0
|
|
760
|
+
},
|
|
761
|
+
hideAfter: {
|
|
762
|
+
type: Number,
|
|
763
|
+
default: 200
|
|
764
|
+
},
|
|
765
|
+
autoClose: {
|
|
766
|
+
type: Number,
|
|
767
|
+
default: 0
|
|
768
|
+
}
|
|
769
|
+
});
|
|
770
|
+
const useDelayedToggle = ({
|
|
771
|
+
showAfter,
|
|
772
|
+
hideAfter,
|
|
773
|
+
autoClose,
|
|
774
|
+
open,
|
|
775
|
+
close
|
|
776
|
+
}) => {
|
|
777
|
+
const { registerTimeout } = useTimeout();
|
|
778
|
+
const {
|
|
779
|
+
registerTimeout: registerTimeoutForAutoClose,
|
|
780
|
+
cancelTimeout: cancelTimeoutForAutoClose
|
|
781
|
+
} = useTimeout();
|
|
782
|
+
const onOpen = (event) => {
|
|
783
|
+
registerTimeout(() => {
|
|
784
|
+
open(event);
|
|
785
|
+
const _autoClose = unref$1(autoClose);
|
|
786
|
+
if (isNumber(_autoClose) && _autoClose > 0) {
|
|
787
|
+
registerTimeoutForAutoClose(() => {
|
|
788
|
+
close(event);
|
|
789
|
+
}, _autoClose);
|
|
790
|
+
}
|
|
791
|
+
}, unref$1(showAfter));
|
|
792
|
+
};
|
|
793
|
+
const onClose = (event) => {
|
|
794
|
+
cancelTimeoutForAutoClose();
|
|
795
|
+
registerTimeout(() => {
|
|
796
|
+
close(event);
|
|
797
|
+
}, unref$1(hideAfter));
|
|
798
|
+
};
|
|
799
|
+
return {
|
|
800
|
+
onOpen,
|
|
801
|
+
onClose
|
|
802
|
+
};
|
|
803
|
+
};
|
|
804
|
+
|
|
805
|
+
const FORWARD_REF_INJECTION_KEY = Symbol("elForwardRef");
|
|
806
|
+
const useForwardRef = (forwardRef) => {
|
|
807
|
+
const setForwardRef = (el) => {
|
|
808
|
+
forwardRef.value = el;
|
|
809
|
+
};
|
|
810
|
+
provide(FORWARD_REF_INJECTION_KEY, {
|
|
811
|
+
setForwardRef
|
|
812
|
+
});
|
|
813
|
+
};
|
|
814
|
+
const useForwardRefDirective = (setForwardRef) => {
|
|
815
|
+
return {
|
|
816
|
+
mounted(el) {
|
|
817
|
+
setForwardRef(el);
|
|
818
|
+
},
|
|
819
|
+
updated(el) {
|
|
820
|
+
setForwardRef(el);
|
|
821
|
+
},
|
|
822
|
+
unmounted() {
|
|
823
|
+
setForwardRef(null);
|
|
824
|
+
}
|
|
825
|
+
};
|
|
826
|
+
};
|
|
827
|
+
|
|
828
|
+
const zIndex = ref(0);
|
|
829
|
+
const defaultInitialZIndex = 2e3;
|
|
830
|
+
const zIndexContextKey = Symbol("zIndexContextKey");
|
|
831
|
+
const useZIndex = (zIndexOverrides) => {
|
|
832
|
+
const zIndexInjection = zIndexOverrides || inject(zIndexContextKey, void 0);
|
|
833
|
+
const initialZIndex = computed(() => {
|
|
834
|
+
const zIndexFromInjection = unref$1(zIndexInjection);
|
|
835
|
+
return isNumber(zIndexFromInjection) ? zIndexFromInjection : defaultInitialZIndex;
|
|
836
|
+
});
|
|
837
|
+
const currentZIndex = computed(() => initialZIndex.value + zIndex.value);
|
|
838
|
+
const nextZIndex = () => {
|
|
839
|
+
zIndex.value++;
|
|
840
|
+
return currentZIndex.value;
|
|
841
|
+
};
|
|
842
|
+
return {
|
|
843
|
+
initialZIndex,
|
|
844
|
+
currentZIndex,
|
|
845
|
+
nextZIndex
|
|
846
|
+
};
|
|
847
|
+
};
|
|
848
|
+
|
|
849
|
+
var _export_sfc = (sfc, props) => {
|
|
850
|
+
const target = sfc.__vccOpts || sfc;
|
|
851
|
+
for (const [key, val] of props) {
|
|
852
|
+
target[key] = val;
|
|
853
|
+
}
|
|
854
|
+
return target;
|
|
855
|
+
};
|
|
856
|
+
|
|
857
|
+
const formItemContextKey = Symbol("formItemContextKey");
|
|
858
|
+
|
|
859
|
+
const POPPER_INJECTION_KEY = Symbol("popper");
|
|
860
|
+
const POPPER_CONTENT_INJECTION_KEY = Symbol("popperContent");
|
|
861
|
+
|
|
862
|
+
const roleTypes = [
|
|
863
|
+
"dialog",
|
|
864
|
+
"grid",
|
|
865
|
+
"group",
|
|
866
|
+
"listbox",
|
|
867
|
+
"menu",
|
|
868
|
+
"navigation",
|
|
869
|
+
"tooltip",
|
|
870
|
+
"tree"
|
|
871
|
+
];
|
|
872
|
+
const popperProps = buildProps({
|
|
873
|
+
role: {
|
|
874
|
+
type: String,
|
|
875
|
+
values: roleTypes,
|
|
876
|
+
default: "tooltip"
|
|
877
|
+
}
|
|
878
|
+
});
|
|
879
|
+
|
|
880
|
+
const __default__$6 = defineComponent({
|
|
881
|
+
name: "ElPopper",
|
|
882
|
+
inheritAttrs: false
|
|
883
|
+
});
|
|
884
|
+
const _sfc_main$7 = /* @__PURE__ */ defineComponent({
|
|
885
|
+
...__default__$6,
|
|
886
|
+
props: popperProps,
|
|
887
|
+
setup(__props, { expose }) {
|
|
888
|
+
const props = __props;
|
|
889
|
+
const triggerRef = ref();
|
|
890
|
+
const popperInstanceRef = ref();
|
|
891
|
+
const contentRef = ref();
|
|
892
|
+
const referenceRef = ref();
|
|
893
|
+
const role = computed(() => props.role);
|
|
894
|
+
const popperProvides = {
|
|
895
|
+
triggerRef,
|
|
896
|
+
popperInstanceRef,
|
|
897
|
+
contentRef,
|
|
898
|
+
referenceRef,
|
|
899
|
+
role
|
|
900
|
+
};
|
|
901
|
+
expose(popperProvides);
|
|
902
|
+
provide(POPPER_INJECTION_KEY, popperProvides);
|
|
903
|
+
return (_ctx, _cache) => {
|
|
904
|
+
return renderSlot(_ctx.$slots, "default");
|
|
905
|
+
};
|
|
906
|
+
}
|
|
907
|
+
});
|
|
908
|
+
var Popper = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/popper/src/popper.vue"]]);
|
|
909
|
+
|
|
910
|
+
const popperArrowProps = buildProps({
|
|
911
|
+
arrowOffset: {
|
|
912
|
+
type: Number,
|
|
913
|
+
default: 5
|
|
914
|
+
}
|
|
915
|
+
});
|
|
916
|
+
|
|
917
|
+
const __default__$5 = defineComponent({
|
|
918
|
+
name: "ElPopperArrow",
|
|
919
|
+
inheritAttrs: false
|
|
920
|
+
});
|
|
921
|
+
const _sfc_main$6 = /* @__PURE__ */ defineComponent({
|
|
922
|
+
...__default__$5,
|
|
923
|
+
props: popperArrowProps,
|
|
924
|
+
setup(__props, { expose }) {
|
|
925
|
+
const props = __props;
|
|
926
|
+
const ns = useNamespace("popper");
|
|
927
|
+
const { arrowOffset, arrowRef, arrowStyle } = inject(POPPER_CONTENT_INJECTION_KEY, void 0);
|
|
928
|
+
watch$1(() => props.arrowOffset, (val) => {
|
|
929
|
+
arrowOffset.value = val;
|
|
930
|
+
});
|
|
931
|
+
onBeforeUnmount(() => {
|
|
932
|
+
arrowRef.value = void 0;
|
|
933
|
+
});
|
|
934
|
+
expose({
|
|
935
|
+
arrowRef
|
|
936
|
+
});
|
|
937
|
+
return (_ctx, _cache) => {
|
|
938
|
+
return openBlock(), createElementBlock("span", {
|
|
939
|
+
ref_key: "arrowRef",
|
|
940
|
+
ref: arrowRef,
|
|
941
|
+
class: normalizeClass(unref$1(ns).e("arrow")),
|
|
942
|
+
style: normalizeStyle(unref$1(arrowStyle)),
|
|
943
|
+
"data-popper-arrow": ""
|
|
944
|
+
}, null, 6);
|
|
945
|
+
};
|
|
946
|
+
}
|
|
947
|
+
});
|
|
948
|
+
var ElPopperArrow = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/popper/src/arrow.vue"]]);
|
|
949
|
+
|
|
950
|
+
const NAME = "ElOnlyChild";
|
|
951
|
+
const OnlyChild = defineComponent({
|
|
952
|
+
name: NAME,
|
|
953
|
+
setup(_, {
|
|
954
|
+
slots,
|
|
955
|
+
attrs
|
|
956
|
+
}) {
|
|
957
|
+
var _a;
|
|
958
|
+
const forwardRefInjection = inject(FORWARD_REF_INJECTION_KEY);
|
|
959
|
+
const forwardRefDirective = useForwardRefDirective((_a = forwardRefInjection == null ? void 0 : forwardRefInjection.setForwardRef) != null ? _a : NOOP);
|
|
960
|
+
return () => {
|
|
961
|
+
var _a2;
|
|
962
|
+
const defaultSlot = (_a2 = slots.default) == null ? void 0 : _a2.call(slots, attrs);
|
|
963
|
+
if (!defaultSlot)
|
|
964
|
+
return null;
|
|
965
|
+
if (defaultSlot.length > 1) {
|
|
966
|
+
debugWarn(NAME, "requires exact only one valid child.");
|
|
967
|
+
return null;
|
|
968
|
+
}
|
|
969
|
+
const firstLegitNode = findFirstLegitChild(defaultSlot);
|
|
970
|
+
if (!firstLegitNode) {
|
|
971
|
+
debugWarn(NAME, "no valid child node found");
|
|
972
|
+
return null;
|
|
973
|
+
}
|
|
974
|
+
return withDirectives(cloneVNode(firstLegitNode, attrs), [[forwardRefDirective]]);
|
|
975
|
+
};
|
|
976
|
+
}
|
|
977
|
+
});
|
|
978
|
+
function findFirstLegitChild(node) {
|
|
979
|
+
if (!node)
|
|
980
|
+
return null;
|
|
981
|
+
const children = node;
|
|
982
|
+
for (const child of children) {
|
|
983
|
+
if (isObject(child)) {
|
|
984
|
+
switch (child.type) {
|
|
985
|
+
case Comment:
|
|
986
|
+
continue;
|
|
987
|
+
case Text:
|
|
988
|
+
case "svg":
|
|
989
|
+
return wrapTextContent(child);
|
|
990
|
+
case Fragment:
|
|
991
|
+
return findFirstLegitChild(child.children);
|
|
992
|
+
default:
|
|
993
|
+
return child;
|
|
994
|
+
}
|
|
995
|
+
}
|
|
996
|
+
return wrapTextContent(child);
|
|
997
|
+
}
|
|
998
|
+
return null;
|
|
999
|
+
}
|
|
1000
|
+
function wrapTextContent(s) {
|
|
1001
|
+
const ns = useNamespace("only-child");
|
|
1002
|
+
return createVNode("span", {
|
|
1003
|
+
"class": ns.e("content")
|
|
1004
|
+
}, [s]);
|
|
1005
|
+
}
|
|
1006
|
+
|
|
1007
|
+
const popperTriggerProps = buildProps({
|
|
1008
|
+
virtualRef: {
|
|
1009
|
+
type: definePropType(Object)
|
|
1010
|
+
},
|
|
1011
|
+
virtualTriggering: Boolean,
|
|
1012
|
+
onMouseenter: {
|
|
1013
|
+
type: definePropType(Function)
|
|
1014
|
+
},
|
|
1015
|
+
onMouseleave: {
|
|
1016
|
+
type: definePropType(Function)
|
|
1017
|
+
},
|
|
1018
|
+
onClick: {
|
|
1019
|
+
type: definePropType(Function)
|
|
1020
|
+
},
|
|
1021
|
+
onKeydown: {
|
|
1022
|
+
type: definePropType(Function)
|
|
1023
|
+
},
|
|
1024
|
+
onFocus: {
|
|
1025
|
+
type: definePropType(Function)
|
|
1026
|
+
},
|
|
1027
|
+
onBlur: {
|
|
1028
|
+
type: definePropType(Function)
|
|
1029
|
+
},
|
|
1030
|
+
onContextmenu: {
|
|
1031
|
+
type: definePropType(Function)
|
|
1032
|
+
},
|
|
1033
|
+
id: String,
|
|
1034
|
+
open: Boolean
|
|
1035
|
+
});
|
|
1036
|
+
|
|
1037
|
+
const __default__$4 = defineComponent({
|
|
1038
|
+
name: "ElPopperTrigger",
|
|
1039
|
+
inheritAttrs: false
|
|
1040
|
+
});
|
|
1041
|
+
const _sfc_main$5 = /* @__PURE__ */ defineComponent({
|
|
1042
|
+
...__default__$4,
|
|
1043
|
+
props: popperTriggerProps,
|
|
1044
|
+
setup(__props, { expose }) {
|
|
1045
|
+
const props = __props;
|
|
1046
|
+
const { role, triggerRef } = inject(POPPER_INJECTION_KEY, void 0);
|
|
1047
|
+
useForwardRef(triggerRef);
|
|
1048
|
+
const ariaControls = computed(() => {
|
|
1049
|
+
return ariaHaspopup.value ? props.id : void 0;
|
|
1050
|
+
});
|
|
1051
|
+
const ariaDescribedby = computed(() => {
|
|
1052
|
+
if (role && role.value === "tooltip") {
|
|
1053
|
+
return props.open && props.id ? props.id : void 0;
|
|
1054
|
+
}
|
|
1055
|
+
return void 0;
|
|
1056
|
+
});
|
|
1057
|
+
const ariaHaspopup = computed(() => {
|
|
1058
|
+
if (role && role.value !== "tooltip") {
|
|
1059
|
+
return role.value;
|
|
1060
|
+
}
|
|
1061
|
+
return void 0;
|
|
1062
|
+
});
|
|
1063
|
+
const ariaExpanded = computed(() => {
|
|
1064
|
+
return ariaHaspopup.value ? `${props.open}` : void 0;
|
|
1065
|
+
});
|
|
1066
|
+
let virtualTriggerAriaStopWatch = void 0;
|
|
1067
|
+
onMounted(() => {
|
|
1068
|
+
watch$1(() => props.virtualRef, (virtualEl) => {
|
|
1069
|
+
if (virtualEl) {
|
|
1070
|
+
triggerRef.value = unrefElement(virtualEl);
|
|
1071
|
+
}
|
|
1072
|
+
}, {
|
|
1073
|
+
immediate: true
|
|
1074
|
+
});
|
|
1075
|
+
watch$1(triggerRef, (el, prevEl) => {
|
|
1076
|
+
virtualTriggerAriaStopWatch == null ? void 0 : virtualTriggerAriaStopWatch();
|
|
1077
|
+
virtualTriggerAriaStopWatch = void 0;
|
|
1078
|
+
if (isElement(el)) {
|
|
1079
|
+
[
|
|
1080
|
+
"onMouseenter",
|
|
1081
|
+
"onMouseleave",
|
|
1082
|
+
"onClick",
|
|
1083
|
+
"onKeydown",
|
|
1084
|
+
"onFocus",
|
|
1085
|
+
"onBlur",
|
|
1086
|
+
"onContextmenu"
|
|
1087
|
+
].forEach((eventName) => {
|
|
1088
|
+
var _a;
|
|
1089
|
+
const handler = props[eventName];
|
|
1090
|
+
if (handler) {
|
|
1091
|
+
el.addEventListener(eventName.slice(2).toLowerCase(), handler);
|
|
1092
|
+
(_a = prevEl == null ? void 0 : prevEl.removeEventListener) == null ? void 0 : _a.call(prevEl, eventName.slice(2).toLowerCase(), handler);
|
|
1093
|
+
}
|
|
1094
|
+
});
|
|
1095
|
+
virtualTriggerAriaStopWatch = watch$1([ariaControls, ariaDescribedby, ariaHaspopup, ariaExpanded], (watches) => {
|
|
1096
|
+
[
|
|
1097
|
+
"aria-controls",
|
|
1098
|
+
"aria-describedby",
|
|
1099
|
+
"aria-haspopup",
|
|
1100
|
+
"aria-expanded"
|
|
1101
|
+
].forEach((key, idx) => {
|
|
1102
|
+
isNil(watches[idx]) ? el.removeAttribute(key) : el.setAttribute(key, watches[idx]);
|
|
1103
|
+
});
|
|
1104
|
+
}, { immediate: true });
|
|
1105
|
+
}
|
|
1106
|
+
if (isElement(prevEl)) {
|
|
1107
|
+
[
|
|
1108
|
+
"aria-controls",
|
|
1109
|
+
"aria-describedby",
|
|
1110
|
+
"aria-haspopup",
|
|
1111
|
+
"aria-expanded"
|
|
1112
|
+
].forEach((key) => prevEl.removeAttribute(key));
|
|
1113
|
+
}
|
|
1114
|
+
}, {
|
|
1115
|
+
immediate: true
|
|
1116
|
+
});
|
|
1117
|
+
});
|
|
1118
|
+
onBeforeUnmount(() => {
|
|
1119
|
+
virtualTriggerAriaStopWatch == null ? void 0 : virtualTriggerAriaStopWatch();
|
|
1120
|
+
virtualTriggerAriaStopWatch = void 0;
|
|
1121
|
+
});
|
|
1122
|
+
expose({
|
|
1123
|
+
triggerRef
|
|
1124
|
+
});
|
|
1125
|
+
return (_ctx, _cache) => {
|
|
1126
|
+
return !_ctx.virtualTriggering ? (openBlock(), createBlock(unref$1(OnlyChild), mergeProps({ key: 0 }, _ctx.$attrs, {
|
|
1127
|
+
"aria-controls": unref$1(ariaControls),
|
|
1128
|
+
"aria-describedby": unref$1(ariaDescribedby),
|
|
1129
|
+
"aria-expanded": unref$1(ariaExpanded),
|
|
1130
|
+
"aria-haspopup": unref$1(ariaHaspopup)
|
|
1131
|
+
}), {
|
|
1132
|
+
default: withCtx(() => [
|
|
1133
|
+
renderSlot(_ctx.$slots, "default")
|
|
1134
|
+
]),
|
|
1135
|
+
_: 3
|
|
1136
|
+
}, 16, ["aria-controls", "aria-describedby", "aria-expanded", "aria-haspopup"])) : createCommentVNode("v-if", true);
|
|
1137
|
+
};
|
|
1138
|
+
}
|
|
1139
|
+
});
|
|
1140
|
+
var ElPopperTrigger = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/popper/src/trigger.vue"]]);
|
|
1141
|
+
|
|
1142
|
+
const FOCUS_AFTER_TRAPPED = "focus-trap.focus-after-trapped";
|
|
1143
|
+
const FOCUS_AFTER_RELEASED = "focus-trap.focus-after-released";
|
|
1144
|
+
const FOCUSOUT_PREVENTED = "focus-trap.focusout-prevented";
|
|
1145
|
+
const FOCUS_AFTER_TRAPPED_OPTS = {
|
|
1146
|
+
cancelable: true,
|
|
1147
|
+
bubbles: false
|
|
1148
|
+
};
|
|
1149
|
+
const FOCUSOUT_PREVENTED_OPTS = {
|
|
1150
|
+
cancelable: true,
|
|
1151
|
+
bubbles: false
|
|
1152
|
+
};
|
|
1153
|
+
const ON_TRAP_FOCUS_EVT = "focusAfterTrapped";
|
|
1154
|
+
const ON_RELEASE_FOCUS_EVT = "focusAfterReleased";
|
|
1155
|
+
const FOCUS_TRAP_INJECTION_KEY = Symbol("elFocusTrap");
|
|
1156
|
+
|
|
1157
|
+
const focusReason = ref();
|
|
1158
|
+
const lastUserFocusTimestamp = ref(0);
|
|
1159
|
+
const lastAutomatedFocusTimestamp = ref(0);
|
|
1160
|
+
let focusReasonUserCount = 0;
|
|
1161
|
+
const obtainAllFocusableElements = (element) => {
|
|
1162
|
+
const nodes = [];
|
|
1163
|
+
const walker = document.createTreeWalker(element, NodeFilter.SHOW_ELEMENT, {
|
|
1164
|
+
acceptNode: (node) => {
|
|
1165
|
+
const isHiddenInput = node.tagName === "INPUT" && node.type === "hidden";
|
|
1166
|
+
if (node.disabled || node.hidden || isHiddenInput)
|
|
1167
|
+
return NodeFilter.FILTER_SKIP;
|
|
1168
|
+
return node.tabIndex >= 0 || node === document.activeElement ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
|
|
1169
|
+
}
|
|
1170
|
+
});
|
|
1171
|
+
while (walker.nextNode())
|
|
1172
|
+
nodes.push(walker.currentNode);
|
|
1173
|
+
return nodes;
|
|
1174
|
+
};
|
|
1175
|
+
const getVisibleElement = (elements, container) => {
|
|
1176
|
+
for (const element of elements) {
|
|
1177
|
+
if (!isHidden(element, container))
|
|
1178
|
+
return element;
|
|
1179
|
+
}
|
|
1180
|
+
};
|
|
1181
|
+
const isHidden = (element, container) => {
|
|
1182
|
+
if (process.env.NODE_ENV === "test")
|
|
1183
|
+
return false;
|
|
1184
|
+
if (getComputedStyle(element).visibility === "hidden")
|
|
1185
|
+
return true;
|
|
1186
|
+
while (element) {
|
|
1187
|
+
if (container && element === container)
|
|
1188
|
+
return false;
|
|
1189
|
+
if (getComputedStyle(element).display === "none")
|
|
1190
|
+
return true;
|
|
1191
|
+
element = element.parentElement;
|
|
1192
|
+
}
|
|
1193
|
+
return false;
|
|
1194
|
+
};
|
|
1195
|
+
const getEdges = (container) => {
|
|
1196
|
+
const focusable = obtainAllFocusableElements(container);
|
|
1197
|
+
const first = getVisibleElement(focusable, container);
|
|
1198
|
+
const last = getVisibleElement(focusable.reverse(), container);
|
|
1199
|
+
return [first, last];
|
|
1200
|
+
};
|
|
1201
|
+
const isSelectable = (element) => {
|
|
1202
|
+
return element instanceof HTMLInputElement && "select" in element;
|
|
1203
|
+
};
|
|
1204
|
+
const tryFocus = (element, shouldSelect) => {
|
|
1205
|
+
if (element && element.focus) {
|
|
1206
|
+
const prevFocusedElement = document.activeElement;
|
|
1207
|
+
element.focus({ preventScroll: true });
|
|
1208
|
+
lastAutomatedFocusTimestamp.value = window.performance.now();
|
|
1209
|
+
if (element !== prevFocusedElement && isSelectable(element) && shouldSelect) {
|
|
1210
|
+
element.select();
|
|
1211
|
+
}
|
|
1212
|
+
}
|
|
1213
|
+
};
|
|
1214
|
+
function removeFromStack(list, item) {
|
|
1215
|
+
const copy = [...list];
|
|
1216
|
+
const idx = list.indexOf(item);
|
|
1217
|
+
if (idx !== -1) {
|
|
1218
|
+
copy.splice(idx, 1);
|
|
1219
|
+
}
|
|
1220
|
+
return copy;
|
|
1221
|
+
}
|
|
1222
|
+
const createFocusableStack = () => {
|
|
1223
|
+
let stack = [];
|
|
1224
|
+
const push = (layer) => {
|
|
1225
|
+
const currentLayer = stack[0];
|
|
1226
|
+
if (currentLayer && layer !== currentLayer) {
|
|
1227
|
+
currentLayer.pause();
|
|
1228
|
+
}
|
|
1229
|
+
stack = removeFromStack(stack, layer);
|
|
1230
|
+
stack.unshift(layer);
|
|
1231
|
+
};
|
|
1232
|
+
const remove = (layer) => {
|
|
1233
|
+
var _a, _b;
|
|
1234
|
+
stack = removeFromStack(stack, layer);
|
|
1235
|
+
(_b = (_a = stack[0]) == null ? void 0 : _a.resume) == null ? void 0 : _b.call(_a);
|
|
1236
|
+
};
|
|
1237
|
+
return {
|
|
1238
|
+
push,
|
|
1239
|
+
remove
|
|
1240
|
+
};
|
|
1241
|
+
};
|
|
1242
|
+
const focusFirstDescendant = (elements, shouldSelect = false) => {
|
|
1243
|
+
const prevFocusedElement = document.activeElement;
|
|
1244
|
+
for (const element of elements) {
|
|
1245
|
+
tryFocus(element, shouldSelect);
|
|
1246
|
+
if (document.activeElement !== prevFocusedElement)
|
|
1247
|
+
return;
|
|
1248
|
+
}
|
|
1249
|
+
};
|
|
1250
|
+
const focusableStack = createFocusableStack();
|
|
1251
|
+
const isFocusCausedByUserEvent = () => {
|
|
1252
|
+
return lastUserFocusTimestamp.value > lastAutomatedFocusTimestamp.value;
|
|
1253
|
+
};
|
|
1254
|
+
const notifyFocusReasonPointer = () => {
|
|
1255
|
+
focusReason.value = "pointer";
|
|
1256
|
+
lastUserFocusTimestamp.value = window.performance.now();
|
|
1257
|
+
};
|
|
1258
|
+
const notifyFocusReasonKeydown = () => {
|
|
1259
|
+
focusReason.value = "keyboard";
|
|
1260
|
+
lastUserFocusTimestamp.value = window.performance.now();
|
|
1261
|
+
};
|
|
1262
|
+
const useFocusReason = () => {
|
|
1263
|
+
onMounted(() => {
|
|
1264
|
+
if (focusReasonUserCount === 0) {
|
|
1265
|
+
document.addEventListener("mousedown", notifyFocusReasonPointer);
|
|
1266
|
+
document.addEventListener("touchstart", notifyFocusReasonPointer);
|
|
1267
|
+
document.addEventListener("keydown", notifyFocusReasonKeydown);
|
|
1268
|
+
}
|
|
1269
|
+
focusReasonUserCount++;
|
|
1270
|
+
});
|
|
1271
|
+
onBeforeUnmount(() => {
|
|
1272
|
+
focusReasonUserCount--;
|
|
1273
|
+
if (focusReasonUserCount <= 0) {
|
|
1274
|
+
document.removeEventListener("mousedown", notifyFocusReasonPointer);
|
|
1275
|
+
document.removeEventListener("touchstart", notifyFocusReasonPointer);
|
|
1276
|
+
document.removeEventListener("keydown", notifyFocusReasonKeydown);
|
|
1277
|
+
}
|
|
1278
|
+
});
|
|
1279
|
+
return {
|
|
1280
|
+
focusReason,
|
|
1281
|
+
lastUserFocusTimestamp,
|
|
1282
|
+
lastAutomatedFocusTimestamp
|
|
1283
|
+
};
|
|
1284
|
+
};
|
|
1285
|
+
const createFocusOutPreventedEvent = (detail) => {
|
|
1286
|
+
return new CustomEvent(FOCUSOUT_PREVENTED, {
|
|
1287
|
+
...FOCUSOUT_PREVENTED_OPTS,
|
|
1288
|
+
detail
|
|
1289
|
+
});
|
|
1290
|
+
};
|
|
1291
|
+
|
|
1292
|
+
const _sfc_main$4 = defineComponent({
|
|
1293
|
+
name: "ElFocusTrap",
|
|
1294
|
+
inheritAttrs: false,
|
|
1295
|
+
props: {
|
|
1296
|
+
loop: Boolean,
|
|
1297
|
+
trapped: Boolean,
|
|
1298
|
+
focusTrapEl: Object,
|
|
1299
|
+
focusStartEl: {
|
|
1300
|
+
type: [Object, String],
|
|
1301
|
+
default: "first"
|
|
1302
|
+
}
|
|
1303
|
+
},
|
|
1304
|
+
emits: [
|
|
1305
|
+
ON_TRAP_FOCUS_EVT,
|
|
1306
|
+
ON_RELEASE_FOCUS_EVT,
|
|
1307
|
+
"focusin",
|
|
1308
|
+
"focusout",
|
|
1309
|
+
"focusout-prevented",
|
|
1310
|
+
"release-requested"
|
|
1311
|
+
],
|
|
1312
|
+
setup(props, { emit }) {
|
|
1313
|
+
const forwardRef = ref();
|
|
1314
|
+
let lastFocusBeforeTrapped;
|
|
1315
|
+
let lastFocusAfterTrapped;
|
|
1316
|
+
const { focusReason } = useFocusReason();
|
|
1317
|
+
useEscapeKeydown((event) => {
|
|
1318
|
+
if (props.trapped && !focusLayer.paused) {
|
|
1319
|
+
emit("release-requested", event);
|
|
1320
|
+
}
|
|
1321
|
+
});
|
|
1322
|
+
const focusLayer = {
|
|
1323
|
+
paused: false,
|
|
1324
|
+
pause() {
|
|
1325
|
+
this.paused = true;
|
|
1326
|
+
},
|
|
1327
|
+
resume() {
|
|
1328
|
+
this.paused = false;
|
|
1329
|
+
}
|
|
1330
|
+
};
|
|
1331
|
+
const onKeydown = (e) => {
|
|
1332
|
+
if (!props.loop && !props.trapped)
|
|
1333
|
+
return;
|
|
1334
|
+
if (focusLayer.paused)
|
|
1335
|
+
return;
|
|
1336
|
+
const { key, altKey, ctrlKey, metaKey, currentTarget, shiftKey } = e;
|
|
1337
|
+
const { loop } = props;
|
|
1338
|
+
const isTabbing = key === EVENT_CODE.tab && !altKey && !ctrlKey && !metaKey;
|
|
1339
|
+
const currentFocusingEl = document.activeElement;
|
|
1340
|
+
if (isTabbing && currentFocusingEl) {
|
|
1341
|
+
const container = currentTarget;
|
|
1342
|
+
const [first, last] = getEdges(container);
|
|
1343
|
+
const isTabbable = first && last;
|
|
1344
|
+
if (!isTabbable) {
|
|
1345
|
+
if (currentFocusingEl === container) {
|
|
1346
|
+
const focusoutPreventedEvent = createFocusOutPreventedEvent({
|
|
1347
|
+
focusReason: focusReason.value
|
|
1348
|
+
});
|
|
1349
|
+
emit("focusout-prevented", focusoutPreventedEvent);
|
|
1350
|
+
if (!focusoutPreventedEvent.defaultPrevented) {
|
|
1351
|
+
e.preventDefault();
|
|
1352
|
+
}
|
|
1353
|
+
}
|
|
1354
|
+
} else {
|
|
1355
|
+
if (!shiftKey && currentFocusingEl === last) {
|
|
1356
|
+
const focusoutPreventedEvent = createFocusOutPreventedEvent({
|
|
1357
|
+
focusReason: focusReason.value
|
|
1358
|
+
});
|
|
1359
|
+
emit("focusout-prevented", focusoutPreventedEvent);
|
|
1360
|
+
if (!focusoutPreventedEvent.defaultPrevented) {
|
|
1361
|
+
e.preventDefault();
|
|
1362
|
+
if (loop)
|
|
1363
|
+
tryFocus(first, true);
|
|
1364
|
+
}
|
|
1365
|
+
} else if (shiftKey && [first, container].includes(currentFocusingEl)) {
|
|
1366
|
+
const focusoutPreventedEvent = createFocusOutPreventedEvent({
|
|
1367
|
+
focusReason: focusReason.value
|
|
1368
|
+
});
|
|
1369
|
+
emit("focusout-prevented", focusoutPreventedEvent);
|
|
1370
|
+
if (!focusoutPreventedEvent.defaultPrevented) {
|
|
1371
|
+
e.preventDefault();
|
|
1372
|
+
if (loop)
|
|
1373
|
+
tryFocus(last, true);
|
|
1374
|
+
}
|
|
1375
|
+
}
|
|
1376
|
+
}
|
|
1377
|
+
}
|
|
1378
|
+
};
|
|
1379
|
+
provide(FOCUS_TRAP_INJECTION_KEY, {
|
|
1380
|
+
focusTrapRef: forwardRef,
|
|
1381
|
+
onKeydown
|
|
1382
|
+
});
|
|
1383
|
+
watch$1(() => props.focusTrapEl, (focusTrapEl) => {
|
|
1384
|
+
if (focusTrapEl) {
|
|
1385
|
+
forwardRef.value = focusTrapEl;
|
|
1386
|
+
}
|
|
1387
|
+
}, { immediate: true });
|
|
1388
|
+
watch$1([forwardRef], ([forwardRef2], [oldForwardRef]) => {
|
|
1389
|
+
if (forwardRef2) {
|
|
1390
|
+
forwardRef2.addEventListener("keydown", onKeydown);
|
|
1391
|
+
forwardRef2.addEventListener("focusin", onFocusIn);
|
|
1392
|
+
forwardRef2.addEventListener("focusout", onFocusOut);
|
|
1393
|
+
}
|
|
1394
|
+
if (oldForwardRef) {
|
|
1395
|
+
oldForwardRef.removeEventListener("keydown", onKeydown);
|
|
1396
|
+
oldForwardRef.removeEventListener("focusin", onFocusIn);
|
|
1397
|
+
oldForwardRef.removeEventListener("focusout", onFocusOut);
|
|
1398
|
+
}
|
|
1399
|
+
});
|
|
1400
|
+
const trapOnFocus = (e) => {
|
|
1401
|
+
emit(ON_TRAP_FOCUS_EVT, e);
|
|
1402
|
+
};
|
|
1403
|
+
const releaseOnFocus = (e) => emit(ON_RELEASE_FOCUS_EVT, e);
|
|
1404
|
+
const onFocusIn = (e) => {
|
|
1405
|
+
const trapContainer = unref$1(forwardRef);
|
|
1406
|
+
if (!trapContainer)
|
|
1407
|
+
return;
|
|
1408
|
+
const target = e.target;
|
|
1409
|
+
const relatedTarget = e.relatedTarget;
|
|
1410
|
+
const isFocusedInTrap = target && trapContainer.contains(target);
|
|
1411
|
+
if (!props.trapped) {
|
|
1412
|
+
const isPrevFocusedInTrap = relatedTarget && trapContainer.contains(relatedTarget);
|
|
1413
|
+
if (!isPrevFocusedInTrap) {
|
|
1414
|
+
lastFocusBeforeTrapped = relatedTarget;
|
|
1415
|
+
}
|
|
1416
|
+
}
|
|
1417
|
+
if (isFocusedInTrap)
|
|
1418
|
+
emit("focusin", e);
|
|
1419
|
+
if (focusLayer.paused)
|
|
1420
|
+
return;
|
|
1421
|
+
if (props.trapped) {
|
|
1422
|
+
if (isFocusedInTrap) {
|
|
1423
|
+
lastFocusAfterTrapped = target;
|
|
1424
|
+
} else {
|
|
1425
|
+
tryFocus(lastFocusAfterTrapped, true);
|
|
1426
|
+
}
|
|
1427
|
+
}
|
|
1428
|
+
};
|
|
1429
|
+
const onFocusOut = (e) => {
|
|
1430
|
+
const trapContainer = unref$1(forwardRef);
|
|
1431
|
+
if (focusLayer.paused || !trapContainer)
|
|
1432
|
+
return;
|
|
1433
|
+
if (props.trapped) {
|
|
1434
|
+
const relatedTarget = e.relatedTarget;
|
|
1435
|
+
if (!isNil(relatedTarget) && !trapContainer.contains(relatedTarget)) {
|
|
1436
|
+
setTimeout(() => {
|
|
1437
|
+
if (!focusLayer.paused && props.trapped) {
|
|
1438
|
+
const focusoutPreventedEvent = createFocusOutPreventedEvent({
|
|
1439
|
+
focusReason: focusReason.value
|
|
1440
|
+
});
|
|
1441
|
+
emit("focusout-prevented", focusoutPreventedEvent);
|
|
1442
|
+
if (!focusoutPreventedEvent.defaultPrevented) {
|
|
1443
|
+
tryFocus(lastFocusAfterTrapped, true);
|
|
1444
|
+
}
|
|
1445
|
+
}
|
|
1446
|
+
}, 0);
|
|
1447
|
+
}
|
|
1448
|
+
} else {
|
|
1449
|
+
const target = e.target;
|
|
1450
|
+
const isFocusedInTrap = target && trapContainer.contains(target);
|
|
1451
|
+
if (!isFocusedInTrap)
|
|
1452
|
+
emit("focusout", e);
|
|
1453
|
+
}
|
|
1454
|
+
};
|
|
1455
|
+
async function startTrap() {
|
|
1456
|
+
await nextTick();
|
|
1457
|
+
const trapContainer = unref$1(forwardRef);
|
|
1458
|
+
if (trapContainer) {
|
|
1459
|
+
focusableStack.push(focusLayer);
|
|
1460
|
+
const prevFocusedElement = trapContainer.contains(document.activeElement) ? lastFocusBeforeTrapped : document.activeElement;
|
|
1461
|
+
lastFocusBeforeTrapped = prevFocusedElement;
|
|
1462
|
+
const isPrevFocusContained = trapContainer.contains(prevFocusedElement);
|
|
1463
|
+
if (!isPrevFocusContained) {
|
|
1464
|
+
const focusEvent = new Event(FOCUS_AFTER_TRAPPED, FOCUS_AFTER_TRAPPED_OPTS);
|
|
1465
|
+
trapContainer.addEventListener(FOCUS_AFTER_TRAPPED, trapOnFocus);
|
|
1466
|
+
trapContainer.dispatchEvent(focusEvent);
|
|
1467
|
+
if (!focusEvent.defaultPrevented) {
|
|
1468
|
+
nextTick(() => {
|
|
1469
|
+
let focusStartEl = props.focusStartEl;
|
|
1470
|
+
if (!isString(focusStartEl)) {
|
|
1471
|
+
tryFocus(focusStartEl);
|
|
1472
|
+
if (document.activeElement !== focusStartEl) {
|
|
1473
|
+
focusStartEl = "first";
|
|
1474
|
+
}
|
|
1475
|
+
}
|
|
1476
|
+
if (focusStartEl === "first") {
|
|
1477
|
+
focusFirstDescendant(obtainAllFocusableElements(trapContainer), true);
|
|
1478
|
+
}
|
|
1479
|
+
if (document.activeElement === prevFocusedElement || focusStartEl === "container") {
|
|
1480
|
+
tryFocus(trapContainer);
|
|
1481
|
+
}
|
|
1482
|
+
});
|
|
1483
|
+
}
|
|
1484
|
+
}
|
|
1485
|
+
}
|
|
1486
|
+
}
|
|
1487
|
+
function stopTrap() {
|
|
1488
|
+
const trapContainer = unref$1(forwardRef);
|
|
1489
|
+
if (trapContainer) {
|
|
1490
|
+
trapContainer.removeEventListener(FOCUS_AFTER_TRAPPED, trapOnFocus);
|
|
1491
|
+
const releasedEvent = new CustomEvent(FOCUS_AFTER_RELEASED, {
|
|
1492
|
+
...FOCUS_AFTER_TRAPPED_OPTS,
|
|
1493
|
+
detail: {
|
|
1494
|
+
focusReason: focusReason.value
|
|
1495
|
+
}
|
|
1496
|
+
});
|
|
1497
|
+
trapContainer.addEventListener(FOCUS_AFTER_RELEASED, releaseOnFocus);
|
|
1498
|
+
trapContainer.dispatchEvent(releasedEvent);
|
|
1499
|
+
if (!releasedEvent.defaultPrevented && (focusReason.value == "keyboard" || !isFocusCausedByUserEvent() || trapContainer.contains(document.activeElement))) {
|
|
1500
|
+
tryFocus(lastFocusBeforeTrapped != null ? lastFocusBeforeTrapped : document.body);
|
|
1501
|
+
}
|
|
1502
|
+
trapContainer.removeEventListener(FOCUS_AFTER_RELEASED, trapOnFocus);
|
|
1503
|
+
focusableStack.remove(focusLayer);
|
|
1504
|
+
}
|
|
1505
|
+
}
|
|
1506
|
+
onMounted(() => {
|
|
1507
|
+
if (props.trapped) {
|
|
1508
|
+
startTrap();
|
|
1509
|
+
}
|
|
1510
|
+
watch$1(() => props.trapped, (trapped) => {
|
|
1511
|
+
if (trapped) {
|
|
1512
|
+
startTrap();
|
|
1513
|
+
} else {
|
|
1514
|
+
stopTrap();
|
|
1515
|
+
}
|
|
1516
|
+
});
|
|
1517
|
+
});
|
|
1518
|
+
onBeforeUnmount(() => {
|
|
1519
|
+
if (props.trapped) {
|
|
1520
|
+
stopTrap();
|
|
1521
|
+
}
|
|
1522
|
+
});
|
|
1523
|
+
return {
|
|
1524
|
+
onKeydown
|
|
1525
|
+
};
|
|
1526
|
+
}
|
|
1527
|
+
});
|
|
1528
|
+
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
1529
|
+
return renderSlot(_ctx.$slots, "default", { handleKeydown: _ctx.onKeydown });
|
|
1530
|
+
}
|
|
1531
|
+
var ElFocusTrap = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render], ["__file", "/home/runner/work/element-plus/element-plus/packages/components/focus-trap/src/focus-trap.vue"]]);
|
|
1532
|
+
|
|
1533
|
+
const POSITIONING_STRATEGIES = ["fixed", "absolute"];
|
|
1534
|
+
const popperCoreConfigProps = buildProps({
|
|
1535
|
+
boundariesPadding: {
|
|
1536
|
+
type: Number,
|
|
1537
|
+
default: 0
|
|
1538
|
+
},
|
|
1539
|
+
fallbackPlacements: {
|
|
1540
|
+
type: definePropType(Array),
|
|
1541
|
+
default: void 0
|
|
1542
|
+
},
|
|
1543
|
+
gpuAcceleration: {
|
|
1544
|
+
type: Boolean,
|
|
1545
|
+
default: true
|
|
1546
|
+
},
|
|
1547
|
+
offset: {
|
|
1548
|
+
type: Number,
|
|
1549
|
+
default: 12
|
|
1550
|
+
},
|
|
1551
|
+
placement: {
|
|
1552
|
+
type: String,
|
|
1553
|
+
values: Ee,
|
|
1554
|
+
default: "bottom"
|
|
1555
|
+
},
|
|
1556
|
+
popperOptions: {
|
|
1557
|
+
type: definePropType(Object),
|
|
1558
|
+
default: () => ({})
|
|
1559
|
+
},
|
|
1560
|
+
strategy: {
|
|
1561
|
+
type: String,
|
|
1562
|
+
values: POSITIONING_STRATEGIES,
|
|
1563
|
+
default: "absolute"
|
|
1564
|
+
}
|
|
1565
|
+
});
|
|
1566
|
+
const popperContentProps = buildProps({
|
|
1567
|
+
...popperCoreConfigProps,
|
|
1568
|
+
id: String,
|
|
1569
|
+
style: {
|
|
1570
|
+
type: definePropType([String, Array, Object])
|
|
1571
|
+
},
|
|
1572
|
+
className: {
|
|
1573
|
+
type: definePropType([String, Array, Object])
|
|
1574
|
+
},
|
|
1575
|
+
effect: {
|
|
1576
|
+
type: String,
|
|
1577
|
+
default: "dark"
|
|
1578
|
+
},
|
|
1579
|
+
visible: Boolean,
|
|
1580
|
+
enterable: {
|
|
1581
|
+
type: Boolean,
|
|
1582
|
+
default: true
|
|
1583
|
+
},
|
|
1584
|
+
pure: Boolean,
|
|
1585
|
+
focusOnShow: {
|
|
1586
|
+
type: Boolean,
|
|
1587
|
+
default: false
|
|
1588
|
+
},
|
|
1589
|
+
trapping: {
|
|
1590
|
+
type: Boolean,
|
|
1591
|
+
default: false
|
|
1592
|
+
},
|
|
1593
|
+
popperClass: {
|
|
1594
|
+
type: definePropType([String, Array, Object])
|
|
1595
|
+
},
|
|
1596
|
+
popperStyle: {
|
|
1597
|
+
type: definePropType([String, Array, Object])
|
|
1598
|
+
},
|
|
1599
|
+
referenceEl: {
|
|
1600
|
+
type: definePropType(Object)
|
|
1601
|
+
},
|
|
1602
|
+
triggerTargetEl: {
|
|
1603
|
+
type: definePropType(Object)
|
|
1604
|
+
},
|
|
1605
|
+
stopPopperMouseEvent: {
|
|
1606
|
+
type: Boolean,
|
|
1607
|
+
default: true
|
|
1608
|
+
},
|
|
1609
|
+
ariaLabel: {
|
|
1610
|
+
type: String,
|
|
1611
|
+
default: void 0
|
|
1612
|
+
},
|
|
1613
|
+
virtualTriggering: Boolean,
|
|
1614
|
+
zIndex: Number
|
|
1615
|
+
});
|
|
1616
|
+
const popperContentEmits = {
|
|
1617
|
+
mouseenter: (evt) => evt instanceof MouseEvent,
|
|
1618
|
+
mouseleave: (evt) => evt instanceof MouseEvent,
|
|
1619
|
+
focus: () => true,
|
|
1620
|
+
blur: () => true,
|
|
1621
|
+
close: () => true
|
|
1622
|
+
};
|
|
1623
|
+
|
|
1624
|
+
const buildPopperOptions = (props, modifiers = []) => {
|
|
1625
|
+
const { placement, strategy, popperOptions } = props;
|
|
1626
|
+
const options = {
|
|
1627
|
+
placement,
|
|
1628
|
+
strategy,
|
|
1629
|
+
...popperOptions,
|
|
1630
|
+
modifiers: [...genModifiers(props), ...modifiers]
|
|
1631
|
+
};
|
|
1632
|
+
deriveExtraModifiers(options, popperOptions == null ? void 0 : popperOptions.modifiers);
|
|
1633
|
+
return options;
|
|
1634
|
+
};
|
|
1635
|
+
const unwrapMeasurableEl = ($el) => {
|
|
1636
|
+
if (!isClient)
|
|
1637
|
+
return;
|
|
1638
|
+
return unrefElement($el);
|
|
1639
|
+
};
|
|
1640
|
+
function genModifiers(options) {
|
|
1641
|
+
const { offset, gpuAcceleration, fallbackPlacements } = options;
|
|
1642
|
+
return [
|
|
1643
|
+
{
|
|
1644
|
+
name: "offset",
|
|
1645
|
+
options: {
|
|
1646
|
+
offset: [0, offset != null ? offset : 12]
|
|
1647
|
+
}
|
|
1648
|
+
},
|
|
1649
|
+
{
|
|
1650
|
+
name: "preventOverflow",
|
|
1651
|
+
options: {
|
|
1652
|
+
padding: {
|
|
1653
|
+
top: 2,
|
|
1654
|
+
bottom: 2,
|
|
1655
|
+
left: 5,
|
|
1656
|
+
right: 5
|
|
1657
|
+
}
|
|
1658
|
+
}
|
|
1659
|
+
},
|
|
1660
|
+
{
|
|
1661
|
+
name: "flip",
|
|
1662
|
+
options: {
|
|
1663
|
+
padding: 5,
|
|
1664
|
+
fallbackPlacements
|
|
1665
|
+
}
|
|
1666
|
+
},
|
|
1667
|
+
{
|
|
1668
|
+
name: "computeStyles",
|
|
1669
|
+
options: {
|
|
1670
|
+
gpuAcceleration
|
|
1671
|
+
}
|
|
1672
|
+
}
|
|
1673
|
+
];
|
|
1674
|
+
}
|
|
1675
|
+
function deriveExtraModifiers(options, modifiers) {
|
|
1676
|
+
if (modifiers) {
|
|
1677
|
+
options.modifiers = [...options.modifiers, ...modifiers != null ? modifiers : []];
|
|
1678
|
+
}
|
|
1679
|
+
}
|
|
1680
|
+
|
|
1681
|
+
const DEFAULT_ARROW_OFFSET = 0;
|
|
1682
|
+
const usePopperContent = (props) => {
|
|
1683
|
+
const { popperInstanceRef, contentRef, triggerRef, role } = inject(POPPER_INJECTION_KEY, void 0);
|
|
1684
|
+
const arrowRef = ref();
|
|
1685
|
+
const arrowOffset = ref();
|
|
1686
|
+
const eventListenerModifier = computed(() => {
|
|
1687
|
+
return {
|
|
1688
|
+
name: "eventListeners",
|
|
1689
|
+
enabled: !!props.visible
|
|
1690
|
+
};
|
|
1691
|
+
});
|
|
1692
|
+
const arrowModifier = computed(() => {
|
|
1693
|
+
var _a;
|
|
1694
|
+
const arrowEl = unref$1(arrowRef);
|
|
1695
|
+
const offset = (_a = unref$1(arrowOffset)) != null ? _a : DEFAULT_ARROW_OFFSET;
|
|
1696
|
+
return {
|
|
1697
|
+
name: "arrow",
|
|
1698
|
+
enabled: !isUndefined(arrowEl),
|
|
1699
|
+
options: {
|
|
1700
|
+
element: arrowEl,
|
|
1701
|
+
padding: offset
|
|
1702
|
+
}
|
|
1703
|
+
};
|
|
1704
|
+
});
|
|
1705
|
+
const options = computed(() => {
|
|
1706
|
+
return {
|
|
1707
|
+
onFirstUpdate: () => {
|
|
1708
|
+
update();
|
|
1709
|
+
},
|
|
1710
|
+
...buildPopperOptions(props, [
|
|
1711
|
+
unref$1(arrowModifier),
|
|
1712
|
+
unref$1(eventListenerModifier)
|
|
1713
|
+
])
|
|
1714
|
+
};
|
|
1715
|
+
});
|
|
1716
|
+
const computedReference = computed(() => unwrapMeasurableEl(props.referenceEl) || unref$1(triggerRef));
|
|
1717
|
+
const { attributes, state, styles, update, forceUpdate, instanceRef } = usePopper(computedReference, contentRef, options);
|
|
1718
|
+
watch$1(instanceRef, (instance) => popperInstanceRef.value = instance);
|
|
1719
|
+
onMounted(() => {
|
|
1720
|
+
watch$1(() => {
|
|
1721
|
+
var _a;
|
|
1722
|
+
return (_a = unref$1(computedReference)) == null ? void 0 : _a.getBoundingClientRect();
|
|
1723
|
+
}, () => {
|
|
1724
|
+
update();
|
|
1725
|
+
});
|
|
1726
|
+
});
|
|
1727
|
+
return {
|
|
1728
|
+
attributes,
|
|
1729
|
+
arrowRef,
|
|
1730
|
+
contentRef,
|
|
1731
|
+
instanceRef,
|
|
1732
|
+
state,
|
|
1733
|
+
styles,
|
|
1734
|
+
role,
|
|
1735
|
+
forceUpdate,
|
|
1736
|
+
update
|
|
1737
|
+
};
|
|
1738
|
+
};
|
|
1739
|
+
|
|
1740
|
+
const usePopperContentDOM = (props, {
|
|
1741
|
+
attributes,
|
|
1742
|
+
styles,
|
|
1743
|
+
role
|
|
1744
|
+
}) => {
|
|
1745
|
+
const { nextZIndex } = useZIndex();
|
|
1746
|
+
const ns = useNamespace("popper");
|
|
1747
|
+
const contentAttrs = computed(() => unref$1(attributes).popper);
|
|
1748
|
+
const contentZIndex = ref(props.zIndex || nextZIndex());
|
|
1749
|
+
const contentClass = computed(() => [
|
|
1750
|
+
ns.b(),
|
|
1751
|
+
ns.is("pure", props.pure),
|
|
1752
|
+
ns.is(props.effect),
|
|
1753
|
+
props.popperClass
|
|
1754
|
+
]);
|
|
1755
|
+
const contentStyle = computed(() => {
|
|
1756
|
+
return [
|
|
1757
|
+
{ zIndex: unref$1(contentZIndex) },
|
|
1758
|
+
unref$1(styles).popper,
|
|
1759
|
+
props.popperStyle || {}
|
|
1760
|
+
];
|
|
1761
|
+
});
|
|
1762
|
+
const ariaModal = computed(() => role.value === "dialog" ? "false" : void 0);
|
|
1763
|
+
const arrowStyle = computed(() => unref$1(styles).arrow || {});
|
|
1764
|
+
const updateZIndex = () => {
|
|
1765
|
+
contentZIndex.value = props.zIndex || nextZIndex();
|
|
1766
|
+
};
|
|
1767
|
+
return {
|
|
1768
|
+
ariaModal,
|
|
1769
|
+
arrowStyle,
|
|
1770
|
+
contentAttrs,
|
|
1771
|
+
contentClass,
|
|
1772
|
+
contentStyle,
|
|
1773
|
+
contentZIndex,
|
|
1774
|
+
updateZIndex
|
|
1775
|
+
};
|
|
1776
|
+
};
|
|
1777
|
+
|
|
1778
|
+
const usePopperContentFocusTrap = (props, emit) => {
|
|
1779
|
+
const trapped = ref(false);
|
|
1780
|
+
const focusStartRef = ref();
|
|
1781
|
+
const onFocusAfterTrapped = () => {
|
|
1782
|
+
emit("focus");
|
|
1783
|
+
};
|
|
1784
|
+
const onFocusAfterReleased = (event) => {
|
|
1785
|
+
var _a;
|
|
1786
|
+
if (((_a = event.detail) == null ? void 0 : _a.focusReason) !== "pointer") {
|
|
1787
|
+
focusStartRef.value = "first";
|
|
1788
|
+
emit("blur");
|
|
1789
|
+
}
|
|
1790
|
+
};
|
|
1791
|
+
const onFocusInTrap = (event) => {
|
|
1792
|
+
if (props.visible && !trapped.value) {
|
|
1793
|
+
if (event.target) {
|
|
1794
|
+
focusStartRef.value = event.target;
|
|
1795
|
+
}
|
|
1796
|
+
trapped.value = true;
|
|
1797
|
+
}
|
|
1798
|
+
};
|
|
1799
|
+
const onFocusoutPrevented = (event) => {
|
|
1800
|
+
if (!props.trapping) {
|
|
1801
|
+
if (event.detail.focusReason === "pointer") {
|
|
1802
|
+
event.preventDefault();
|
|
1803
|
+
}
|
|
1804
|
+
trapped.value = false;
|
|
1805
|
+
}
|
|
1806
|
+
};
|
|
1807
|
+
const onReleaseRequested = () => {
|
|
1808
|
+
trapped.value = false;
|
|
1809
|
+
emit("close");
|
|
1810
|
+
};
|
|
1811
|
+
return {
|
|
1812
|
+
focusStartRef,
|
|
1813
|
+
trapped,
|
|
1814
|
+
onFocusAfterReleased,
|
|
1815
|
+
onFocusAfterTrapped,
|
|
1816
|
+
onFocusInTrap,
|
|
1817
|
+
onFocusoutPrevented,
|
|
1818
|
+
onReleaseRequested
|
|
1819
|
+
};
|
|
1820
|
+
};
|
|
1821
|
+
|
|
1822
|
+
const __default__$3 = defineComponent({
|
|
1823
|
+
name: "ElPopperContent"
|
|
1824
|
+
});
|
|
1825
|
+
const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
1826
|
+
...__default__$3,
|
|
1827
|
+
props: popperContentProps,
|
|
1828
|
+
emits: popperContentEmits,
|
|
1829
|
+
setup(__props, { expose, emit }) {
|
|
1830
|
+
const props = __props;
|
|
1831
|
+
const {
|
|
1832
|
+
focusStartRef,
|
|
1833
|
+
trapped,
|
|
1834
|
+
onFocusAfterReleased,
|
|
1835
|
+
onFocusAfterTrapped,
|
|
1836
|
+
onFocusInTrap,
|
|
1837
|
+
onFocusoutPrevented,
|
|
1838
|
+
onReleaseRequested
|
|
1839
|
+
} = usePopperContentFocusTrap(props, emit);
|
|
1840
|
+
const { attributes, arrowRef, contentRef, styles, instanceRef, role, update } = usePopperContent(props);
|
|
1841
|
+
const {
|
|
1842
|
+
ariaModal,
|
|
1843
|
+
arrowStyle,
|
|
1844
|
+
contentAttrs,
|
|
1845
|
+
contentClass,
|
|
1846
|
+
contentStyle,
|
|
1847
|
+
updateZIndex
|
|
1848
|
+
} = usePopperContentDOM(props, {
|
|
1849
|
+
styles,
|
|
1850
|
+
attributes,
|
|
1851
|
+
role
|
|
1852
|
+
});
|
|
1853
|
+
const formItemContext = inject(formItemContextKey, void 0);
|
|
1854
|
+
const arrowOffset = ref();
|
|
1855
|
+
provide(POPPER_CONTENT_INJECTION_KEY, {
|
|
1856
|
+
arrowStyle,
|
|
1857
|
+
arrowRef,
|
|
1858
|
+
arrowOffset
|
|
1859
|
+
});
|
|
1860
|
+
if (formItemContext && (formItemContext.addInputId || formItemContext.removeInputId)) {
|
|
1861
|
+
provide(formItemContextKey, {
|
|
1862
|
+
...formItemContext,
|
|
1863
|
+
addInputId: NOOP,
|
|
1864
|
+
removeInputId: NOOP
|
|
1865
|
+
});
|
|
1866
|
+
}
|
|
1867
|
+
let triggerTargetAriaStopWatch = void 0;
|
|
1868
|
+
const updatePopper = (shouldUpdateZIndex = true) => {
|
|
1869
|
+
update();
|
|
1870
|
+
shouldUpdateZIndex && updateZIndex();
|
|
1871
|
+
};
|
|
1872
|
+
const togglePopperAlive = () => {
|
|
1873
|
+
updatePopper(false);
|
|
1874
|
+
if (props.visible && props.focusOnShow) {
|
|
1875
|
+
trapped.value = true;
|
|
1876
|
+
} else if (props.visible === false) {
|
|
1877
|
+
trapped.value = false;
|
|
1878
|
+
}
|
|
1879
|
+
};
|
|
1880
|
+
onMounted(() => {
|
|
1881
|
+
watch$1(() => props.triggerTargetEl, (triggerTargetEl, prevTriggerTargetEl) => {
|
|
1882
|
+
triggerTargetAriaStopWatch == null ? void 0 : triggerTargetAriaStopWatch();
|
|
1883
|
+
triggerTargetAriaStopWatch = void 0;
|
|
1884
|
+
const el = unref$1(triggerTargetEl || contentRef.value);
|
|
1885
|
+
const prevEl = unref$1(prevTriggerTargetEl || contentRef.value);
|
|
1886
|
+
if (isElement(el)) {
|
|
1887
|
+
triggerTargetAriaStopWatch = watch$1([role, () => props.ariaLabel, ariaModal, () => props.id], (watches) => {
|
|
1888
|
+
["role", "aria-label", "aria-modal", "id"].forEach((key, idx) => {
|
|
1889
|
+
isNil(watches[idx]) ? el.removeAttribute(key) : el.setAttribute(key, watches[idx]);
|
|
1890
|
+
});
|
|
1891
|
+
}, { immediate: true });
|
|
1892
|
+
}
|
|
1893
|
+
if (prevEl !== el && isElement(prevEl)) {
|
|
1894
|
+
["role", "aria-label", "aria-modal", "id"].forEach((key) => {
|
|
1895
|
+
prevEl.removeAttribute(key);
|
|
1896
|
+
});
|
|
1897
|
+
}
|
|
1898
|
+
}, { immediate: true });
|
|
1899
|
+
watch$1(() => props.visible, togglePopperAlive, { immediate: true });
|
|
1900
|
+
});
|
|
1901
|
+
onBeforeUnmount(() => {
|
|
1902
|
+
triggerTargetAriaStopWatch == null ? void 0 : triggerTargetAriaStopWatch();
|
|
1903
|
+
triggerTargetAriaStopWatch = void 0;
|
|
1904
|
+
});
|
|
1905
|
+
expose({
|
|
1906
|
+
popperContentRef: contentRef,
|
|
1907
|
+
popperInstanceRef: instanceRef,
|
|
1908
|
+
updatePopper,
|
|
1909
|
+
contentStyle
|
|
1910
|
+
});
|
|
1911
|
+
return (_ctx, _cache) => {
|
|
1912
|
+
return openBlock(), createElementBlock("div", mergeProps({
|
|
1913
|
+
ref_key: "contentRef",
|
|
1914
|
+
ref: contentRef
|
|
1915
|
+
}, unref$1(contentAttrs), {
|
|
1916
|
+
style: unref$1(contentStyle),
|
|
1917
|
+
class: unref$1(contentClass),
|
|
1918
|
+
tabindex: "-1",
|
|
1919
|
+
onMouseenter: _cache[0] || (_cache[0] = (e) => _ctx.$emit("mouseenter", e)),
|
|
1920
|
+
onMouseleave: _cache[1] || (_cache[1] = (e) => _ctx.$emit("mouseleave", e))
|
|
1921
|
+
}), [
|
|
1922
|
+
createVNode(unref$1(ElFocusTrap), {
|
|
1923
|
+
trapped: unref$1(trapped),
|
|
1924
|
+
"trap-on-focus-in": true,
|
|
1925
|
+
"focus-trap-el": unref$1(contentRef),
|
|
1926
|
+
"focus-start-el": unref$1(focusStartRef),
|
|
1927
|
+
onFocusAfterTrapped: unref$1(onFocusAfterTrapped),
|
|
1928
|
+
onFocusAfterReleased: unref$1(onFocusAfterReleased),
|
|
1929
|
+
onFocusin: unref$1(onFocusInTrap),
|
|
1930
|
+
onFocusoutPrevented: unref$1(onFocusoutPrevented),
|
|
1931
|
+
onReleaseRequested: unref$1(onReleaseRequested)
|
|
1932
|
+
}, {
|
|
1933
|
+
default: withCtx(() => [
|
|
1934
|
+
renderSlot(_ctx.$slots, "default")
|
|
1935
|
+
]),
|
|
1936
|
+
_: 3
|
|
1937
|
+
}, 8, ["trapped", "focus-trap-el", "focus-start-el", "onFocusAfterTrapped", "onFocusAfterReleased", "onFocusin", "onFocusoutPrevented", "onReleaseRequested"])
|
|
1938
|
+
], 16);
|
|
1939
|
+
};
|
|
1940
|
+
}
|
|
1941
|
+
});
|
|
1942
|
+
var ElPopperContent = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/popper/src/content.vue"]]);
|
|
1943
|
+
|
|
1944
|
+
const ElPopper = withInstall(Popper);
|
|
1945
|
+
|
|
1946
|
+
const TOOLTIP_INJECTION_KEY = Symbol("elTooltip");
|
|
1947
|
+
|
|
1948
|
+
const useTooltipContentProps = buildProps({
|
|
1949
|
+
...useDelayedToggleProps,
|
|
1950
|
+
...popperContentProps,
|
|
1951
|
+
appendTo: {
|
|
1952
|
+
type: definePropType([String, Object])
|
|
1953
|
+
},
|
|
1954
|
+
content: {
|
|
1955
|
+
type: String,
|
|
1956
|
+
default: ""
|
|
1957
|
+
},
|
|
1958
|
+
rawContent: {
|
|
1959
|
+
type: Boolean,
|
|
1960
|
+
default: false
|
|
1961
|
+
},
|
|
1962
|
+
persistent: Boolean,
|
|
1963
|
+
ariaLabel: String,
|
|
1964
|
+
visible: {
|
|
1965
|
+
type: definePropType(Boolean),
|
|
1966
|
+
default: null
|
|
1967
|
+
},
|
|
1968
|
+
transition: String,
|
|
1969
|
+
teleported: {
|
|
1970
|
+
type: Boolean,
|
|
1971
|
+
default: true
|
|
1972
|
+
},
|
|
1973
|
+
disabled: Boolean
|
|
1974
|
+
});
|
|
1975
|
+
|
|
1976
|
+
const useTooltipTriggerProps = buildProps({
|
|
1977
|
+
...popperTriggerProps,
|
|
1978
|
+
disabled: Boolean,
|
|
1979
|
+
trigger: {
|
|
1980
|
+
type: definePropType([String, Array]),
|
|
1981
|
+
default: "hover"
|
|
1982
|
+
},
|
|
1983
|
+
triggerKeys: {
|
|
1984
|
+
type: definePropType(Array),
|
|
1985
|
+
default: () => [EVENT_CODE.enter, EVENT_CODE.space]
|
|
1986
|
+
}
|
|
1987
|
+
});
|
|
1988
|
+
|
|
1989
|
+
const {
|
|
1990
|
+
useModelToggleProps: useTooltipModelToggleProps,
|
|
1991
|
+
useModelToggleEmits: useTooltipModelToggleEmits,
|
|
1992
|
+
useModelToggle: useTooltipModelToggle
|
|
1993
|
+
} = createModelToggleComposable("visible");
|
|
1994
|
+
const useTooltipProps = buildProps({
|
|
1995
|
+
...popperProps,
|
|
1996
|
+
...useTooltipModelToggleProps,
|
|
1997
|
+
...useTooltipContentProps,
|
|
1998
|
+
...useTooltipTriggerProps,
|
|
1999
|
+
...popperArrowProps,
|
|
2000
|
+
showArrow: {
|
|
2001
|
+
type: Boolean,
|
|
2002
|
+
default: true
|
|
2003
|
+
}
|
|
2004
|
+
});
|
|
2005
|
+
const tooltipEmits = [
|
|
2006
|
+
...useTooltipModelToggleEmits,
|
|
2007
|
+
"before-show",
|
|
2008
|
+
"before-hide",
|
|
2009
|
+
"show",
|
|
2010
|
+
"hide",
|
|
2011
|
+
"open",
|
|
2012
|
+
"close"
|
|
2013
|
+
];
|
|
2014
|
+
|
|
2015
|
+
const isTriggerType = (trigger, type) => {
|
|
2016
|
+
if (isArray(trigger)) {
|
|
2017
|
+
return trigger.includes(type);
|
|
2018
|
+
}
|
|
2019
|
+
return trigger === type;
|
|
2020
|
+
};
|
|
2021
|
+
const whenTrigger = (trigger, type, handler) => {
|
|
2022
|
+
return (e) => {
|
|
2023
|
+
isTriggerType(unref$1(trigger), type) && handler(e);
|
|
2024
|
+
};
|
|
2025
|
+
};
|
|
2026
|
+
|
|
2027
|
+
const __default__$2 = defineComponent({
|
|
2028
|
+
name: "ElTooltipTrigger"
|
|
2029
|
+
});
|
|
2030
|
+
const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
2031
|
+
...__default__$2,
|
|
2032
|
+
props: useTooltipTriggerProps,
|
|
2033
|
+
setup(__props, { expose }) {
|
|
2034
|
+
const props = __props;
|
|
2035
|
+
const ns = useNamespace("tooltip");
|
|
2036
|
+
const { controlled, id, open, onOpen, onClose, onToggle } = inject(TOOLTIP_INJECTION_KEY, void 0);
|
|
2037
|
+
const triggerRef = ref(null);
|
|
2038
|
+
const stopWhenControlledOrDisabled = () => {
|
|
2039
|
+
if (unref$1(controlled) || props.disabled) {
|
|
2040
|
+
return true;
|
|
2041
|
+
}
|
|
2042
|
+
};
|
|
2043
|
+
const trigger = toRef(props, "trigger");
|
|
2044
|
+
const onMouseenter = composeEventHandlers(stopWhenControlledOrDisabled, whenTrigger(trigger, "hover", onOpen));
|
|
2045
|
+
const onMouseleave = composeEventHandlers(stopWhenControlledOrDisabled, whenTrigger(trigger, "hover", onClose));
|
|
2046
|
+
const onClick = composeEventHandlers(stopWhenControlledOrDisabled, whenTrigger(trigger, "click", (e) => {
|
|
2047
|
+
if (e.button === 0) {
|
|
2048
|
+
onToggle(e);
|
|
2049
|
+
}
|
|
2050
|
+
}));
|
|
2051
|
+
const onFocus = composeEventHandlers(stopWhenControlledOrDisabled, whenTrigger(trigger, "focus", onOpen));
|
|
2052
|
+
const onBlur = composeEventHandlers(stopWhenControlledOrDisabled, whenTrigger(trigger, "focus", onClose));
|
|
2053
|
+
const onContextMenu = composeEventHandlers(stopWhenControlledOrDisabled, whenTrigger(trigger, "contextmenu", (e) => {
|
|
2054
|
+
e.preventDefault();
|
|
2055
|
+
onToggle(e);
|
|
2056
|
+
}));
|
|
2057
|
+
const onKeydown = composeEventHandlers(stopWhenControlledOrDisabled, (e) => {
|
|
2058
|
+
const { code } = e;
|
|
2059
|
+
if (props.triggerKeys.includes(code)) {
|
|
2060
|
+
e.preventDefault();
|
|
2061
|
+
onToggle(e);
|
|
2062
|
+
}
|
|
2063
|
+
});
|
|
2064
|
+
expose({
|
|
2065
|
+
triggerRef
|
|
2066
|
+
});
|
|
2067
|
+
return (_ctx, _cache) => {
|
|
2068
|
+
return openBlock(), createBlock(unref$1(ElPopperTrigger), {
|
|
2069
|
+
id: unref$1(id),
|
|
2070
|
+
"virtual-ref": _ctx.virtualRef,
|
|
2071
|
+
open: unref$1(open),
|
|
2072
|
+
"virtual-triggering": _ctx.virtualTriggering,
|
|
2073
|
+
class: normalizeClass(unref$1(ns).e("trigger")),
|
|
2074
|
+
onBlur: unref$1(onBlur),
|
|
2075
|
+
onClick: unref$1(onClick),
|
|
2076
|
+
onContextmenu: unref$1(onContextMenu),
|
|
2077
|
+
onFocus: unref$1(onFocus),
|
|
2078
|
+
onMouseenter: unref$1(onMouseenter),
|
|
2079
|
+
onMouseleave: unref$1(onMouseleave),
|
|
2080
|
+
onKeydown: unref$1(onKeydown)
|
|
2081
|
+
}, {
|
|
2082
|
+
default: withCtx(() => [
|
|
2083
|
+
renderSlot(_ctx.$slots, "default")
|
|
2084
|
+
]),
|
|
2085
|
+
_: 3
|
|
2086
|
+
}, 8, ["id", "virtual-ref", "open", "virtual-triggering", "class", "onBlur", "onClick", "onContextmenu", "onFocus", "onMouseenter", "onMouseleave", "onKeydown"]);
|
|
2087
|
+
};
|
|
2088
|
+
}
|
|
2089
|
+
});
|
|
2090
|
+
var ElTooltipTrigger = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/tooltip/src/trigger.vue"]]);
|
|
2091
|
+
|
|
2092
|
+
const __default__$1 = defineComponent({
|
|
2093
|
+
name: "ElTooltipContent",
|
|
2094
|
+
inheritAttrs: false
|
|
2095
|
+
});
|
|
2096
|
+
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
2097
|
+
...__default__$1,
|
|
2098
|
+
props: useTooltipContentProps,
|
|
2099
|
+
setup(__props, { expose }) {
|
|
2100
|
+
const props = __props;
|
|
2101
|
+
const { selector } = usePopperContainerId();
|
|
2102
|
+
const ns = useNamespace("tooltip");
|
|
2103
|
+
const contentRef = ref(null);
|
|
2104
|
+
const destroyed = ref(false);
|
|
2105
|
+
const {
|
|
2106
|
+
controlled,
|
|
2107
|
+
id,
|
|
2108
|
+
open,
|
|
2109
|
+
trigger,
|
|
2110
|
+
onClose,
|
|
2111
|
+
onOpen,
|
|
2112
|
+
onShow,
|
|
2113
|
+
onHide,
|
|
2114
|
+
onBeforeShow,
|
|
2115
|
+
onBeforeHide
|
|
2116
|
+
} = inject(TOOLTIP_INJECTION_KEY, void 0);
|
|
2117
|
+
const transitionClass = computed(() => {
|
|
2118
|
+
return props.transition || `${ns.namespace.value}-fade-in-linear`;
|
|
2119
|
+
});
|
|
2120
|
+
const persistentRef = computed(() => {
|
|
2121
|
+
if (process.env.NODE_ENV === "test") {
|
|
2122
|
+
return true;
|
|
2123
|
+
}
|
|
2124
|
+
return props.persistent;
|
|
2125
|
+
});
|
|
2126
|
+
onBeforeUnmount(() => {
|
|
2127
|
+
destroyed.value = true;
|
|
2128
|
+
});
|
|
2129
|
+
const shouldRender = computed(() => {
|
|
2130
|
+
return unref$1(persistentRef) ? true : unref$1(open);
|
|
2131
|
+
});
|
|
2132
|
+
const shouldShow = computed(() => {
|
|
2133
|
+
return props.disabled ? false : unref$1(open);
|
|
2134
|
+
});
|
|
2135
|
+
const appendTo = computed(() => {
|
|
2136
|
+
return props.appendTo || selector.value;
|
|
2137
|
+
});
|
|
2138
|
+
const contentStyle = computed(() => {
|
|
2139
|
+
var _a;
|
|
2140
|
+
return (_a = props.style) != null ? _a : {};
|
|
2141
|
+
});
|
|
2142
|
+
const ariaHidden = computed(() => !unref$1(open));
|
|
2143
|
+
const onTransitionLeave = () => {
|
|
2144
|
+
onHide();
|
|
2145
|
+
};
|
|
2146
|
+
const stopWhenControlled = () => {
|
|
2147
|
+
if (unref$1(controlled))
|
|
2148
|
+
return true;
|
|
2149
|
+
};
|
|
2150
|
+
const onContentEnter = composeEventHandlers(stopWhenControlled, () => {
|
|
2151
|
+
if (props.enterable && unref$1(trigger) === "hover") {
|
|
2152
|
+
onOpen();
|
|
2153
|
+
}
|
|
2154
|
+
});
|
|
2155
|
+
const onContentLeave = composeEventHandlers(stopWhenControlled, () => {
|
|
2156
|
+
if (unref$1(trigger) === "hover") {
|
|
2157
|
+
onClose();
|
|
2158
|
+
}
|
|
2159
|
+
});
|
|
2160
|
+
const onBeforeEnter = () => {
|
|
2161
|
+
var _a, _b;
|
|
2162
|
+
(_b = (_a = contentRef.value) == null ? void 0 : _a.updatePopper) == null ? void 0 : _b.call(_a);
|
|
2163
|
+
onBeforeShow == null ? void 0 : onBeforeShow();
|
|
2164
|
+
};
|
|
2165
|
+
const onBeforeLeave = () => {
|
|
2166
|
+
onBeforeHide == null ? void 0 : onBeforeHide();
|
|
2167
|
+
};
|
|
2168
|
+
const onAfterShow = () => {
|
|
2169
|
+
onShow();
|
|
2170
|
+
stopHandle = onClickOutside(computed(() => {
|
|
2171
|
+
var _a;
|
|
2172
|
+
return (_a = contentRef.value) == null ? void 0 : _a.popperContentRef;
|
|
2173
|
+
}), () => {
|
|
2174
|
+
if (unref$1(controlled))
|
|
2175
|
+
return;
|
|
2176
|
+
const $trigger = unref$1(trigger);
|
|
2177
|
+
if ($trigger !== "hover") {
|
|
2178
|
+
onClose();
|
|
2179
|
+
}
|
|
2180
|
+
});
|
|
2181
|
+
};
|
|
2182
|
+
const onBlur = () => {
|
|
2183
|
+
if (!props.virtualTriggering) {
|
|
2184
|
+
onClose();
|
|
2185
|
+
}
|
|
2186
|
+
};
|
|
2187
|
+
let stopHandle;
|
|
2188
|
+
watch$1(() => unref$1(open), (val) => {
|
|
2189
|
+
if (!val) {
|
|
2190
|
+
stopHandle == null ? void 0 : stopHandle();
|
|
2191
|
+
}
|
|
2192
|
+
}, {
|
|
2193
|
+
flush: "post"
|
|
2194
|
+
});
|
|
2195
|
+
watch$1(() => props.content, () => {
|
|
2196
|
+
var _a, _b;
|
|
2197
|
+
(_b = (_a = contentRef.value) == null ? void 0 : _a.updatePopper) == null ? void 0 : _b.call(_a);
|
|
2198
|
+
});
|
|
2199
|
+
expose({
|
|
2200
|
+
contentRef
|
|
2201
|
+
});
|
|
2202
|
+
return (_ctx, _cache) => {
|
|
2203
|
+
return openBlock(), createBlock(Teleport, {
|
|
2204
|
+
disabled: !_ctx.teleported,
|
|
2205
|
+
to: unref$1(appendTo)
|
|
2206
|
+
}, [
|
|
2207
|
+
createVNode(Transition, {
|
|
2208
|
+
name: unref$1(transitionClass),
|
|
2209
|
+
onAfterLeave: onTransitionLeave,
|
|
2210
|
+
onBeforeEnter,
|
|
2211
|
+
onAfterEnter: onAfterShow,
|
|
2212
|
+
onBeforeLeave
|
|
2213
|
+
}, {
|
|
2214
|
+
default: withCtx(() => [
|
|
2215
|
+
unref$1(shouldRender) ? withDirectives((openBlock(), createBlock(unref$1(ElPopperContent), mergeProps({
|
|
2216
|
+
key: 0,
|
|
2217
|
+
id: unref$1(id),
|
|
2218
|
+
ref_key: "contentRef",
|
|
2219
|
+
ref: contentRef
|
|
2220
|
+
}, _ctx.$attrs, {
|
|
2221
|
+
"aria-label": _ctx.ariaLabel,
|
|
2222
|
+
"aria-hidden": unref$1(ariaHidden),
|
|
2223
|
+
"boundaries-padding": _ctx.boundariesPadding,
|
|
2224
|
+
"fallback-placements": _ctx.fallbackPlacements,
|
|
2225
|
+
"gpu-acceleration": _ctx.gpuAcceleration,
|
|
2226
|
+
offset: _ctx.offset,
|
|
2227
|
+
placement: _ctx.placement,
|
|
2228
|
+
"popper-options": _ctx.popperOptions,
|
|
2229
|
+
strategy: _ctx.strategy,
|
|
2230
|
+
effect: _ctx.effect,
|
|
2231
|
+
enterable: _ctx.enterable,
|
|
2232
|
+
pure: _ctx.pure,
|
|
2233
|
+
"popper-class": _ctx.popperClass,
|
|
2234
|
+
"popper-style": [_ctx.popperStyle, unref$1(contentStyle)],
|
|
2235
|
+
"reference-el": _ctx.referenceEl,
|
|
2236
|
+
"trigger-target-el": _ctx.triggerTargetEl,
|
|
2237
|
+
visible: unref$1(shouldShow),
|
|
2238
|
+
"z-index": _ctx.zIndex,
|
|
2239
|
+
onMouseenter: unref$1(onContentEnter),
|
|
2240
|
+
onMouseleave: unref$1(onContentLeave),
|
|
2241
|
+
onBlur,
|
|
2242
|
+
onClose: unref$1(onClose)
|
|
2243
|
+
}), {
|
|
2244
|
+
default: withCtx(() => [
|
|
2245
|
+
!destroyed.value ? renderSlot(_ctx.$slots, "default", { key: 0 }) : createCommentVNode("v-if", true)
|
|
2246
|
+
]),
|
|
2247
|
+
_: 3
|
|
2248
|
+
}, 16, ["id", "aria-label", "aria-hidden", "boundaries-padding", "fallback-placements", "gpu-acceleration", "offset", "placement", "popper-options", "strategy", "effect", "enterable", "pure", "popper-class", "popper-style", "reference-el", "trigger-target-el", "visible", "z-index", "onMouseenter", "onMouseleave", "onClose"])), [
|
|
2249
|
+
[vShow, unref$1(shouldShow)]
|
|
2250
|
+
]) : createCommentVNode("v-if", true)
|
|
2251
|
+
]),
|
|
2252
|
+
_: 3
|
|
2253
|
+
}, 8, ["name"])
|
|
2254
|
+
], 8, ["disabled", "to"]);
|
|
2255
|
+
};
|
|
2256
|
+
}
|
|
2257
|
+
});
|
|
2258
|
+
var ElTooltipContent = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/tooltip/src/content.vue"]]);
|
|
2259
|
+
|
|
2260
|
+
const _hoisted_1 = ["innerHTML"];
|
|
2261
|
+
const _hoisted_2 = { key: 1 };
|
|
2262
|
+
const __default__ = defineComponent({
|
|
2263
|
+
name: "ElTooltip"
|
|
2264
|
+
});
|
|
2265
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
2266
|
+
...__default__,
|
|
2267
|
+
props: useTooltipProps,
|
|
2268
|
+
emits: tooltipEmits,
|
|
2269
|
+
setup(__props, { expose, emit }) {
|
|
2270
|
+
const props = __props;
|
|
2271
|
+
usePopperContainer();
|
|
2272
|
+
const id = useId();
|
|
2273
|
+
const popperRef = ref();
|
|
2274
|
+
const contentRef = ref();
|
|
2275
|
+
const updatePopper = () => {
|
|
2276
|
+
var _a;
|
|
2277
|
+
const popperComponent = unref$1(popperRef);
|
|
2278
|
+
if (popperComponent) {
|
|
2279
|
+
(_a = popperComponent.popperInstanceRef) == null ? void 0 : _a.update();
|
|
2280
|
+
}
|
|
2281
|
+
};
|
|
2282
|
+
const open = ref(false);
|
|
2283
|
+
const toggleReason = ref();
|
|
2284
|
+
const { show, hide, hasUpdateHandler } = useTooltipModelToggle({
|
|
2285
|
+
indicator: open,
|
|
2286
|
+
toggleReason
|
|
2287
|
+
});
|
|
2288
|
+
const { onOpen, onClose } = useDelayedToggle({
|
|
2289
|
+
showAfter: toRef(props, "showAfter"),
|
|
2290
|
+
hideAfter: toRef(props, "hideAfter"),
|
|
2291
|
+
autoClose: toRef(props, "autoClose"),
|
|
2292
|
+
open: show,
|
|
2293
|
+
close: hide
|
|
2294
|
+
});
|
|
2295
|
+
const controlled = computed(() => isBoolean(props.visible) && !hasUpdateHandler.value);
|
|
2296
|
+
provide(TOOLTIP_INJECTION_KEY, {
|
|
2297
|
+
controlled,
|
|
2298
|
+
id,
|
|
2299
|
+
open: readonly(open),
|
|
2300
|
+
trigger: toRef(props, "trigger"),
|
|
2301
|
+
onOpen: (event) => {
|
|
2302
|
+
onOpen(event);
|
|
2303
|
+
},
|
|
2304
|
+
onClose: (event) => {
|
|
2305
|
+
onClose(event);
|
|
2306
|
+
},
|
|
2307
|
+
onToggle: (event) => {
|
|
2308
|
+
if (unref$1(open)) {
|
|
2309
|
+
onClose(event);
|
|
2310
|
+
} else {
|
|
2311
|
+
onOpen(event);
|
|
2312
|
+
}
|
|
2313
|
+
},
|
|
2314
|
+
onShow: () => {
|
|
2315
|
+
emit("show", toggleReason.value);
|
|
2316
|
+
},
|
|
2317
|
+
onHide: () => {
|
|
2318
|
+
emit("hide", toggleReason.value);
|
|
2319
|
+
},
|
|
2320
|
+
onBeforeShow: () => {
|
|
2321
|
+
emit("before-show", toggleReason.value);
|
|
2322
|
+
},
|
|
2323
|
+
onBeforeHide: () => {
|
|
2324
|
+
emit("before-hide", toggleReason.value);
|
|
2325
|
+
},
|
|
2326
|
+
updatePopper
|
|
2327
|
+
});
|
|
2328
|
+
watch$1(() => props.disabled, (disabled) => {
|
|
2329
|
+
if (disabled && open.value) {
|
|
2330
|
+
open.value = false;
|
|
2331
|
+
}
|
|
2332
|
+
});
|
|
2333
|
+
const isFocusInsideContent = () => {
|
|
2334
|
+
var _a, _b;
|
|
2335
|
+
const popperContent = (_b = (_a = contentRef.value) == null ? void 0 : _a.contentRef) == null ? void 0 : _b.popperContentRef;
|
|
2336
|
+
return popperContent && popperContent.contains(document.activeElement);
|
|
2337
|
+
};
|
|
2338
|
+
onDeactivated(() => open.value && hide());
|
|
2339
|
+
expose({
|
|
2340
|
+
popperRef,
|
|
2341
|
+
contentRef,
|
|
2342
|
+
isFocusInsideContent,
|
|
2343
|
+
updatePopper,
|
|
2344
|
+
onOpen,
|
|
2345
|
+
onClose,
|
|
2346
|
+
hide
|
|
2347
|
+
});
|
|
2348
|
+
return (_ctx, _cache) => {
|
|
2349
|
+
return openBlock(), createBlock(unref$1(ElPopper), {
|
|
2350
|
+
ref_key: "popperRef",
|
|
2351
|
+
ref: popperRef,
|
|
2352
|
+
role: _ctx.role
|
|
2353
|
+
}, {
|
|
2354
|
+
default: withCtx(() => [
|
|
2355
|
+
createVNode(ElTooltipTrigger, {
|
|
2356
|
+
disabled: _ctx.disabled,
|
|
2357
|
+
trigger: _ctx.trigger,
|
|
2358
|
+
"trigger-keys": _ctx.triggerKeys,
|
|
2359
|
+
"virtual-ref": _ctx.virtualRef,
|
|
2360
|
+
"virtual-triggering": _ctx.virtualTriggering
|
|
2361
|
+
}, {
|
|
2362
|
+
default: withCtx(() => [
|
|
2363
|
+
_ctx.$slots.default ? renderSlot(_ctx.$slots, "default", { key: 0 }) : createCommentVNode("v-if", true)
|
|
2364
|
+
]),
|
|
2365
|
+
_: 3
|
|
2366
|
+
}, 8, ["disabled", "trigger", "trigger-keys", "virtual-ref", "virtual-triggering"]),
|
|
2367
|
+
createVNode(ElTooltipContent, {
|
|
2368
|
+
ref_key: "contentRef",
|
|
2369
|
+
ref: contentRef,
|
|
2370
|
+
"aria-label": _ctx.ariaLabel,
|
|
2371
|
+
"boundaries-padding": _ctx.boundariesPadding,
|
|
2372
|
+
content: _ctx.content,
|
|
2373
|
+
disabled: _ctx.disabled,
|
|
2374
|
+
effect: _ctx.effect,
|
|
2375
|
+
enterable: _ctx.enterable,
|
|
2376
|
+
"fallback-placements": _ctx.fallbackPlacements,
|
|
2377
|
+
"hide-after": _ctx.hideAfter,
|
|
2378
|
+
"gpu-acceleration": _ctx.gpuAcceleration,
|
|
2379
|
+
offset: _ctx.offset,
|
|
2380
|
+
persistent: _ctx.persistent,
|
|
2381
|
+
"popper-class": _ctx.popperClass,
|
|
2382
|
+
"popper-style": _ctx.popperStyle,
|
|
2383
|
+
placement: _ctx.placement,
|
|
2384
|
+
"popper-options": _ctx.popperOptions,
|
|
2385
|
+
pure: _ctx.pure,
|
|
2386
|
+
"raw-content": _ctx.rawContent,
|
|
2387
|
+
"reference-el": _ctx.referenceEl,
|
|
2388
|
+
"trigger-target-el": _ctx.triggerTargetEl,
|
|
2389
|
+
"show-after": _ctx.showAfter,
|
|
2390
|
+
strategy: _ctx.strategy,
|
|
2391
|
+
teleported: _ctx.teleported,
|
|
2392
|
+
transition: _ctx.transition,
|
|
2393
|
+
"virtual-triggering": _ctx.virtualTriggering,
|
|
2394
|
+
"z-index": _ctx.zIndex,
|
|
2395
|
+
"append-to": _ctx.appendTo
|
|
2396
|
+
}, {
|
|
2397
|
+
default: withCtx(() => [
|
|
2398
|
+
renderSlot(_ctx.$slots, "content", {}, () => [
|
|
2399
|
+
_ctx.rawContent ? (openBlock(), createElementBlock("span", {
|
|
2400
|
+
key: 0,
|
|
2401
|
+
innerHTML: _ctx.content
|
|
2402
|
+
}, null, 8, _hoisted_1)) : (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(_ctx.content), 1))
|
|
2403
|
+
]),
|
|
2404
|
+
_ctx.showArrow ? (openBlock(), createBlock(unref$1(ElPopperArrow), {
|
|
2405
|
+
key: 0,
|
|
2406
|
+
"arrow-offset": _ctx.arrowOffset
|
|
2407
|
+
}, null, 8, ["arrow-offset"])) : createCommentVNode("v-if", true)
|
|
2408
|
+
]),
|
|
2409
|
+
_: 3
|
|
2410
|
+
}, 8, ["aria-label", "boundaries-padding", "content", "disabled", "effect", "enterable", "fallback-placements", "hide-after", "gpu-acceleration", "offset", "persistent", "popper-class", "popper-style", "placement", "popper-options", "pure", "raw-content", "reference-el", "trigger-target-el", "show-after", "strategy", "teleported", "transition", "virtual-triggering", "z-index", "append-to"])
|
|
2411
|
+
]),
|
|
2412
|
+
_: 3
|
|
2413
|
+
}, 8, ["role"]);
|
|
2414
|
+
};
|
|
2415
|
+
}
|
|
2416
|
+
});
|
|
2417
|
+
var Tooltip = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/tooltip/src/tooltip.vue"]]);
|
|
2418
|
+
|
|
2419
|
+
const ElTooltip = withInstall(Tooltip);
|
|
2420
|
+
|
|
2421
|
+
function useBase(props, attrs) {
|
|
2422
|
+
const rxToolTipOptions = ref();
|
|
2423
|
+
function init() {
|
|
2424
|
+
const { popperClass } = attrs;
|
|
2425
|
+
console.log(attrs);
|
|
2426
|
+
rxToolTipOptions.value = Object.assign(Object.assign({}, attrs), { popperClass: popperClass ? popperClass : 'rx-tooltip' });
|
|
2427
|
+
}
|
|
2428
|
+
return { rxToolTipOptions, init };
|
|
2429
|
+
}
|
|
2430
|
+
|
|
2431
|
+
function useController(props, attrs, init) {
|
|
2432
|
+
watch$1(() => attrs, () => {
|
|
2433
|
+
nextTick(() => init());
|
|
2434
|
+
}, { deep: true, immediate: true });
|
|
2435
|
+
return {};
|
|
2436
|
+
}
|
|
2437
|
+
|
|
2438
|
+
var script = defineComponent({
|
|
2439
|
+
name: 'RxTooltip',
|
|
2440
|
+
components: { ElTooltip },
|
|
2441
|
+
props: RxTooltipProps,
|
|
2442
|
+
setup(props, { attrs }) {
|
|
2443
|
+
const { rxToolTipOptions, init } = useBase(props, attrs);
|
|
2444
|
+
onMounted(() => {
|
|
2445
|
+
useController(props, attrs, init);
|
|
2446
|
+
});
|
|
2447
|
+
return { rxToolTipOptions };
|
|
2448
|
+
}
|
|
2449
|
+
});
|
|
2450
|
+
|
|
2451
|
+
function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
2452
|
+
const _component_el_tooltip = resolveComponent("el-tooltip");
|
|
2453
|
+
|
|
2454
|
+
return (openBlock(), createBlock(_component_el_tooltip, normalizeProps(guardReactiveProps(_ctx.$attrs)), {
|
|
2455
|
+
default: withCtx(() => [
|
|
2456
|
+
renderSlot(_ctx.$slots, "default")
|
|
2457
|
+
]),
|
|
2458
|
+
content: withCtx(() => [
|
|
2459
|
+
renderSlot(_ctx.$slots, "content")
|
|
2460
|
+
]),
|
|
2461
|
+
_: 3 /* FORWARDED */
|
|
2462
|
+
}, 16 /* FULL_PROPS */))
|
|
2463
|
+
}
|
|
2464
|
+
|
|
2465
|
+
script.render = render;
|
|
2466
|
+
script.__file = "packages/components/RxTooltip/src/index.vue";
|
|
2467
|
+
|
|
2468
|
+
const RxTooltip = withInstall$1(script);
|
|
2469
|
+
|
|
2470
|
+
export { RxTooltip, RxTooltip as default };
|